@umbraco-ui/uui 1.2.0-rc.2 → 1.2.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 +188 -82
- package/dist/uui.min.js +402 -34
- package/dist/uui.min.js.map +1 -1
- package/package.json +81 -81
- package/vscode-html-custom-data.json +85 -29
|
@@ -153,7 +153,7 @@
|
|
|
153
153
|
},
|
|
154
154
|
{
|
|
155
155
|
"name": "uui-button",
|
|
156
|
-
"description": "Events:\n\n * `click` - fires when the element is clicked\n\nSlots:\n\n * `
|
|
156
|
+
"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`} - ",
|
|
157
157
|
"attributes": [
|
|
158
158
|
{
|
|
159
159
|
"name": "type",
|
|
@@ -506,7 +506,7 @@
|
|
|
506
506
|
},
|
|
507
507
|
{
|
|
508
508
|
"name": "uui-checkbox",
|
|
509
|
-
"description": "Umbraco checkbox, toggles between checked and uncheck\n\nEvents:\n\n * `change` - fires when the element is begin checked by a user action\n\
|
|
509
|
+
"description": "Umbraco checkbox, toggles between checked and uncheck\n\nEvents:\n\n * `change` - fires when the element is begin checked by a user action\n\nAttributes:\n\n * `label-position` {'left' | 'right' | 'top' | 'bottom'} - Specifies the label position of the checkbox or the toggle\n\n * `checked` {boolean} - Reflects the state of the element.\nTrue if checkbox or toggle is checked. Change this to switch the state programmatically.\n\n * `disabled` {boolean} - Disables the input.\n\n * `name` {string} - This is a name property of the component.\n\n * `value` {string} - intentional overwrite of FormControlMixins value getter and setter method.\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 * `labelPosition` {'left' | 'right' | 'top' | 'bottom'} - Specifies the label position of the checkbox or the toggle\n\n * `_checked` {`boolean`} - \n\n * `checked` {boolean} - Reflects the state of the element.\nTrue if checkbox or toggle is checked. Change this to switch the state programmatically.\n\n * `disabled` {boolean} - Disables the input.\n\n * `_input` {`HTMLInputElement`} - \n\n * `inputRole` {`\"checkbox\" | \"switch\"`} - \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. It may require a polyfill, check support here https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/attachInternals. Read 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} - intentional overwrite of FormControlMixins value getter and setter method.\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`} - ",
|
|
510
510
|
"attributes": [
|
|
511
511
|
{
|
|
512
512
|
"name": "label-position",
|
|
@@ -614,7 +614,7 @@
|
|
|
614
614
|
},
|
|
615
615
|
{
|
|
616
616
|
"name": "uui-color-picker",
|
|
617
|
-
"description": "Events:\n\n * `change` - Fired when the color changes\n\
|
|
617
|
+
"description": "Events:\n\n * `change` - Fired when the color changes\n\nAttributes:\n\n * `value` {string} - The current color.\n\n * `format` {UUIColorPickerFormat} - The format to use for the display value. If opacity is enabled, these will translate to HEXA, RGBA, and HSLA\nrespectively. The color picker will always accept user input in any format (including CSS color names) and convert\nit to the desired format.\n\n * `name` {string} - The input's name attribute.\n\n * `size` {UUIColorPickerSize} - Determines the size of the color picker's trigger. This has no effect on inline color pickers.\n\n * `no-format-toggle` {boolean} - Removes the format toggle.\n\n * `inline` {boolean} - Renders the color picker inline rather than inside a dropdown.\n\n * `disabled` {boolean} - Disables the color picker.\n\n * `opacity` {boolean} - Whether to show the opacity slider.\n\n * `uppercase` {boolean} - By default, the value will be set in lowercase. Set this to true to set it in uppercase instead.\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 * `_input` - \n\n * `_previewButton` {`HTMLButtonElement`} - \n\n * `_swatches` - \n\n * `inputValue` {`string`} - \n\n * `hue` {`number`} - \n\n * `saturation` {`number`} - \n\n * `lightness` {`number`} - \n\n * `alpha` {`number`} - \n\n * `_colord` - \n\n * `value` {string} - The current color.\n\n * `format` {UUIColorPickerFormat} - The format to use for the display value. If opacity is enabled, these will translate to HEXA, RGBA, and HSLA\nrespectively. The color picker will always accept user input in any format (including CSS color names) and convert\nit to the desired format.\n\n * `name` {string} - The input's name attribute.\n\n * `size` {UUIColorPickerSize} - Determines the size of the color picker's trigger. This has no effect on inline color pickers.\n\n * `noFormatToggle` {boolean} - Removes the format toggle.\n\n * `inline` {boolean} - Renders the color picker inline rather than inside a dropdown.\n\n * `disabled` {boolean} - Disables the color picker.\n\n * `opacity` {boolean} - Whether to show the opacity slider.\n\n * `uppercase` {boolean} - By default, the value will be set in lowercase. Set this to true to set it in uppercase instead.\n\n * `swatches` {`string[]`} - An array of predefined color swatches to display. Can include any format the color picker can parse, including\nHEX(A), RGB(A), HSL(A), and CSS color names.\n\n * `label` {string} - Label to be used for aria-label and potentially as visual label for some components\n\n * `_labelSlotHasContent` {`boolean`} - ",
|
|
618
618
|
"attributes": [
|
|
619
619
|
{
|
|
620
620
|
"name": "value",
|
|
@@ -691,7 +691,7 @@
|
|
|
691
691
|
},
|
|
692
692
|
{
|
|
693
693
|
"name": "uui-color-slider",
|
|
694
|
-
"description": "Events:\n\n * `change` - Fires when the value of the slider changes.\n\
|
|
694
|
+
"description": "Events:\n\n * `change` - Fires when the value of the slider changes.\n\nAttributes:\n\n * `type` {UUIColorSliderType} - The type of the slider.\n\n * `color` {string} - The color value.\n\n * `min` {number} - This is a minimum value of the slider.\n\n * `max` {number} - This is a maximum value of the slider.\n\n * `precision` {number} - The minimum increment value allowed by the slider.\n\n * `vertical` {boolean} - Draws the slider in a vertical orientation.\n\n * `value` {number} - The current value of the slider.\n\n * `disabled` {boolean} - Disables the color slider.\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` {UUIColorSliderType} - The type of the slider.\n\n * `color` {string} - The color value.\n\n * `min` {number} - This is a minimum value of the slider.\n\n * `max` {number} - This is a maximum value of the slider.\n\n * `precision` {number} - The minimum increment value allowed by the slider.\n\n * `vertical` {boolean} - Draws the slider in a vertical orientation.\n\n * `value` {number} - The current value of the slider.\n\n * `disabled` {boolean} - Disables the color slider.\n\n * `container` {`HTMLElement`} - \n\n * `handle` {`HTMLElement`} - \n\n * `ccsPropCurrentValue` {`number`} - \n\n * `label` {string} - Label to be used for aria-label and potentially as visual label for some components\n\n * `_labelSlotHasContent` {`boolean`} - ",
|
|
695
695
|
"attributes": [
|
|
696
696
|
{
|
|
697
697
|
"name": "type",
|
|
@@ -747,7 +747,7 @@
|
|
|
747
747
|
},
|
|
748
748
|
{
|
|
749
749
|
"name": "uui-color-swatch",
|
|
750
|
-
"description": "Color swatch, can have label and be selectable. Depends on colord library and exposes it's utility functions under color property.\n\nEvents:\n\n * `selected` - fires when the media card is selected\n\n * `unselected` - fires when the media card is unselected\n\nSlots:\n\n * `label` {} - Default slot for the label.\n\
|
|
750
|
+
"description": "Color swatch, can have label and be selectable. Depends on colord library and exposes it's utility functions under color property.\n\nEvents:\n\n * `selected` - fires when the media card is selected\n\n * `unselected` - fires when the media card is unselected\n\nSlots:\n\n * `label` {} - Default slot for the label.\n\nAttributes:\n\n * `value` { string } - Value of the swatch. Should be a valid hex, hexa, rgb, rgba, hsl or hsla string. Should fulfill this [css spec](https://www.w3.org/TR/css-color-4/#color-type). If not provided element will look at its text content.\n\n * `disabled` { boolean } - Determines if the options is disabled. If true the option can't be selected\n\n * `show-label` {`boolean`} - When true shows element label below the color checkbox\n\n * `label` {string} - Label to be used for aria-label and potentially as visual label for some components\n\n * `selectable` {`boolean`} - Enable the ability to select this element.\n\n * `selected` {`boolean`} - Attribute applied when the element is selected.\n\n * `active` {boolean} - Set this boolean to true for then the related composition is sorted.\n\nProperties:\n\n * `styles` {`CSSResult[]`} - \n\n * `_value` {`string | undefined`} - \n\n * `value` { string } - Value of the swatch. Should be a valid hex, hexa, rgb, rgba, hsl or hsla string. Should fulfill this [css spec](https://www.w3.org/TR/css-color-4/#color-type). If not provided element will look at its text content.\n\n * `disabled` { boolean } - Determines if the options is disabled. If true the option can't be selected\n\n * `showLabel` {`boolean`} - When true shows element label below the color checkbox\n\n * `color` {(Colord | null)} - Colord object instance based on the value provided to the element. If the value is not a valid color, it falls back to black (like Amy Winehouse). For more information about Colord, see [Colord](https://omgovich.github.io/colord/)\n\n * `_color` - \n\n * `isLight` {`boolean`} - Returns true if the color brightness is >= 0.5\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 * `_selectable` {`boolean`} - \n\n * `selectable` {`boolean`} - Enable the ability to select this element.\n\n * `unselectable` {`boolean`} - \n\n * `selected` {`boolean`} - Attribute applied when the element is selected.\n\n * `selectableTarget` {`EventTarget`} - \n\n * `active` {boolean} - Set this boolean to true for then the related composition is sorted.",
|
|
751
751
|
"attributes": [
|
|
752
752
|
{
|
|
753
753
|
"name": "value",
|
|
@@ -1121,31 +1121,46 @@
|
|
|
1121
1121
|
},
|
|
1122
1122
|
{
|
|
1123
1123
|
"name": "uui-input-lock",
|
|
1124
|
-
"description": "Events:\n\n * `change` {} - on change\n\n * `input` {} - on input\n\n * `keyup` {} - on keyup\n\nSlots:\n\n * `prepend` {} - for components to render to the left of the input.\n\n * `append` {} - for components to render to the right of the input.\n\n * `
|
|
1124
|
+
"description": "Events:\n\n * `change` {} - on change\n\n * `input` {} - on input\n\n * `keyup` {} - on keyup\n\nSlots:\n\n * `prepend` {} - for components to render to the left of the input.\n\n * `append` {} - for components to render to the right of the input.\n\nAttributes:\n\n * `locked` {boolean} - Determine the inputs locked state.\n\n * `min` {number | string} - Sets the min value of the input.\nExamples: the first date the user may pick in date and datetime-local, or the min numeric value the user can pick in a number input.\n\n * `minlength` {number} - Sets the minimum length of the value of the input.\n\n * `minlength-message` {boolean} - Minlength validation message.\n\n * `max` {number | string} - Sets the max value of the input.\nExamples: the last date the user may pick in date and datetime-local, or the max numeric value the user can pick in a number input.\n\n * `maxlength` {number} - Sets the maximum length of the value of the input.\n\n * `maxlength-message` {boolean} - Maxlength validation message.\n\n * `step` {number} - Specifies the interval between legal numbers of the input\n\n * `disabled` {boolean} - Disables the input.\n\n * `readonly` {boolean} - Sets the input to readonly mode, meaning value cannot be changed but still able to read and select its content.\n\n * `placeholder` {string} - Defines the input placeholder.\n\n * `autocomplete` {string} - Defines the input autocomplete.\n\n * `type` {'text' | 'tel'| 'url'| 'email'| 'password'| 'date'| 'month'| 'week'| 'time'| 'datetime-local'| 'number'| 'color'} - This property specifies the type of input that will be rendered.\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 * `locked` {boolean} - Determine the inputs locked state.\n\n * `styles` {`CSSResult[]`} - \n\n * `min` {number | string} - Sets the min value of the input.\nExamples: the first date the user may pick in date and datetime-local, or the min numeric value the user can pick in a number input.\n\n * `minlength` {number} - Sets the minimum length of the value of the input.\n\n * `minlengthMessage` {boolean} - Minlength validation message.\n\n * `max` {number | string} - Sets the max value of the input.\nExamples: the last date the user may pick in date and datetime-local, or the max numeric value the user can pick in a number input.\n\n * `maxlength` {number} - Sets the maximum length of the value of the input.\n\n * `maxlengthMessage` {boolean} - Maxlength validation message.\n\n * `step` {number} - Specifies the interval between legal numbers of the input\n\n * `disabled` {boolean} - Disables the input.\n\n * `readonly` {boolean} - Sets the input to readonly mode, meaning value cannot be changed but still able to read and select its content.\n\n * `placeholder` {string} - Defines the input placeholder.\n\n * `autocomplete` {string} - Defines the input autocomplete.\n\n * `type` {'text' | 'tel'| 'url'| 'email'| 'password'| 'date'| 'month'| 'week'| 'time'| 'datetime-local'| 'number'| 'color'} - This property specifies the type of input that will be rendered.\n\n * `_input` {`HTMLInputElement`} - \n\n * `_type` {`InputType`} - \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. It may require a polyfill, check support here https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/attachInternals. Read 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`} - ",
|
|
1125
1125
|
"attributes": [
|
|
1126
1126
|
{
|
|
1127
1127
|
"name": "locked",
|
|
1128
1128
|
"description": "`locked` {boolean} - Determine the inputs locked state.\n\nProperty: locked\n\nDefault: true",
|
|
1129
1129
|
"valueSet": "v"
|
|
1130
1130
|
},
|
|
1131
|
+
{
|
|
1132
|
+
"name": "min",
|
|
1133
|
+
"description": "`min` {number | string} - Sets the min value of the input.\nExamples: the first date the user may pick in date and datetime-local, or the min numeric value the user can pick in a number input.\n\nProperty: min\n\nDefault: undefined",
|
|
1134
|
+
"values": []
|
|
1135
|
+
},
|
|
1131
1136
|
{
|
|
1132
1137
|
"name": "minlength",
|
|
1133
|
-
"description": "`minlength` {number} -
|
|
1138
|
+
"description": "`minlength` {number} - Sets the minimum length of the value of the input.\n\nProperty: minlength\n\nDefault: undefined",
|
|
1134
1139
|
"values": []
|
|
1135
1140
|
},
|
|
1136
1141
|
{
|
|
1137
1142
|
"name": "minlength-message",
|
|
1138
1143
|
"description": "`minlength-message` {boolean} - Minlength validation message.\n\nProperty: minlengthMessage"
|
|
1139
1144
|
},
|
|
1145
|
+
{
|
|
1146
|
+
"name": "max",
|
|
1147
|
+
"description": "`max` {number | string} - Sets the max value of the input.\nExamples: the last date the user may pick in date and datetime-local, or the max numeric value the user can pick in a number input.\n\nProperty: max\n\nDefault: undefined",
|
|
1148
|
+
"values": []
|
|
1149
|
+
},
|
|
1140
1150
|
{
|
|
1141
1151
|
"name": "maxlength",
|
|
1142
|
-
"description": "`maxlength` {number} -
|
|
1152
|
+
"description": "`maxlength` {number} - Sets the maximum length of the value of the input.\n\nProperty: maxlength\n\nDefault: undefined",
|
|
1143
1153
|
"values": []
|
|
1144
1154
|
},
|
|
1145
1155
|
{
|
|
1146
1156
|
"name": "maxlength-message",
|
|
1147
1157
|
"description": "`maxlength-message` {boolean} - Maxlength validation message.\n\nProperty: maxlengthMessage"
|
|
1148
1158
|
},
|
|
1159
|
+
{
|
|
1160
|
+
"name": "step",
|
|
1161
|
+
"description": "`step` {number} - Specifies the interval between legal numbers of the input\n\nProperty: step\n\nDefault: undefined",
|
|
1162
|
+
"values": []
|
|
1163
|
+
},
|
|
1149
1164
|
{
|
|
1150
1165
|
"name": "disabled",
|
|
1151
1166
|
"description": "`disabled` {boolean} - Disables the input.\n\nProperty: disabled\n\nDefault: false",
|
|
@@ -1259,26 +1274,41 @@
|
|
|
1259
1274
|
},
|
|
1260
1275
|
{
|
|
1261
1276
|
"name": "uui-input-password",
|
|
1262
|
-
"description": "Events:\n\n * `change` {} - on change\n\n * `input` {} - on input\n\n * `keyup` {} - on keyup\n\nSlots:\n\n * `prepend` {} - for components to render to the left of the input.\n\n * `append` {} - for components to render to the right of the input.\n\n * `
|
|
1277
|
+
"description": "Events:\n\n * `change` {} - on change\n\n * `input` {} - on input\n\n * `keyup` {} - on keyup\n\nSlots:\n\n * `prepend` {} - for components to render to the left of the input.\n\n * `append` {} - for components to render to the right of the input.\n\nAttributes:\n\n * `min` {number | string} - Sets the min value of the input.\nExamples: the first date the user may pick in date and datetime-local, or the min numeric value the user can pick in a number input.\n\n * `minlength` {number} - Sets the minimum length of the value of the input.\n\n * `minlength-message` {boolean} - Minlength validation message.\n\n * `max` {number | string} - Sets the max value of the input.\nExamples: the last date the user may pick in date and datetime-local, or the max numeric value the user can pick in a number input.\n\n * `maxlength` {number} - Sets the maximum length of the value of the input.\n\n * `maxlength-message` {boolean} - Maxlength validation message.\n\n * `step` {number} - Specifies the interval between legal numbers of the input\n\n * `disabled` {boolean} - Disables the input.\n\n * `readonly` {boolean} - Sets the input to readonly mode, meaning value cannot be changed but still able to read and select its content.\n\n * `placeholder` {string} - Defines the input placeholder.\n\n * `autocomplete` {string} - Defines the input autocomplete.\n\n * `type` {'text' | 'tel'| 'url'| 'email'| 'password'| 'date'| 'month'| 'week'| 'time'| 'datetime-local'| 'number'| 'color'} - This property specifies the type of input that will be rendered.\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 * `passwordType` {`InputType`} - \n\n * `styles` {`CSSResult[]`} - \n\n * `min` {number | string} - Sets the min value of the input.\nExamples: the first date the user may pick in date and datetime-local, or the min numeric value the user can pick in a number input.\n\n * `minlength` {number} - Sets the minimum length of the value of the input.\n\n * `minlengthMessage` {boolean} - Minlength validation message.\n\n * `max` {number | string} - Sets the max value of the input.\nExamples: the last date the user may pick in date and datetime-local, or the max numeric value the user can pick in a number input.\n\n * `maxlength` {number} - Sets the maximum length of the value of the input.\n\n * `maxlengthMessage` {boolean} - Maxlength validation message.\n\n * `step` {number} - Specifies the interval between legal numbers of the input\n\n * `disabled` {boolean} - Disables the input.\n\n * `readonly` {boolean} - Sets the input to readonly mode, meaning value cannot be changed but still able to read and select its content.\n\n * `placeholder` {string} - Defines the input placeholder.\n\n * `autocomplete` {string} - Defines the input autocomplete.\n\n * `type` {'text' | 'tel'| 'url'| 'email'| 'password'| 'date'| 'month'| 'week'| 'time'| 'datetime-local'| 'number'| 'color'} - This property specifies the type of input that will be rendered.\n\n * `_input` {`HTMLInputElement`} - \n\n * `_type` {`InputType`} - \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. It may require a polyfill, check support here https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/attachInternals. Read 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`} - ",
|
|
1263
1278
|
"attributes": [
|
|
1279
|
+
{
|
|
1280
|
+
"name": "min",
|
|
1281
|
+
"description": "`min` {number | string} - Sets the min value of the input.\nExamples: the first date the user may pick in date and datetime-local, or the min numeric value the user can pick in a number input.\n\nProperty: min\n\nDefault: undefined",
|
|
1282
|
+
"values": []
|
|
1283
|
+
},
|
|
1264
1284
|
{
|
|
1265
1285
|
"name": "minlength",
|
|
1266
|
-
"description": "`minlength` {number} -
|
|
1286
|
+
"description": "`minlength` {number} - Sets the minimum length of the value of the input.\n\nProperty: minlength\n\nDefault: undefined",
|
|
1267
1287
|
"values": []
|
|
1268
1288
|
},
|
|
1269
1289
|
{
|
|
1270
1290
|
"name": "minlength-message",
|
|
1271
1291
|
"description": "`minlength-message` {boolean} - Minlength validation message.\n\nProperty: minlengthMessage"
|
|
1272
1292
|
},
|
|
1293
|
+
{
|
|
1294
|
+
"name": "max",
|
|
1295
|
+
"description": "`max` {number | string} - Sets the max value of the input.\nExamples: the last date the user may pick in date and datetime-local, or the max numeric value the user can pick in a number input.\n\nProperty: max\n\nDefault: undefined",
|
|
1296
|
+
"values": []
|
|
1297
|
+
},
|
|
1273
1298
|
{
|
|
1274
1299
|
"name": "maxlength",
|
|
1275
|
-
"description": "`maxlength` {number} -
|
|
1300
|
+
"description": "`maxlength` {number} - Sets the maximum length of the value of the input.\n\nProperty: maxlength\n\nDefault: undefined",
|
|
1276
1301
|
"values": []
|
|
1277
1302
|
},
|
|
1278
1303
|
{
|
|
1279
1304
|
"name": "maxlength-message",
|
|
1280
1305
|
"description": "`maxlength-message` {boolean} - Maxlength validation message.\n\nProperty: maxlengthMessage"
|
|
1281
1306
|
},
|
|
1307
|
+
{
|
|
1308
|
+
"name": "step",
|
|
1309
|
+
"description": "`step` {number} - Specifies the interval between legal numbers of the input\n\nProperty: step\n\nDefault: undefined",
|
|
1310
|
+
"values": []
|
|
1311
|
+
},
|
|
1282
1312
|
{
|
|
1283
1313
|
"name": "disabled",
|
|
1284
1314
|
"description": "`disabled` {boolean} - Disables the input.\n\nProperty: disabled\n\nDefault: false",
|
|
@@ -1392,26 +1422,41 @@
|
|
|
1392
1422
|
},
|
|
1393
1423
|
{
|
|
1394
1424
|
"name": "uui-input",
|
|
1395
|
-
"description": "Custom element wrapping the native input element.This is a formAssociated element, meaning it can participate in a native HTMLForm. A name:value pair will be submitted.\n\nEvents:\n\n * `change` {} - on change\n\n * `input` {} - on input\n\n * `keyup` {} - on keyup\n\nSlots:\n\n * `prepend` {} - for components to render to the left of the input.\n\n * `append` {} - for components to render to the right of the input.\n\n * `
|
|
1425
|
+
"description": "Custom element wrapping the native input element.This is a formAssociated element, meaning it can participate in a native HTMLForm. A name:value pair will be submitted.\n\nEvents:\n\n * `change` {} - on change\n\n * `input` {} - on input\n\n * `keyup` {} - on keyup\n\nSlots:\n\n * `prepend` {} - for components to render to the left of the input.\n\n * `append` {} - for components to render to the right of the input.\n\nAttributes:\n\n * `min` {number | string} - Sets the min value of the input.\nExamples: the first date the user may pick in date and datetime-local, or the min numeric value the user can pick in a number input.\n\n * `minlength` {number} - Sets the minimum length of the value of the input.\n\n * `minlength-message` {boolean} - Minlength validation message.\n\n * `max` {number | string} - Sets the max value of the input.\nExamples: the last date the user may pick in date and datetime-local, or the max numeric value the user can pick in a number input.\n\n * `maxlength` {number} - Sets the maximum length of the value of the input.\n\n * `maxlength-message` {boolean} - Maxlength validation message.\n\n * `step` {number} - Specifies the interval between legal numbers of the input\n\n * `disabled` {boolean} - Disables the input.\n\n * `readonly` {boolean} - Sets the input to readonly mode, meaning value cannot be changed but still able to read and select its content.\n\n * `placeholder` {string} - Defines the input placeholder.\n\n * `autocomplete` {string} - Defines the input autocomplete.\n\n * `type` {'text' | 'tel'| 'url'| 'email'| 'password'| 'date'| 'month'| 'week'| 'time'| 'datetime-local'| 'number'| 'color'} - This property specifies the type of input that will be rendered.\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 * `min` {number | string} - Sets the min value of the input.\nExamples: the first date the user may pick in date and datetime-local, or the min numeric value the user can pick in a number input.\n\n * `minlength` {number} - Sets the minimum length of the value of the input.\n\n * `minlengthMessage` {boolean} - Minlength validation message.\n\n * `max` {number | string} - Sets the max value of the input.\nExamples: the last date the user may pick in date and datetime-local, or the max numeric value the user can pick in a number input.\n\n * `maxlength` {number} - Sets the maximum length of the value of the input.\n\n * `maxlengthMessage` {boolean} - Maxlength validation message.\n\n * `step` {number} - Specifies the interval between legal numbers of the input\n\n * `disabled` {boolean} - Disables the input.\n\n * `readonly` {boolean} - Sets the input to readonly mode, meaning value cannot be changed but still able to read and select its content.\n\n * `placeholder` {string} - Defines the input placeholder.\n\n * `autocomplete` {string} - Defines the input autocomplete.\n\n * `type` {'text' | 'tel'| 'url'| 'email'| 'password'| 'date'| 'month'| 'week'| 'time'| 'datetime-local'| 'number'| 'color'} - This property specifies the type of input that will be rendered.\n\n * `_input` {`HTMLInputElement`} - \n\n * `_type` {`InputType`} - \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. It may require a polyfill, check support here https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/attachInternals. Read 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`} - ",
|
|
1396
1426
|
"attributes": [
|
|
1427
|
+
{
|
|
1428
|
+
"name": "min",
|
|
1429
|
+
"description": "`min` {number | string} - Sets the min value of the input.\nExamples: the first date the user may pick in date and datetime-local, or the min numeric value the user can pick in a number input.\n\nProperty: min\n\nDefault: undefined",
|
|
1430
|
+
"values": []
|
|
1431
|
+
},
|
|
1397
1432
|
{
|
|
1398
1433
|
"name": "minlength",
|
|
1399
|
-
"description": "`minlength` {number} -
|
|
1434
|
+
"description": "`minlength` {number} - Sets the minimum length of the value of the input.\n\nProperty: minlength\n\nDefault: undefined",
|
|
1400
1435
|
"values": []
|
|
1401
1436
|
},
|
|
1402
1437
|
{
|
|
1403
1438
|
"name": "minlength-message",
|
|
1404
1439
|
"description": "`minlength-message` {boolean} - Minlength validation message.\n\nProperty: minlengthMessage"
|
|
1405
1440
|
},
|
|
1441
|
+
{
|
|
1442
|
+
"name": "max",
|
|
1443
|
+
"description": "`max` {number | string} - Sets the max value of the input.\nExamples: the last date the user may pick in date and datetime-local, or the max numeric value the user can pick in a number input.\n\nProperty: max\n\nDefault: undefined",
|
|
1444
|
+
"values": []
|
|
1445
|
+
},
|
|
1406
1446
|
{
|
|
1407
1447
|
"name": "maxlength",
|
|
1408
|
-
"description": "`maxlength` {number} -
|
|
1448
|
+
"description": "`maxlength` {number} - Sets the maximum length of the value of the input.\n\nProperty: maxlength\n\nDefault: undefined",
|
|
1409
1449
|
"values": []
|
|
1410
1450
|
},
|
|
1411
1451
|
{
|
|
1412
1452
|
"name": "maxlength-message",
|
|
1413
1453
|
"description": "`maxlength-message` {boolean} - Maxlength validation message.\n\nProperty: maxlengthMessage"
|
|
1414
1454
|
},
|
|
1455
|
+
{
|
|
1456
|
+
"name": "step",
|
|
1457
|
+
"description": "`step` {number} - Specifies the interval between legal numbers of the input\n\nProperty: step\n\nDefault: undefined",
|
|
1458
|
+
"values": []
|
|
1459
|
+
},
|
|
1415
1460
|
{
|
|
1416
1461
|
"name": "disabled",
|
|
1417
1462
|
"description": "`disabled` {boolean} - Disables the input.\n\nProperty: disabled\n\nDefault: false",
|
|
@@ -1953,7 +1998,7 @@
|
|
|
1953
1998
|
},
|
|
1954
1999
|
{
|
|
1955
2000
|
"name": "uui-range-slider",
|
|
1956
|
-
"description": "
|
|
2001
|
+
"description": "Events:\n\n * `input` {} - on input\n\n * `change` {} - on change\n\nAttributes:\n\n * `disabled` {boolean} - Disables the input.\n\n * `label` {string} - Label to be used for aria-label and eventually as visual label. Adds \" low value\" and \" high value\" endings for the two values.\n\n * `step` {number} - This reflects the behavior of a native input step attribute.\n\n * `hide-step-values` {boolean} - Hides the numbers representing the value of each steps. Dots will still be visible\n\n * `min` {number} - Sets the minimum allowed value.\n\n * `max` {number} - Sets the maximum allowed value.\n\n * `min-gap` {number} - Minimum value gap between the the two picked values. Cannot be lower than the step value and cannot be higher than the maximum gap\n\n * `max-gap` {number} - Maximum value gap between the the two picked values. Cannot be lower than the minimum gap.\n\n * `value-low` {number} - The lower picked value.\n\n * `value-high` {number} - The higher picked value.\n\n * `name` {string} - This is a name property of the component.\n\n * `value` {string} - This is a value property of the uui-range-slider. Split the two values with comma, forexample 10,50 sets the values to 10 and 50.\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\nProperties:\n\n * `styles` {`CSSResult[]`} - \n\n * `disabled` {boolean} - Disables the input.\n\n * `label` {string} - Label to be used for aria-label and eventually as visual label. Adds \" low value\" and \" high value\" endings for the two values.\n\n * `step` {number} - This reflects the behavior of a native input step attribute.\n\n * `hideStepValues` {boolean} - Hides the numbers representing the value of each steps. Dots will still be visible\n\n * `min` {number} - Sets the minimum allowed value.\n\n * `max` {number} - Sets the maximum allowed value.\n\n * `minGap` {number} - Minimum value gap between the the two picked values. Cannot be lower than the step value and cannot be higher than the maximum gap\n\n * `maxGap` {number} - Maximum value gap between the the two picked values. Cannot be lower than the minimum gap.\n\n * `_valueLow` {`number`} - \n\n * `valueLow` {number} - The lower picked value.\n\n * `_valueHigh` {`number`} - \n\n * `valueHigh` {number} - The higher picked value.\n\n * `_trackWidth` {`number`} - \n\n * `_currentInputFocus` {`HTMLInputElement | undefined`} - \n\n * `_currentThumbFocus` {`\"high\" | \"low\"`} - \n\n * `_grabbingBoth` {`boolean | undefined`} - \n\n * `_startPos` {`number`} - \n\n * `_startLow` {`number`} - \n\n * `_startHigh` {`number`} - \n\n * `_inputLow` {`HTMLInputElement`} - \n\n * `_inputHigh` {`HTMLInputElement`} - \n\n * `_outerTrack` {`HTMLElement`} - \n\n * `_innerTrack` {`HTMLElement`} - \n\n * `_thumbLow` {`HTMLElement`} - \n\n * `_thumbHigh` {`HTMLElement`} - \n\n * `_innerColor` {`HTMLElement`} - \n\n * `_bothThumbsTarget` {`HTMLElement`} - \n\n * `_onMouseDown` - Mouse events\n\n * `_onMouseMove` - \n\n * `_onMouseUp` - \n\n * `_onTouchStart` - Touch / mobile events\n\n * `_onTouchMove` - \n\n * `_onTouchEnd` - \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} - This is a value property of the uui-range-slider. Split the two values with comma, forexample 10,50 sets the values to 10 and 50.\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` - ",
|
|
1957
2002
|
"attributes": [
|
|
1958
2003
|
{
|
|
1959
2004
|
"name": "disabled",
|
|
@@ -1981,17 +2026,10 @@
|
|
|
1981
2026
|
"name": "max",
|
|
1982
2027
|
"description": "`max` {number} - Sets the maximum allowed value.\n\nProperty: max\n\nDefault: 100"
|
|
1983
2028
|
},
|
|
1984
|
-
{
|
|
1985
|
-
"name": "value-low",
|
|
1986
|
-
"description": "`value-low` {number} - The lower picked value.\n\nProperty: valueLow\n\nDefault: 0"
|
|
1987
|
-
},
|
|
1988
|
-
{
|
|
1989
|
-
"name": "value-high",
|
|
1990
|
-
"description": "`value-high` {number} - The higher picked value.\n\nProperty: valueHigh\n\nDefault: 100"
|
|
1991
|
-
},
|
|
1992
2029
|
{
|
|
1993
2030
|
"name": "min-gap",
|
|
1994
|
-
"description": "`min-gap` {number} - Minimum value gap between the the two picked values. Cannot be lower than the step value and cannot be higher than the maximum gap\n\nProperty: minGap\n\nDefault:
|
|
2031
|
+
"description": "`min-gap` {number} - Minimum value gap between the the two picked values. Cannot be lower than the step value and cannot be higher than the maximum gap\n\nProperty: minGap\n\nDefault: undefined",
|
|
2032
|
+
"values": []
|
|
1995
2033
|
},
|
|
1996
2034
|
{
|
|
1997
2035
|
"name": "max-gap",
|
|
@@ -1999,8 +2037,12 @@
|
|
|
1999
2037
|
"values": []
|
|
2000
2038
|
},
|
|
2001
2039
|
{
|
|
2002
|
-
"name": "
|
|
2003
|
-
"description": "`
|
|
2040
|
+
"name": "value-low",
|
|
2041
|
+
"description": "`value-low` {number} - The lower picked value.\n\nProperty: valueLow\n\nDefault: 0"
|
|
2042
|
+
},
|
|
2043
|
+
{
|
|
2044
|
+
"name": "value-high",
|
|
2045
|
+
"description": "`value-high` {number} - The higher picked value.\n\nProperty: valueHigh\n\nDefault: 100"
|
|
2004
2046
|
},
|
|
2005
2047
|
{
|
|
2006
2048
|
"name": "name",
|
|
@@ -2033,6 +2075,14 @@
|
|
|
2033
2075
|
{
|
|
2034
2076
|
"name": "error-message",
|
|
2035
2077
|
"description": "`error-message` {`string`} - Custom error message.\n\nProperty: errorMessage\n\nDefault: This field is invalid"
|
|
2078
|
+
},
|
|
2079
|
+
{
|
|
2080
|
+
"name": "oninput",
|
|
2081
|
+
"description": "`input` {} - on input"
|
|
2082
|
+
},
|
|
2083
|
+
{
|
|
2084
|
+
"name": "onchange",
|
|
2085
|
+
"description": "`change` {} - on change"
|
|
2036
2086
|
}
|
|
2037
2087
|
]
|
|
2038
2088
|
},
|
|
@@ -2467,8 +2517,14 @@
|
|
|
2467
2517
|
},
|
|
2468
2518
|
{
|
|
2469
2519
|
"name": "uui-scroll-container",
|
|
2470
|
-
"description": "Slots:\n\n * ` ` {} - for content\n\nProperties:\n\n * `styles` {`CSSResult[]`} - ",
|
|
2471
|
-
"attributes": [
|
|
2520
|
+
"description": "Slots:\n\n * ` ` {} - for content\n\nAttributes:\n\n * `enforce-scroll` {boolean} - forces the scrollbar to appear\n\nProperties:\n\n * `styles` {`CSSResult[]`} - \n\n * `enforceScroll` {boolean} - forces the scrollbar to appear",
|
|
2521
|
+
"attributes": [
|
|
2522
|
+
{
|
|
2523
|
+
"name": "enforce-scroll",
|
|
2524
|
+
"description": "`enforce-scroll` {boolean} - forces the scrollbar to appear\n\nProperty: enforceScroll\n\nDefault: false",
|
|
2525
|
+
"valueSet": "v"
|
|
2526
|
+
}
|
|
2527
|
+
]
|
|
2472
2528
|
},
|
|
2473
2529
|
{
|
|
2474
2530
|
"name": "uui-select",
|
|
@@ -3100,7 +3156,7 @@
|
|
|
3100
3156
|
},
|
|
3101
3157
|
{
|
|
3102
3158
|
"name": "uui-toggle",
|
|
3103
|
-
"description": "Umbraco Toggle-switch, toggles between off/on. Technically a checkbox.\n\nEvents:\n\n * `change-` {} - fires when the element is begin checked by a user action\n\n * `change` {} - on change\n\
|
|
3159
|
+
"description": "Umbraco Toggle-switch, toggles between off/on. Technically a checkbox.\n\nEvents:\n\n * `change-` {} - fires when the element is begin checked by a user action\n\n * `change` {} - on change\n\nAttributes:\n\n * `label-position` {'left' | 'right' | 'top' | 'bottom'} - Specifies the label position of the checkbox or the toggle\n\n * `checked` {boolean} - Reflects the state of the element.\nTrue if checkbox or toggle is checked. Change this to switch the state programmatically.\n\n * `disabled` {boolean} - Disables the input.\n\n * `name` {string} - This is a name property of the component.\n\n * `value` {string} - intentional overwrite of FormControlMixins value getter and setter method.\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 * `labelPosition` {'left' | 'right' | 'top' | 'bottom'} - Specifies the label position of the checkbox or the toggle\n\n * `_checked` {`boolean`} - \n\n * `checked` {boolean} - Reflects the state of the element.\nTrue if checkbox or toggle is checked. Change this to switch the state programmatically.\n\n * `disabled` {boolean} - Disables the input.\n\n * `_input` {`HTMLInputElement`} - \n\n * `inputRole` {`\"checkbox\" | \"switch\"`} - \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. It may require a polyfill, check support here https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/attachInternals. Read 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} - intentional overwrite of FormControlMixins value getter and setter method.\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`} - ",
|
|
3104
3160
|
"attributes": [
|
|
3105
3161
|
{
|
|
3106
3162
|
"name": "label-position",
|