@emuanalytics/flow-rdf-ui 0.0.4 → 0.0.6
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/custom-elements.json +6040 -4428
- package/dist/flow-rdf-ui.d.ts +70 -0
- package/dist/flow-rdf-ui.js +1041 -736
- package/dist/flow-rdf-ui.umd.cjs +1041 -736
- package/dist/vscode.html-custom-data.json +207 -207
- package/package.json +2 -1
|
@@ -35,37 +35,63 @@
|
|
|
35
35
|
"references": []
|
|
36
36
|
},
|
|
37
37
|
{
|
|
38
|
-
"name": "flow-ui-
|
|
39
|
-
"description": "
|
|
38
|
+
"name": "flow-ui-animation",
|
|
39
|
+
"description": "Animate elements declaratively with nearly 100 baked-in presets, or roll your own with custom keyframes. Powered by the [Web Animations API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API).\n\n\n---\n\n\n\n\n### **Events:**\n - **flow-ui-cancel** - Emitted when the animation is canceled.\n- **flow-ui-finish** - Emitted when the animation finishes.\n- **flow-ui-start** - Emitted when the animation starts or restarts.\n\n### **Methods:**\n - **cancel()** - Clears all keyframe effects caused by this animation and aborts its playback.\n- **finish()** - Sets the playback time to the end of the animation corresponding to the current playback direction.\n\n### **Slots:**\n - _default_ - The element to animate. Avoid slotting in more than one element, as subsequent ones will be ignored. To animate multiple elements, either wrap them in a single container or use multiple `<flow-ui-animation>` elements.",
|
|
40
40
|
"attributes": [
|
|
41
41
|
{
|
|
42
|
-
"name": "
|
|
43
|
-
"description": "The
|
|
42
|
+
"name": "name",
|
|
43
|
+
"description": "The name of the built-in animation to use. For custom animations, use the `keyframes` prop.",
|
|
44
44
|
"values": []
|
|
45
45
|
},
|
|
46
46
|
{
|
|
47
|
-
"name": "
|
|
48
|
-
"description": "
|
|
47
|
+
"name": "play",
|
|
48
|
+
"description": "Plays the animation. When omitted, the animation will be paused. This attribute will be automatically removed when\nthe animation finishes or gets canceled.",
|
|
49
49
|
"values": []
|
|
50
50
|
},
|
|
51
51
|
{
|
|
52
|
-
"name": "
|
|
53
|
-
"description": "
|
|
52
|
+
"name": "delay",
|
|
53
|
+
"description": "The number of milliseconds to delay the start of the animation.",
|
|
54
54
|
"values": []
|
|
55
55
|
},
|
|
56
56
|
{
|
|
57
|
-
"name": "
|
|
58
|
-
"description": "
|
|
59
|
-
"values": [{ "name": "
|
|
57
|
+
"name": "direction",
|
|
58
|
+
"description": "Determines the direction of playback as well as the behavior when reaching the end of an iteration.\n[Learn more](https://developer.mozilla.org/en-US/docs/Web/CSS/animation-direction)",
|
|
59
|
+
"values": [{ "name": "PlaybackDirection" }]
|
|
60
60
|
},
|
|
61
61
|
{
|
|
62
|
-
"name": "
|
|
63
|
-
"description": "The
|
|
64
|
-
"values": [
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
62
|
+
"name": "duration",
|
|
63
|
+
"description": "The number of milliseconds each iteration of the animation takes to complete.",
|
|
64
|
+
"values": []
|
|
65
|
+
},
|
|
66
|
+
{
|
|
67
|
+
"name": "easing",
|
|
68
|
+
"description": "The easing function to use for the animation. This can be a Flo.w RDF UI easing function or a custom easing function\nsuch as `cubic-bezier(0, 1, .76, 1.14)`.",
|
|
69
|
+
"values": []
|
|
70
|
+
},
|
|
71
|
+
{
|
|
72
|
+
"name": "end-delay",
|
|
73
|
+
"description": "The number of milliseconds to delay after the active period of an animation sequence.",
|
|
74
|
+
"values": []
|
|
75
|
+
},
|
|
76
|
+
{
|
|
77
|
+
"name": "fill",
|
|
78
|
+
"description": "Sets how the animation applies styles to its target before and after its execution.",
|
|
79
|
+
"values": [{ "name": "FillMode" }]
|
|
80
|
+
},
|
|
81
|
+
{
|
|
82
|
+
"name": "iterations",
|
|
83
|
+
"description": "The number of iterations to run before the animation completes. Defaults to `Infinity`, which loops.",
|
|
84
|
+
"values": []
|
|
85
|
+
},
|
|
86
|
+
{
|
|
87
|
+
"name": "iteration-start",
|
|
88
|
+
"description": "The offset at which to start the animation, usually between 0 (start) and 1 (end).",
|
|
89
|
+
"values": []
|
|
90
|
+
},
|
|
91
|
+
{
|
|
92
|
+
"name": "playback-rate",
|
|
93
|
+
"description": "Sets the animation's playback rate. The default is `1`, which plays the animation at a normal speed. Setting this\nto `2`, for example, will double the animation's speed. A negative value can be used to reverse the animation. This\nvalue can be changed without causing the animation to restart.",
|
|
94
|
+
"values": []
|
|
69
95
|
}
|
|
70
96
|
],
|
|
71
97
|
"references": []
|
|
@@ -109,6 +135,19 @@
|
|
|
109
135
|
],
|
|
110
136
|
"references": []
|
|
111
137
|
},
|
|
138
|
+
{
|
|
139
|
+
"name": "flow-ui-button-group",
|
|
140
|
+
"description": "Button groups can be used to group related buttons into sections.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - One or more `<flow-ui-button>` elements to display in the button group.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
|
|
141
|
+
"attributes": [
|
|
142
|
+
{ "name": "label", "values": [] },
|
|
143
|
+
{
|
|
144
|
+
"name": "vertical",
|
|
145
|
+
"description": "Use vertical layout for the button group.",
|
|
146
|
+
"values": []
|
|
147
|
+
}
|
|
148
|
+
],
|
|
149
|
+
"references": []
|
|
150
|
+
},
|
|
112
151
|
{
|
|
113
152
|
"name": "flow-ui-button",
|
|
114
153
|
"description": "Buttons represent actions that are available to the user.\n\n\n---\n\n\n\n\n### **Events:**\n - **flow-ui-blur** - Emitted when the button loses focus.\n- **flow-ui-focus** - Emitted when the button gains focus.\n- **flow-ui-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **click()** - Simulates a click on the button.\n- **focus(options: _FocusOptions_)** - Sets focus on the button.\n- **blur()** - Removes focus from the button.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n\n### **Slots:**\n - _default_ - The button's label.\n- **prefix** - A presentational prefix icon or similar element.\n- **suffix** - A presentational suffix icon or similar element.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **prefix** - The container that wraps the prefix.\n- **label** - The button's label.\n- **suffix** - The container that wraps the suffix.\n- **caret** - The button's caret icon, an `<flow-ui-icon>` element.",
|
|
@@ -253,81 +292,6 @@
|
|
|
253
292
|
],
|
|
254
293
|
"references": []
|
|
255
294
|
},
|
|
256
|
-
{
|
|
257
|
-
"name": "flow-ui-button-group",
|
|
258
|
-
"description": "Button groups can be used to group related buttons into sections.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - One or more `<flow-ui-button>` elements to display in the button group.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
|
|
259
|
-
"attributes": [
|
|
260
|
-
{ "name": "label", "values": [] },
|
|
261
|
-
{
|
|
262
|
-
"name": "vertical",
|
|
263
|
-
"description": "Use vertical layout for the button group.",
|
|
264
|
-
"values": []
|
|
265
|
-
}
|
|
266
|
-
],
|
|
267
|
-
"references": []
|
|
268
|
-
},
|
|
269
|
-
{
|
|
270
|
-
"name": "flow-ui-animation",
|
|
271
|
-
"description": "Animate elements declaratively with nearly 100 baked-in presets, or roll your own with custom keyframes. Powered by the [Web Animations API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API).\n\n\n---\n\n\n\n\n### **Events:**\n - **flow-ui-cancel** - Emitted when the animation is canceled.\n- **flow-ui-finish** - Emitted when the animation finishes.\n- **flow-ui-start** - Emitted when the animation starts or restarts.\n\n### **Methods:**\n - **cancel()** - Clears all keyframe effects caused by this animation and aborts its playback.\n- **finish()** - Sets the playback time to the end of the animation corresponding to the current playback direction.\n\n### **Slots:**\n - _default_ - The element to animate. Avoid slotting in more than one element, as subsequent ones will be ignored. To animate multiple elements, either wrap them in a single container or use multiple `<flow-ui-animation>` elements.",
|
|
272
|
-
"attributes": [
|
|
273
|
-
{
|
|
274
|
-
"name": "name",
|
|
275
|
-
"description": "The name of the built-in animation to use. For custom animations, use the `keyframes` prop.",
|
|
276
|
-
"values": []
|
|
277
|
-
},
|
|
278
|
-
{
|
|
279
|
-
"name": "play",
|
|
280
|
-
"description": "Plays the animation. When omitted, the animation will be paused. This attribute will be automatically removed when\nthe animation finishes or gets canceled.",
|
|
281
|
-
"values": []
|
|
282
|
-
},
|
|
283
|
-
{
|
|
284
|
-
"name": "delay",
|
|
285
|
-
"description": "The number of milliseconds to delay the start of the animation.",
|
|
286
|
-
"values": []
|
|
287
|
-
},
|
|
288
|
-
{
|
|
289
|
-
"name": "direction",
|
|
290
|
-
"description": "Determines the direction of playback as well as the behavior when reaching the end of an iteration.\n[Learn more](https://developer.mozilla.org/en-US/docs/Web/CSS/animation-direction)",
|
|
291
|
-
"values": [{ "name": "PlaybackDirection" }]
|
|
292
|
-
},
|
|
293
|
-
{
|
|
294
|
-
"name": "duration",
|
|
295
|
-
"description": "The number of milliseconds each iteration of the animation takes to complete.",
|
|
296
|
-
"values": []
|
|
297
|
-
},
|
|
298
|
-
{
|
|
299
|
-
"name": "easing",
|
|
300
|
-
"description": "The easing function to use for the animation. This can be a Flo.w RDF UI easing function or a custom easing function\nsuch as `cubic-bezier(0, 1, .76, 1.14)`.",
|
|
301
|
-
"values": []
|
|
302
|
-
},
|
|
303
|
-
{
|
|
304
|
-
"name": "end-delay",
|
|
305
|
-
"description": "The number of milliseconds to delay after the active period of an animation sequence.",
|
|
306
|
-
"values": []
|
|
307
|
-
},
|
|
308
|
-
{
|
|
309
|
-
"name": "fill",
|
|
310
|
-
"description": "Sets how the animation applies styles to its target before and after its execution.",
|
|
311
|
-
"values": [{ "name": "FillMode" }]
|
|
312
|
-
},
|
|
313
|
-
{
|
|
314
|
-
"name": "iterations",
|
|
315
|
-
"description": "The number of iterations to run before the animation completes. Defaults to `Infinity`, which loops.",
|
|
316
|
-
"values": []
|
|
317
|
-
},
|
|
318
|
-
{
|
|
319
|
-
"name": "iteration-start",
|
|
320
|
-
"description": "The offset at which to start the animation, usually between 0 (start) and 1 (end).",
|
|
321
|
-
"values": []
|
|
322
|
-
},
|
|
323
|
-
{
|
|
324
|
-
"name": "playback-rate",
|
|
325
|
-
"description": "Sets the animation's playback rate. The default is `1`, which plays the animation at a normal speed. Setting this\nto `2`, for example, will double the animation's speed. A negative value can be used to reverse the animation. This\nvalue can be changed without causing the animation to restart.",
|
|
326
|
-
"values": []
|
|
327
|
-
}
|
|
328
|
-
],
|
|
329
|
-
"references": []
|
|
330
|
-
},
|
|
331
295
|
{
|
|
332
296
|
"name": "flow-ui-badge",
|
|
333
297
|
"description": "Badges are used to draw attention and display statuses or counts.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - The badge's content.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
|
|
@@ -356,6 +320,42 @@
|
|
|
356
320
|
],
|
|
357
321
|
"references": []
|
|
358
322
|
},
|
|
323
|
+
{
|
|
324
|
+
"name": "flow-ui-avatar",
|
|
325
|
+
"description": "Avatars are used to represent a person or object.\n\n\n---\n\n\n\n\n### **Slots:**\n - **icon** - The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.\n\n### **CSS Properties:**\n - **--size** - The size of the avatar. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **icon** - The container that wraps the avatar's icon.\n- **initials** - The container that wraps the avatar's initials.\n- **image** - The avatar image. Only shown when the `image` attribute is set.",
|
|
326
|
+
"attributes": [
|
|
327
|
+
{
|
|
328
|
+
"name": "image",
|
|
329
|
+
"description": "The image source to use for the avatar.",
|
|
330
|
+
"values": []
|
|
331
|
+
},
|
|
332
|
+
{
|
|
333
|
+
"name": "label",
|
|
334
|
+
"description": "A label to use to describe the avatar to assistive devices.",
|
|
335
|
+
"values": []
|
|
336
|
+
},
|
|
337
|
+
{
|
|
338
|
+
"name": "initials",
|
|
339
|
+
"description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
|
|
340
|
+
"values": []
|
|
341
|
+
},
|
|
342
|
+
{
|
|
343
|
+
"name": "loading",
|
|
344
|
+
"description": "Indicates how the browser should load the image.",
|
|
345
|
+
"values": [{ "name": "eager" }, { "name": "lazy" }]
|
|
346
|
+
},
|
|
347
|
+
{
|
|
348
|
+
"name": "shape",
|
|
349
|
+
"description": "The shape of the avatar.",
|
|
350
|
+
"values": [
|
|
351
|
+
{ "name": "circle" },
|
|
352
|
+
{ "name": "square" },
|
|
353
|
+
{ "name": "rounded" }
|
|
354
|
+
]
|
|
355
|
+
}
|
|
356
|
+
],
|
|
357
|
+
"references": []
|
|
358
|
+
},
|
|
359
359
|
{
|
|
360
360
|
"name": "flow-ui-card",
|
|
361
361
|
"description": "Cards can be used to group related subjects in a container.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - The card's main content.\n- **header** - An optional header for the card.\n- **footer** - An optional footer for the card.\n- **image** - An optional image to render at the start of the card.\n\n### **CSS Properties:**\n - **--border-color** - The card's border color, including borders that occur inside the card. _(default: undefined)_\n- **--border-radius** - The border radius for the card's edges. _(default: undefined)_\n- **--border-width** - The width of the card's borders. _(default: undefined)_\n- **--padding** - The padding to use for the card's sections. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **image** - The container that wraps the card's image.\n- **header** - The container that wraps the card's header.\n- **body** - The container that wraps the card's main content.\n- **footer** - The container that wraps the card's footer.",
|
|
@@ -1030,12 +1030,76 @@
|
|
|
1030
1030
|
"attributes": [],
|
|
1031
1031
|
"references": []
|
|
1032
1032
|
},
|
|
1033
|
+
{
|
|
1034
|
+
"name": "flow-ui-menu-item",
|
|
1035
|
+
"description": "Menu items provide options for the user to pick from in a menu.\n\n\n---\n\n\n\n\n### **Methods:**\n - **getTextLabel()** - Returns a text label based on the contents of the menu item's default slot.\n\n### **Slots:**\n - _default_ - The menu item's label.\n- **prefix** - Used to prepend an icon or similar element to the menu item.\n- **suffix** - Used to append an icon or similar element to the menu item.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **checked-icon** - The checked icon, which is only visible when the menu item is checked.\n- **prefix** - The prefix container.\n- **label** - The menu item label.\n- **suffix** - The suffix container.\n- **submenu-icon** - The submenu icon, visible only when the menu item has a submenu (not yet implemented).",
|
|
1036
|
+
"attributes": [
|
|
1037
|
+
{
|
|
1038
|
+
"name": "type",
|
|
1039
|
+
"description": "The type of menu item to render. To use `checked`, this value must be set to `checkbox`.",
|
|
1040
|
+
"values": [{ "name": "normal" }, { "name": "checkbox" }]
|
|
1041
|
+
},
|
|
1042
|
+
{
|
|
1043
|
+
"name": "checked",
|
|
1044
|
+
"description": "Draws the item in a checked state.",
|
|
1045
|
+
"values": []
|
|
1046
|
+
},
|
|
1047
|
+
{
|
|
1048
|
+
"name": "value",
|
|
1049
|
+
"description": "A unique value to store in the menu item. This can be used as a way to identify menu items when selected.",
|
|
1050
|
+
"values": []
|
|
1051
|
+
},
|
|
1052
|
+
{
|
|
1053
|
+
"name": "disabled",
|
|
1054
|
+
"description": "Draws the menu item in a disabled state, preventing selection.",
|
|
1055
|
+
"values": []
|
|
1056
|
+
}
|
|
1057
|
+
],
|
|
1058
|
+
"references": []
|
|
1059
|
+
},
|
|
1033
1060
|
{
|
|
1034
1061
|
"name": "flow-ui-menu-label",
|
|
1035
1062
|
"description": "Menu labels are used to describe a group of menu items.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - The menu label's content.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
|
|
1036
1063
|
"attributes": [],
|
|
1037
1064
|
"references": []
|
|
1038
1065
|
},
|
|
1066
|
+
{
|
|
1067
|
+
"name": "flow-ui-mutation-observer",
|
|
1068
|
+
"description": "The Mutation Observer component offers a thin, declarative interface to the [`MutationObserver API`](https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver).\n\n\n---\n\n\n\n\n### **Events:**\n - **flow-ui-mutation** - Emitted when a mutation occurs.\n\n### **Slots:**\n - _default_ - The content to watch for mutations.",
|
|
1069
|
+
"attributes": [
|
|
1070
|
+
{
|
|
1071
|
+
"name": "attr",
|
|
1072
|
+
"description": "Watches for changes to attributes. To watch only specific attributes, separate them by a space, e.g.\n`attr=\"class id title\"`. To watch all attributes, use `*`.",
|
|
1073
|
+
"values": []
|
|
1074
|
+
},
|
|
1075
|
+
{
|
|
1076
|
+
"name": "attr-old-value",
|
|
1077
|
+
"description": "Indicates whether or not the attribute's previous value should be recorded when monitoring changes.",
|
|
1078
|
+
"values": []
|
|
1079
|
+
},
|
|
1080
|
+
{
|
|
1081
|
+
"name": "char-data",
|
|
1082
|
+
"description": "Watches for changes to the character data contained within the node.",
|
|
1083
|
+
"values": []
|
|
1084
|
+
},
|
|
1085
|
+
{
|
|
1086
|
+
"name": "char-data-old-value",
|
|
1087
|
+
"description": "Indicates whether or not the previous value of the node's text should be recorded.",
|
|
1088
|
+
"values": []
|
|
1089
|
+
},
|
|
1090
|
+
{
|
|
1091
|
+
"name": "child-list",
|
|
1092
|
+
"description": "Watches for the addition or removal of new child nodes.",
|
|
1093
|
+
"values": []
|
|
1094
|
+
},
|
|
1095
|
+
{
|
|
1096
|
+
"name": "disabled",
|
|
1097
|
+
"description": "Disables the observer.",
|
|
1098
|
+
"values": []
|
|
1099
|
+
}
|
|
1100
|
+
],
|
|
1101
|
+
"references": []
|
|
1102
|
+
},
|
|
1039
1103
|
{
|
|
1040
1104
|
"name": "flow-ui-option",
|
|
1041
1105
|
"description": "Options define the selectable items within various form controls such as [select](/components/select).\n\n\n---\n\n\n\n\n### **Methods:**\n - **getTextLabel()** - Returns a plain text label based on the option's content.\n\n### **Slots:**\n - _default_ - The option's label.\n- **prefix** - Used to prepend an icon or similar element to the menu item.\n- **suffix** - Used to append an icon or similar element to the menu item.\n\n### **CSS Parts:**\n - **checked-icon** - The checked icon, a `<flow-ui-icon>` element.\n- **base** - The component's base wrapper.\n- **label** - The option's label.\n- **prefix** - The container that wraps the prefix.\n- **suffix** - The container that wraps the suffix.",
|
|
@@ -1193,56 +1257,36 @@
|
|
|
1193
1257
|
"references": []
|
|
1194
1258
|
},
|
|
1195
1259
|
{
|
|
1196
|
-
"name": "flow-ui-
|
|
1197
|
-
"description": "
|
|
1260
|
+
"name": "flow-ui-progress-bar",
|
|
1261
|
+
"description": "Progress bars are used to show the status of an ongoing operation.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - A label to show inside the progress indicator.\n\n### **CSS Properties:**\n - **--height** - The progress bar's height. _(default: undefined)_\n- **--track-color** - The color of the track. _(default: undefined)_\n- **--indicator-color** - The color of the indicator. _(default: undefined)_\n- **--label-color** - The color of the label. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **indicator** - The progress bar's indicator.\n- **label** - The progress bar's label.",
|
|
1198
1262
|
"attributes": [
|
|
1199
1263
|
{
|
|
1200
|
-
"name": "
|
|
1201
|
-
"description": "
|
|
1202
|
-
"values": []
|
|
1203
|
-
},
|
|
1204
|
-
{
|
|
1205
|
-
"name": "attr-old-value",
|
|
1206
|
-
"description": "Indicates whether or not the attribute's previous value should be recorded when monitoring changes.",
|
|
1207
|
-
"values": []
|
|
1208
|
-
},
|
|
1209
|
-
{
|
|
1210
|
-
"name": "char-data",
|
|
1211
|
-
"description": "Watches for changes to the character data contained within the node.",
|
|
1212
|
-
"values": []
|
|
1213
|
-
},
|
|
1214
|
-
{
|
|
1215
|
-
"name": "char-data-old-value",
|
|
1216
|
-
"description": "Indicates whether or not the previous value of the node's text should be recorded.",
|
|
1264
|
+
"name": "value",
|
|
1265
|
+
"description": "The current progress as a percentage, 0 to 100.",
|
|
1217
1266
|
"values": []
|
|
1218
1267
|
},
|
|
1219
1268
|
{
|
|
1220
|
-
"name": "
|
|
1221
|
-
"description": "
|
|
1269
|
+
"name": "indeterminate",
|
|
1270
|
+
"description": "When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state.",
|
|
1222
1271
|
"values": []
|
|
1223
1272
|
},
|
|
1224
1273
|
{
|
|
1225
|
-
"name": "
|
|
1226
|
-
"description": "
|
|
1274
|
+
"name": "label",
|
|
1275
|
+
"description": "A custom label for assistive devices.",
|
|
1227
1276
|
"values": []
|
|
1228
1277
|
}
|
|
1229
1278
|
],
|
|
1230
1279
|
"references": []
|
|
1231
1280
|
},
|
|
1232
1281
|
{
|
|
1233
|
-
"name": "flow-ui-progress-
|
|
1234
|
-
"description": "Progress
|
|
1282
|
+
"name": "flow-ui-progress-ring",
|
|
1283
|
+
"description": "Progress rings are used to show the progress of a determinate operation in a circular fashion.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - A label to show inside the ring.\n\n### **CSS Properties:**\n - **--size** - The diameter of the progress ring (cannot be a percentage). _(default: undefined)_\n- **--track-width** - The width of the track. _(default: undefined)_\n- **--track-color** - The color of the track. _(default: undefined)_\n- **--indicator-width** - The width of the indicator. Defaults to the track width. _(default: undefined)_\n- **--indicator-color** - The color of the indicator. _(default: undefined)_\n- **--indicator-transition-duration** - The duration of the indicator's transition when the value changes. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **label** - The progress ring label.",
|
|
1235
1284
|
"attributes": [
|
|
1236
1285
|
{
|
|
1237
1286
|
"name": "value",
|
|
1238
1287
|
"description": "The current progress as a percentage, 0 to 100.",
|
|
1239
1288
|
"values": []
|
|
1240
1289
|
},
|
|
1241
|
-
{
|
|
1242
|
-
"name": "indeterminate",
|
|
1243
|
-
"description": "When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state.",
|
|
1244
|
-
"values": []
|
|
1245
|
-
},
|
|
1246
1290
|
{
|
|
1247
1291
|
"name": "label",
|
|
1248
1292
|
"description": "A custom label for assistive devices.",
|
|
@@ -1328,23 +1372,6 @@
|
|
|
1328
1372
|
],
|
|
1329
1373
|
"references": []
|
|
1330
1374
|
},
|
|
1331
|
-
{
|
|
1332
|
-
"name": "flow-ui-progress-ring",
|
|
1333
|
-
"description": "Progress rings are used to show the progress of a determinate operation in a circular fashion.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - A label to show inside the ring.\n\n### **CSS Properties:**\n - **--size** - The diameter of the progress ring (cannot be a percentage). _(default: undefined)_\n- **--track-width** - The width of the track. _(default: undefined)_\n- **--track-color** - The color of the track. _(default: undefined)_\n- **--indicator-width** - The width of the indicator. Defaults to the track width. _(default: undefined)_\n- **--indicator-color** - The color of the indicator. _(default: undefined)_\n- **--indicator-transition-duration** - The duration of the indicator's transition when the value changes. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **label** - The progress ring label.",
|
|
1334
|
-
"attributes": [
|
|
1335
|
-
{
|
|
1336
|
-
"name": "value",
|
|
1337
|
-
"description": "The current progress as a percentage, 0 to 100.",
|
|
1338
|
-
"values": []
|
|
1339
|
-
},
|
|
1340
|
-
{
|
|
1341
|
-
"name": "label",
|
|
1342
|
-
"description": "A custom label for assistive devices.",
|
|
1343
|
-
"values": []
|
|
1344
|
-
}
|
|
1345
|
-
],
|
|
1346
|
-
"references": []
|
|
1347
|
-
},
|
|
1348
1375
|
{
|
|
1349
1376
|
"name": "flow-ui-range",
|
|
1350
1377
|
"description": "Ranges allow the user to select a single value within a given range using a slider.\n\n\n---\n\n\n\n\n### **Events:**\n - **flow-ui-blur** - Emitted when the control loses focus.\n- **flow-ui-change** - Emitted when an alteration to the control's value is committed by the user.\n- **flow-ui-focus** - Emitted when the control gains focus.\n- **flow-ui-input** - Emitted when the control receives input.\n- **flow-ui-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **focus(options: _FocusOptions_)** - Sets focus on the range.\n- **blur()** - Removes focus from the range.\n- **stepUp()** - Increments the value of the range by the value of the step attribute.\n- **stepDown()** - Decrements the value of the range by the value of the step attribute.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n\n### **Slots:**\n - **label** - The range's label. Alternatively, you can use the `label` attribute.\n- **help-text** - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n\n### **CSS Properties:**\n - **--thumb-size** - The size of the thumb. _(default: undefined)_\n- **--tooltip-offset** - The vertical distance the tooltip is offset from the track. _(default: undefined)_\n- **--track-color-active** - The color of the portion of the track that represents the current value. _(default: undefined)_\n- **--track-color-inactive** - The of the portion of the track that represents the remaining value. _(default: undefined)_\n- **--track-height** - The height of the track. _(default: undefined)_\n- **--track-active-offset** - The point of origin of the active track. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The range's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **base** - The component's base wrapper.\n- **input** - The internal `<input>` element.\n- **tooltip** - The range's tooltip.",
|
|
@@ -1407,6 +1434,18 @@
|
|
|
1407
1434
|
],
|
|
1408
1435
|
"references": []
|
|
1409
1436
|
},
|
|
1437
|
+
{
|
|
1438
|
+
"name": "flow-ui-resize-observer",
|
|
1439
|
+
"description": "The Resize Observer component offers a thin, declarative interface to the [`ResizeObserver API`](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver).\n\n\n---\n\n\n\n\n### **Events:**\n - **flow-ui-resize** - Emitted when the element is resized.\n\n### **Slots:**\n - _default_ - One or more elements to watch for resizing.",
|
|
1440
|
+
"attributes": [
|
|
1441
|
+
{
|
|
1442
|
+
"name": "disabled",
|
|
1443
|
+
"description": "Disables the observer.",
|
|
1444
|
+
"values": []
|
|
1445
|
+
}
|
|
1446
|
+
],
|
|
1447
|
+
"references": []
|
|
1448
|
+
},
|
|
1410
1449
|
{
|
|
1411
1450
|
"name": "flow-ui-select",
|
|
1412
1451
|
"description": "Selects allow you to choose items from a menu of predefined options.\n\n\n---\n\n\n\n\n### **Events:**\n - **flow-ui-change** - Emitted when the control's value changes.\n- **flow-ui-clear** - Emitted when the control's value is cleared.\n- **flow-ui-input** - Emitted when the control receives input.\n- **flow-ui-focus** - Emitted when the control gains focus.\n- **flow-ui-blur** - Emitted when the control loses focus.\n- **flow-ui-show** - Emitted when the select's menu opens.\n- **flow-ui-after-show** - Emitted after the select's menu opens and all animations are complete.\n- **flow-ui-hide** - Emitted when the select's menu closes.\n- **flow-ui-after-hide** - Emitted after the select's menu closes and all animations are complete.\n- **flow-ui-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **show()** - Shows the listbox.\n- **hide()** - Hides the listbox.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n- **focus(options: _FocusOptions_)** - Sets focus on the control.\n- **blur()** - Removes focus from the control.\n\n### **Slots:**\n - _default_ - The listbox options. Must be `<flow-ui-option>` elements. You can use `<flow-ui-divider>` to group items visually.\n- **label** - The input's label. Alternatively, you can use the `label` attribute.\n- **prefix** - Used to prepend a presentational icon or similar element to the combobox.\n- **clear-icon** - An icon to use in lieu of the default clear icon.\n- **expand-icon** - The icon to show when the control is expanded and collapsed. Rotates on open and close.\n- **help-text** - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The select's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **combobox** - The container the wraps the prefix, combobox, clear icon, and expand button.\n- **prefix** - The container that wraps the prefix slot.\n- **display-input** - The element that displays the selected option's label, an `<input>` element.\n- **listbox** - The listbox container where options are slotted.\n- **tags** - The container that houses option tags when `multiselect` is used.\n- **tag** - The individual tags that represent each multiselect option.\n- **tag__base** - The tag's base part.\n- **tag__content** - The tag's content part.\n- **tag__remove-button** - The tag's remove button.\n- **tag__remove-button__base** - The tag's remove button base part.\n- **clear-button** - The clear button.\n- **expand-icon** - The container that wraps the expand icon.",
|
|
@@ -1503,18 +1542,6 @@
|
|
|
1503
1542
|
],
|
|
1504
1543
|
"references": []
|
|
1505
1544
|
},
|
|
1506
|
-
{
|
|
1507
|
-
"name": "flow-ui-resize-observer",
|
|
1508
|
-
"description": "The Resize Observer component offers a thin, declarative interface to the [`ResizeObserver API`](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver).\n\n\n---\n\n\n\n\n### **Events:**\n - **flow-ui-resize** - Emitted when the element is resized.\n\n### **Slots:**\n - _default_ - One or more elements to watch for resizing.",
|
|
1509
|
-
"attributes": [
|
|
1510
|
-
{
|
|
1511
|
-
"name": "disabled",
|
|
1512
|
-
"description": "Disables the observer.",
|
|
1513
|
-
"values": []
|
|
1514
|
-
}
|
|
1515
|
-
],
|
|
1516
|
-
"references": []
|
|
1517
|
-
},
|
|
1518
1545
|
{
|
|
1519
1546
|
"name": "flow-ui-spinner",
|
|
1520
1547
|
"description": "Spinners are used to show the progress of an indeterminate operation.\n\n\n---\n\n\n\n\n### **CSS Properties:**\n - **--track-width** - The width of the track. _(default: undefined)_\n- **--track-color** - The color of the track. _(default: undefined)_\n- **--indicator-color** - The color of the spinner's indicator. _(default: undefined)_\n- **--speed** - The time it takes for the spinner to complete one animation cycle. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
|
|
@@ -1629,61 +1656,6 @@
|
|
|
1629
1656
|
],
|
|
1630
1657
|
"references": []
|
|
1631
1658
|
},
|
|
1632
|
-
{
|
|
1633
|
-
"name": "flow-ui-tab-group",
|
|
1634
|
-
"description": "Tab groups organize content into a container that shows one section at a time.\n\n\n---\n\n\n\n\n### **Events:**\n - **flow-ui-tab-show** - Emitted when a tab is shown.\n- **flow-ui-tab-hide** - Emitted when a tab is hidden.\n\n### **Methods:**\n - **show(panel: _string_)** - Shows the specified tab panel.\n\n### **Slots:**\n - _default_ - Used for grouping tab panels in the tab group. Must be `<flow-ui-tab-panel>` elements.\n- **nav** - Used for grouping tabs in the tab group. Must be `<flow-ui-tab>` elements.\n\n### **CSS Properties:**\n - **--indicator-color** - The color of the active tab indicator. _(default: undefined)_\n- **--track-color** - The color of the indicator's track (the line that separates tabs from panels). _(default: undefined)_\n- **--track-width** - The width of the indicator's track (the line that separates tabs from panels). _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **nav** - The tab group's navigation container where tabs are slotted in.\n- **tabs** - The container that wraps the tabs.\n- **active-tab-indicator** - The line that highlights the currently selected tab.\n- **body** - The tab group's body where tab panels are slotted in.\n- **scroll-button** - The previous/next scroll buttons that show when tabs are scrollable, an `<flow-ui-icon-button>`.\n- **scroll-button--start** - The starting scroll button.\n- **scroll-button--end** - The ending scroll button.\n- **scroll-button__base** - The scroll button's exported `base` part.",
|
|
1635
|
-
"attributes": [
|
|
1636
|
-
{
|
|
1637
|
-
"name": "placement",
|
|
1638
|
-
"description": "The placement of the tabs.",
|
|
1639
|
-
"values": [
|
|
1640
|
-
{ "name": "top" },
|
|
1641
|
-
{ "name": "bottom" },
|
|
1642
|
-
{ "name": "start" },
|
|
1643
|
-
{ "name": "end" }
|
|
1644
|
-
]
|
|
1645
|
-
},
|
|
1646
|
-
{
|
|
1647
|
-
"name": "activation",
|
|
1648
|
-
"description": "When set to auto, navigating tabs with the arrow keys will instantly show the corresponding tab panel. When set to\nmanual, the tab will receive focus but will not show until the user presses spacebar or enter.",
|
|
1649
|
-
"values": [{ "name": "auto" }, { "name": "manual" }]
|
|
1650
|
-
},
|
|
1651
|
-
{
|
|
1652
|
-
"name": "no-scroll-controls",
|
|
1653
|
-
"description": "Disables the scroll arrows that appear when tabs overflow.",
|
|
1654
|
-
"values": []
|
|
1655
|
-
},
|
|
1656
|
-
{ "name": "control-split-panel", "values": [] }
|
|
1657
|
-
],
|
|
1658
|
-
"references": []
|
|
1659
|
-
},
|
|
1660
|
-
{
|
|
1661
|
-
"name": "flow-ui-menu-item",
|
|
1662
|
-
"description": "Menu items provide options for the user to pick from in a menu.\n\n\n---\n\n\n\n\n### **Methods:**\n - **getTextLabel()** - Returns a text label based on the contents of the menu item's default slot.\n\n### **Slots:**\n - _default_ - The menu item's label.\n- **prefix** - Used to prepend an icon or similar element to the menu item.\n- **suffix** - Used to append an icon or similar element to the menu item.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **checked-icon** - The checked icon, which is only visible when the menu item is checked.\n- **prefix** - The prefix container.\n- **label** - The menu item label.\n- **suffix** - The suffix container.\n- **submenu-icon** - The submenu icon, visible only when the menu item has a submenu (not yet implemented).",
|
|
1663
|
-
"attributes": [
|
|
1664
|
-
{
|
|
1665
|
-
"name": "type",
|
|
1666
|
-
"description": "The type of menu item to render. To use `checked`, this value must be set to `checkbox`.",
|
|
1667
|
-
"values": [{ "name": "normal" }, { "name": "checkbox" }]
|
|
1668
|
-
},
|
|
1669
|
-
{
|
|
1670
|
-
"name": "checked",
|
|
1671
|
-
"description": "Draws the item in a checked state.",
|
|
1672
|
-
"values": []
|
|
1673
|
-
},
|
|
1674
|
-
{
|
|
1675
|
-
"name": "value",
|
|
1676
|
-
"description": "A unique value to store in the menu item. This can be used as a way to identify menu items when selected.",
|
|
1677
|
-
"values": []
|
|
1678
|
-
},
|
|
1679
|
-
{
|
|
1680
|
-
"name": "disabled",
|
|
1681
|
-
"description": "Draws the menu item in a disabled state, preventing selection.",
|
|
1682
|
-
"values": []
|
|
1683
|
-
}
|
|
1684
|
-
],
|
|
1685
|
-
"references": []
|
|
1686
|
-
},
|
|
1687
1659
|
{
|
|
1688
1660
|
"name": "flow-ui-tab-panel",
|
|
1689
1661
|
"description": "Tab panels are used inside [tab groups](/components/tab-group) to display tabbed content.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - The tab panel's content.\n\n### **CSS Properties:**\n - **--padding** - The tab panel's padding. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
|
|
@@ -1739,6 +1711,34 @@
|
|
|
1739
1711
|
],
|
|
1740
1712
|
"references": []
|
|
1741
1713
|
},
|
|
1714
|
+
{
|
|
1715
|
+
"name": "flow-ui-tab-group",
|
|
1716
|
+
"description": "Tab groups organize content into a container that shows one section at a time.\n\n\n---\n\n\n\n\n### **Events:**\n - **flow-ui-tab-show** - Emitted when a tab is shown.\n- **flow-ui-tab-hide** - Emitted when a tab is hidden.\n\n### **Methods:**\n - **show(panel: _string_)** - Shows the specified tab panel.\n\n### **Slots:**\n - _default_ - Used for grouping tab panels in the tab group. Must be `<flow-ui-tab-panel>` elements.\n- **nav** - Used for grouping tabs in the tab group. Must be `<flow-ui-tab>` elements.\n\n### **CSS Properties:**\n - **--indicator-color** - The color of the active tab indicator. _(default: undefined)_\n- **--track-color** - The color of the indicator's track (the line that separates tabs from panels). _(default: undefined)_\n- **--track-width** - The width of the indicator's track (the line that separates tabs from panels). _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **nav** - The tab group's navigation container where tabs are slotted in.\n- **tabs** - The container that wraps the tabs.\n- **active-tab-indicator** - The line that highlights the currently selected tab.\n- **body** - The tab group's body where tab panels are slotted in.\n- **scroll-button** - The previous/next scroll buttons that show when tabs are scrollable, an `<flow-ui-icon-button>`.\n- **scroll-button--start** - The starting scroll button.\n- **scroll-button--end** - The ending scroll button.\n- **scroll-button__base** - The scroll button's exported `base` part.",
|
|
1717
|
+
"attributes": [
|
|
1718
|
+
{
|
|
1719
|
+
"name": "placement",
|
|
1720
|
+
"description": "The placement of the tabs.",
|
|
1721
|
+
"values": [
|
|
1722
|
+
{ "name": "top" },
|
|
1723
|
+
{ "name": "bottom" },
|
|
1724
|
+
{ "name": "start" },
|
|
1725
|
+
{ "name": "end" }
|
|
1726
|
+
]
|
|
1727
|
+
},
|
|
1728
|
+
{
|
|
1729
|
+
"name": "activation",
|
|
1730
|
+
"description": "When set to auto, navigating tabs with the arrow keys will instantly show the corresponding tab panel. When set to\nmanual, the tab will receive focus but will not show until the user presses spacebar or enter.",
|
|
1731
|
+
"values": [{ "name": "auto" }, { "name": "manual" }]
|
|
1732
|
+
},
|
|
1733
|
+
{
|
|
1734
|
+
"name": "no-scroll-controls",
|
|
1735
|
+
"description": "Disables the scroll arrows that appear when tabs overflow.",
|
|
1736
|
+
"values": []
|
|
1737
|
+
},
|
|
1738
|
+
{ "name": "control-split-panel", "values": [] }
|
|
1739
|
+
],
|
|
1740
|
+
"references": []
|
|
1741
|
+
},
|
|
1742
1742
|
{
|
|
1743
1743
|
"name": "flow-ui-textarea",
|
|
1744
1744
|
"description": "Textareas collect data from the user and allow multiple lines of text.\n\n\n---\n\n\n\n\n### **Events:**\n - **flow-ui-blur** - Emitted when the control loses focus.\n- **flow-ui-change** - Emitted when an alteration to the control's value is committed by the user.\n- **flow-ui-focus** - Emitted when the control gains focus.\n- **flow-ui-input** - Emitted when the control receives input.\n- **flow-ui-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **focus(options: _FocusOptions_)** - Sets focus on the textarea.\n- **blur()** - Removes focus from the textarea.\n- **select()** - Selects all the text in the textarea.\n- **scrollPosition(position: _{ top?: number; left?: number }_): _{ top: number; left: number } | undefined_** - Gets or sets the textarea's scroll position.\n- **setSelectionRange(selectionStart: _number_, selectionEnd: _number_, selectionDirection: _'forward' | 'backward' | 'none'_)** - Sets the start and end positions of the text selection (0-based).\n- **setRangeText(replacement: _string_, start: _number_, end: _number_, selectMode: _'select' | 'start' | 'end' | 'preserve'_)** - Replaces a range of text with a new string.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n\n### **Slots:**\n - **label** - The textarea's label. Alternatively, you can use the `label` attribute.\n- **help-text** - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The input's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **base** - The component's base wrapper.\n- **textarea** - The internal `<textarea>` control.",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@emuanalytics/flow-rdf-ui",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.6",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "dist/flow-rdf-ui.umd.cjs",
|
|
6
6
|
"module": "dist/flow-rdf-ui.js",
|
|
@@ -24,6 +24,7 @@
|
|
|
24
24
|
"composed-offset-position": "^0.0.4",
|
|
25
25
|
"lit": "^2.7.2",
|
|
26
26
|
"ora": "^7.0.1",
|
|
27
|
+
"overlayscrollbars": "^2.4.4",
|
|
27
28
|
"s3-node-client": "^4.4.4"
|
|
28
29
|
},
|
|
29
30
|
"devDependencies": {
|