@typed/ui 1.0.0-beta.6 → 1.0.0-beta.8
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/LICENSE +21 -0
- package/README.md +1 -1
- package/dist/Alert.d.ts +35 -41
- package/dist/Alert.d.ts.map +1 -1
- package/dist/Alert.js +23 -20
- package/dist/Button.d.ts +34 -78
- package/dist/Button.d.ts.map +1 -1
- package/dist/Button.js +16 -12
- package/dist/Carousel.d.ts +35 -236
- package/dist/Carousel.d.ts.map +1 -1
- package/dist/Carousel.js +13 -136
- package/dist/Checkbox.d.ts +55 -90
- package/dist/Checkbox.d.ts.map +1 -1
- package/dist/Checkbox.js +44 -38
- package/dist/Collection.d.ts +15 -15
- package/dist/Collection.js +7 -7
- package/dist/Combobox.d.ts +38 -187
- package/dist/Combobox.d.ts.map +1 -1
- package/dist/Combobox.js +9 -80
- package/dist/Component.d.ts +30 -24
- package/dist/Component.d.ts.map +1 -1
- package/dist/Component.js +23 -12
- package/dist/Composite.d.ts +50 -50
- package/dist/Composite.js +20 -20
- package/dist/Dialog.d.ts +34 -34
- package/dist/Dialog.d.ts.map +1 -1
- package/dist/Dialog.js +16 -14
- package/dist/Disclosure.d.ts +15 -15
- package/dist/Disclosure.js +6 -6
- package/dist/Dom/Events.d.ts +4 -4
- package/dist/Dom/Events.js +4 -4
- package/dist/Dom/Props.d.ts +9 -9
- package/dist/Dom/Props.js +4 -4
- package/dist/Dom/Refs.d.ts +2 -2
- package/dist/Dom/Refs.js +1 -1
- package/dist/Dom/Render.d.ts +2 -2
- package/dist/Dom/Render.js +2 -2
- package/dist/Dom/Types.d.ts +33 -33
- package/dist/Dom/index.d.ts +5 -5
- package/dist/Dom/index.d.ts.map +1 -1
- package/dist/Dom/index.js +4 -4
- package/dist/Dom.d.ts +1 -1
- package/dist/Dom.js +1 -1
- package/dist/Focusable.d.ts +5 -5
- package/dist/Focusable.js +1 -1
- package/dist/Form.d.ts +565 -533
- package/dist/Form.d.ts.map +1 -1
- package/dist/Form.js +350 -195
- package/dist/Grid.d.ts +39 -220
- package/dist/Grid.d.ts.map +1 -1
- package/dist/Grid.js +12 -107
- package/dist/Group.d.ts +50 -69
- package/dist/Group.d.ts.map +1 -1
- package/dist/Group.js +33 -25
- package/dist/Heading.d.ts +41 -40
- package/dist/Heading.d.ts.map +1 -1
- package/dist/Heading.js +26 -16
- package/dist/Hovercard.d.ts +18 -18
- package/dist/Hovercard.js +6 -6
- package/dist/HttpRouter.d.ts +3 -3
- package/dist/HttpRouter.js +5 -5
- package/dist/Link.d.ts +17 -21
- package/dist/Link.d.ts.map +1 -1
- package/dist/Link.js +11 -0
- package/dist/Listbox.d.ts +31 -163
- package/dist/Listbox.d.ts.map +1 -1
- package/dist/Listbox.js +9 -80
- package/dist/Menu.d.ts +67 -376
- package/dist/Menu.d.ts.map +1 -1
- package/dist/Menu.js +17 -179
- package/dist/Menubar.d.ts +24 -142
- package/dist/Menubar.d.ts.map +1 -1
- package/dist/Menubar.js +8 -66
- package/dist/Meter.d.ts +72 -132
- package/dist/Meter.d.ts.map +1 -1
- package/dist/Meter.js +35 -42
- package/dist/NativeDetails.d.ts +1 -1
- package/dist/NativeDetails.js +1 -1
- package/dist/NativeDialog.d.ts +7 -5
- package/dist/NativeDialog.d.ts.map +1 -1
- package/dist/NativeDialog.js +42 -4
- package/dist/NativePopover.d.ts +6 -4
- package/dist/NativePopover.d.ts.map +1 -1
- package/dist/NativePopover.js +43 -5
- package/dist/Popover.d.ts +18 -19
- package/dist/Popover.d.ts.map +1 -1
- package/dist/Popover.js +7 -8
- package/dist/RadioGroup.d.ts +86 -188
- package/dist/RadioGroup.d.ts.map +1 -1
- package/dist/RadioGroup.js +55 -105
- package/dist/Role.d.ts +4 -4
- package/dist/Role.js +1 -1
- package/dist/Select.d.ts +109 -220
- package/dist/Select.d.ts.map +1 -1
- package/dist/Select.js +67 -117
- package/dist/Separator.d.ts +30 -26
- package/dist/Separator.d.ts.map +1 -1
- package/dist/Separator.js +16 -10
- package/dist/Slider.d.ts +64 -111
- package/dist/Slider.d.ts.map +1 -1
- package/dist/Slider.js +47 -42
- package/dist/SpinButton.d.ts +64 -111
- package/dist/SpinButton.d.ts.map +1 -1
- package/dist/SpinButton.js +47 -42
- package/dist/Storybook.d.ts +2 -2
- package/dist/Storybook.js +1 -1
- package/dist/Switch.d.ts +52 -91
- package/dist/Switch.d.ts.map +1 -1
- package/dist/Switch.js +30 -36
- package/dist/Tabs.d.ts +44 -224
- package/dist/Tabs.d.ts.map +1 -1
- package/dist/Tabs.js +10 -94
- package/dist/Toolbar.d.ts +24 -142
- package/dist/Toolbar.d.ts.map +1 -1
- package/dist/Toolbar.js +8 -66
- package/dist/Tooltip.d.ts +20 -20
- package/dist/Tooltip.js +6 -6
- package/dist/Tree.d.ts +43 -229
- package/dist/Tree.d.ts.map +1 -1
- package/dist/Tree.js +12 -113
- package/dist/TreeGrid.d.ts +45 -264
- package/dist/TreeGrid.d.ts.map +1 -1
- package/dist/TreeGrid.js +13 -125
- package/dist/VisuallyHidden.d.ts +41 -27
- package/dist/VisuallyHidden.d.ts.map +1 -1
- package/dist/VisuallyHidden.js +27 -10
- package/dist/WindowSplitter.d.ts +68 -108
- package/dist/WindowSplitter.d.ts.map +1 -1
- package/dist/WindowSplitter.js +106 -23
- package/package.json +13 -12
package/dist/Tabs.js
CHANGED
|
@@ -8,6 +8,8 @@
|
|
|
8
8
|
* the state and pure operations without mounting UI, or supply custom hosts without replacing native
|
|
9
9
|
* events and browser-owned focus.
|
|
10
10
|
*
|
|
11
|
+
* Learn the interaction in the [Tabs guide](/explore/ui-tabs).
|
|
12
|
+
*
|
|
11
13
|
* @since 1.0.0
|
|
12
14
|
* @category modules
|
|
13
15
|
* @packageDocumentation
|
|
@@ -23,15 +25,6 @@ import * as Dom from "./Dom.js";
|
|
|
23
25
|
* Effect Schema used by makeState to encode, decode, and hydrate Tabs state.
|
|
24
26
|
*
|
|
25
27
|
* @remarks
|
|
26
|
-
* ## Why
|
|
27
|
-
*
|
|
28
|
-
* A public schema makes hydration and serialized state use the same runtime validation as direct
|
|
29
|
-
* construction.
|
|
30
|
-
*
|
|
31
|
-
* ## Ownership and lifetime
|
|
32
|
-
*
|
|
33
|
-
* This declaration is data or schema metadata and acquires no resources.
|
|
34
|
-
*
|
|
35
28
|
* @example
|
|
36
29
|
* ```ts
|
|
37
30
|
* import * as Schema from "effect/Schema";
|
|
@@ -40,7 +33,7 @@ import * as Dom from "./Dom.js";
|
|
|
40
33
|
* const decodeState = Schema.decodeUnknownEffect(Tabs.StateSchema);
|
|
41
34
|
* ```
|
|
42
35
|
* @since 1.0.0
|
|
43
|
-
* @category
|
|
36
|
+
* @category Selection and focus
|
|
44
37
|
*/
|
|
45
38
|
export const StateSchema = Schema.Struct({
|
|
46
39
|
selectedId: Schema.String,
|
|
@@ -56,12 +49,6 @@ export const StateSchema = Schema.Struct({
|
|
|
56
49
|
* is automatic, orientation horizontal, and loop true.
|
|
57
50
|
*
|
|
58
51
|
* @remarks
|
|
59
|
-
* ## Why
|
|
60
|
-
*
|
|
61
|
-
* State and collection ownership can be composed and tested independently from any renderer.
|
|
62
|
-
*
|
|
63
|
-
* ## Ownership and lifetime
|
|
64
|
-
*
|
|
65
52
|
* The returned Effect creates the RefSubject when run. That state is renderer-independent;
|
|
66
53
|
* collection registrations belong to the separate Scope that runs register or ref, not to state
|
|
67
54
|
* creation.
|
|
@@ -80,7 +67,7 @@ export const StateSchema = Schema.Struct({
|
|
|
80
67
|
* );
|
|
81
68
|
* ```
|
|
82
69
|
* @since 1.0.0
|
|
83
|
-
* @category
|
|
70
|
+
* @category Selection and focus
|
|
84
71
|
*/
|
|
85
72
|
export function makeState(initial) {
|
|
86
73
|
return RefSubject.hydrate(StateSchema, {
|
|
@@ -97,12 +84,6 @@ export function makeState(initial) {
|
|
|
97
84
|
* Creates a scoped Collection for Tabs items.
|
|
98
85
|
*
|
|
99
86
|
* @remarks
|
|
100
|
-
* ## Why
|
|
101
|
-
*
|
|
102
|
-
* State and collection ownership can be composed and tested independently from any renderer.
|
|
103
|
-
*
|
|
104
|
-
* ## Ownership and lifetime
|
|
105
|
-
*
|
|
106
87
|
* The returned Effect allocates the RefSubject in the caller's Scope. Each later registration is
|
|
107
88
|
* owned by the Scope that runs register, independently of this construction Effect.
|
|
108
89
|
*
|
|
@@ -119,31 +100,18 @@ export function makeState(initial) {
|
|
|
119
100
|
* );
|
|
120
101
|
* ```
|
|
121
102
|
* @since 1.0.0
|
|
122
|
-
* @category
|
|
103
|
+
* @category Tab registration
|
|
123
104
|
*/
|
|
124
105
|
export const makeCollection = Collection.makeState;
|
|
125
106
|
/**
|
|
126
107
|
* Selects a tab and makes it the active roving-focus item.
|
|
127
108
|
*
|
|
128
109
|
* @remarks
|
|
129
|
-
* ## Why
|
|
130
|
-
*
|
|
131
110
|
* The operation exposes Tabs's transition directly so callers can compose it in Effect programs
|
|
132
111
|
* and native event handlers.
|
|
133
112
|
*
|
|
134
|
-
* ## Ownership and lifetime
|
|
135
|
-
*
|
|
136
|
-
* The returned Effect performs the update or DOM side effect only when run, preserves the declared
|
|
137
|
-
* error and service channels, and retains no resources after completion.
|
|
138
|
-
*
|
|
139
|
-
* ## Example
|
|
140
|
-
*
|
|
141
|
-
* Import with `import { select } from "@typed/ui/Tabs";` Extend the [Tabs.makeState runnable
|
|
142
|
-
* setup](/reference/%40typed%2Fui%2FTabs%23makeState). Inside the linked Effect program invoke
|
|
143
|
-
* `yield* select(state, "settings")`, then read state to observe both `selectedId` and `activeId`
|
|
144
|
-
* become `"settings"`.
|
|
145
113
|
* @since 1.0.0
|
|
146
|
-
* @category
|
|
114
|
+
* @category Panel activation
|
|
147
115
|
*/
|
|
148
116
|
export function select(state, selectedId) {
|
|
149
117
|
return RefSubject.update(state, (current) => ({ ...current, activeId: selectedId, selectedId }));
|
|
@@ -152,24 +120,11 @@ export function select(state, selectedId) {
|
|
|
152
120
|
* Moves activeId through registered tabs without selecting under manual activation.
|
|
153
121
|
*
|
|
154
122
|
* @remarks
|
|
155
|
-
* ## Why
|
|
156
|
-
*
|
|
157
123
|
* The operation exposes Tabs's transition directly so callers can compose it in Effect programs
|
|
158
124
|
* and native event handlers.
|
|
159
125
|
*
|
|
160
|
-
* ## Ownership and lifetime
|
|
161
|
-
*
|
|
162
|
-
* The returned Effect performs the update or DOM side effect only when run, preserves the declared
|
|
163
|
-
* error and service channels, and retains no resources after completion.
|
|
164
|
-
*
|
|
165
|
-
* ## Example
|
|
166
|
-
*
|
|
167
|
-
* Import with `import { move } from "@typed/ui/Tabs";` Extend the [Tabs.makeState runnable
|
|
168
|
-
* setup](/reference/%40typed%2Fui%2FTabs%23makeState). Inside the linked Effect program invoke
|
|
169
|
-
* `yield* move(state, yield* collection, "next")`, then read state to observe focus move—and, in
|
|
170
|
-
* automatic mode, selection move—to the next enabled tab.
|
|
171
126
|
* @since 1.0.0
|
|
172
|
-
* @category
|
|
127
|
+
* @category Tab navigation
|
|
173
128
|
*/
|
|
174
129
|
export function move(state, items, direction) {
|
|
175
130
|
return Effect.gen(function* () {
|
|
@@ -227,25 +182,12 @@ function listInternalProps(options) {
|
|
|
227
182
|
* mode.
|
|
228
183
|
*
|
|
229
184
|
* @remarks
|
|
230
|
-
* ## Why
|
|
231
|
-
*
|
|
232
|
-
* The component applies the family behavior while leaving callers free to supply a custom host
|
|
233
|
-
* through the shared DOM boundary.
|
|
234
|
-
*
|
|
235
|
-
* ## Ownership and lifetime
|
|
236
|
-
*
|
|
237
185
|
* The returned Fx installs DOM refs, native listeners, state subscriptions, and optional
|
|
238
186
|
* collection registrations only when rendered. The rendering Scope removes those resources;
|
|
239
187
|
* unrelated nodes and attributes remain caller-owned.
|
|
240
188
|
*
|
|
241
|
-
* ## Example
|
|
242
|
-
*
|
|
243
|
-
* Import with `import { List } from "@typed/ui/Tabs";` Extend the [Tabs.makeState runnable
|
|
244
|
-
* setup](/reference/%40typed%2Fui%2FTabs%23makeState). Replace the linked program's final snapshot
|
|
245
|
-
* read with `List({ state, label: "Account", content: "Tabs" })`; render that Fx before the same
|
|
246
|
-
* Scope closes.
|
|
247
189
|
* @since 1.0.0
|
|
248
|
-
* @category
|
|
190
|
+
* @category Tab list
|
|
249
191
|
*/
|
|
250
192
|
export function List(options, host) {
|
|
251
193
|
return Dom.renderHost()(options, host, listInternalProps(options), options.content, (props, content) => {
|
|
@@ -284,25 +226,12 @@ function tabInternalProps(options) {
|
|
|
284
226
|
* tabindex.
|
|
285
227
|
*
|
|
286
228
|
* @remarks
|
|
287
|
-
* ## Why
|
|
288
|
-
*
|
|
289
|
-
* The component applies the family behavior while leaving callers free to supply a custom host
|
|
290
|
-
* through the shared DOM boundary.
|
|
291
|
-
*
|
|
292
|
-
* ## Ownership and lifetime
|
|
293
|
-
*
|
|
294
229
|
* The returned Fx installs DOM refs, native listeners, state subscriptions, and optional
|
|
295
230
|
* collection registrations only when rendered. The rendering Scope removes those resources;
|
|
296
231
|
* unrelated nodes and attributes remain caller-owned.
|
|
297
232
|
*
|
|
298
|
-
* ## Example
|
|
299
|
-
*
|
|
300
|
-
* Import with `import { Tab } from "@typed/ui/Tabs";` Extend the [Tabs.makeState runnable
|
|
301
|
-
* setup](/reference/%40typed%2Fui%2FTabs%23makeState). Replace the linked program's final snapshot
|
|
302
|
-
* read with `Tab({ state, id: "overview", panelId: "overview-panel", content: "Overview" })`;
|
|
303
|
-
* render that Fx before the same Scope closes.
|
|
304
233
|
* @since 1.0.0
|
|
305
|
-
* @category
|
|
234
|
+
* @category Tab controls
|
|
306
235
|
*/
|
|
307
236
|
export function Tab(options, host) {
|
|
308
237
|
return Dom.renderHost()(options, host, tabInternalProps(options), options.content, (props, content) => html `<button ...${props}>${content}</button>`);
|
|
@@ -321,25 +250,12 @@ function panelInternalProps(options) {
|
|
|
321
250
|
* Renders a labelled tabpanel and hides it reactively when its tab is not selected.
|
|
322
251
|
*
|
|
323
252
|
* @remarks
|
|
324
|
-
* ## Why
|
|
325
|
-
*
|
|
326
|
-
* The component applies the family behavior while leaving callers free to supply a custom host
|
|
327
|
-
* through the shared DOM boundary.
|
|
328
|
-
*
|
|
329
|
-
* ## Ownership and lifetime
|
|
330
|
-
*
|
|
331
253
|
* The returned Fx installs DOM refs, native listeners, state subscriptions, and optional
|
|
332
254
|
* collection registrations only when rendered. The rendering Scope removes those resources;
|
|
333
255
|
* unrelated nodes and attributes remain caller-owned.
|
|
334
256
|
*
|
|
335
|
-
* ## Example
|
|
336
|
-
*
|
|
337
|
-
* Import with `import { Panel } from "@typed/ui/Tabs";` Extend the [Tabs.makeState runnable
|
|
338
|
-
* setup](/reference/%40typed%2Fui%2FTabs%23makeState). Replace the linked program's final snapshot
|
|
339
|
-
* read with `Panel({ state, id: "overview-panel", tabId: "overview", content: "Account overview"
|
|
340
|
-
* })`; render that Fx before the same Scope closes.
|
|
341
257
|
* @since 1.0.0
|
|
342
|
-
* @category
|
|
258
|
+
* @category Panel visibility
|
|
343
259
|
*/
|
|
344
260
|
export function Panel(options, host) {
|
|
345
261
|
return Dom.renderHost()(options, host, panelInternalProps(options), options.content, (props, content) => html `<div ...${props}>${content}</div>`);
|
package/dist/Toolbar.d.ts
CHANGED
|
@@ -7,6 +7,8 @@
|
|
|
7
7
|
* the state and pure operations without mounting UI, or supply custom hosts without replacing native
|
|
8
8
|
* events and browser-owned focus.
|
|
9
9
|
*
|
|
10
|
+
* Learn the interaction in the [Toolbar guide](/explore/ui-toolbar).
|
|
11
|
+
*
|
|
10
12
|
* @since 1.0.0
|
|
11
13
|
* @category modules
|
|
12
14
|
* @packageDocumentation
|
|
@@ -22,64 +24,25 @@ import * as Composite from "./Composite.js";
|
|
|
22
24
|
import * as Dom from "./Dom.js";
|
|
23
25
|
import type { HostResult } from "./Dom/Types.js";
|
|
24
26
|
/**
|
|
25
|
-
*
|
|
26
|
-
*
|
|
27
|
-
* @remarks
|
|
28
|
-
* ## Why
|
|
29
|
-
*
|
|
30
|
-
* Applications can inspect, update, and test Toolbar behavior without mounting or coupling the
|
|
31
|
-
* state to a renderer.
|
|
32
|
-
*
|
|
33
|
-
* ## Ownership and lifetime
|
|
34
|
-
*
|
|
35
|
-
* This declaration is data or schema metadata and acquires no resources.
|
|
27
|
+
* The active command and arrow-navigation policy.
|
|
28
|
+
* Formatting preferences such as bold or italic are separate application state.
|
|
36
29
|
*
|
|
37
|
-
* ## Example
|
|
38
|
-
*
|
|
39
|
-
* Import with `import type { State } from "@typed/ui/Toolbar";` Extend the [Toolbar.makeState
|
|
40
|
-
* runnable setup](/reference/%40typed%2Fui%2FToolbar%23makeState). Inside the linked program,
|
|
41
|
-
* `const snapshot: State = yield* state` exposes toolbar focus policy.
|
|
42
30
|
* @since 1.0.0
|
|
43
|
-
* @category
|
|
31
|
+
* @category Command focus
|
|
44
32
|
*/
|
|
45
33
|
export interface State extends Composite.State {
|
|
46
34
|
}
|
|
47
35
|
/**
|
|
48
36
|
* Initial Toolbar values. Uses Composite defaults unless overridden.
|
|
49
37
|
*
|
|
50
|
-
* @remarks
|
|
51
|
-
* ## Why
|
|
52
|
-
*
|
|
53
|
-
* Making initialization explicit documents hydration-sensitive defaults and lets servers and
|
|
54
|
-
* clients construct matching state.
|
|
55
|
-
*
|
|
56
|
-
* ## Ownership and lifetime
|
|
57
|
-
*
|
|
58
|
-
* This declaration is data or schema metadata and acquires no resources.
|
|
59
|
-
*
|
|
60
|
-
* ## Example
|
|
61
|
-
*
|
|
62
|
-
* Import with `import type { InitialState } from "@typed/ui/Toolbar";` Extend the
|
|
63
|
-
* [Toolbar.makeState runnable setup](/reference/%40typed%2Fui%2FToolbar%23makeState). Construct a
|
|
64
|
-
* vertical toolbar with
|
|
65
|
-
* `const initial: InitialState = { orientation: "vertical" }; const state = yield* Toolbar.makeState(initial)`.
|
|
66
38
|
* @since 1.0.0
|
|
67
|
-
* @category
|
|
39
|
+
* @category Command focus
|
|
68
40
|
*/
|
|
69
41
|
export type InitialState = Composite.InitialState;
|
|
70
42
|
/**
|
|
71
43
|
* Effect Schema used by makeState to encode, decode, and hydrate Toolbar state.
|
|
72
44
|
*
|
|
73
45
|
* @remarks
|
|
74
|
-
* ## Why
|
|
75
|
-
*
|
|
76
|
-
* A public schema makes hydration and serialized state use the same runtime validation as direct
|
|
77
|
-
* construction.
|
|
78
|
-
*
|
|
79
|
-
* ## Ownership and lifetime
|
|
80
|
-
*
|
|
81
|
-
* This declaration is data or schema metadata and acquires no resources.
|
|
82
|
-
*
|
|
83
46
|
* @example
|
|
84
47
|
* ```ts
|
|
85
48
|
* import * as Schema from "effect/Schema";
|
|
@@ -88,7 +51,7 @@ export type InitialState = Composite.InitialState;
|
|
|
88
51
|
* const decodeState = Schema.decodeUnknownEffect(Toolbar.StateSchema);
|
|
89
52
|
* ```
|
|
90
53
|
* @since 1.0.0
|
|
91
|
-
* @category
|
|
54
|
+
* @category Command focus
|
|
92
55
|
*/
|
|
93
56
|
export declare const StateSchema: Schema.Struct<{
|
|
94
57
|
readonly activeId: Schema.NullOr<Schema.String>;
|
|
@@ -101,12 +64,6 @@ export declare const StateSchema: Schema.Struct<{
|
|
|
101
64
|
* Creates hydrated Toolbar state. Uses Composite defaults unless overridden.
|
|
102
65
|
*
|
|
103
66
|
* @remarks
|
|
104
|
-
* ## Why
|
|
105
|
-
*
|
|
106
|
-
* State and collection ownership can be composed and tested independently from any renderer.
|
|
107
|
-
*
|
|
108
|
-
* ## Ownership and lifetime
|
|
109
|
-
*
|
|
110
67
|
* The returned Effect creates the RefSubject when run. That state is renderer-independent;
|
|
111
68
|
* collection registrations belong to the separate Scope that runs register or ref, not to state
|
|
112
69
|
* creation.
|
|
@@ -125,7 +82,7 @@ export declare const StateSchema: Schema.Struct<{
|
|
|
125
82
|
* );
|
|
126
83
|
* ```
|
|
127
84
|
* @since 1.0.0
|
|
128
|
-
* @category
|
|
85
|
+
* @category Command focus
|
|
129
86
|
*/
|
|
130
87
|
export declare function makeState(initial?: InitialState): Effect.Effect<RefSubject.HydratedRefSubject<{
|
|
131
88
|
readonly activeId: string | null;
|
|
@@ -138,12 +95,6 @@ export declare function makeState(initial?: InitialState): Effect.Effect<RefSubj
|
|
|
138
95
|
* Creates a scoped Collection for Toolbar items.
|
|
139
96
|
*
|
|
140
97
|
* @remarks
|
|
141
|
-
* ## Why
|
|
142
|
-
*
|
|
143
|
-
* State and collection ownership can be composed and tested independently from any renderer.
|
|
144
|
-
*
|
|
145
|
-
* ## Ownership and lifetime
|
|
146
|
-
*
|
|
147
98
|
* The returned Effect allocates the RefSubject in the caller's Scope. Each later registration is
|
|
148
99
|
* owned by the Scope that runs register, independently of this construction Effect.
|
|
149
100
|
*
|
|
@@ -160,53 +111,38 @@ export declare function makeState(initial?: InitialState): Effect.Effect<RefSubj
|
|
|
160
111
|
* );
|
|
161
112
|
* ```
|
|
162
113
|
* @since 1.0.0
|
|
163
|
-
* @category
|
|
114
|
+
* @category Command registration
|
|
164
115
|
*/
|
|
165
116
|
export declare const makeCollection: (initial?: Collection.State<string, Element>) => Effect.Effect<RefSubject.RefSubject<Collection.State<string, Element>, never, never>, never, Scope.Scope>;
|
|
166
117
|
/**
|
|
167
118
|
* Inputs accepted by Toolbar.Root in addition to the shared DOM host options.
|
|
168
119
|
*
|
|
169
|
-
* @remarks
|
|
170
|
-
* ## Why
|
|
171
|
-
*
|
|
172
|
-
* The options type makes required state, content, accessible relationships, and custom-host inputs
|
|
173
|
-
* visible before rendering.
|
|
174
|
-
*
|
|
175
|
-
* ## Ownership and lifetime
|
|
176
|
-
*
|
|
177
|
-
* This declaration is data or schema metadata and acquires no resources.
|
|
178
|
-
*
|
|
179
|
-
* ## Example
|
|
180
|
-
*
|
|
181
|
-
* Import with `import type { RootOptions } from "@typed/ui/Toolbar";` Extend the [Toolbar.makeState
|
|
182
|
-
* runnable setup](/reference/%40typed%2Fui%2FToolbar%23makeState). Enable toolbar movement with
|
|
183
|
-
* `const options: RootOptions = { state, collection, label: "Formatting", content: "Buttons" }`.
|
|
184
120
|
* @since 1.0.0
|
|
185
|
-
* @category
|
|
121
|
+
* @category Toolbar surface
|
|
186
122
|
*/
|
|
187
123
|
export interface RootOptions extends Dom.HostOptions<HTMLDivElement> {
|
|
188
124
|
/**
|
|
189
125
|
* Renderer-independent RefSubject state consumed by this component or operation.
|
|
190
126
|
* @since 1.0.0
|
|
191
|
-
* @category
|
|
127
|
+
* @category State connection
|
|
192
128
|
*/
|
|
193
129
|
readonly state: RefSubject.HydratedRefSubject<State, Schema.SchemaError>;
|
|
194
130
|
/**
|
|
195
131
|
* Item registry used for collection-driven keyboard behavior and mounted ordering.
|
|
196
132
|
* @since 1.0.0
|
|
197
|
-
* @category
|
|
133
|
+
* @category Item registration
|
|
198
134
|
*/
|
|
199
135
|
readonly collection?: RefSubject.RefSubject<Collection.State<string>>;
|
|
200
136
|
/**
|
|
201
137
|
* Renderable child content for the component host.
|
|
202
138
|
* @since 1.0.0
|
|
203
|
-
* @category
|
|
139
|
+
* @category Rendered content
|
|
204
140
|
*/
|
|
205
141
|
readonly content: Renderable.Any;
|
|
206
142
|
/**
|
|
207
143
|
* Accessible label rendered through aria-label.
|
|
208
144
|
* @since 1.0.0
|
|
209
|
-
* @category
|
|
145
|
+
* @category Accessible naming
|
|
210
146
|
*/
|
|
211
147
|
readonly label?: Renderable.Any<string | null | undefined>;
|
|
212
148
|
}
|
|
@@ -224,107 +160,66 @@ type RootProps<Options extends RootOptions> = ReturnType<ReturnType<typeof rootP
|
|
|
224
160
|
* Renders the toolbar root and moves roving focus through registered items in DOM order.
|
|
225
161
|
*
|
|
226
162
|
* @remarks
|
|
227
|
-
* ## Why
|
|
228
|
-
*
|
|
229
|
-
* The component applies the family behavior while leaving callers free to supply a custom host
|
|
230
|
-
* through the shared DOM boundary.
|
|
231
|
-
*
|
|
232
|
-
* ## Ownership and lifetime
|
|
233
|
-
*
|
|
234
163
|
* The returned Fx installs DOM refs, native listeners, state subscriptions, and optional
|
|
235
164
|
* collection registrations only when rendered. The rendering Scope removes those resources;
|
|
236
165
|
* unrelated nodes and attributes remain caller-owned.
|
|
237
166
|
*
|
|
238
|
-
* ## Example
|
|
239
|
-
*
|
|
240
|
-
* Import with `import { Root } from "@typed/ui/Toolbar";` Extend the [Toolbar.makeState runnable
|
|
241
|
-
* setup](/reference/%40typed%2Fui%2FToolbar%23makeState). Replace the linked program's final
|
|
242
|
-
* snapshot read with `Root({ state, label: "Formatting", content: "Buttons" })`; render that Fx
|
|
243
|
-
* before the same Scope closes.
|
|
244
167
|
* @since 1.0.0
|
|
245
|
-
* @category
|
|
168
|
+
* @category Toolbar surface
|
|
246
169
|
*/
|
|
247
170
|
export declare function Root<const Options extends RootOptions, const Host extends HostResult = never>(options: Options, host?: Dom.HostOverride<Dom.RenderHostProps<Options, RootProps<Options>>, Options["content"], Host>): Fx<RenderEvent, Renderable.Error<Options | Host>, Renderable.Services<Options | Host> | Scope.Scope | RenderTemplate>;
|
|
248
171
|
/**
|
|
249
172
|
* Consumer-facing alias of the canonical Toolbar component with identical behavior and lifetime.
|
|
250
173
|
*
|
|
251
174
|
* @remarks
|
|
252
|
-
* ## Why
|
|
253
|
-
*
|
|
254
|
-
* The component applies the family behavior while leaving callers free to supply a custom host
|
|
255
|
-
* through the shared DOM boundary.
|
|
256
|
-
*
|
|
257
|
-
* ## Ownership and lifetime
|
|
258
|
-
*
|
|
259
175
|
* The alias acquires nothing. Rendering it has exactly the canonical component's Scope and DOM
|
|
260
176
|
* ownership contract.
|
|
261
177
|
*
|
|
262
|
-
* ## Example
|
|
263
|
-
*
|
|
264
|
-
* Import with `import { Toolbar } from "@typed/ui/Toolbar";` Extend the [Toolbar.makeState runnable
|
|
265
|
-
* setup](/reference/%40typed%2Fui%2FToolbar%23makeState). Replace the linked program's final
|
|
266
|
-
* snapshot read with `Toolbar({ state, label: "Formatting", content: "Buttons" })`; render that Fx
|
|
267
|
-
* before the same Scope closes.
|
|
268
178
|
* @since 1.0.0
|
|
269
|
-
* @category
|
|
179
|
+
* @category Toolbar surface
|
|
270
180
|
*/
|
|
271
181
|
export declare const Toolbar: typeof Root;
|
|
272
182
|
/**
|
|
273
183
|
* Inputs accepted by Toolbar.Item in addition to the shared DOM host options.
|
|
274
184
|
*
|
|
275
|
-
* @remarks
|
|
276
|
-
* ## Why
|
|
277
|
-
*
|
|
278
|
-
* The options type makes required state, content, accessible relationships, and custom-host inputs
|
|
279
|
-
* visible before rendering.
|
|
280
|
-
*
|
|
281
|
-
* ## Ownership and lifetime
|
|
282
|
-
*
|
|
283
|
-
* This declaration is data or schema metadata and acquires no resources.
|
|
284
|
-
*
|
|
285
|
-
* ## Example
|
|
286
|
-
*
|
|
287
|
-
* Import with `import type { ItemOptions } from "@typed/ui/Toolbar";` Extend the [Toolbar.makeState
|
|
288
|
-
* runnable setup](/reference/%40typed%2Fui%2FToolbar%23makeState). A toolbar control is
|
|
289
|
-
* `const options: ItemOptions = { state, collection, id: "bold", content: "Bold" }`.
|
|
290
185
|
* @since 1.0.0
|
|
291
|
-
* @category
|
|
186
|
+
* @category Toolbar commands
|
|
292
187
|
*/
|
|
293
188
|
export interface ItemOptions extends Dom.HostOptions<HTMLDivElement> {
|
|
294
189
|
/**
|
|
295
190
|
* Renderer-independent RefSubject state consumed by this component or operation.
|
|
296
191
|
* @since 1.0.0
|
|
297
|
-
* @category
|
|
192
|
+
* @category State connection
|
|
298
193
|
*/
|
|
299
194
|
readonly state: RefSubject.HydratedRefSubject<State, Schema.SchemaError>;
|
|
300
195
|
/**
|
|
301
196
|
* Item registry used for collection-driven keyboard behavior and mounted ordering.
|
|
302
197
|
* @since 1.0.0
|
|
303
|
-
* @category
|
|
198
|
+
* @category Item registration
|
|
304
199
|
*/
|
|
305
200
|
readonly collection?: RefSubject.RefSubject<Collection.State<string>>;
|
|
306
201
|
/**
|
|
307
202
|
* Stable id used for collection identity and ARIA relationships.
|
|
308
203
|
* @since 1.0.0
|
|
309
|
-
* @category
|
|
204
|
+
* @category Identity and relationships
|
|
310
205
|
*/
|
|
311
206
|
readonly id: string;
|
|
312
207
|
/**
|
|
313
208
|
* Renderable child content for the component host.
|
|
314
209
|
* @since 1.0.0
|
|
315
|
-
* @category
|
|
210
|
+
* @category Rendered content
|
|
316
211
|
*/
|
|
317
212
|
readonly content: Renderable.Any;
|
|
318
213
|
/**
|
|
319
214
|
* Search text used by typeahead independently of rendered markup.
|
|
320
215
|
* @since 1.0.0
|
|
321
|
-
* @category
|
|
216
|
+
* @category Text matching
|
|
322
217
|
*/
|
|
323
218
|
readonly textValue?: string;
|
|
324
219
|
/**
|
|
325
220
|
* Flag used by collection movement and widget handlers to skip activation by default.
|
|
326
221
|
* @since 1.0.0
|
|
327
|
-
* @category
|
|
222
|
+
* @category Availability
|
|
328
223
|
*/
|
|
329
224
|
readonly disabled?: boolean;
|
|
330
225
|
}
|
|
@@ -341,25 +236,12 @@ type ItemProps<Options extends ItemOptions> = ReturnType<ReturnType<typeof itemP
|
|
|
341
236
|
* Renders and optionally registers a toolbar button; focus activates it unless disabled.
|
|
342
237
|
*
|
|
343
238
|
* @remarks
|
|
344
|
-
* ## Why
|
|
345
|
-
*
|
|
346
|
-
* The component applies the family behavior while leaving callers free to supply a custom host
|
|
347
|
-
* through the shared DOM boundary.
|
|
348
|
-
*
|
|
349
|
-
* ## Ownership and lifetime
|
|
350
|
-
*
|
|
351
239
|
* The returned Fx installs DOM refs, native listeners, state subscriptions, and optional
|
|
352
240
|
* collection registrations only when rendered. The rendering Scope removes those resources;
|
|
353
241
|
* unrelated nodes and attributes remain caller-owned.
|
|
354
242
|
*
|
|
355
|
-
* ## Example
|
|
356
|
-
*
|
|
357
|
-
* Import with `import { Item } from "@typed/ui/Toolbar";` Extend the [Toolbar.makeState runnable
|
|
358
|
-
* setup](/reference/%40typed%2Fui%2FToolbar%23makeState). Replace the linked program's final
|
|
359
|
-
* snapshot read with `Item({ state, id: "bold", content: "Bold" })`; render that Fx before the same
|
|
360
|
-
* Scope closes.
|
|
361
243
|
* @since 1.0.0
|
|
362
|
-
* @category
|
|
244
|
+
* @category Toolbar commands
|
|
363
245
|
*/
|
|
364
246
|
export declare function Item<const Options extends ItemOptions, const Host extends HostResult = never>(options: Options, host?: Dom.HostOverride<Dom.RenderHostProps<Options, ItemProps<Options>>, Options["content"], Host>): Fx<RenderEvent, Renderable.Error<Options | Host>, Renderable.Services<Options | Host> | Scope.Scope | RenderTemplate>;
|
|
365
247
|
export {};
|
package/dist/Toolbar.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toolbar.d.ts","sourceRoot":"","sources":["../src/Toolbar.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"Toolbar.d.ts","sourceRoot":"","sources":["../src/Toolbar.ts"],"names":[],"mappings":"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"}
|