@umbraco-ui/uui 1.4.0-rc.2 → 1.5.0-rc.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/custom-elements.json +119 -0
- package/dist/uui.min.js +55 -55
- package/dist/uui.min.js.map +1 -1
- package/lib/index.d.ts +1 -0
- package/lib/index.js +1 -0
- package/package.json +82 -81
- package/vscode-html-custom-data.json +124 -21
package/lib/index.d.ts
CHANGED
|
@@ -46,6 +46,7 @@ export * from '@umbraco-ui/uui-menu-item/lib';
|
|
|
46
46
|
export * from '@umbraco-ui/uui-modal/lib';
|
|
47
47
|
export * from '@umbraco-ui/uui-pagination/lib';
|
|
48
48
|
export * from '@umbraco-ui/uui-popover/lib';
|
|
49
|
+
export * from '@umbraco-ui/uui-popover-container/lib';
|
|
49
50
|
export * from '@umbraco-ui/uui-progress-bar/lib';
|
|
50
51
|
export * from '@umbraco-ui/uui-radio/lib';
|
|
51
52
|
export * from '@umbraco-ui/uui-range-slider/lib';
|
package/lib/index.js
CHANGED
|
@@ -46,6 +46,7 @@ export * from '@umbraco-ui/uui-menu-item/lib';
|
|
|
46
46
|
export * from '@umbraco-ui/uui-modal/lib';
|
|
47
47
|
export * from '@umbraco-ui/uui-pagination/lib';
|
|
48
48
|
export * from '@umbraco-ui/uui-popover/lib';
|
|
49
|
+
export * from '@umbraco-ui/uui-popover-container/lib';
|
|
49
50
|
export * from '@umbraco-ui/uui-progress-bar/lib';
|
|
50
51
|
export * from '@umbraco-ui/uui-radio/lib';
|
|
51
52
|
export * from '@umbraco-ui/uui-range-slider/lib';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@umbraco-ui/uui",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.5.0-rc.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "The full Umbraco UI Library. The package includes and registers all UUI Web Components.",
|
|
6
6
|
"keywords": [
|
|
@@ -37,85 +37,86 @@
|
|
|
37
37
|
"vscode-html-custom-data.json"
|
|
38
38
|
],
|
|
39
39
|
"dependencies": {
|
|
40
|
-
"@umbraco-ui/uui-action-bar": "1.
|
|
41
|
-
"@umbraco-ui/uui-avatar": "1.
|
|
42
|
-
"@umbraco-ui/uui-avatar-group": "1.
|
|
43
|
-
"@umbraco-ui/uui-badge": "1.
|
|
44
|
-
"@umbraco-ui/uui-base": "1.
|
|
45
|
-
"@umbraco-ui/uui-boolean-input": "1.
|
|
46
|
-
"@umbraco-ui/uui-box": "1.
|
|
47
|
-
"@umbraco-ui/uui-breadcrumbs": "1.
|
|
48
|
-
"@umbraco-ui/uui-button": "1.
|
|
49
|
-
"@umbraco-ui/uui-button-group": "1.
|
|
50
|
-
"@umbraco-ui/uui-button-inline-create": "1.
|
|
51
|
-
"@umbraco-ui/uui-card": "1.
|
|
52
|
-
"@umbraco-ui/uui-card-content-node": "1.
|
|
53
|
-
"@umbraco-ui/uui-card-media": "1.
|
|
54
|
-
"@umbraco-ui/uui-card-user": "1.
|
|
55
|
-
"@umbraco-ui/uui-caret": "1.
|
|
56
|
-
"@umbraco-ui/uui-checkbox": "1.
|
|
57
|
-
"@umbraco-ui/uui-color-area": "1.
|
|
58
|
-
"@umbraco-ui/uui-color-picker": "1.
|
|
59
|
-
"@umbraco-ui/uui-color-slider": "1.
|
|
60
|
-
"@umbraco-ui/uui-color-swatch": "1.
|
|
61
|
-
"@umbraco-ui/uui-color-swatches": "1.
|
|
62
|
-
"@umbraco-ui/uui-combobox": "1.
|
|
63
|
-
"@umbraco-ui/uui-combobox-list": "1.
|
|
64
|
-
"@umbraco-ui/uui-css": "1.4.0
|
|
65
|
-
"@umbraco-ui/uui-dialog": "1.
|
|
66
|
-
"@umbraco-ui/uui-dialog-layout": "1.
|
|
67
|
-
"@umbraco-ui/uui-file-dropzone": "1.
|
|
68
|
-
"@umbraco-ui/uui-file-preview": "1.
|
|
69
|
-
"@umbraco-ui/uui-form": "1.
|
|
70
|
-
"@umbraco-ui/uui-form-layout-item": "1.
|
|
71
|
-
"@umbraco-ui/uui-form-validation-message": "1.
|
|
72
|
-
"@umbraco-ui/uui-icon": "1.
|
|
73
|
-
"@umbraco-ui/uui-icon-registry": "1.
|
|
74
|
-
"@umbraco-ui/uui-icon-registry-essential": "1.
|
|
75
|
-
"@umbraco-ui/uui-input": "1.
|
|
76
|
-
"@umbraco-ui/uui-input-file": "1.
|
|
77
|
-
"@umbraco-ui/uui-input-lock": "1.
|
|
78
|
-
"@umbraco-ui/uui-input-password": "1.
|
|
79
|
-
"@umbraco-ui/uui-keyboard-shortcut": "1.
|
|
80
|
-
"@umbraco-ui/uui-label": "1.
|
|
81
|
-
"@umbraco-ui/uui-loader": "1.
|
|
82
|
-
"@umbraco-ui/uui-loader-bar": "1.
|
|
83
|
-
"@umbraco-ui/uui-loader-circle": "1.
|
|
84
|
-
"@umbraco-ui/uui-menu-item": "1.
|
|
85
|
-
"@umbraco-ui/uui-modal": "1.
|
|
86
|
-
"@umbraco-ui/uui-pagination": "1.
|
|
87
|
-
"@umbraco-ui/uui-popover": "1.
|
|
88
|
-
"@umbraco-ui/uui-
|
|
89
|
-
"@umbraco-ui/uui-
|
|
90
|
-
"@umbraco-ui/uui-
|
|
91
|
-
"@umbraco-ui/uui-
|
|
92
|
-
"@umbraco-ui/uui-ref
|
|
93
|
-
"@umbraco-ui/uui-ref-
|
|
94
|
-
"@umbraco-ui/uui-ref-node
|
|
95
|
-
"@umbraco-ui/uui-ref-node-
|
|
96
|
-
"@umbraco-ui/uui-ref-node-
|
|
97
|
-
"@umbraco-ui/uui-ref-node-
|
|
98
|
-
"@umbraco-ui/uui-ref-node-
|
|
99
|
-
"@umbraco-ui/uui-ref-node-
|
|
100
|
-
"@umbraco-ui/uui-
|
|
101
|
-
"@umbraco-ui/uui-
|
|
102
|
-
"@umbraco-ui/uui-
|
|
103
|
-
"@umbraco-ui/uui-
|
|
104
|
-
"@umbraco-ui/uui-symbol-
|
|
105
|
-
"@umbraco-ui/uui-symbol-file
|
|
106
|
-
"@umbraco-ui/uui-symbol-file-
|
|
107
|
-
"@umbraco-ui/uui-symbol-
|
|
108
|
-
"@umbraco-ui/uui-symbol-
|
|
109
|
-
"@umbraco-ui/uui-symbol-
|
|
110
|
-
"@umbraco-ui/uui-symbol-
|
|
111
|
-
"@umbraco-ui/uui-
|
|
112
|
-
"@umbraco-ui/uui-
|
|
113
|
-
"@umbraco-ui/uui-
|
|
114
|
-
"@umbraco-ui/uui-
|
|
115
|
-
"@umbraco-ui/uui-
|
|
116
|
-
"@umbraco-ui/uui-toast-notification
|
|
117
|
-
"@umbraco-ui/uui-toast-notification-
|
|
118
|
-
"@umbraco-ui/uui-
|
|
40
|
+
"@umbraco-ui/uui-action-bar": "1.5.0-rc.0",
|
|
41
|
+
"@umbraco-ui/uui-avatar": "1.5.0-rc.0",
|
|
42
|
+
"@umbraco-ui/uui-avatar-group": "1.5.0-rc.0",
|
|
43
|
+
"@umbraco-ui/uui-badge": "1.5.0-rc.0",
|
|
44
|
+
"@umbraco-ui/uui-base": "1.5.0-rc.0",
|
|
45
|
+
"@umbraco-ui/uui-boolean-input": "1.5.0-rc.0",
|
|
46
|
+
"@umbraco-ui/uui-box": "1.5.0-rc.0",
|
|
47
|
+
"@umbraco-ui/uui-breadcrumbs": "1.5.0-rc.0",
|
|
48
|
+
"@umbraco-ui/uui-button": "1.5.0-rc.0",
|
|
49
|
+
"@umbraco-ui/uui-button-group": "1.5.0-rc.0",
|
|
50
|
+
"@umbraco-ui/uui-button-inline-create": "1.5.0-rc.0",
|
|
51
|
+
"@umbraco-ui/uui-card": "1.5.0-rc.0",
|
|
52
|
+
"@umbraco-ui/uui-card-content-node": "1.5.0-rc.0",
|
|
53
|
+
"@umbraco-ui/uui-card-media": "1.5.0-rc.0",
|
|
54
|
+
"@umbraco-ui/uui-card-user": "1.5.0-rc.0",
|
|
55
|
+
"@umbraco-ui/uui-caret": "1.5.0-rc.0",
|
|
56
|
+
"@umbraco-ui/uui-checkbox": "1.5.0-rc.0",
|
|
57
|
+
"@umbraco-ui/uui-color-area": "1.5.0-rc.0",
|
|
58
|
+
"@umbraco-ui/uui-color-picker": "1.5.0-rc.0",
|
|
59
|
+
"@umbraco-ui/uui-color-slider": "1.5.0-rc.0",
|
|
60
|
+
"@umbraco-ui/uui-color-swatch": "1.5.0-rc.0",
|
|
61
|
+
"@umbraco-ui/uui-color-swatches": "1.5.0-rc.0",
|
|
62
|
+
"@umbraco-ui/uui-combobox": "1.5.0-rc.0",
|
|
63
|
+
"@umbraco-ui/uui-combobox-list": "1.5.0-rc.0",
|
|
64
|
+
"@umbraco-ui/uui-css": "1.4.0",
|
|
65
|
+
"@umbraco-ui/uui-dialog": "1.5.0-rc.0",
|
|
66
|
+
"@umbraco-ui/uui-dialog-layout": "1.5.0-rc.0",
|
|
67
|
+
"@umbraco-ui/uui-file-dropzone": "1.5.0-rc.0",
|
|
68
|
+
"@umbraco-ui/uui-file-preview": "1.5.0-rc.0",
|
|
69
|
+
"@umbraco-ui/uui-form": "1.5.0-rc.0",
|
|
70
|
+
"@umbraco-ui/uui-form-layout-item": "1.5.0-rc.0",
|
|
71
|
+
"@umbraco-ui/uui-form-validation-message": "1.5.0-rc.0",
|
|
72
|
+
"@umbraco-ui/uui-icon": "1.5.0-rc.0",
|
|
73
|
+
"@umbraco-ui/uui-icon-registry": "1.5.0-rc.0",
|
|
74
|
+
"@umbraco-ui/uui-icon-registry-essential": "1.5.0-rc.0",
|
|
75
|
+
"@umbraco-ui/uui-input": "1.5.0-rc.0",
|
|
76
|
+
"@umbraco-ui/uui-input-file": "1.5.0-rc.0",
|
|
77
|
+
"@umbraco-ui/uui-input-lock": "1.5.0-rc.0",
|
|
78
|
+
"@umbraco-ui/uui-input-password": "1.5.0-rc.0",
|
|
79
|
+
"@umbraco-ui/uui-keyboard-shortcut": "1.5.0-rc.0",
|
|
80
|
+
"@umbraco-ui/uui-label": "1.5.0-rc.0",
|
|
81
|
+
"@umbraco-ui/uui-loader": "1.5.0-rc.0",
|
|
82
|
+
"@umbraco-ui/uui-loader-bar": "1.5.0-rc.0",
|
|
83
|
+
"@umbraco-ui/uui-loader-circle": "1.5.0-rc.0",
|
|
84
|
+
"@umbraco-ui/uui-menu-item": "1.5.0-rc.0",
|
|
85
|
+
"@umbraco-ui/uui-modal": "1.5.0-rc.0",
|
|
86
|
+
"@umbraco-ui/uui-pagination": "1.5.0-rc.0",
|
|
87
|
+
"@umbraco-ui/uui-popover": "1.5.0-rc.0",
|
|
88
|
+
"@umbraco-ui/uui-popover-container": "1.5.0-rc.0",
|
|
89
|
+
"@umbraco-ui/uui-progress-bar": "1.5.0-rc.0",
|
|
90
|
+
"@umbraco-ui/uui-radio": "1.5.0-rc.0",
|
|
91
|
+
"@umbraco-ui/uui-range-slider": "1.5.0-rc.0",
|
|
92
|
+
"@umbraco-ui/uui-ref": "1.5.0-rc.0",
|
|
93
|
+
"@umbraco-ui/uui-ref-list": "1.5.0-rc.0",
|
|
94
|
+
"@umbraco-ui/uui-ref-node": "1.5.0-rc.0",
|
|
95
|
+
"@umbraco-ui/uui-ref-node-data-type": "1.5.0-rc.0",
|
|
96
|
+
"@umbraco-ui/uui-ref-node-document-type": "1.5.0-rc.0",
|
|
97
|
+
"@umbraco-ui/uui-ref-node-form": "1.5.0-rc.0",
|
|
98
|
+
"@umbraco-ui/uui-ref-node-member": "1.5.0-rc.0",
|
|
99
|
+
"@umbraco-ui/uui-ref-node-package": "1.5.0-rc.0",
|
|
100
|
+
"@umbraco-ui/uui-ref-node-user": "1.5.0-rc.0",
|
|
101
|
+
"@umbraco-ui/uui-scroll-container": "1.5.0-rc.0",
|
|
102
|
+
"@umbraco-ui/uui-select": "1.5.0-rc.0",
|
|
103
|
+
"@umbraco-ui/uui-slider": "1.5.0-rc.0",
|
|
104
|
+
"@umbraco-ui/uui-symbol-expand": "1.5.0-rc.0",
|
|
105
|
+
"@umbraco-ui/uui-symbol-file": "1.5.0-rc.0",
|
|
106
|
+
"@umbraco-ui/uui-symbol-file-dropzone": "1.5.0-rc.0",
|
|
107
|
+
"@umbraco-ui/uui-symbol-file-thumbnail": "1.5.0-rc.0",
|
|
108
|
+
"@umbraco-ui/uui-symbol-folder": "1.5.0-rc.0",
|
|
109
|
+
"@umbraco-ui/uui-symbol-lock": "1.5.0-rc.0",
|
|
110
|
+
"@umbraco-ui/uui-symbol-more": "1.5.0-rc.0",
|
|
111
|
+
"@umbraco-ui/uui-symbol-sort": "1.5.0-rc.0",
|
|
112
|
+
"@umbraco-ui/uui-table": "1.5.0-rc.0",
|
|
113
|
+
"@umbraco-ui/uui-tabs": "1.5.0-rc.0",
|
|
114
|
+
"@umbraco-ui/uui-tag": "1.5.0-rc.0",
|
|
115
|
+
"@umbraco-ui/uui-textarea": "1.5.0-rc.0",
|
|
116
|
+
"@umbraco-ui/uui-toast-notification": "1.5.0-rc.0",
|
|
117
|
+
"@umbraco-ui/uui-toast-notification-container": "1.5.0-rc.0",
|
|
118
|
+
"@umbraco-ui/uui-toast-notification-layout": "1.5.0-rc.0",
|
|
119
|
+
"@umbraco-ui/uui-toggle": "1.5.0-rc.0"
|
|
119
120
|
},
|
|
120
121
|
"scripts": {
|
|
121
122
|
"build": "npm run analyze && tsc --build && rollup -c rollup.config.js",
|
|
@@ -128,5 +129,5 @@
|
|
|
128
129
|
"storybook": {
|
|
129
130
|
"url": "https://v1-contrib--62189360eeb21b003ab2f4ad.chromatic.com/"
|
|
130
131
|
},
|
|
131
|
-
"gitHead": "
|
|
132
|
+
"gitHead": "73cbc1444590282b7fb63a18d5639628ba18f0a3"
|
|
132
133
|
}
|
|
@@ -180,7 +180,7 @@
|
|
|
180
180
|
},
|
|
181
181
|
{
|
|
182
182
|
"name": "uui-button",
|
|
183
|
-
"description": "Events:\n\n * `click` - fires when the element is clicked\n\nSlots:\n\n * ` ` {} - for default content\n\n * `label` {} - for label content\n\n * `extra` {} - for extra\n\nAttributes:\n\n * `type` { \"submit\" | \"button\" | \"reset\" } - Specifies the type of button\n\n * `disabled` {boolean} - Disables the button, changes the looks of it and prevents if from emitting the click event\n\n * `look` {\"default\" | \"primary\" | \"secondary\" | \"outline\" | \"placeholder\"} - Changes the look of the button to one of the predefined, symbolic looks. For example - set this to positive if you want nice, green \"confirm\" button.\n\n * `color` {\"default\" | \"positive\" | \"warning\" | \"danger\"} - Changes the look of the button to one of the predefined, symbolic looks. For example - set this to positive if you want nice, green \"confirm\" button.\n\n * `compact` {boolean} - Makes the left and right padding of the button narrower.\n\n * `state` {undefined |'waiting' | 'success' | 'failed'} - Sets the state of the button. With waiting state a loader will show, the success state and fail states display icons. State is reset do default automatically after 3 seconds.\n\n * `href` {string} - Set an href, this will turns the button into a anchor tag.\n\n * `target` {string} - Set an anchor tag target, only used when using href.\n\n * `name` {string} - This is a name property of the component.\n\n * `value` {string} - Value of this form control.\n\n * `pristine` {boolean} - Determines wether the form control has been touched or interacted with, this determines wether the validation-status of this form control should be made visible.\n\n * `required` {`boolean`} - Apply validation rule for requiring a value of this form control.\n\n * `required-message` {`string`} - Required validation message.\n\n * `error` {`boolean`} - Apply custom error on this input.\n\n * `error-message` {`string`} - Custom error message.\n\n * `label` {string} - Label to be used for aria-label and potentially as visual label for some components\n\nProperties:\n\n * `styles` {`CSSResult[]`} - \n\n * `type` { \"submit\" | \"button\" | \"reset\" } - Specifies the type of button\n\n * `disabled` {boolean} - Disables the button, changes the looks of it and prevents if from emitting the click event\n\n * `look` {\"default\" | \"primary\" | \"secondary\" | \"outline\" | \"placeholder\"} - Changes the look of the button to one of the predefined, symbolic looks. For example - set this to positive if you want nice, green \"confirm\" button.\n\n * `color` {\"default\" | \"positive\" | \"warning\" | \"danger\"} - Changes the look of the button to one of the predefined, symbolic looks. For example - set this to positive if you want nice, green \"confirm\" button.\n\n * `compact` {boolean} - Makes the left and right padding of the button narrower.\n\n * `state` {undefined |'waiting' | 'success' | 'failed'} - Sets the state of the button. With waiting state a loader will show, the success state and fail states display icons. State is reset do default automatically after 3 seconds.\n\n * `href` {string} - Set an href, this will turns the button into a anchor tag.\n\n * `target` {string} - Set an anchor tag target, only used when using href.\n\n * `_button` {`HTMLInputElement`} - \n\n * `_resetStateTimeout` {`number | undefined`} - \n\n * `formAssociated` {boolean} - This is a static class field indicating that the element is can be used inside a native form and participate in its events.\nIt may require a polyfill, check support here https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/attachInternals.\nRead more about form controls here https://web.dev/more-capable-form-controls/\n\n * `name` {string} - This is a name property of the component.\n\n * `value` {string} - Value of this form control.\n\n * `_validityState` - \n\n * `pristine` {boolean} - Determines wether the form control has been touched or interacted with, this determines wether the validation-status of this form control should be made visible.\n\n * `required` {`boolean`} - Apply validation rule for requiring a value of this form control.\n\n * `requiredMessage` {`string`} - Required validation message.\n\n * `error` {`boolean`} - Apply custom error on this input.\n\n * `errorMessage` {`string`} - Custom error message.\n\n * `_value` {`string | File | FormData`} - \n\n * `_form` {`HTMLFormElement | null`} - \n\n * `_validators` {`Validator[]`} - \n\n * `_formCtrlElements` {`HTMLInputElement[]`} - \n\n * `_customValidityObject` {`Validator | undefined`} - \n\n * `_onFormSubmit` - \n\n * `validity` {`ValidityState`} - \n\n * `validationMessage` - \n\n * `_internals` - \n\n * `label` {string} - Label to be used for aria-label and potentially as visual label for some components\n\n * `_labelSlotHasContent` {`boolean`} - ",
|
|
183
|
+
"description": "Events:\n\n * `click` - fires when the element is clicked\n\nSlots:\n\n * ` ` {} - for default content\n\n * `label` {} - for label content\n\n * `extra` {} - for extra\n\nAttributes:\n\n * `type` { \"submit\" | \"button\" | \"reset\" } - Specifies the type of button\n\n * `disabled` {boolean} - Disables the button, changes the looks of it and prevents if from emitting the click event\n\n * `look` {\"default\" | \"primary\" | \"secondary\" | \"outline\" | \"placeholder\"} - Changes the look of the button to one of the predefined, symbolic looks. For example - set this to positive if you want nice, green \"confirm\" button.\n\n * `color` {\"default\" | \"positive\" | \"warning\" | \"danger\"} - Changes the look of the button to one of the predefined, symbolic looks. For example - set this to positive if you want nice, green \"confirm\" button.\n\n * `compact` {boolean} - Makes the left and right padding of the button narrower.\n\n * `state` {undefined |'waiting' | 'success' | 'failed'} - Sets the state of the button. With waiting state a loader will show, the success state and fail states display icons. State is reset do default automatically after 3 seconds.\n\n * `href` {string} - Set an href, this will turns the button into a anchor tag.\n\n * `target` {string} - Set an anchor tag target, only used when using href.\n\n * `name` {string} - This is a name property of the component.\n\n * `value` {string} - Value of this form control.\n\n * `pristine` {boolean} - Determines wether the form control has been touched or interacted with, this determines wether the validation-status of this form control should be made visible.\n\n * `required` {`boolean`} - Apply validation rule for requiring a value of this form control.\n\n * `required-message` {`string`} - Required validation message.\n\n * `error` {`boolean`} - Apply custom error on this input.\n\n * `error-message` {`string`} - Custom error message.\n\n * `label` {string} - Label to be used for aria-label and potentially as visual label for some components\n\n * `popovertarget` {string} - Set a popovertarget.\n\nProperties:\n\n * `styles` {`CSSResult[]`} - \n\n * `type` { \"submit\" | \"button\" | \"reset\" } - Specifies the type of button\n\n * `disabled` {boolean} - Disables the button, changes the looks of it and prevents if from emitting the click event\n\n * `look` {\"default\" | \"primary\" | \"secondary\" | \"outline\" | \"placeholder\"} - Changes the look of the button to one of the predefined, symbolic looks. For example - set this to positive if you want nice, green \"confirm\" button.\n\n * `color` {\"default\" | \"positive\" | \"warning\" | \"danger\"} - Changes the look of the button to one of the predefined, symbolic looks. For example - set this to positive if you want nice, green \"confirm\" button.\n\n * `compact` {boolean} - Makes the left and right padding of the button narrower.\n\n * `state` {undefined |'waiting' | 'success' | 'failed'} - Sets the state of the button. With waiting state a loader will show, the success state and fail states display icons. State is reset do default automatically after 3 seconds.\n\n * `href` {string} - Set an href, this will turns the button into a anchor tag.\n\n * `target` {string} - Set an anchor tag target, only used when using href.\n\n * `_button` {`HTMLInputElement`} - \n\n * `_resetStateTimeout` {`number | undefined`} - \n\n * `formAssociated` {boolean} - This is a static class field indicating that the element is can be used inside a native form and participate in its events.\nIt may require a polyfill, check support here https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/attachInternals.\nRead more about form controls here https://web.dev/more-capable-form-controls/\n\n * `name` {string} - This is a name property of the component.\n\n * `value` {string} - Value of this form control.\n\n * `_validityState` - \n\n * `pristine` {boolean} - Determines wether the form control has been touched or interacted with, this determines wether the validation-status of this form control should be made visible.\n\n * `required` {`boolean`} - Apply validation rule for requiring a value of this form control.\n\n * `requiredMessage` {`string`} - Required validation message.\n\n * `error` {`boolean`} - Apply custom error on this input.\n\n * `errorMessage` {`string`} - Custom error message.\n\n * `_value` {`string | File | FormData`} - \n\n * `_form` {`HTMLFormElement | null`} - \n\n * `_validators` {`Validator[]`} - \n\n * `_formCtrlElements` {`HTMLInputElement[]`} - \n\n * `_customValidityObject` {`Validator | undefined`} - \n\n * `_onFormSubmit` - \n\n * `validity` {`ValidityState`} - \n\n * `validationMessage` - \n\n * `_internals` - \n\n * `label` {string} - Label to be used for aria-label and potentially as visual label for some components\n\n * `_labelSlotHasContent` {`boolean`} - \n\n * `popoverContainerElement` {string} - Set a popovertarget.\n\n * `_togglePopover` - ",
|
|
184
184
|
"attributes": [
|
|
185
185
|
{
|
|
186
186
|
"name": "type",
|
|
@@ -326,6 +326,11 @@
|
|
|
326
326
|
"name": "label",
|
|
327
327
|
"description": "`label` {string} - Label to be used for aria-label and potentially as visual label for some components\n\nProperty: label"
|
|
328
328
|
},
|
|
329
|
+
{
|
|
330
|
+
"name": "popovertarget",
|
|
331
|
+
"description": "`popovertarget` {string} - Set a popovertarget.\n\nProperty: popoverContainerElement\n\nDefault: undefined",
|
|
332
|
+
"values": []
|
|
333
|
+
},
|
|
329
334
|
{
|
|
330
335
|
"name": "onclick",
|
|
331
336
|
"description": "`click` - fires when the element is clicked"
|
|
@@ -632,16 +637,16 @@
|
|
|
632
637
|
"description": "`label-position` {'left' | 'right' | 'top' | 'bottom'} - Specifies the label position of the checkbox or the toggle\n\nProperty: labelPosition\n\nDefault: right",
|
|
633
638
|
"values": [
|
|
634
639
|
{
|
|
635
|
-
"name": "
|
|
640
|
+
"name": "top"
|
|
636
641
|
},
|
|
637
642
|
{
|
|
638
|
-
"name": "
|
|
643
|
+
"name": "bottom"
|
|
639
644
|
},
|
|
640
645
|
{
|
|
641
|
-
"name": "
|
|
646
|
+
"name": "right"
|
|
642
647
|
},
|
|
643
648
|
{
|
|
644
|
-
"name": "
|
|
649
|
+
"name": "left"
|
|
645
650
|
}
|
|
646
651
|
]
|
|
647
652
|
},
|
|
@@ -2036,31 +2041,80 @@
|
|
|
2036
2041
|
]
|
|
2037
2042
|
},
|
|
2038
2043
|
{
|
|
2039
|
-
"name": "uui-popover",
|
|
2040
|
-
"description": "Events:\n\n * `
|
|
2044
|
+
"name": "uui-popover-container",
|
|
2045
|
+
"description": "Events:\n\n * `uui-popover-before-toggle` {`CustomEvent<{ oldState: any; newState: any; }>`} - \n\nAttributes:\n\n * `margin` {number} - Set the distance between popover container element and target element.\n\n * `open` {boolean} - Read-only attribute to check if the popover is open\n\n * `placement` {`PopoverContainerPlacement`} - Define the placement of the popover container.\n\nProperties:\n\n * `margin` {number} - Set the distance between popover container element and target element.\n\n * `open` {boolean} - Read-only attribute to check if the popover is open\n\n * `placement` {`PopoverContainerPlacement`} - Define the placement of the popover container.\n\n * `_placement` {`PopoverContainerPlacement`} - \n\n * `_open` {`boolean`} - \n\n * `_actualPlacement` {`PopoverContainerPlacement`} - \n\n * `styles` {`CSSResult[]`} - ",
|
|
2041
2046
|
"attributes": [
|
|
2042
2047
|
{
|
|
2043
2048
|
"name": "margin",
|
|
2044
|
-
"description": "`margin` {number} - Set the distance between popover
|
|
2049
|
+
"description": "`margin` {number} - Set the distance between popover container element and target element.\n\nProperty: margin\n\nDefault: 0"
|
|
2050
|
+
},
|
|
2051
|
+
{
|
|
2052
|
+
"name": "open",
|
|
2053
|
+
"description": "`open` {boolean} - Read-only attribute to check if the popover is open\n\nProperty: open\n\nDefault: false",
|
|
2054
|
+
"valueSet": "v"
|
|
2045
2055
|
},
|
|
2046
2056
|
{
|
|
2047
2057
|
"name": "placement",
|
|
2048
|
-
"description": "`placement` {`
|
|
2058
|
+
"description": "`placement` {`PopoverContainerPlacement`} - Define the placement of the popover container.\n\nProperty: placement\n\nDefault: 'bottom-start'",
|
|
2049
2059
|
"values": [
|
|
2050
2060
|
{
|
|
2051
|
-
"name": "
|
|
2061
|
+
"name": "top"
|
|
2052
2062
|
},
|
|
2053
2063
|
{
|
|
2054
|
-
"name": "
|
|
2064
|
+
"name": "top-start"
|
|
2055
2065
|
},
|
|
2056
2066
|
{
|
|
2057
|
-
"name": "top"
|
|
2067
|
+
"name": "top-end"
|
|
2058
2068
|
},
|
|
2059
2069
|
{
|
|
2060
2070
|
"name": "bottom"
|
|
2061
2071
|
},
|
|
2062
2072
|
{
|
|
2063
|
-
"name": "
|
|
2073
|
+
"name": "bottom-start"
|
|
2074
|
+
},
|
|
2075
|
+
{
|
|
2076
|
+
"name": "bottom-end"
|
|
2077
|
+
},
|
|
2078
|
+
{
|
|
2079
|
+
"name": "right"
|
|
2080
|
+
},
|
|
2081
|
+
{
|
|
2082
|
+
"name": "right-start"
|
|
2083
|
+
},
|
|
2084
|
+
{
|
|
2085
|
+
"name": "right-end"
|
|
2086
|
+
},
|
|
2087
|
+
{
|
|
2088
|
+
"name": "left"
|
|
2089
|
+
},
|
|
2090
|
+
{
|
|
2091
|
+
"name": "left-start"
|
|
2092
|
+
},
|
|
2093
|
+
{
|
|
2094
|
+
"name": "left-end"
|
|
2095
|
+
}
|
|
2096
|
+
]
|
|
2097
|
+
},
|
|
2098
|
+
{
|
|
2099
|
+
"name": "onuui-popover-before-toggle",
|
|
2100
|
+
"description": "`uui-popover-before-toggle` {`CustomEvent<{ oldState: any; newState: any; }>`} - "
|
|
2101
|
+
}
|
|
2102
|
+
]
|
|
2103
|
+
},
|
|
2104
|
+
{
|
|
2105
|
+
"name": "uui-popover",
|
|
2106
|
+
"description": "Events:\n\n * `close` {} - When popover is closed by user interaction.\n\nSlots:\n\n * `trigger` {} - The element that triggers the popover.\n\n * `popover` {} - The content of the popover.\n\nAttributes:\n\n * `margin` {number} - Set the distance between popover-modal and trigger.\n\n * `placement` {`PopoverPlacement`} - Define the placement of the popover-modal.\n\n * `open` {boolean} - Opens the popover-modal.\n\nProperties:\n\n * `styles` {`CSSResult[]`} - \n\n * `intersectionObserver` {`IntersectionObserver | undefined`} - \n\n * `scrollEventHandler` - \n\n * `containerElement` {`HTMLElement`} - \n\n * `_open` {`boolean`} - \n\n * `_placement` {`PopoverPlacement`} - \n\n * `_currentPlacement` {`\"top\" | \"top-start\" | \"top-end\" | \"bottom\" | \"bottom-start\" | \"bottom-end\" | \"right\" | \"right-start\" | \"right-end\" | \"left\" | \"left-start\" | \"left-end\" | \"auto\" | null`} - \n\n * `_trigger` {`Element | undefined`} - \n\n * `_scrollParents` {`Element[]`} - \n\n * `_positionX` {`number | undefined`} - \n\n * `_positionY` {`number | undefined`} - \n\n * `margin` {number} - Set the distance between popover-modal and trigger.\n\n * `placement` {`PopoverPlacement`} - Define the placement of the popover-modal.\n\n * `open` {boolean} - Opens the popover-modal.\n\n * `_onTriggerSlotChanged` - \n\n * `_intersectionCallback` - \n\n * `_onKeyUp` - \n\n * `_onDocumentClick` - ",
|
|
2107
|
+
"attributes": [
|
|
2108
|
+
{
|
|
2109
|
+
"name": "margin",
|
|
2110
|
+
"description": "`margin` {number} - Set the distance between popover-modal and trigger.\n\nProperty: margin\n\nDefault: false"
|
|
2111
|
+
},
|
|
2112
|
+
{
|
|
2113
|
+
"name": "placement",
|
|
2114
|
+
"description": "`placement` {`PopoverPlacement`} - Define the placement of the popover-modal.\n\nProperty: placement\n\nDefault: 'bottom-start'",
|
|
2115
|
+
"values": [
|
|
2116
|
+
{
|
|
2117
|
+
"name": "top"
|
|
2064
2118
|
},
|
|
2065
2119
|
{
|
|
2066
2120
|
"name": "top-start"
|
|
@@ -2068,23 +2122,35 @@
|
|
|
2068
2122
|
{
|
|
2069
2123
|
"name": "top-end"
|
|
2070
2124
|
},
|
|
2125
|
+
{
|
|
2126
|
+
"name": "bottom"
|
|
2127
|
+
},
|
|
2071
2128
|
{
|
|
2072
2129
|
"name": "bottom-start"
|
|
2073
2130
|
},
|
|
2074
2131
|
{
|
|
2075
2132
|
"name": "bottom-end"
|
|
2076
2133
|
},
|
|
2134
|
+
{
|
|
2135
|
+
"name": "right"
|
|
2136
|
+
},
|
|
2077
2137
|
{
|
|
2078
2138
|
"name": "right-start"
|
|
2079
2139
|
},
|
|
2080
2140
|
{
|
|
2081
2141
|
"name": "right-end"
|
|
2082
2142
|
},
|
|
2143
|
+
{
|
|
2144
|
+
"name": "left"
|
|
2145
|
+
},
|
|
2083
2146
|
{
|
|
2084
2147
|
"name": "left-start"
|
|
2085
2148
|
},
|
|
2086
2149
|
{
|
|
2087
2150
|
"name": "left-end"
|
|
2151
|
+
},
|
|
2152
|
+
{
|
|
2153
|
+
"name": "auto"
|
|
2088
2154
|
}
|
|
2089
2155
|
]
|
|
2090
2156
|
},
|
|
@@ -3027,12 +3093,25 @@
|
|
|
3027
3093
|
},
|
|
3028
3094
|
{
|
|
3029
3095
|
"name": "uui-tab-group",
|
|
3030
|
-
"description": "Slots:\n\n * ` ` {} - Default slot for the tab group\n\
|
|
3031
|
-
"attributes": [
|
|
3096
|
+
"description": "Slots:\n\n * ` ` {} - Default slot for the tab group\n\nAttributes:\n\n * `dropdown-content-direction` {string} - Set the flex direction of the content of the dropdown.\n\nProperties:\n\n * `styles` {`CSSResult[]`} - \n\n * `_moreButtonElement` - \n\n * `_slottedNodes` {`HTMLElement[] | undefined`} - \n\n * `dropdownContentDirection` {string} - Set the flex direction of the content of the dropdown.",
|
|
3097
|
+
"attributes": [
|
|
3098
|
+
{
|
|
3099
|
+
"name": "dropdown-content-direction",
|
|
3100
|
+
"description": "`dropdown-content-direction` {string} - Set the flex direction of the content of the dropdown.\n\nProperty: dropdownContentDirection\n\nDefault: vertical",
|
|
3101
|
+
"values": [
|
|
3102
|
+
{
|
|
3103
|
+
"name": "vertical"
|
|
3104
|
+
},
|
|
3105
|
+
{
|
|
3106
|
+
"name": "horizontal"
|
|
3107
|
+
}
|
|
3108
|
+
]
|
|
3109
|
+
}
|
|
3110
|
+
]
|
|
3032
3111
|
},
|
|
3033
3112
|
{
|
|
3034
3113
|
"name": "uui-tabs",
|
|
3035
|
-
"description": "A single tab. Should be put into `<uui-tab-group>`,\n\nSlots:\n\n * ` ` {} - for label\n\n * `icon` {} - for icon\n\n * `extra` {} - for extra\n\nAttributes:\n\n * `disabled` {boolean} - Reflects the disabled state of the element. True if tab is disabled. Change this to switch the state programmatically.\n\n * `href` {string} - Set an href, this will turns the inner button into a anchor tag.\n\n * `target` {string} - Set an anchor tag target, only used when using href.\n\n * `active` {boolean} - Set this boolean to true for then the related composition is sorted.\n\n * `label` {string} - Label to be used for aria-label and potentially as visual label for some components\n\nProperties:\n\n * `styles` {`CSSResult[]`} - \n\n * `disabled` {boolean} - Reflects the disabled state of the element. True if tab is disabled. Change this to switch the state programmatically.\n\n * `href` {string} - Set an href, this will turns the inner button into a anchor tag.\n\n * `target` {string} - Set an anchor tag target, only used when using href.\n\n * `active` {boolean} - Set this boolean to true for then the related composition is sorted.\n\n * `label` {string} - Label to be used for aria-label and potentially as visual label for some components\n\n * `_labelSlotHasContent` {`boolean`} - ",
|
|
3114
|
+
"description": "A single tab. Should be put into `<uui-tab-group>`,\n\nSlots:\n\n * ` ` {} - for label\n\n * `icon` {} - for icon\n\n * `extra` {} - for extra\n\nAttributes:\n\n * `disabled` {boolean} - Reflects the disabled state of the element. True if tab is disabled. Change this to switch the state programmatically.\n\n * `href` {string} - Set an href, this will turns the inner button into a anchor tag.\n\n * `target` {string} - Set an anchor tag target, only used when using href.\n\n * `orientation` {string} - Set the visual orientation of this tab, this changes the look and placement of the active indication.\n\n * `active` {boolean} - Set this boolean to true for then the related composition is sorted.\n\n * `label` {string} - Label to be used for aria-label and potentially as visual label for some components\n\nProperties:\n\n * `styles` {`CSSResult[]`} - \n\n * `disabled` {boolean} - Reflects the disabled state of the element. True if tab is disabled. Change this to switch the state programmatically.\n\n * `href` {string} - Set an href, this will turns the inner button into a anchor tag.\n\n * `target` {string} - Set an anchor tag target, only used when using href.\n\n * `orientation` {string} - Set the visual orientation of this tab, this changes the look and placement of the active indication.\n\n * `active` {boolean} - Set this boolean to true for then the related composition is sorted.\n\n * `label` {string} - Label to be used for aria-label and potentially as visual label for some components\n\n * `_labelSlotHasContent` {`boolean`} - ",
|
|
3036
3115
|
"attributes": [
|
|
3037
3116
|
{
|
|
3038
3117
|
"name": "disabled",
|
|
@@ -3062,6 +3141,18 @@
|
|
|
3062
3141
|
}
|
|
3063
3142
|
]
|
|
3064
3143
|
},
|
|
3144
|
+
{
|
|
3145
|
+
"name": "orientation",
|
|
3146
|
+
"description": "`orientation` {string} - Set the visual orientation of this tab, this changes the look and placement of the active indication.\n\nProperty: orientation\n\nDefault: horizontal",
|
|
3147
|
+
"values": [
|
|
3148
|
+
{
|
|
3149
|
+
"name": "vertical"
|
|
3150
|
+
},
|
|
3151
|
+
{
|
|
3152
|
+
"name": "horizontal"
|
|
3153
|
+
}
|
|
3154
|
+
]
|
|
3155
|
+
},
|
|
3065
3156
|
{
|
|
3066
3157
|
"name": "active",
|
|
3067
3158
|
"description": "`active` {boolean} - Set this boolean to true for then the related composition is sorted.\n\nProperty: active\n\nDefault: false",
|
|
@@ -3075,7 +3166,7 @@
|
|
|
3075
3166
|
},
|
|
3076
3167
|
{
|
|
3077
3168
|
"name": "uui-tab",
|
|
3078
|
-
"description": "A single tab. Should be put into `<uui-tab-group>`,\n\nSlots:\n\n * ` ` {} - for label\n\n * `icon` {} - for icon\n\n * `extra` {} - for extra\n\nAttributes:\n\n * `disabled` {boolean} - Reflects the disabled state of the element. True if tab is disabled. Change this to switch the state programmatically.\n\n * `href` {string} - Set an href, this will turns the inner button into a anchor tag.\n\n * `target` {string} - Set an anchor tag target, only used when using href.\n\n * `active` {boolean} - Set this boolean to true for then the related composition is sorted.\n\n * `label` {string} - Label to be used for aria-label and potentially as visual label for some components\n\nProperties:\n\n * `styles` {`CSSResult[]`} - \n\n * `disabled` {boolean} - Reflects the disabled state of the element. True if tab is disabled. Change this to switch the state programmatically.\n\n * `href` {string} - Set an href, this will turns the inner button into a anchor tag.\n\n * `target` {string} - Set an anchor tag target, only used when using href.\n\n * `active` {boolean} - Set this boolean to true for then the related composition is sorted.\n\n * `label` {string} - Label to be used for aria-label and potentially as visual label for some components\n\n * `_labelSlotHasContent` {`boolean`} - ",
|
|
3169
|
+
"description": "A single tab. Should be put into `<uui-tab-group>`,\n\nSlots:\n\n * ` ` {} - for label\n\n * `icon` {} - for icon\n\n * `extra` {} - for extra\n\nAttributes:\n\n * `disabled` {boolean} - Reflects the disabled state of the element. True if tab is disabled. Change this to switch the state programmatically.\n\n * `href` {string} - Set an href, this will turns the inner button into a anchor tag.\n\n * `target` {string} - Set an anchor tag target, only used when using href.\n\n * `orientation` {string} - Set the visual orientation of this tab, this changes the look and placement of the active indication.\n\n * `active` {boolean} - Set this boolean to true for then the related composition is sorted.\n\n * `label` {string} - Label to be used for aria-label and potentially as visual label for some components\n\nProperties:\n\n * `styles` {`CSSResult[]`} - \n\n * `disabled` {boolean} - Reflects the disabled state of the element. True if tab is disabled. Change this to switch the state programmatically.\n\n * `href` {string} - Set an href, this will turns the inner button into a anchor tag.\n\n * `target` {string} - Set an anchor tag target, only used when using href.\n\n * `orientation` {string} - Set the visual orientation of this tab, this changes the look and placement of the active indication.\n\n * `active` {boolean} - Set this boolean to true for then the related composition is sorted.\n\n * `label` {string} - Label to be used for aria-label and potentially as visual label for some components\n\n * `_labelSlotHasContent` {`boolean`} - ",
|
|
3079
3170
|
"attributes": [
|
|
3080
3171
|
{
|
|
3081
3172
|
"name": "disabled",
|
|
@@ -3105,6 +3196,18 @@
|
|
|
3105
3196
|
}
|
|
3106
3197
|
]
|
|
3107
3198
|
},
|
|
3199
|
+
{
|
|
3200
|
+
"name": "orientation",
|
|
3201
|
+
"description": "`orientation` {string} - Set the visual orientation of this tab, this changes the look and placement of the active indication.\n\nProperty: orientation\n\nDefault: horizontal",
|
|
3202
|
+
"values": [
|
|
3203
|
+
{
|
|
3204
|
+
"name": "vertical"
|
|
3205
|
+
},
|
|
3206
|
+
{
|
|
3207
|
+
"name": "horizontal"
|
|
3208
|
+
}
|
|
3209
|
+
]
|
|
3210
|
+
},
|
|
3108
3211
|
{
|
|
3109
3212
|
"name": "active",
|
|
3110
3213
|
"description": "`active` {boolean} - Set this boolean to true for then the related composition is sorted.\n\nProperty: active\n\nDefault: false",
|
|
@@ -3376,16 +3479,16 @@
|
|
|
3376
3479
|
"description": "`label-position` {'left' | 'right' | 'top' | 'bottom'} - Specifies the label position of the checkbox or the toggle\n\nProperty: labelPosition\n\nDefault: right",
|
|
3377
3480
|
"values": [
|
|
3378
3481
|
{
|
|
3379
|
-
"name": "
|
|
3482
|
+
"name": "top"
|
|
3380
3483
|
},
|
|
3381
3484
|
{
|
|
3382
|
-
"name": "
|
|
3485
|
+
"name": "bottom"
|
|
3383
3486
|
},
|
|
3384
3487
|
{
|
|
3385
|
-
"name": "
|
|
3488
|
+
"name": "right"
|
|
3386
3489
|
},
|
|
3387
3490
|
{
|
|
3388
|
-
"name": "
|
|
3491
|
+
"name": "left"
|
|
3389
3492
|
}
|
|
3390
3493
|
]
|
|
3391
3494
|
},
|