@emuanalytics/flow-rdf-ui 0.0.2 → 0.0.3

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.
Files changed (235) hide show
  1. package/dist/custom-elements.json +8391 -7539
  2. package/dist/flow-rdf-ui.d.ts +3566 -0
  3. package/dist/flow-rdf-ui.js +2407 -1432
  4. package/dist/flow-rdf-ui.umd.cjs +2417 -1440
  5. package/dist/themes/dark.css +13 -0
  6. package/dist/themes/dark.styles.js +13 -0
  7. package/dist/themes/light.css +13 -0
  8. package/dist/themes/light.styles.js +13 -0
  9. package/dist/vscode.html-custom-data.json +327 -369
  10. package/package.json +7 -3
  11. package/dist/types/components/alert/alert.d.ts +0 -71
  12. package/dist/types/components/alert/alert.stories.d.ts +0 -5
  13. package/dist/types/components/alert/alert.styles.d.ts +0 -2
  14. package/dist/types/components/animation/animation.d.ts +0 -81
  15. package/dist/types/components/animation/animation.stories.d.ts +0 -5
  16. package/dist/types/components/animation/animation.styles.d.ts +0 -2
  17. package/dist/types/components/animation/animations.d.ts +0 -6
  18. package/dist/types/components/animation/index.d.ts +0 -1
  19. package/dist/types/components/avatar/avatar.d.ts +0 -40
  20. package/dist/types/components/avatar/avatar.stories.d.ts +0 -5
  21. package/dist/types/components/avatar/avatar.styles.d.ts +0 -2
  22. package/dist/types/components/badge/badge.d.ts +0 -27
  23. package/dist/types/components/badge/badge.stories.d.ts +0 -5
  24. package/dist/types/components/badge/badge.styles.d.ts +0 -2
  25. package/dist/types/components/breadcrumb/breadcrumb.d.ts +0 -35
  26. package/dist/types/components/breadcrumb/breadcrumb.stories.d.ts +0 -5
  27. package/dist/types/components/breadcrumb/breadcrumb.styles.d.ts +0 -2
  28. package/dist/types/components/breadcrumb-item/breadcrumb-item.d.ts +0 -39
  29. package/dist/types/components/breadcrumb-item/breadcrumb-item.styles.d.ts +0 -2
  30. package/dist/types/components/button/button.d.ts +0 -133
  31. package/dist/types/components/button/button.stories.d.ts +0 -6
  32. package/dist/types/components/button/button.styles.d.ts +0 -2
  33. package/dist/types/components/button-group/button-group.d.ts +0 -33
  34. package/dist/types/components/button-group/button-group.stories.d.ts +0 -5
  35. package/dist/types/components/button-group/button-group.styles.d.ts +0 -2
  36. package/dist/types/components/card/card.d.ts +0 -34
  37. package/dist/types/components/card/card.stories.d.ts +0 -5
  38. package/dist/types/components/card/card.styles.d.ts +0 -2
  39. package/dist/types/components/carousel/autoplay-controller.d.ts +0 -20
  40. package/dist/types/components/carousel/carousel.d.ts +0 -105
  41. package/dist/types/components/carousel/carousel.styles.d.ts +0 -2
  42. package/dist/types/components/carousel/scroll-controller.d.ts +0 -28
  43. package/dist/types/components/carousel-item/carousel-item.d.ts +0 -24
  44. package/dist/types/components/carousel-item/carousel-item.styles.d.ts +0 -2
  45. package/dist/types/components/checkbox/checkbox.d.ts +0 -94
  46. package/dist/types/components/checkbox/checkbox.styles.d.ts +0 -2
  47. package/dist/types/components/checkbox/index.d.ts +0 -1
  48. package/dist/types/components/color-mapper/color-mapper.component.d.ts +0 -39
  49. package/dist/types/components/color-mapper/color-mapper.stories.d.ts +0 -68
  50. package/dist/types/components/color-mapper/color-mapper.styles.d.ts +0 -2
  51. package/dist/types/components/color-mapper/color-stop.component.d.ts +0 -54
  52. package/dist/types/components/color-mapper/color-stop.styles.d.ts +0 -2
  53. package/dist/types/components/color-mapper/helpers.d.ts +0 -3
  54. package/dist/types/components/color-mapper/index.d.ts +0 -4
  55. package/dist/types/components/color-mapper/types.d.ts +0 -54
  56. package/dist/types/components/color-picker/color-picker.d.ts +0 -193
  57. package/dist/types/components/color-picker/color-picker.stories.d.ts +0 -5
  58. package/dist/types/components/color-picker/color-picker.styles.d.ts +0 -2
  59. package/dist/types/components/details/details.d.ts +0 -60
  60. package/dist/types/components/details/details.stories.d.ts +0 -5
  61. package/dist/types/components/details/details.styles.d.ts +0 -2
  62. package/dist/types/components/dialog/dialog.d.ts +0 -91
  63. package/dist/types/components/dialog/dialog.styles.d.ts +0 -2
  64. package/dist/types/components/divider/divider.d.ts +0 -24
  65. package/dist/types/components/divider/divider.styles.d.ts +0 -2
  66. package/dist/types/components/drawer/drawer.d.ts +0 -106
  67. package/dist/types/components/drawer/drawer.styles.d.ts +0 -2
  68. package/dist/types/components/dropdown/dropdown.d.ts +0 -98
  69. package/dist/types/components/dropdown/dropdown.styles.d.ts +0 -2
  70. package/dist/types/components/icon/icon.d.ts +0 -45
  71. package/dist/types/components/icon/icon.stories.d.ts +0 -5
  72. package/dist/types/components/icon/icon.styles.d.ts +0 -2
  73. package/dist/types/components/icon/library.d.ts +0 -21
  74. package/dist/types/components/icon/library.default.d.ts +0 -3
  75. package/dist/types/components/icon/library.system.d.ts +0 -3
  76. package/dist/types/components/icon-button/icon-button.d.ts +0 -92
  77. package/dist/types/components/icon-button/icon-button.stories.d.ts +0 -29
  78. package/dist/types/components/icon-button/icon-button.styles.d.ts +0 -2
  79. package/dist/types/components/icon-button/index.d.ts +0 -1
  80. package/dist/types/components/input/input.d.ts +0 -176
  81. package/dist/types/components/input/input.styles.d.ts +0 -2
  82. package/dist/types/components/menu/menu.d.ts +0 -44
  83. package/dist/types/components/menu/menu.styles.d.ts +0 -2
  84. package/dist/types/components/menu-item/menu-item.d.ts +0 -50
  85. package/dist/types/components/menu-item/menu-item.styles.d.ts +0 -2
  86. package/dist/types/components/menu-label/menu-label.d.ts +0 -21
  87. package/dist/types/components/menu-label/menu-label.styles.d.ts +0 -2
  88. package/dist/types/components/mutation-observer/mutation-observer.d.ts +0 -44
  89. package/dist/types/components/mutation-observer/mutation-observer.styles.d.ts +0 -2
  90. package/dist/types/components/option/option.d.ts +0 -52
  91. package/dist/types/components/option/option.stories.d.ts +0 -7
  92. package/dist/types/components/option/option.styles.d.ts +0 -2
  93. package/dist/types/components/popup/popup.d.ts +0 -140
  94. package/dist/types/components/popup/popup.stories.d.ts +0 -5
  95. package/dist/types/components/popup/popup.styles.d.ts +0 -2
  96. package/dist/types/components/progress-bar/progress-bar.d.ts +0 -35
  97. package/dist/types/components/progress-bar/progress-bar.styles.d.ts +0 -2
  98. package/dist/types/components/progress-ring/progress-ring.d.ts +0 -37
  99. package/dist/types/components/progress-ring/progress-ring.styles.d.ts +0 -2
  100. package/dist/types/components/radio/radio.d.ts +0 -53
  101. package/dist/types/components/radio/radio.stories.d.ts +0 -5
  102. package/dist/types/components/radio/radio.styles.d.ts +0 -2
  103. package/dist/types/components/radio-button/radio-button.d.ts +0 -60
  104. package/dist/types/components/radio-button/radio-button.stories.d.ts +0 -5
  105. package/dist/types/components/radio-button/radio-button.styles.d.ts +0 -2
  106. package/dist/types/components/radio-group/radio-group.d.ts +0 -89
  107. package/dist/types/components/radio-group/radio-group.stories.d.ts +0 -5
  108. package/dist/types/components/radio-group/radio-group.styles.d.ts +0 -2
  109. package/dist/types/components/range/range.d.ts +0 -116
  110. package/dist/types/components/range/range.styles.d.ts +0 -2
  111. package/dist/types/components/resize-observer/resize-observer.d.ts +0 -31
  112. package/dist/types/components/resize-observer/resize-observer.styles.d.ts +0 -2
  113. package/dist/types/components/select/select.d.ts +0 -174
  114. package/dist/types/components/select/select.stories.d.ts +0 -5
  115. package/dist/types/components/select/select.styles.d.ts +0 -2
  116. package/dist/types/components/spinner/spinner.d.ts +0 -25
  117. package/dist/types/components/spinner/spinner.stories.d.ts +0 -5
  118. package/dist/types/components/spinner/spinner.styles.d.ts +0 -2
  119. package/dist/types/components/split-panel/split-panel.d.ts +0 -74
  120. package/dist/types/components/split-panel/split-panel.stories.d.ts +0 -5
  121. package/dist/types/components/split-panel/split-panel.styles.d.ts +0 -2
  122. package/dist/types/components/switch/switch.d.ts +0 -86
  123. package/dist/types/components/switch/switch.stories.d.ts +0 -5
  124. package/dist/types/components/switch/switch.styles.d.ts +0 -2
  125. package/dist/types/components/tab/tab.d.ts +0 -47
  126. package/dist/types/components/tab/tab.styles.d.ts +0 -2
  127. package/dist/types/components/tab-group/tab-group.d.ts +0 -76
  128. package/dist/types/components/tab-group/tab-group.stories.d.ts +0 -5
  129. package/dist/types/components/tab-group/tab-group.styles.d.ts +0 -2
  130. package/dist/types/components/tab-panel/tab-panel.d.ts +0 -31
  131. package/dist/types/components/tab-panel/tab-panel.styles.d.ts +0 -2
  132. package/dist/types/components/tag/tag.d.ts +0 -38
  133. package/dist/types/components/tag/tag.stories.d.ts +0 -5
  134. package/dist/types/components/tag/tag.styles.d.ts +0 -2
  135. package/dist/types/components/textarea/textarea.d.ts +0 -138
  136. package/dist/types/components/textarea/textarea.stories.d.ts +0 -5
  137. package/dist/types/components/textarea/textarea.styles.d.ts +0 -2
  138. package/dist/types/components/tooltip/tooltip.d.ts +0 -89
  139. package/dist/types/components/tooltip/tooltip.stories.d.ts +0 -5
  140. package/dist/types/components/tooltip/tooltip.styles.d.ts +0 -2
  141. package/dist/types/components/tree/tree.d.ts +0 -65
  142. package/dist/types/components/tree/tree.stories.d.ts +0 -5
  143. package/dist/types/components/tree/tree.styles.d.ts +0 -2
  144. package/dist/types/components/tree-item/tree-item.d.ts +0 -89
  145. package/dist/types/components/tree-item/tree-item.styles.d.ts +0 -2
  146. package/dist/types/components/visually-hidden/visually-hidden.d.ts +0 -19
  147. package/dist/types/components/visually-hidden/visually-hidden.stories.d.ts +0 -5
  148. package/dist/types/components/visually-hidden/visually-hidden.styles.d.ts +0 -2
  149. package/dist/types/events/events.d.ts +0 -34
  150. package/dist/types/events/flow-after-collapse.d.ts +0 -7
  151. package/dist/types/events/flow-after-expand.d.ts +0 -7
  152. package/dist/types/events/flow-after-hide.d.ts +0 -7
  153. package/dist/types/events/flow-after-show.d.ts +0 -7
  154. package/dist/types/events/flow-blur.d.ts +0 -7
  155. package/dist/types/events/flow-cancel.d.ts +0 -7
  156. package/dist/types/events/flow-change.d.ts +0 -7
  157. package/dist/types/events/flow-clear.d.ts +0 -7
  158. package/dist/types/events/flow-close.d.ts +0 -7
  159. package/dist/types/events/flow-collapse.d.ts +0 -7
  160. package/dist/types/events/flow-error.d.ts +0 -9
  161. package/dist/types/events/flow-expand.d.ts +0 -7
  162. package/dist/types/events/flow-finish.d.ts +0 -7
  163. package/dist/types/events/flow-focus.d.ts +0 -7
  164. package/dist/types/events/flow-hide.d.ts +0 -7
  165. package/dist/types/events/flow-hover.d.ts +0 -10
  166. package/dist/types/events/flow-initial-focus.d.ts +0 -7
  167. package/dist/types/events/flow-input.d.ts +0 -7
  168. package/dist/types/events/flow-invalid.d.ts +0 -7
  169. package/dist/types/events/flow-lazy-change.d.ts +0 -7
  170. package/dist/types/events/flow-lazy-load.d.ts +0 -7
  171. package/dist/types/events/flow-load.d.ts +0 -7
  172. package/dist/types/events/flow-mutation.d.ts +0 -9
  173. package/dist/types/events/flow-remove.d.ts +0 -7
  174. package/dist/types/events/flow-reposition.d.ts +0 -7
  175. package/dist/types/events/flow-request-close.d.ts +0 -9
  176. package/dist/types/events/flow-resize.d.ts +0 -9
  177. package/dist/types/events/flow-select.d.ts +0 -10
  178. package/dist/types/events/flow-selection-change.d.ts +0 -10
  179. package/dist/types/events/flow-show.d.ts +0 -7
  180. package/dist/types/events/flow-slide-change.d.ts +0 -11
  181. package/dist/types/events/flow-start.d.ts +0 -7
  182. package/dist/types/events/flow-tab-hide.d.ts +0 -9
  183. package/dist/types/events/flow-tab-show.d.ts +0 -9
  184. package/dist/types/flow-autoloader.d.ts +0 -4
  185. package/dist/types/index.d.ts +0 -52
  186. package/dist/types/internal/animate.d.ts +0 -22
  187. package/dist/types/internal/checks.util.d.ts +0 -28
  188. package/dist/types/internal/debounce.d.ts +0 -1
  189. package/dist/types/internal/default-value.d.ts +0 -2
  190. package/dist/types/internal/drag.d.ts +0 -15
  191. package/dist/types/internal/event.d.ts +0 -2
  192. package/dist/types/internal/flow-ui-rdf-element.d.ts +0 -43
  193. package/dist/types/internal/form.d.ts +0 -73
  194. package/dist/types/internal/math.d.ts +0 -2
  195. package/dist/types/internal/modal.d.ts +0 -12
  196. package/dist/types/internal/offset.d.ts +0 -11
  197. package/dist/types/internal/orderby.d.ts +0 -1
  198. package/dist/types/internal/scroll.d.ts +0 -11
  199. package/dist/types/internal/slot.d.ts +0 -23
  200. package/dist/types/internal/string.d.ts +0 -2
  201. package/dist/types/internal/tabbable.d.ts +0 -8
  202. package/dist/types/internal/test/data-testid-helpers.d.ts +0 -12
  203. package/dist/types/internal/test/element-visible-overflow.d.ts +0 -11
  204. package/dist/types/internal/test/form-control-base-tests.d.ts +0 -7
  205. package/dist/types/internal/test/wait-for-scrolling.d.ts +0 -9
  206. package/dist/types/internal/test.d.ts +0 -28
  207. package/dist/types/internal/throttle.d.ts +0 -1
  208. package/dist/types/internal/watch.d.ts +0 -26
  209. package/dist/types/styles/component.styles.d.ts +0 -2
  210. package/dist/types/styles/form-control.styles.d.ts +0 -2
  211. package/dist/types/translations/da.d.ts +0 -3
  212. package/dist/types/translations/de-ch.d.ts +0 -3
  213. package/dist/types/translations/de.d.ts +0 -3
  214. package/dist/types/translations/en-gb.d.ts +0 -3
  215. package/dist/types/translations/en.d.ts +0 -3
  216. package/dist/types/translations/es.d.ts +0 -3
  217. package/dist/types/translations/fa.d.ts +0 -3
  218. package/dist/types/translations/fr.d.ts +0 -3
  219. package/dist/types/translations/he.d.ts +0 -3
  220. package/dist/types/translations/hu.d.ts +0 -3
  221. package/dist/types/translations/ja.d.ts +0 -3
  222. package/dist/types/translations/nl.d.ts +0 -3
  223. package/dist/types/translations/pl.d.ts +0 -3
  224. package/dist/types/translations/pt.d.ts +0 -3
  225. package/dist/types/translations/ru.d.ts +0 -3
  226. package/dist/types/translations/sv.d.ts +0 -3
  227. package/dist/types/translations/tr.d.ts +0 -3
  228. package/dist/types/translations/zh-tw.d.ts +0 -3
  229. package/dist/types/utilities/animation-registry.d.ts +0 -24
  230. package/dist/types/utilities/animation.d.ts +0 -1
  231. package/dist/types/utilities/announce.d.ts +0 -1
  232. package/dist/types/utilities/base-path.d.ts +0 -18
  233. package/dist/types/utilities/form.d.ts +0 -11
  234. package/dist/types/utilities/icon-library.d.ts +0 -1
  235. package/dist/types/utilities/localize.d.ts +0 -30
@@ -1,138 +0,0 @@
1
- import type { CSSResultGroup } from 'lit';
2
- import type { FlowRdfFormControl } from '../../internal/flow-ui-rdf-element';
3
- import FlowRdfElement from '../../internal/flow-ui-rdf-element';
4
- /**
5
- * @summary Textareas collect data from the user and allow multiple lines of text.
6
- * @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/textarea
7
- * @status stable
8
- * @since 2.0
9
- *
10
- * @slot label - The textarea's label. Alternatively, you can use the `label` attribute.
11
- * @slot help-text - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.
12
- *
13
- * @event flow-ui-blur - Emitted when the control loses focus.
14
- * @event flow-ui-change - Emitted when an alteration to the control's value is committed by the user.
15
- * @event flow-ui-focus - Emitted when the control gains focus.
16
- * @event flow-ui-input - Emitted when the control receives input.
17
- * @event flow-ui-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.
18
- *
19
- * @csspart form-control - The form control that wraps the label, input, and help text.
20
- * @csspart form-control-label - The label's wrapper.
21
- * @csspart form-control-input - The input's wrapper.
22
- * @csspart form-control-help-text - The help text's wrapper.
23
- * @csspart base - The component's base wrapper.
24
- * @csspart textarea - The internal `<textarea>` control.
25
- */
26
- export default class FlowTextarea extends FlowRdfElement implements FlowRdfFormControl {
27
- static styles: CSSResultGroup;
28
- private readonly formControlController;
29
- private readonly hasSlotController;
30
- private resizeObserver;
31
- input: HTMLTextAreaElement;
32
- private hasFocus;
33
- title: string;
34
- /** The name of the textarea, submitted as a name/value pair with form data. */
35
- name: string;
36
- /** The current value of the textarea, submitted as a name/value pair with form data. */
37
- value: string;
38
- /** The textarea's size. */
39
- size: 'small' | 'medium' | 'large';
40
- /** Draws a filled textarea. */
41
- filled: boolean;
42
- /** The textarea's label. If you need to display HTML, use the `label` slot instead. */
43
- label: string;
44
- /** The textarea's help text. If you need to display HTML, use the `help-text` slot instead. */
45
- helpText: string;
46
- /** Placeholder text to show as a hint when the input is empty. */
47
- placeholder: string;
48
- /** The number of rows to display by default. */
49
- rows: number;
50
- /** Controls how the textarea can be resized. */
51
- resize: 'none' | 'vertical' | 'auto';
52
- /** Disables the textarea. */
53
- disabled: boolean;
54
- /** Makes the textarea readonly. */
55
- readonly: boolean;
56
- /**
57
- * By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
58
- * to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
59
- * the same document or shadow root for this to work.
60
- */
61
- form: string;
62
- /** Makes the textarea a required field. */
63
- required: boolean;
64
- /** The minimum length of input that will be considered valid. */
65
- minlength: number;
66
- /** The maximum length of input that will be considered valid. */
67
- maxlength: number;
68
- /** Controls whether and how text input is automatically capitalized as it is entered by the user. */
69
- autocapitalize: 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters';
70
- /** Indicates whether the browser's autocorrect feature is on or off. */
71
- autocorrect: string;
72
- /**
73
- * Specifies what permission the browser has to provide assistance in filling out form field values. Refer to
74
- * [this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for available values.
75
- */
76
- autocomplete: string;
77
- /** Indicates that the input should receive focus on page load. */
78
- autofocus: boolean;
79
- /** Used to customize the label or icon of the Enter key on virtual keyboards. */
80
- enterkeyhint: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';
81
- /** Enables spell checking on the textarea. */
82
- spellcheck: boolean;
83
- /**
84
- * Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual
85
- * keyboard on supportive devices.
86
- */
87
- inputmode: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
88
- /** The default value of the form control. Primarily used for resetting the form control. */
89
- defaultValue: string;
90
- /** Gets the validity state object */
91
- get validity(): ValidityState;
92
- /** Gets the validation message */
93
- get validationMessage(): string;
94
- connectedCallback(): void;
95
- firstUpdated(): void;
96
- disconnectedCallback(): void;
97
- private handleBlur;
98
- private handleChange;
99
- private handleFocus;
100
- private handleInput;
101
- private handleInvalid;
102
- private setTextareaHeight;
103
- handleDisabledChange(): void;
104
- handleRowsChange(): void;
105
- handleValueChange(): Promise<void>;
106
- /** Sets focus on the textarea. */
107
- focus(options?: FocusOptions): void;
108
- /** Removes focus from the textarea. */
109
- blur(): void;
110
- /** Selects all the text in the textarea. */
111
- select(): void;
112
- /** Gets or sets the textarea's scroll position. */
113
- scrollPosition(position?: {
114
- top?: number;
115
- left?: number;
116
- }): {
117
- top: number;
118
- left: number;
119
- } | undefined;
120
- /** Sets the start and end positions of the text selection (0-based). */
121
- setSelectionRange(selectionStart: number, selectionEnd: number, selectionDirection?: 'forward' | 'backward' | 'none'): void;
122
- /** Replaces a range of text with a new string. */
123
- setRangeText(replacement: string, start?: number, end?: number, selectMode?: 'select' | 'start' | 'end' | 'preserve'): void;
124
- /** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */
125
- checkValidity(): boolean;
126
- /** Gets the associated form, if one exists. */
127
- getForm(): HTMLFormElement | null;
128
- /** Checks for validity and shows the browser's validation message if the control is invalid. */
129
- reportValidity(): boolean;
130
- /** Sets a custom validation message. Pass an empty string to restore validity. */
131
- setCustomValidity(message: string): void;
132
- render(): import("lit").TemplateResult<1>;
133
- }
134
- declare global {
135
- interface HTMLElementTagNameMap {
136
- 'flow-ui-textarea': FlowTextarea;
137
- }
138
- }
@@ -1,5 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/web-components';
2
- declare const meta: Meta;
3
- export default meta;
4
- type Story = StoryObj;
5
- export declare const Primary: Story;
@@ -1,2 +0,0 @@
1
- declare const _default: import("lit").CSSResult;
2
- export default _default;
@@ -1,89 +0,0 @@
1
- import type { CSSResultGroup } from 'lit';
2
- import FlowRdfElement from '../../internal/flow-ui-rdf-element';
3
- import type FlowPopup from '../popup/popup';
4
- /**
5
- * @summary Tooltips display additional information based on a specific action.
6
- * @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tooltip
7
- * @status stable
8
- * @since 2.0
9
- *
10
- * @dependency flow-ui-popup
11
- *
12
- * @slot - The tooltip's target element. Avoid slotting in more than one element, as subsequent ones will be ignored.
13
- * @slot content - The content to render in the tooltip. Alternatively, you can use the `content` attribute.
14
- *
15
- * @event flow-ui-show - Emitted when the tooltip begins to show.
16
- * @event flow-ui-after-show - Emitted after the tooltip has shown and all animations are complete.
17
- * @event flow-ui-hide - Emitted when the tooltip begins to hide.
18
- * @event flow-ui-after-hide - Emitted after the tooltip has hidden and all animations are complete.
19
- *
20
- * @csspart base - The component's base wrapper, an `<flow-ui-popup>` element.
21
- * @csspart base__popup - The popup's exported `popup` part. Use this to target the tooltip's popup container.
22
- * @csspart base__arrow - The popup's exported `arrow` part. Use this to target the tooltip's arrow.
23
- * @csspart body - The tooltip's body where its content is rendered.
24
- *
25
- * @cssproperty --max-width - The maximum width of the tooltip before its content will wrap.
26
- * @cssproperty --hide-delay - The amount of time to wait before hiding the tooltip when hovering.
27
- * @cssproperty --show-delay - The amount of time to wait before showing the tooltip when hovering.
28
- *
29
- * @animation tooltip.show - The animation to use when showing the tooltip.
30
- * @animation tooltip.hide - The animation to use when hiding the tooltip.
31
- */
32
- export default class FlowTooltip extends FlowRdfElement {
33
- static styles: CSSResultGroup;
34
- private hoverTimeout;
35
- private readonly localize;
36
- defaultSlot: HTMLSlotElement;
37
- body: HTMLElement;
38
- popup: FlowPopup;
39
- /** The tooltip's content. If you need to display HTML, use the `content` slot instead. */
40
- content: string;
41
- /**
42
- * The preferred placement of the tooltip. Note that the actual placement may vary as needed to keep the tooltip
43
- * inside of the viewport.
44
- */
45
- placement: 'top' | 'top-start' | 'top-end' | 'right' | 'right-start' | 'right-end' | 'bottom' | 'bottom-start' | 'bottom-end' | 'left' | 'left-start' | 'left-end';
46
- /** Disables the tooltip so it won't show when triggered. */
47
- disabled: boolean;
48
- /** The distance in pixels from which to offset the tooltip away from its target. */
49
- distance: number;
50
- /** Indicates whether or not the tooltip is open. You can use this in lieu of the show/hide methods. */
51
- open: boolean;
52
- /** The distance in pixels from which to offset the tooltip along its target. */
53
- skidding: number;
54
- /**
55
- * Controls how the tooltip is activated. Possible options include `click`, `hover`, `focus`, and `manual`. Multiple
56
- * options can be passed by separating them with a space. When manual is used, the tooltip must be activated
57
- * programmatically.
58
- */
59
- trigger: string;
60
- /**
61
- * Enable this option to prevent the tooltip from being clipped when the component is placed inside a container with
62
- * `overflow: auto|hidden|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all,
63
- * scenarios.
64
- */
65
- hoist: boolean;
66
- connectedCallback(): void;
67
- firstUpdated(): void;
68
- disconnectedCallback(): void;
69
- private handleBlur;
70
- private handleClick;
71
- private handleFocus;
72
- private handleKeyDown;
73
- private handleMouseOver;
74
- private handleMouseOut;
75
- private hasTrigger;
76
- handleOpenChange(): Promise<void>;
77
- handleOptionsChange(): Promise<void>;
78
- handleDisabledChange(): void;
79
- /** Shows the tooltip. */
80
- show(): Promise<void>;
81
- /** Hides the tooltip */
82
- hide(): Promise<void>;
83
- render(): import("lit").TemplateResult<1>;
84
- }
85
- declare global {
86
- interface HTMLElementTagNameMap {
87
- 'flow-ui-tooltip': FlowTooltip;
88
- }
89
- }
@@ -1,5 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/web-components';
2
- declare const meta: Meta;
3
- export default meta;
4
- type Story = StoryObj;
5
- export declare const Primary: Story;
@@ -1,2 +0,0 @@
1
- declare const _default: import("lit").CSSResult;
2
- export default _default;
@@ -1,65 +0,0 @@
1
- import type { CSSResultGroup } from 'lit';
2
- import FlowRdfElement from '../../internal/flow-ui-rdf-element';
3
- import FlowTreeItem from '../tree-item/tree-item';
4
- /**
5
- * @summary Trees allow you to display a hierarchical list of selectable [tree items](/components/tree-item). Items with children can be expanded and collapsed as desired by the user.
6
- * @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tree
7
- * @status stable
8
- * @since 2.0
9
- *
10
- * @event {{ selection: FlowTreeItem[] }} flow-ui-selection-change - Emitted when a tree item is selected or deselected.
11
- *
12
- * @slot - The default slot.
13
- * @slot expand-icon - The icon to show when the tree item is expanded. Works best with `<flow-ui-icon>`.
14
- * @slot collapse-icon - The icon to show when the tree item is collapsed. Works best with `<flow-ui-icon>`.
15
- *
16
- * @csspart base - The component's base wrapper.
17
- *
18
- * @cssproperty [--indent-size=var(--flow-ui-spacing-medium)] - The size of the indentation for nested items.
19
- * @cssproperty [--indent-guide-color=var(--flow-ui-color-neutral-200)] - The color of the indentation line.
20
- * @cssproperty [--indent-guide-offset=0] - The amount of vertical spacing to leave between the top and bottom of the
21
- * indentation line's starting position.
22
- * @cssproperty [--indent-guide-style=solid] - The style of the indentation line, e.g. solid, dotted, dashed.
23
- * @cssproperty [--indent-guide-width=0] - The width of the indentation line.
24
- */
25
- export default class FlowTree extends FlowRdfElement {
26
- static styles: CSSResultGroup;
27
- defaultSlot: HTMLSlotElement;
28
- expandedIconSlot: HTMLSlotElement;
29
- collapsedIconSlot: HTMLSlotElement;
30
- /**
31
- * The selection behavior of the tree. Single selection allows only one node to be selected at a time. Multiple
32
- * displays checkboxes and allows more than one node to be selected. Leaf allows only leaf nodes to be selected.
33
- */
34
- selection: 'single' | 'multiple' | 'leaf';
35
- private lastFocusedItem;
36
- private readonly localize;
37
- private mutationObserver;
38
- private clickTarget;
39
- connectedCallback(): Promise<void>;
40
- disconnectedCallback(): void;
41
- private getExpandButtonIcon;
42
- private initTreeItem;
43
- private handleTreeChanged;
44
- private syncTreeItems;
45
- private selectItem;
46
- private getAllTreeItems;
47
- private focusItem;
48
- private handleKeyDown;
49
- private handleClick;
50
- handleMouseDown(event: MouseEvent): void;
51
- private handleFocusOut;
52
- private handleFocusIn;
53
- private handleSlotChange;
54
- handleSelectionChange(): Promise<void>;
55
- /** @internal Returns the list of tree items that are selected in the tree. */
56
- get selectedItems(): FlowTreeItem[];
57
- /** @internal Gets focusable tree items in the tree. */
58
- getFocusableItems(): FlowTreeItem[];
59
- render(): import("lit").TemplateResult<1>;
60
- }
61
- declare global {
62
- interface HTMLElementTagNameMap {
63
- 'flow-ui-tree': FlowTree;
64
- }
65
- }
@@ -1,5 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/web-components';
2
- declare const meta: Meta;
3
- export default meta;
4
- type Story = StoryObj;
5
- export declare const Primary: Story;
@@ -1,2 +0,0 @@
1
- declare const _default: import("lit").CSSResult;
2
- export default _default;
@@ -1,89 +0,0 @@
1
- import type { CSSResultGroup, PropertyValueMap } from 'lit';
2
- import FlowRdfElement from '../../internal/flow-ui-rdf-element';
3
- /**
4
- * @summary A tree item serves as a hierarchical node that lives inside a [tree](/components/tree).
5
- * @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tree-item
6
- * @status stable
7
- * @since 2.0
8
- *
9
- * @dependency flow-ui-checkbox
10
- * @dependency flow-ui-icon
11
- * @dependency flow-ui-spinner
12
- *
13
- * @event flow-ui-expand - Emitted when the tree item expands.
14
- * @event flow-ui-after-expand - Emitted after the tree item expands and all animations are complete.
15
- * @event flow-ui-collapse - Emitted when the tree item collapses.
16
- * @event flow-ui-after-collapse - Emitted after the tree item collapses and all animations are complete.
17
- * @event flow-ui-lazy-change - Emitted when the tree item's lazy state changes.
18
- * @event flow-ui-lazy-load - Emitted when a lazy item is selected. Use this event to asynchronously load data and append
19
- * items to the tree before expanding. After appending new items, remove the `lazy` attribute to remove the loading
20
- * state and update the tree.
21
- *
22
- * @slot - The default slot.
23
- * @slot expand-icon - The icon to show when the tree item is expanded.
24
- * @slot collapse-icon - The icon to show when the tree item is collapsed.
25
- *
26
- * @csspart base - The component's base wrapper.
27
- * @csspart item - The tree item's container. This element wraps everything except slotted tree item children.
28
- * @csspart item--disabled - Applied when the tree item is disabled.
29
- * @csspart item--expanded - Applied when the tree item is expanded.
30
- * @csspart item--indeterminate - Applied when the selection is indeterminate.
31
- * @csspart item--selected - Applied when the tree item is selected.
32
- * @csspart indentation - The tree item's indentation container.
33
- * @csspart expand-button - The container that wraps the tree item's expand button and spinner.
34
- * @csspart label - The tree item's label.
35
- * @csspart children - The container that wraps the tree item's nested children.
36
- * @csspart checkbox - The checkbox that shows when using multiselect.
37
- * @csspart checkbox__base - The checkbox's exported `base` part.
38
- * @csspart checkbox__control - The checkbox's exported `control` part.
39
- * @csspart checkbox__control--checked - The checkbox's exported `control--checked` part.
40
- * @csspart checkbox__control--indeterminate - The checkbox's exported `control--indeterminate` part.
41
- * @csspart checkbox__checked-icon - The checkbox's exported `checked-icon` part.
42
- * @csspart checkbox__indeterminate-icon - The checkbox's exported `indeterminate-icon` part.
43
- * @csspart checkbox__label - The checkbox's exported `label` part.
44
- */
45
- export default class FlowTreeItem extends FlowRdfElement {
46
- static styles: CSSResultGroup;
47
- static isTreeItem(node: Node): boolean;
48
- private readonly localize;
49
- indeterminate: boolean;
50
- isLeaf: boolean;
51
- loading: boolean;
52
- selectable: boolean;
53
- /** Expands the tree item. */
54
- expanded: boolean;
55
- /** Draws the tree item in a selected state. */
56
- selected: boolean;
57
- /** Disables the tree item. */
58
- disabled: boolean;
59
- /** Enables lazy loading behavior. */
60
- lazy: boolean;
61
- defaultSlot: HTMLSlotElement;
62
- childrenSlot: HTMLSlotElement;
63
- itemElement: HTMLDivElement;
64
- childrenContainer: HTMLDivElement;
65
- expandButtonSlot: HTMLSlotElement;
66
- connectedCallback(): void;
67
- firstUpdated(): void;
68
- private animateCollapse;
69
- private isNestedItem;
70
- private handleChildrenSlotChange;
71
- protected willUpdate(changedProperties: PropertyValueMap<FlowTreeItem> | Map<PropertyKey, unknown>): void;
72
- private animateExpand;
73
- handleLoadingChange(): void;
74
- handleDisabledChange(): void;
75
- handleSelectedChange(): void;
76
- handleExpandedChange(): void;
77
- handleExpandAnimation(): void;
78
- handleLazyChange(): void;
79
- /** Gets all the nested tree items in this node. */
80
- getChildrenItems({ includeDisabled }?: {
81
- includeDisabled?: boolean;
82
- }): FlowTreeItem[];
83
- render(): import("lit").TemplateResult<1>;
84
- }
85
- declare global {
86
- interface HTMLElementTagNameMap {
87
- 'flow-ui-tree-item': FlowTreeItem;
88
- }
89
- }
@@ -1,2 +0,0 @@
1
- declare const _default: import("lit").CSSResult;
2
- export default _default;
@@ -1,19 +0,0 @@
1
- import type { CSSResultGroup } from 'lit';
2
- import FlowRdfElement from '../../internal/flow-ui-rdf-element';
3
- /**
4
- * @summary The visually hidden utility makes content accessible to assistive devices without displaying it on the screen.
5
- * @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/visually-hidden
6
- * @status stable
7
- * @since 2.0
8
- *
9
- * @slot - The content to be visually hidden.
10
- */
11
- export default class FlowVisuallyHidden extends FlowRdfElement {
12
- static styles: CSSResultGroup;
13
- render(): import("lit").TemplateResult<1>;
14
- }
15
- declare global {
16
- interface HTMLElementTagNameMap {
17
- 'flow-ui-visually-hidden': FlowVisuallyHidden;
18
- }
19
- }
@@ -1,5 +0,0 @@
1
- import type { Meta, StoryObj } from '@storybook/web-components';
2
- declare const meta: Meta;
3
- export default meta;
4
- type Story = StoryObj;
5
- export declare const Primary: Story;
@@ -1,2 +0,0 @@
1
- declare const _default: import("lit").CSSResult;
2
- export default _default;
@@ -1,34 +0,0 @@
1
- export type { default as FlowAfterCollapseEvent } from './flow-after-collapse';
2
- export type { default as FlowAfterExpandEvent } from './flow-after-expand';
3
- export type { default as FlowAfterHideEvent } from './flow-after-hide';
4
- export type { default as FlowAfterShowEvent } from './flow-after-show';
5
- export type { default as FlowBlurEvent } from './flow-blur';
6
- export type { default as FlowCancelEvent } from './flow-cancel';
7
- export type { default as FlowChangeEvent } from './flow-change';
8
- export type { default as FlowClearEvent } from './flow-clear';
9
- export type { default as FlowCloseEvent } from './flow-close';
10
- export type { default as FlowCollapseEvent } from './flow-collapse';
11
- export type { default as FlowErrorEvent } from './flow-error';
12
- export type { default as FlowExpandEvent } from './flow-expand';
13
- export type { default as FlowFinishEvent } from './flow-finish';
14
- export type { default as FlowFocusEvent } from './flow-focus';
15
- export type { default as FlowHideEvent } from './flow-hide';
16
- export type { default as FlowHoverEvent } from './flow-hover';
17
- export type { default as FlowInitialFocusEvent } from './flow-initial-focus';
18
- export type { default as FlowInputEvent } from './flow-input';
19
- export type { default as FlowInvalidEvent } from './flow-invalid';
20
- export type { default as FlowLazyChangeEvent } from './flow-lazy-change';
21
- export type { default as FlowLazyLoadEvent } from './flow-lazy-load';
22
- export type { default as FlowLoadEvent } from './flow-load';
23
- export type { default as FlowMutationEvent } from './flow-mutation';
24
- export type { default as FlowRemoveEvent } from './flow-remove';
25
- export type { default as FlowRepositionEvent } from './flow-reposition';
26
- export type { default as FlowRequestCloseEvent } from './flow-request-close';
27
- export type { default as FlowResizeEvent } from './flow-resize';
28
- export type { default as FlowSelectEvent } from './flow-select';
29
- export type { default as FlowSelectionChangeEvent } from './flow-selection-change';
30
- export type { default as FlowShowEvent } from './flow-show';
31
- export type { default as FlowSlideChange } from './flow-slide-change';
32
- export type { default as FlowStartEvent } from './flow-start';
33
- export type { default as FlowTabHideEvent } from './flow-tab-hide';
34
- export type { default as FlowTabShowEvent } from './flow-tab-show';
@@ -1,7 +0,0 @@
1
- type FlowAfterCollapseEvent = CustomEvent<Record<PropertyKey, never>>;
2
- declare global {
3
- interface GlobalEventHandlersEventMap {
4
- 'flow-ui-after-collapse': FlowAfterCollapseEvent;
5
- }
6
- }
7
- export default FlowAfterCollapseEvent;
@@ -1,7 +0,0 @@
1
- type FlowAfterExpandEvent = CustomEvent<Record<PropertyKey, never>>;
2
- declare global {
3
- interface GlobalEventHandlersEventMap {
4
- 'flow-ui-after-expand': FlowAfterExpandEvent;
5
- }
6
- }
7
- export default FlowAfterExpandEvent;
@@ -1,7 +0,0 @@
1
- type FlowAfterHideEvent = CustomEvent<Record<PropertyKey, never>>;
2
- declare global {
3
- interface GlobalEventHandlersEventMap {
4
- 'flow-ui-after-hide': FlowAfterHideEvent;
5
- }
6
- }
7
- export default FlowAfterHideEvent;
@@ -1,7 +0,0 @@
1
- type FlowAfterShowEvent = CustomEvent<Record<PropertyKey, never>>;
2
- declare global {
3
- interface GlobalEventHandlersEventMap {
4
- 'flow-ui-after-show': FlowAfterShowEvent;
5
- }
6
- }
7
- export default FlowAfterShowEvent;
@@ -1,7 +0,0 @@
1
- type FlowBlurEvent = CustomEvent<Record<PropertyKey, never>>;
2
- declare global {
3
- interface GlobalEventHandlersEventMap {
4
- 'flow-ui-blur': FlowBlurEvent;
5
- }
6
- }
7
- export default FlowBlurEvent;
@@ -1,7 +0,0 @@
1
- type FlowCancelEvent = CustomEvent<Record<PropertyKey, never>>;
2
- declare global {
3
- interface GlobalEventHandlersEventMap {
4
- 'flow-ui-cancel': FlowCancelEvent;
5
- }
6
- }
7
- export default FlowCancelEvent;
@@ -1,7 +0,0 @@
1
- type FlowChangeEvent = CustomEvent<Record<PropertyKey, never>>;
2
- declare global {
3
- interface GlobalEventHandlersEventMap {
4
- 'flow-ui-change': FlowChangeEvent;
5
- }
6
- }
7
- export default FlowChangeEvent;
@@ -1,7 +0,0 @@
1
- type FlowClearEvent = CustomEvent<Record<PropertyKey, never>>;
2
- declare global {
3
- interface GlobalEventHandlersEventMap {
4
- 'flow-ui-clear': FlowClearEvent;
5
- }
6
- }
7
- export default FlowClearEvent;
@@ -1,7 +0,0 @@
1
- type FlowCloseEvent = CustomEvent<Record<PropertyKey, never>>;
2
- declare global {
3
- interface GlobalEventHandlersEventMap {
4
- 'flow-ui-close': FlowCloseEvent;
5
- }
6
- }
7
- export default FlowCloseEvent;
@@ -1,7 +0,0 @@
1
- type FlowCollapseEvent = CustomEvent<Record<PropertyKey, never>>;
2
- declare global {
3
- interface GlobalEventHandlersEventMap {
4
- 'flow-ui-collapse': FlowCollapseEvent;
5
- }
6
- }
7
- export default FlowCollapseEvent;
@@ -1,9 +0,0 @@
1
- type FlowErrorEvent = CustomEvent<{
2
- status?: number;
3
- }>;
4
- declare global {
5
- interface GlobalEventHandlersEventMap {
6
- 'flow-ui-error': FlowErrorEvent;
7
- }
8
- }
9
- export default FlowErrorEvent;
@@ -1,7 +0,0 @@
1
- type FlowExpandEvent = CustomEvent<Record<PropertyKey, never>>;
2
- declare global {
3
- interface GlobalEventHandlersEventMap {
4
- 'flow-ui-expand': FlowExpandEvent;
5
- }
6
- }
7
- export default FlowExpandEvent;
@@ -1,7 +0,0 @@
1
- type FlowFinishEvent = CustomEvent<Record<PropertyKey, never>>;
2
- declare global {
3
- interface GlobalEventHandlersEventMap {
4
- 'flow-ui-finish': FlowFinishEvent;
5
- }
6
- }
7
- export default FlowFinishEvent;
@@ -1,7 +0,0 @@
1
- type FlowFocusEvent = CustomEvent<Record<PropertyKey, never>>;
2
- declare global {
3
- interface GlobalEventHandlersEventMap {
4
- 'flow-ui-focus': FlowFocusEvent;
5
- }
6
- }
7
- export default FlowFocusEvent;
@@ -1,7 +0,0 @@
1
- type FlowHideEvent = CustomEvent<Record<PropertyKey, never>>;
2
- declare global {
3
- interface GlobalEventHandlersEventMap {
4
- 'flow-ui-hide': FlowHideEvent;
5
- }
6
- }
7
- export default FlowHideEvent;
@@ -1,10 +0,0 @@
1
- type FlowHoverEvent = CustomEvent<{
2
- phase: 'start' | 'move' | 'end';
3
- value: number;
4
- }>;
5
- declare global {
6
- interface GlobalEventHandlersEventMap {
7
- 'flow-ui-hover': FlowHoverEvent;
8
- }
9
- }
10
- export default FlowHoverEvent;
@@ -1,7 +0,0 @@
1
- type FlowInitialFocusEvent = CustomEvent<Record<PropertyKey, never>>;
2
- declare global {
3
- interface GlobalEventHandlersEventMap {
4
- 'flow-ui-initial-focus': FlowInitialFocusEvent;
5
- }
6
- }
7
- export default FlowInitialFocusEvent;
@@ -1,7 +0,0 @@
1
- type FlowInputEvent = CustomEvent<Record<PropertyKey, never>>;
2
- declare global {
3
- interface GlobalEventHandlersEventMap {
4
- 'flow-ui-input': FlowInputEvent;
5
- }
6
- }
7
- export default FlowInputEvent;