@riverty/web-components 5.8.0 → 6.1.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/CHANGELOG.md +107 -0
- package/custom-elements.json +215 -362
- package/dist/cjs/index-DJ4H_bFj.js +6 -10
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/r-accordion-panel.cjs.entry.js +1 -1
- package/dist/cjs/r-accordion-section.cjs.entry.js +1 -1
- package/dist/cjs/r-accordion-trigger.cjs.entry.js +5 -35
- package/dist/cjs/r-accordion.cjs.entry.js +3 -7
- package/dist/cjs/r-alert.cjs.entry.js +26 -11
- package/dist/cjs/r-badge.cjs.entry.js +1 -1
- package/dist/cjs/r-button.cjs.entry.js +1 -1
- package/dist/cjs/r-checkbox-group.cjs.entry.js +1 -11
- package/dist/cjs/r-checkbox.cjs.entry.js +76 -75
- package/dist/cjs/r-dialog.cjs.entry.js +3 -11
- package/dist/cjs/r-hint_2.cjs.entry.js +50 -0
- package/dist/cjs/{r-hint_3.cjs.entry.js → r-icon-button_2.cjs.entry.js} +64 -51
- package/dist/cjs/r-icon.cjs.entry.js +1 -1
- package/dist/cjs/r-input-code.cjs.entry.js +112 -17
- package/dist/cjs/r-input-date.cjs.entry.js +8 -14
- package/dist/cjs/r-input-password.cjs.entry.js +16 -8
- package/dist/cjs/r-input-phone-number.cjs.entry.js +7 -12
- package/dist/cjs/r-input.cjs.entry.js +90 -42
- package/dist/cjs/r-list-item.cjs.entry.js +20 -19
- package/dist/cjs/r-panel.cjs.entry.js +5 -5
- package/dist/cjs/r-popover-action.cjs.entry.js +1 -1
- package/dist/cjs/r-popover-content.cjs.entry.js +1 -1
- package/dist/cjs/r-popover-headline.cjs.entry.js +1 -1
- package/dist/cjs/r-popover-trigger.cjs.entry.js +1 -1
- package/dist/cjs/r-popover.cjs.entry.js +3 -3
- package/dist/cjs/r-progress-bar.cjs.entry.js +1 -1
- package/dist/cjs/r-radio-button-description.cjs.entry.js +1 -1
- package/dist/cjs/r-radio-button-leading.cjs.entry.js +1 -1
- package/dist/cjs/r-radio-button-title.cjs.entry.js +1 -1
- package/dist/cjs/r-radio-button-trailing.cjs.entry.js +1 -1
- package/dist/cjs/r-radio-button.cjs.entry.js +29 -12
- package/dist/cjs/r-radio-group.cjs.entry.js +18 -22
- package/dist/cjs/r-select-option.cjs.entry.js +1 -1
- package/dist/cjs/r-select.cjs.entry.js +6 -24
- package/dist/cjs/r-skip-link.cjs.entry.js +1 -1
- package/dist/cjs/r-stepper-item.cjs.entry.js +3 -3
- package/dist/cjs/r-stepper.cjs.entry.js +2 -2
- package/dist/cjs/r-tab-panel.cjs.entry.js +1 -1
- package/dist/cjs/r-tab.cjs.entry.js +6 -2
- package/dist/cjs/r-tabs-list.cjs.entry.js +160 -2
- package/dist/cjs/r-tabs.cjs.entry.js +34 -6
- package/dist/cjs/r-textarea.cjs.entry.js +7 -19
- package/dist/cjs/r-toast-group.cjs.entry.js +2 -2
- package/dist/cjs/r-toast.cjs.entry.js +31 -11
- package/dist/cjs/web-components.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +0 -1
- package/dist/collection/components/accordion/accordion.css +0 -2
- package/dist/collection/components/accordion/accordion.js +4 -8
- package/dist/collection/components/accordion/exports.js +1 -1
- package/dist/collection/components/accordion-panel/accordion-panel.js +1 -1
- package/dist/collection/components/accordion-section/accordion-section.js +1 -1
- package/dist/collection/components/accordion-trigger/accordion-trigger.css +0 -4
- package/dist/collection/components/accordion-trigger/accordion-trigger.js +4 -215
- package/dist/collection/components/alert/alert.css +8 -3
- package/dist/collection/components/alert/alert.js +48 -10
- package/dist/collection/components/badge/badge.js +1 -1
- package/dist/collection/components/button/button.js +1 -1
- package/dist/collection/components/checkbox/checkbox.js +80 -98
- package/dist/collection/components/checkbox-group/checkbox-group.js +1 -50
- package/dist/collection/components/dialog/dialog.css +1 -3
- package/dist/collection/components/dialog/dialog.js +2 -10
- package/dist/collection/components/hint/hint.js +2 -2
- package/dist/collection/components/icon/bundled-icons/riverty-kit.json +1 -1
- package/dist/collection/components/icon/riverty-kit.js +1 -1
- package/dist/collection/components/icon-button/icon-button.js +22 -3
- package/dist/collection/components/input/exports.js +2 -0
- package/dist/collection/components/input/input.css +3 -0
- package/dist/collection/components/input/input.js +233 -371
- package/dist/collection/components/input-code/exports.js +2 -0
- package/dist/collection/components/input-code/input-code.js +294 -26
- package/dist/collection/components/input-date/input-date.js +8 -77
- package/dist/collection/components/input-password/exports.js +1 -0
- package/dist/collection/components/input-password/input-password.css +1 -0
- package/dist/collection/components/input-password/input-password.js +195 -70
- package/dist/collection/components/input-phone-number/input-phone-number.js +7 -75
- package/dist/collection/components/label/label.js +3 -113
- package/dist/collection/components/list-item/list-item/list-item.css +53 -19
- package/dist/collection/components/list-item/list-item/list-item.js +38 -40
- package/dist/collection/components/panel/panel.css +40 -17
- package/dist/collection/components/panel/panel.js +6 -6
- package/dist/collection/components/popover/exports.js +0 -1
- package/dist/collection/components/popover/popover.css +2 -10
- package/dist/collection/components/popover/popover.js +2 -55
- package/dist/collection/components/popover-action/popover-action.js +1 -1
- package/dist/collection/components/popover-content/popover-content.js +1 -1
- package/dist/collection/components/popover-headline/popover-headline.js +1 -1
- package/dist/collection/components/popover-trigger/popover-trigger.js +1 -1
- package/dist/collection/components/progress-bar/progress-bar.js +1 -1
- package/dist/collection/components/radio-button/radio-button.js +49 -12
- package/dist/collection/components/radio-button-description/radio-button-description.js +1 -1
- package/dist/collection/components/radio-button-leading/radio-button-leading.js +1 -1
- package/dist/collection/components/radio-button-title/radio-button-title.js +1 -1
- package/dist/collection/components/radio-button-trailing/radio-button-trailing.js +1 -1
- package/dist/collection/components/radio-group/radio-group.js +38 -124
- package/dist/collection/components/select/select.js +6 -330
- package/dist/collection/components/select-option/select-option.js +1 -1
- package/dist/collection/components/skip-link/skip-link.js +1 -1
- package/dist/collection/components/stepper/stepper.css +1 -1
- package/dist/collection/components/stepper/stepper.js +1 -1
- package/dist/collection/components/stepper-item/stepper-item.css +3 -3
- package/dist/collection/components/stepper-item/stepper-item.js +2 -2
- package/dist/collection/components/tab/tab.css +29 -29
- package/dist/collection/components/tab/tab.js +5 -1
- package/dist/collection/components/tab-panel/tab-panel.js +1 -1
- package/dist/collection/components/tabs/tabs.js +34 -6
- package/dist/collection/components/tabs-list/exports.js +2 -0
- package/dist/collection/components/tabs-list/tabs-list.css +43 -2
- package/dist/collection/components/tabs-list/tabs-list.js +277 -1
- package/dist/collection/components/textarea/textarea.css +1 -1
- package/dist/collection/components/textarea/textarea.js +6 -158
- package/dist/collection/components/toast/toast.css +35 -9
- package/dist/collection/components/toast/toast.js +44 -32
- package/dist/collection/components/toast-group/toast-group.css +1 -1
- package/dist/collection/components/toast-group/toast-group.js +1 -1
- package/dist/collection/components/tooltip/tooltip.js +2 -2
- package/dist/esm/index-Da7qOBFr.js +6 -10
- package/dist/esm/loader.js +1 -1
- package/dist/esm/r-accordion-panel.entry.js +1 -1
- package/dist/esm/r-accordion-section.entry.js +1 -1
- package/dist/esm/r-accordion-trigger.entry.js +5 -35
- package/dist/esm/r-accordion.entry.js +3 -7
- package/dist/esm/r-alert.entry.js +26 -11
- package/dist/esm/r-badge.entry.js +1 -1
- package/dist/esm/r-button.entry.js +1 -1
- package/dist/esm/r-checkbox-group.entry.js +1 -11
- package/dist/esm/r-checkbox.entry.js +76 -75
- package/dist/esm/r-dialog.entry.js +3 -11
- package/dist/esm/r-hint_2.entry.js +47 -0
- package/dist/esm/{r-hint_3.entry.js → r-icon-button_2.entry.js} +65 -51
- package/dist/esm/r-icon.entry.js +1 -1
- package/dist/esm/r-input-code.entry.js +112 -17
- package/dist/esm/r-input-date.entry.js +8 -14
- package/dist/esm/r-input-password.entry.js +16 -8
- package/dist/esm/r-input-phone-number.entry.js +7 -12
- package/dist/esm/r-input.entry.js +90 -42
- package/dist/esm/r-list-item.entry.js +20 -19
- package/dist/esm/r-panel.entry.js +5 -5
- package/dist/esm/r-popover-action.entry.js +1 -1
- package/dist/esm/r-popover-content.entry.js +1 -1
- package/dist/esm/r-popover-headline.entry.js +1 -1
- package/dist/esm/r-popover-trigger.entry.js +1 -1
- package/dist/esm/r-popover.entry.js +3 -3
- package/dist/esm/r-progress-bar.entry.js +1 -1
- package/dist/esm/r-radio-button-description.entry.js +1 -1
- package/dist/esm/r-radio-button-leading.entry.js +1 -1
- package/dist/esm/r-radio-button-title.entry.js +1 -1
- package/dist/esm/r-radio-button-trailing.entry.js +1 -1
- package/dist/esm/r-radio-button.entry.js +29 -12
- package/dist/esm/r-radio-group.entry.js +18 -22
- package/dist/esm/r-select-option.entry.js +1 -1
- package/dist/esm/r-select.entry.js +6 -24
- package/dist/esm/r-skip-link.entry.js +1 -1
- package/dist/esm/r-stepper-item.entry.js +3 -3
- package/dist/esm/r-stepper.entry.js +2 -2
- package/dist/esm/r-tab-panel.entry.js +1 -1
- package/dist/esm/r-tab.entry.js +6 -2
- package/dist/esm/r-tabs-list.entry.js +161 -3
- package/dist/esm/r-tabs.entry.js +34 -6
- package/dist/esm/r-textarea.entry.js +7 -19
- package/dist/esm/r-toast-group.entry.js +2 -2
- package/dist/esm/r-toast.entry.js +31 -11
- package/dist/esm/web-components.js +1 -1
- package/dist/types/components/accordion/accordion.d.ts +1 -5
- package/dist/types/components/accordion/exports.d.ts +1 -1
- package/dist/types/components/accordion-trigger/accordion-trigger.d.ts +0 -36
- package/dist/types/components/alert/alert.d.ts +6 -1
- package/dist/types/components/checkbox/checkbox.d.ts +24 -34
- package/dist/types/components/checkbox-group/checkbox-group.d.ts +0 -11
- package/dist/types/components/dialog/dialog.d.ts +0 -2
- package/dist/types/components/icon/exports.d.ts +1 -0
- package/dist/types/components/icon/icon-data.d.ts +1 -0
- package/dist/types/components/icon/riverty-kit.d.ts +1 -0
- package/dist/types/components/icon-button/icon-button.d.ts +4 -0
- package/dist/types/components/input/exports.d.ts +4 -0
- package/dist/types/components/input/input.d.ts +47 -73
- package/dist/types/components/input-code/exports.d.ts +4 -0
- package/dist/types/components/input-code/input-code.d.ts +49 -7
- package/dist/types/components/input-date/input-date.d.ts +0 -16
- package/dist/types/components/input-password/exports.d.ts +1 -0
- package/dist/types/components/input-password/input-password.d.ts +48 -16
- package/dist/types/components/input-phone-number/input-phone-number.d.ts +0 -16
- package/dist/types/components/label/label.d.ts +0 -18
- package/dist/types/components/list-item/list-item/list-item.d.ts +5 -9
- package/dist/types/components/popover/exports.d.ts +0 -2
- package/dist/types/components/popover/popover.d.ts +1 -14
- package/dist/types/components/radio-button/radio-button.d.ts +5 -0
- package/dist/types/components/radio-group/radio-group.d.ts +5 -26
- package/dist/types/components/select/select.d.ts +0 -50
- package/dist/types/components/tabs/tabs.d.ts +1 -0
- package/dist/types/components/tabs-list/exports.d.ts +4 -0
- package/dist/types/components/tabs-list/tabs-list.d.ts +38 -0
- package/dist/types/components/textarea/textarea.d.ts +0 -32
- package/dist/types/components/toast/toast.d.ts +11 -5
- package/dist/types/components.d.ts +280 -638
- package/dist/web-components/bundled-icons/riverty-kit.json +1 -1
- package/dist/web-components/p-0347feff.entry.js +1 -0
- package/dist/web-components/p-159822fe.entry.js +1 -0
- package/dist/web-components/p-19407a14.entry.js +1 -0
- package/dist/web-components/{p-5744d75c.entry.js → p-1da75540.entry.js} +1 -1
- package/dist/web-components/p-26ef77d6.entry.js +1 -0
- package/dist/web-components/p-3884c6e7.entry.js +1 -0
- package/dist/web-components/p-3f60c6c0.entry.js +1 -0
- package/dist/web-components/{p-87f39749.entry.js → p-4595fa8e.entry.js} +1 -1
- package/dist/web-components/{p-4e3df002.entry.js → p-4cc58c6a.entry.js} +1 -1
- package/dist/web-components/p-4f261b63.entry.js +1 -0
- package/dist/web-components/{p-e0e2f2b2.entry.js → p-50893211.entry.js} +1 -1
- package/dist/web-components/{p-72fa1fd1.entry.js → p-550e2237.entry.js} +1 -1
- package/dist/web-components/p-589baaf9.entry.js +1 -0
- package/dist/web-components/{p-3b4e3faf.entry.js → p-5eeb7002.entry.js} +1 -1
- package/dist/web-components/p-60341de2.entry.js +1 -0
- package/dist/web-components/{p-44ae9f33.entry.js → p-62b788bf.entry.js} +1 -1
- package/dist/web-components/p-63fd817d.entry.js +1 -0
- package/dist/web-components/p-67fa3f84.entry.js +1 -0
- package/dist/web-components/p-6bb44ec6.entry.js +1 -0
- package/dist/web-components/p-6cc2ea2c.entry.js +1 -0
- package/dist/web-components/p-70784685.entry.js +1 -0
- package/dist/web-components/p-7ce57332.entry.js +1 -0
- package/dist/web-components/{p-429213ea.entry.js → p-7fed6f4d.entry.js} +1 -1
- package/dist/web-components/p-8a66d20c.entry.js +1 -0
- package/dist/web-components/{p-c7f8e59b.entry.js → p-8c31cbd5.entry.js} +1 -1
- package/dist/web-components/p-8dac326b.entry.js +1 -0
- package/dist/web-components/p-92c7cf33.entry.js +1 -0
- package/dist/web-components/{p-1c2497de.entry.js → p-9ef1bbee.entry.js} +1 -1
- package/dist/web-components/p-a7d22c76.entry.js +1 -0
- package/dist/web-components/p-b96d59ca.entry.js +1 -0
- package/dist/web-components/p-ba801820.entry.js +1 -0
- package/dist/web-components/{p-a022f356.entry.js → p-bfc8c077.entry.js} +1 -1
- package/dist/web-components/p-c05b05da.entry.js +1 -0
- package/dist/web-components/p-c1e748f2.entry.js +1 -0
- package/dist/web-components/{p-5bbd6e3c.entry.js → p-c478712b.entry.js} +1 -1
- package/dist/web-components/p-c95b6470.entry.js +1 -0
- package/dist/web-components/p-cd5daad2.entry.js +1 -0
- package/dist/web-components/p-cdd88c5a.entry.js +1 -0
- package/dist/web-components/{p-3078b2b8.entry.js → p-d054eb4d.entry.js} +1 -1
- package/dist/web-components/{p-8563a1ab.entry.js → p-d433a828.entry.js} +1 -1
- package/dist/web-components/p-d7726e46.entry.js +1 -0
- package/dist/web-components/p-d819c8e5.entry.js +1 -0
- package/dist/web-components/{p-755cc697.entry.js → p-e4dc60f0.entry.js} +1 -1
- package/dist/web-components/{p-d1379ac6.entry.js → p-f9d5004c.entry.js} +1 -1
- package/dist/web-components/web-components.esm.js +1 -1
- package/package.json +1 -1
- package/dist/cjs/r-accordion-item.cjs.entry.js +0 -78
- package/dist/cjs/r-icon-button.cjs.entry.js +0 -81
- package/dist/collection/components/accordion-item/accordion-item.css +0 -121
- package/dist/collection/components/accordion-item/accordion-item.js +0 -138
- package/dist/esm/r-accordion-item.entry.js +0 -76
- package/dist/esm/r-icon-button.entry.js +0 -79
- package/dist/types/components/accordion-item/accordion-item.d.ts +0 -26
- package/dist/web-components/p-00ca474f.entry.js +0 -1
- package/dist/web-components/p-0bb04d79.entry.js +0 -1
- package/dist/web-components/p-15ac0fdd.entry.js +0 -1
- package/dist/web-components/p-1c956370.entry.js +0 -1
- package/dist/web-components/p-2a512983.entry.js +0 -1
- package/dist/web-components/p-2b2f581a.entry.js +0 -1
- package/dist/web-components/p-2e18e762.entry.js +0 -1
- package/dist/web-components/p-3bc93d65.entry.js +0 -1
- package/dist/web-components/p-4bd3e077.entry.js +0 -1
- package/dist/web-components/p-51a5804b.entry.js +0 -1
- package/dist/web-components/p-56da04d8.entry.js +0 -1
- package/dist/web-components/p-5e6aabd8.entry.js +0 -1
- package/dist/web-components/p-656229de.entry.js +0 -1
- package/dist/web-components/p-6a4f3836.entry.js +0 -1
- package/dist/web-components/p-7775228c.entry.js +0 -1
- package/dist/web-components/p-7ad8e78b.entry.js +0 -1
- package/dist/web-components/p-85a9af42.entry.js +0 -1
- package/dist/web-components/p-9e50120b.entry.js +0 -1
- package/dist/web-components/p-a7e7f8fa.entry.js +0 -1
- package/dist/web-components/p-ad9b2a48.entry.js +0 -1
- package/dist/web-components/p-b2f03016.entry.js +0 -1
- package/dist/web-components/p-b87ad83b.entry.js +0 -1
- package/dist/web-components/p-c937bd92.entry.js +0 -1
- package/dist/web-components/p-cbcd7699.entry.js +0 -1
- package/dist/web-components/p-dbe579e8.entry.js +0 -1
- package/dist/web-components/p-e4b66277.entry.js +0 -1
- package/dist/web-components/p-e6a31881.entry.js +0 -1
- package/dist/web-components/p-f2577a3c.entry.js +0 -1
- package/dist/web-components/p-f6a92287.entry.js +0 -1
|
@@ -22,18 +22,10 @@ export declare class Checkbox {
|
|
|
22
22
|
indeterminate?: boolean;
|
|
23
23
|
/** Prevent user interaction and apply disabled style */
|
|
24
24
|
disabled?: boolean;
|
|
25
|
-
/**
|
|
26
|
-
|
|
27
|
-
* Controls the visibility of validation indicators for the field.
|
|
28
|
-
* */
|
|
29
|
-
showValid: boolean;
|
|
25
|
+
/** Automatically focus the checkbox when the component is mounted. Note: Only one element per page should have autofocus set to true, following browser standard behavior. */
|
|
26
|
+
autofocus?: boolean;
|
|
30
27
|
/** Indicate that validation is successful */
|
|
31
28
|
valid?: boolean;
|
|
32
|
-
/**
|
|
33
|
-
* _DEPRECATED_ (This property will be removed in November 2025 release.)
|
|
34
|
-
* Set custom message if the element meets all its validation constraints.
|
|
35
|
-
* */
|
|
36
|
-
validMessage?: string;
|
|
37
29
|
/** Indicate that validation has failed */
|
|
38
30
|
invalid?: boolean;
|
|
39
31
|
/** Custom validation error message */
|
|
@@ -46,6 +38,7 @@ export declare class Checkbox {
|
|
|
46
38
|
customErrorMessage?: string;
|
|
47
39
|
validityState: string;
|
|
48
40
|
validityMessage: string;
|
|
41
|
+
touched: boolean;
|
|
49
42
|
/**
|
|
50
43
|
* Emit custom `rChange` event when checkbox onChange event emitted.
|
|
51
44
|
* Emitted `event.details` contain checkbox value and checked state.
|
|
@@ -66,13 +59,6 @@ export declare class Checkbox {
|
|
|
66
59
|
state: string;
|
|
67
60
|
message: string;
|
|
68
61
|
}>;
|
|
69
|
-
/** Identify wrapping form element */
|
|
70
|
-
private get parentFormEl();
|
|
71
|
-
/** Determine whether this element should be ignored during Constraint Validation API validation. */
|
|
72
|
-
private get isNoValidate();
|
|
73
|
-
private initial;
|
|
74
|
-
private getValidityStateData;
|
|
75
|
-
private validateFormElement;
|
|
76
62
|
/**
|
|
77
63
|
* Asynchronously retrieves the validity state of the checkbox.
|
|
78
64
|
*
|
|
@@ -88,21 +74,6 @@ export declare class Checkbox {
|
|
|
88
74
|
state: string;
|
|
89
75
|
message: string;
|
|
90
76
|
}>;
|
|
91
|
-
/** Unique id */
|
|
92
|
-
private uniqueId;
|
|
93
|
-
touched: boolean;
|
|
94
|
-
handleCheckedChange(): Promise<void>;
|
|
95
|
-
private handleClick;
|
|
96
|
-
private nativeElement?;
|
|
97
|
-
private onSubmitForm;
|
|
98
|
-
private onResetForm;
|
|
99
|
-
private contributeToFormData;
|
|
100
|
-
private connectFormEventListeners;
|
|
101
|
-
private disconnectFormEventListeners;
|
|
102
|
-
componentWillLoad(): void;
|
|
103
|
-
componentDidLoad(): void;
|
|
104
|
-
connectedCallback(): void;
|
|
105
|
-
disconnectedCallback(): void;
|
|
106
77
|
/**
|
|
107
78
|
* Sets focus on the checkbox element.
|
|
108
79
|
*/
|
|
@@ -136,11 +107,30 @@ export declare class Checkbox {
|
|
|
136
107
|
* @returns A boolean indicating whether the checkbox is valid.
|
|
137
108
|
*/
|
|
138
109
|
checkValidity(): Promise<boolean>;
|
|
110
|
+
private initial;
|
|
111
|
+
private nativeElement?;
|
|
112
|
+
private uniqueId;
|
|
113
|
+
handleCheckedChange(): Promise<void>;
|
|
114
|
+
/** Identify wrapping form element */
|
|
115
|
+
private get parentFormEl();
|
|
116
|
+
/** Determine whether this element should be ignored during Constraint Validation API validation. */
|
|
117
|
+
private get isNoValidate();
|
|
139
118
|
private get hasErrorMessage();
|
|
140
119
|
private get hasCustomErrorMessage();
|
|
141
120
|
private get hasValidationError();
|
|
142
121
|
private get hasInvalidMessage();
|
|
143
|
-
private
|
|
144
|
-
private
|
|
122
|
+
private getValidityStateData;
|
|
123
|
+
private validateFormElement;
|
|
124
|
+
private handleClick;
|
|
125
|
+
private onSubmitForm;
|
|
126
|
+
private onResetForm;
|
|
127
|
+
private contributeToFormData;
|
|
128
|
+
private connectFormEventListeners;
|
|
129
|
+
private disconnectFormEventListeners;
|
|
130
|
+
private applyAutofocus;
|
|
131
|
+
componentWillLoad(): void;
|
|
132
|
+
componentDidLoad(): void;
|
|
133
|
+
connectedCallback(): void;
|
|
134
|
+
disconnectedCallback(): void;
|
|
145
135
|
render(): any;
|
|
146
136
|
}
|
|
@@ -23,19 +23,8 @@ export declare class CheckboxGroup {
|
|
|
23
23
|
* within Constrain Validation API
|
|
24
24
|
* */
|
|
25
25
|
valueMissingMessage?: string;
|
|
26
|
-
/**
|
|
27
|
-
* _DEPRECATED_ (This property will be removed in November 2025 release.)
|
|
28
|
-
* Indicates whether to show the validation state.
|
|
29
|
-
* When set to `true`, the component will display validation feedback.
|
|
30
|
-
* Defaults to `false`.
|
|
31
|
-
* */
|
|
32
|
-
showValid: boolean;
|
|
33
26
|
/** Apply validation success visual style */
|
|
34
27
|
valid?: boolean;
|
|
35
|
-
/**
|
|
36
|
-
* _DEPRECATED_ (This property will be removed in November 2025 release.)
|
|
37
|
-
* Set custom message if the element meets all its validation constraints. */
|
|
38
|
-
validMessage?: string;
|
|
39
28
|
/** Apply validation error visual style */
|
|
40
29
|
invalid?: boolean;
|
|
41
30
|
/** Custom validation error message */
|
|
@@ -46,6 +46,10 @@ export declare class IconButton {
|
|
|
46
46
|
* - `contained`: Button with a contained background.
|
|
47
47
|
*/
|
|
48
48
|
variant: 'standard' | 'contained';
|
|
49
|
+
/**
|
|
50
|
+
* Defines the tabindex of the button for keyboard navigation.
|
|
51
|
+
*/
|
|
52
|
+
rTabindex?: number;
|
|
49
53
|
/**
|
|
50
54
|
* Emits `rClick` event on click.
|
|
51
55
|
*/
|
|
@@ -1,4 +1,8 @@
|
|
|
1
1
|
export declare const inputTypeArray: readonly ["text", "email", "url", "tel", "password", "search", "number"];
|
|
2
|
+
export declare const inputModeArray: readonly ["text", "tel", "email", "url", "numeric", "decimal", "search", "none"];
|
|
2
3
|
export declare const inputAutocompleteArray: InputAutocomplete[];
|
|
4
|
+
export declare const enterKeyHintArray: readonly ["enter", "done", "go", "next", "previous", "search", "send"];
|
|
3
5
|
export type InputType = typeof inputTypeArray[number];
|
|
6
|
+
export type InputMode = typeof inputModeArray[number];
|
|
4
7
|
export type InputAutocomplete = AutoFill | 'bday' | 'sex' | 'url' | 'photo' | 'language';
|
|
8
|
+
export type EnterKeyHint = typeof enterKeyHintArray[number];
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { EventEmitter } from '../../stencil-public-runtime';
|
|
2
|
-
import type {
|
|
3
|
-
import type { InputAutocomplete, InputType } from './exports';
|
|
2
|
+
import type { InputAutocomplete, InputMode, InputType, EnterKeyHint } from './exports';
|
|
4
3
|
export declare class RInput {
|
|
5
4
|
host: HTMLRInputElement;
|
|
6
5
|
/**
|
|
@@ -42,83 +41,18 @@ export declare class RInput {
|
|
|
42
41
|
* When true, hides visual label & messages (for internal layout use; accessibility still preserved).
|
|
43
42
|
*/
|
|
44
43
|
internal?: boolean;
|
|
45
|
-
/**
|
|
46
|
-
* @deprecated Use `fieldIndicator` instead. Will be removed November 2025.
|
|
47
|
-
* Boolean flag to render an “optional” marker.
|
|
48
|
-
*/
|
|
49
|
-
optional?: boolean;
|
|
50
|
-
/**
|
|
51
|
-
* @deprecated Use `fieldIndicator` instead. Will be removed November 2025.
|
|
52
|
-
* Custom text for optional marker.
|
|
53
|
-
*/
|
|
54
|
-
optionalText?: string;
|
|
55
|
-
/**
|
|
56
|
-
* @deprecated Use the `popover` slot instead. Will be removed November 2025.
|
|
57
|
-
* Label tooltip text content.
|
|
58
|
-
*/
|
|
59
|
-
tooltip?: string;
|
|
60
|
-
/**
|
|
61
|
-
* @deprecated Use the `popover` slot instead. Will be removed November 2025.
|
|
62
|
-
* Icon name used as tooltip trigger.
|
|
63
|
-
*/
|
|
64
|
-
tooltipIcon?: IconName;
|
|
65
|
-
/**
|
|
66
|
-
* @deprecated Use the `popover` slot instead. Will be removed November 2025.
|
|
67
|
-
* Color token for tooltip trigger icon.
|
|
68
|
-
*/
|
|
69
|
-
tooltipIconColor?: string;
|
|
70
44
|
/**
|
|
71
45
|
* Optional contextual help text displayed beneath the field.
|
|
72
46
|
*/
|
|
73
47
|
hint?: string;
|
|
74
|
-
/**
|
|
75
|
-
* @deprecated Will be removed November 2025.
|
|
76
|
-
* Legacy single icon (prefer `leading` / `trailing` slots).
|
|
77
|
-
*/
|
|
78
|
-
icon?: IconName;
|
|
79
|
-
/**
|
|
80
|
-
* @deprecated Will be removed November 2025.
|
|
81
|
-
* Color for legacy icon.
|
|
82
|
-
*/
|
|
83
|
-
iconColor?: string;
|
|
84
|
-
/**
|
|
85
|
-
* @deprecated Will be removed November 2025.
|
|
86
|
-
* Position of legacy icon: `start` | `end`.
|
|
87
|
-
*/
|
|
88
|
-
iconPosition: IconPosition;
|
|
89
|
-
/**
|
|
90
|
-
* @deprecated Will be removed November 2025.
|
|
91
|
-
* Treat legacy icon as submit trigger.
|
|
92
|
-
*/
|
|
93
|
-
iconSubmit?: boolean;
|
|
94
48
|
/**
|
|
95
49
|
* When true, stretches the component horizontally to fill its container.
|
|
96
50
|
*/
|
|
97
51
|
fullWidth?: boolean;
|
|
98
|
-
/**
|
|
99
|
-
* @deprecated Will be removed November 2025.
|
|
100
|
-
* Controls visibility of success validation marker.
|
|
101
|
-
*/
|
|
102
|
-
showValid?: boolean;
|
|
103
52
|
/**
|
|
104
53
|
* Explicit valid state override (when set manually).
|
|
105
54
|
*/
|
|
106
55
|
valid?: boolean;
|
|
107
|
-
/**
|
|
108
|
-
* @deprecated Will be removed November 2025.
|
|
109
|
-
* Legacy boolean to show a validation marker icon.
|
|
110
|
-
*/
|
|
111
|
-
validMarker: boolean;
|
|
112
|
-
/**
|
|
113
|
-
* @deprecated Will be removed November 2025.
|
|
114
|
-
* Icon name used when `validMarker` is active and state is valid.
|
|
115
|
-
*/
|
|
116
|
-
validMarkerIcon: IconName;
|
|
117
|
-
/**
|
|
118
|
-
* @deprecated Will be removed November 2025.
|
|
119
|
-
* Custom success message when field is valid.
|
|
120
|
-
*/
|
|
121
|
-
validMessage?: string;
|
|
122
56
|
/**
|
|
123
57
|
* Explicit invalid state override (when set manually).
|
|
124
58
|
*/
|
|
@@ -176,6 +110,25 @@ export declare class RInput {
|
|
|
176
110
|
* Native `autocomplete` hint for browsers / password managers.
|
|
177
111
|
*/
|
|
178
112
|
autocomplete?: InputAutocomplete;
|
|
113
|
+
/**
|
|
114
|
+
* Hint for the action label/icon on the virtual keyboard's enter key.
|
|
115
|
+
* Use cases:
|
|
116
|
+
* - `enter`: Default, generic newline/submit action
|
|
117
|
+
* - `done`: Finishes current input session (e.g., last field in a form)
|
|
118
|
+
* - `go`: Navigates to URL input target (e.g., URL bar)
|
|
119
|
+
* - `next`: Advances to next input field in a sequence
|
|
120
|
+
* - `previous`: Goes back to previous input field
|
|
121
|
+
* - `search`: Submits a search query
|
|
122
|
+
* - `send`: Sends a message (e.g., chat, email)
|
|
123
|
+
*/
|
|
124
|
+
enterkeyhint?: EnterKeyHint;
|
|
125
|
+
/**
|
|
126
|
+
* Safari-specific password rules for strong password generation (password inputs only).
|
|
127
|
+
* Format: "minlength: X; required: lower; required: upper; required: digit; required: special;"
|
|
128
|
+
* This attribute is Safari-specific and will be ignored by other browsers.
|
|
129
|
+
* See: https://developer.apple.com/documentation/security/password_autofill/customizing_password_autofill_rules
|
|
130
|
+
*/
|
|
131
|
+
passwordrules?: string;
|
|
179
132
|
/**
|
|
180
133
|
* Automatically focus the input when it is first rendered.
|
|
181
134
|
* Mirrors native `autofocus` attribute behavior. Avoid using multiple times per page.
|
|
@@ -186,15 +139,24 @@ export declare class RInput {
|
|
|
186
139
|
* but the field can still receive focus, be selected, and be submitted with a form.
|
|
187
140
|
*/
|
|
188
141
|
readonly?: boolean;
|
|
142
|
+
/**
|
|
143
|
+
* Hint to the browser about which keyboard to display on mobile devices.
|
|
144
|
+
*/
|
|
145
|
+
inputmode?: InputMode;
|
|
146
|
+
/**
|
|
147
|
+
* When `true` field renders valid/invalid marker within.
|
|
148
|
+
*/
|
|
149
|
+
validityMarker: boolean;
|
|
189
150
|
/** Validity state passed from validateFormElement function after validation */
|
|
190
151
|
validityState: string;
|
|
191
152
|
/** Validity message passed from validateFormElement function after validation */
|
|
192
153
|
validityMessage: string;
|
|
193
|
-
/**
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
154
|
+
/** Defines if the component has been touched by user */
|
|
155
|
+
touched: boolean;
|
|
156
|
+
/** Defines if the value has been changed by user interaction */
|
|
157
|
+
dirty: boolean;
|
|
158
|
+
/** Private flag to prevent validation during reset */
|
|
159
|
+
private isResetting;
|
|
198
160
|
/**
|
|
199
161
|
* Emitted after each validation attempt (native or triggered logic).
|
|
200
162
|
*/
|
|
@@ -271,6 +233,18 @@ export declare class RInput {
|
|
|
271
233
|
* @returns A boolean indicating whether the input is valid.
|
|
272
234
|
*/
|
|
273
235
|
checkValidity(): Promise<boolean>;
|
|
236
|
+
/**
|
|
237
|
+
* Gets the touched state (whether user has interacted with the input)
|
|
238
|
+
*/
|
|
239
|
+
isTouched(): Promise<boolean>;
|
|
240
|
+
/**
|
|
241
|
+
* Gets the dirty state (whether value has been changed by user)
|
|
242
|
+
*/
|
|
243
|
+
isDirty(): Promise<boolean>;
|
|
244
|
+
/**
|
|
245
|
+
* Resets touched and dirty states to pristine (untouched/clean)
|
|
246
|
+
*/
|
|
247
|
+
markAsPristine(): Promise<void>;
|
|
274
248
|
private nativeElement;
|
|
275
249
|
private uniqueId;
|
|
276
250
|
/**
|
|
@@ -282,7 +256,6 @@ export declare class RInput {
|
|
|
282
256
|
private get ariaDescribedBy();
|
|
283
257
|
private get hasError();
|
|
284
258
|
private get hasValidationError();
|
|
285
|
-
private get hasValidationSuccess();
|
|
286
259
|
private get hasMessage();
|
|
287
260
|
/**
|
|
288
261
|
* Determine whether this element should be ignored
|
|
@@ -308,5 +281,6 @@ export declare class RInput {
|
|
|
308
281
|
private handleKeyup;
|
|
309
282
|
private handleClick;
|
|
310
283
|
handleValueChange(): void;
|
|
284
|
+
handleTypeChange(): void;
|
|
311
285
|
render(): any;
|
|
312
286
|
}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export declare const InputCodeInputModeArray: readonly ["none", "text", "tel", "url", "email", "numeric", "decimal", "search"];
|
|
2
|
+
export declare const InputCodeEnterKeyHintArray: readonly ["enter", "done", "go", "next", "previous", "search", "send"];
|
|
3
|
+
export type InputCodeInputMode = typeof InputCodeInputModeArray[number];
|
|
4
|
+
export type InputCodeEnterKeyHint = typeof InputCodeEnterKeyHintArray[number];
|
|
@@ -1,11 +1,14 @@
|
|
|
1
1
|
import { EventEmitter } from '../../stencil-public-runtime';
|
|
2
|
+
import type { InputCodeInputMode, InputCodeEnterKeyHint } from './exports';
|
|
2
3
|
export declare class InputCode {
|
|
3
4
|
host: HTMLRInputCodeElement;
|
|
4
5
|
/** Specifies the `id` of the `<form>` to which the element belongs. */
|
|
5
6
|
form?: string;
|
|
6
|
-
/** Specifies a name for an input for
|
|
7
|
+
/** Specifies a name for an input for submission within formData object. */
|
|
7
8
|
name: string;
|
|
8
|
-
/** Number of digits (typically 4–6)
|
|
9
|
+
/** Number of digits (typically 4–6).
|
|
10
|
+
* @default: 4
|
|
11
|
+
*/
|
|
9
12
|
length: number;
|
|
10
13
|
/** Whether the input is disabled */
|
|
11
14
|
disabled?: boolean;
|
|
@@ -18,7 +21,9 @@ export declare class InputCode {
|
|
|
18
21
|
* but the field can still receive focus, be selected, and be submitted with a form.
|
|
19
22
|
*/
|
|
20
23
|
readonly?: boolean;
|
|
21
|
-
/** Label for accessibility
|
|
24
|
+
/** Label for accessibility.
|
|
25
|
+
* @default: 'Verification code'
|
|
26
|
+
*/
|
|
22
27
|
label: string;
|
|
23
28
|
/** Text of an additional marker in the label */
|
|
24
29
|
fieldIndicator?: string;
|
|
@@ -31,7 +36,7 @@ export declare class InputCode {
|
|
|
31
36
|
/** Visual indication of valid state */
|
|
32
37
|
valid?: boolean;
|
|
33
38
|
/** Set custom message for `tooShort` property of a ValidityState object (set by `minlength`) within Constrain Validation API */
|
|
34
|
-
tooShortMessage
|
|
39
|
+
tooShortMessage?: string;
|
|
35
40
|
/** Set custom message for `customError` property of a ValidityState object indicating whether the element's custom validity message has been set to a non-empty string by calling the element's setCustomValidity() method. */
|
|
36
41
|
customErrorMessage?: string;
|
|
37
42
|
/** Set custom message for `valueMissing` property of a ValidityState object (set by `required`) within Constrain Validation API */
|
|
@@ -43,6 +48,18 @@ export declare class InputCode {
|
|
|
43
48
|
ariaCharacterLabel?: string;
|
|
44
49
|
/** Defines initial value */
|
|
45
50
|
value?: string | null;
|
|
51
|
+
/** Specifies the input mode for the virtual keyboard on mobile devices. Default is 'numeric' for OTP codes.
|
|
52
|
+
* @default: 'numeric'
|
|
53
|
+
*/
|
|
54
|
+
inputmode?: InputCodeInputMode;
|
|
55
|
+
/** Specifies the enter key hint for the virtual keyboard. Default is 'done' for OTP completion.
|
|
56
|
+
* @default: 'done'
|
|
57
|
+
*/
|
|
58
|
+
enterkeyhint?: InputCodeEnterKeyHint;
|
|
59
|
+
/** Specifies the autocomplete behavior. Default is 'one-time-code' for SMS OTP autofill.
|
|
60
|
+
* @default: 'one-time-code'
|
|
61
|
+
*/
|
|
62
|
+
autocomplete?: string;
|
|
46
63
|
/** Emits the current code value as it changes */
|
|
47
64
|
rChange: EventEmitter<{
|
|
48
65
|
value: string;
|
|
@@ -60,10 +77,16 @@ export declare class InputCode {
|
|
|
60
77
|
/** Holds the current values of each input box */
|
|
61
78
|
values: string[];
|
|
62
79
|
/** Validity state passed from validateFormElement function after validation */
|
|
63
|
-
validityState: string;
|
|
80
|
+
validityState: string | null;
|
|
64
81
|
/** Validity message passed from validateFormElement function after validation */
|
|
65
|
-
validityMessage: string;
|
|
82
|
+
validityMessage: string | null;
|
|
66
83
|
private inputs;
|
|
84
|
+
/**
|
|
85
|
+
* Validates segment index and throws descriptive errors if invalid.
|
|
86
|
+
* @param index - The index to validate
|
|
87
|
+
* @throws Error if index is not an integer or out of bounds
|
|
88
|
+
*/
|
|
89
|
+
private validateSegmentIndex;
|
|
67
90
|
/**
|
|
68
91
|
* Gets the current complete code value by joining all individual digit values.
|
|
69
92
|
* @returns Promise that resolves to the complete code string
|
|
@@ -77,13 +100,32 @@ export declare class InputCode {
|
|
|
77
100
|
/**
|
|
78
101
|
* Sets provided value.
|
|
79
102
|
* */
|
|
80
|
-
setValue(value:
|
|
103
|
+
setValue(value: string | null): Promise<void>;
|
|
81
104
|
/**
|
|
82
105
|
* Validates the input code without triggering UI and returns a boolean indicating its validity.
|
|
83
106
|
* @returns A boolean indicating whether the input code is valid.
|
|
84
107
|
*/
|
|
85
108
|
checkValidity(): Promise<boolean>;
|
|
109
|
+
/**
|
|
110
|
+
* Focuses a specific segment (input) by index.
|
|
111
|
+
* @param index - The zero-based index of the segment to focus (0 to length-1)
|
|
112
|
+
* @returns Promise that resolves when focus is set, or rejects if index is invalid
|
|
113
|
+
*/
|
|
114
|
+
focusSegment(index: number): Promise<void>;
|
|
115
|
+
/**
|
|
116
|
+
* Gets the value of a specific segment by index.
|
|
117
|
+
* @param index - The zero-based index of the segment (0 to length-1)
|
|
118
|
+
* @returns Promise that resolves to the segment value (single character string or empty string)
|
|
119
|
+
*/
|
|
120
|
+
getSegmentValue(index: number): Promise<string>;
|
|
121
|
+
/**
|
|
122
|
+
* Sets the value of a specific segment by index.
|
|
123
|
+
* @param index - The zero-based index of the segment (0 to length-1)
|
|
124
|
+
* @param value - The value to set (will be truncated to first character if longer)
|
|
125
|
+
*/
|
|
126
|
+
setSegmentValue(index: number, value: string): Promise<void>;
|
|
86
127
|
handleValuesChange(): void;
|
|
128
|
+
handleLengthChange(newLength: number): void;
|
|
87
129
|
private handleInput;
|
|
88
130
|
private handleKeyDown;
|
|
89
131
|
private createInputHandler;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { EventEmitter } from '../../stencil-public-runtime';
|
|
2
|
-
import type { IconName } from "../icon/exports";
|
|
3
2
|
import { DateStructure } from "./exports";
|
|
4
3
|
export declare class InputDate {
|
|
5
4
|
host: HTMLRInputDateElement;
|
|
@@ -17,21 +16,6 @@ export declare class InputDate {
|
|
|
17
16
|
label: string;
|
|
18
17
|
/** Text of an additional marker in the label */
|
|
19
18
|
fieldIndicator?: string;
|
|
20
|
-
/**
|
|
21
|
-
* _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.)
|
|
22
|
-
* Label tooltip text
|
|
23
|
-
* */
|
|
24
|
-
tooltip?: string;
|
|
25
|
-
/**
|
|
26
|
-
* _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.)
|
|
27
|
-
* Tooltip trigger icon by name from [Riverty icons set](https://storybook.riverty.design/?path=/story/components-icon--riverty-kit)
|
|
28
|
-
* */
|
|
29
|
-
tooltipIcon?: IconName;
|
|
30
|
-
/**
|
|
31
|
-
* _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.)
|
|
32
|
-
* Change color of an icon that triggers tooltip to one of the Riverty color tokens
|
|
33
|
-
* */
|
|
34
|
-
tooltipIconColor?: string;
|
|
35
19
|
/**
|
|
36
20
|
* Optional hint, visually presented under the input,
|
|
37
21
|
* giving additional context to the user
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type PasswordAutocomplete = 'current-password' | 'new-password' | 'off';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { EventEmitter } from '../../stencil-public-runtime';
|
|
2
|
-
import type {
|
|
2
|
+
import type { PasswordAutocomplete } from './exports';
|
|
3
3
|
export declare class InputPassword {
|
|
4
4
|
host: HTMLRInputPasswordElement;
|
|
5
5
|
/** Specifies the `id` of the `<form>` to which the element belongs */
|
|
@@ -16,21 +16,6 @@ export declare class InputPassword {
|
|
|
16
16
|
label: string;
|
|
17
17
|
/** Text of an additional marker in the label */
|
|
18
18
|
fieldIndicator?: string;
|
|
19
|
-
/**
|
|
20
|
-
* _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.)
|
|
21
|
-
* Label tooltip text
|
|
22
|
-
* */
|
|
23
|
-
tooltip?: string;
|
|
24
|
-
/**
|
|
25
|
-
* _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.)
|
|
26
|
-
* Tooltip trigger icon by name from [Riverty icons set](https://storybook.riverty.design/?path=/story/components-icon--riverty-kit)
|
|
27
|
-
* */
|
|
28
|
-
tooltipIcon?: IconName;
|
|
29
|
-
/**
|
|
30
|
-
* _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.)
|
|
31
|
-
* Change color of an icon that triggers tooltip to one of the Riverty color tokens
|
|
32
|
-
* */
|
|
33
|
-
tooltipIconColor?: string;
|
|
34
19
|
/**
|
|
35
20
|
* Optional hint, visually presented under the input,
|
|
36
21
|
* giving additional context to the user
|
|
@@ -53,8 +38,20 @@ export declare class InputPassword {
|
|
|
53
38
|
readonly?: boolean;
|
|
54
39
|
/** Specifies that an input is required/must be filled out */
|
|
55
40
|
required?: boolean;
|
|
41
|
+
/** Maximum character length (enforced by native input). */
|
|
42
|
+
maxlength?: number;
|
|
43
|
+
/** Minimum character length (validation only). */
|
|
44
|
+
minlength?: number;
|
|
45
|
+
/** Regex pattern the value must match (string form). */
|
|
46
|
+
pattern?: string;
|
|
56
47
|
/** Set custom message for `valueMissing` property of a ValidityState object (set by `required`) within Constrain Validation API */
|
|
57
48
|
valueMissingMessage?: string;
|
|
49
|
+
/** Custom message for `tooLong`. */
|
|
50
|
+
tooLongMessage?: string;
|
|
51
|
+
/** Custom message for `tooShort`. */
|
|
52
|
+
tooShortMessage?: string;
|
|
53
|
+
/** Custom message for `patternMismatch`. */
|
|
54
|
+
patternMismatchMessage?: string;
|
|
58
55
|
/** Custom error message displayed for any validation failures in the input. */
|
|
59
56
|
customErrorMessage?: string;
|
|
60
57
|
/**
|
|
@@ -69,6 +66,36 @@ export declare class InputPassword {
|
|
|
69
66
|
shownPasswordMessage: string;
|
|
70
67
|
/** Custom message when the password is hidden to alert screen reader users. */
|
|
71
68
|
hiddenPasswordMessage: string;
|
|
69
|
+
/**
|
|
70
|
+
* Safari-specific password rules for strong password generation.
|
|
71
|
+
* Format: "minlength: X; required: lower; required: upper; required: digit; required: special;"
|
|
72
|
+
* Example: "minlength: 8; required: lower; required: upper; required: digit; required: special;"
|
|
73
|
+
* Note: This attribute is Safari-specific and will be ignored by other browsers.
|
|
74
|
+
* See: https://developer.apple.com/documentation/security/password_autofill/customizing_password_autofill_rules
|
|
75
|
+
*/
|
|
76
|
+
passwordrules?: string;
|
|
77
|
+
/**
|
|
78
|
+
* Password-specific autocomplete behavior for browser password managers.
|
|
79
|
+
*
|
|
80
|
+
* @example
|
|
81
|
+
* **Usage Guidelines:**
|
|
82
|
+
* - `'current-password'`: Use in login forms where users enter their existing password
|
|
83
|
+
* - `'new-password'`: Use in registration forms or password change forms for the new password field
|
|
84
|
+
* - `'off'`: Disable autofill in sensitive contexts where password managers should not suggest values
|
|
85
|
+
*
|
|
86
|
+
* **Common Patterns:**
|
|
87
|
+
* ```tsx
|
|
88
|
+
* // Login form
|
|
89
|
+
* <r-input-password autocomplete="current-password" />
|
|
90
|
+
*
|
|
91
|
+
* // Registration form
|
|
92
|
+
* <r-input-password autocomplete="new-password" />
|
|
93
|
+
*
|
|
94
|
+
* // Sensitive form (e.g., admin panel)
|
|
95
|
+
* <r-input-password autocomplete="off" />
|
|
96
|
+
* ```
|
|
97
|
+
*/
|
|
98
|
+
autocomplete?: PasswordAutocomplete;
|
|
72
99
|
showed: boolean;
|
|
73
100
|
/** Validity state passed from validateFormElement function after validation */
|
|
74
101
|
validityState: string;
|
|
@@ -95,6 +122,11 @@ export declare class InputPassword {
|
|
|
95
122
|
element: HTMLRInputPasswordElement;
|
|
96
123
|
value: any;
|
|
97
124
|
}>;
|
|
125
|
+
/** Emits 'rVisibilityChange' event when password visibility is toggled */
|
|
126
|
+
rVisibilityChange: EventEmitter<{
|
|
127
|
+
element: HTMLRInputPasswordElement;
|
|
128
|
+
visible: boolean;
|
|
129
|
+
}>;
|
|
98
130
|
/**
|
|
99
131
|
* Toggle password text visibility.
|
|
100
132
|
* */
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { EventEmitter } from '../../stencil-public-runtime';
|
|
2
|
-
import type { IconName } from "../icon/exports";
|
|
3
2
|
export declare class InputPhoneNumber {
|
|
4
3
|
host: HTMLRInputPhoneNumberElement;
|
|
5
4
|
/** Phone number value */
|
|
@@ -14,21 +13,6 @@ export declare class InputPhoneNumber {
|
|
|
14
13
|
fieldIndicator?: string;
|
|
15
14
|
/** Optional hint giving additional context to the user */
|
|
16
15
|
hint?: string;
|
|
17
|
-
/**
|
|
18
|
-
* _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.)
|
|
19
|
-
* Label tooltip text
|
|
20
|
-
* */
|
|
21
|
-
tooltip?: string;
|
|
22
|
-
/**
|
|
23
|
-
* _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.)
|
|
24
|
-
* Label tooltip trigger icon
|
|
25
|
-
* */
|
|
26
|
-
tooltipIcon?: IconName;
|
|
27
|
-
/**
|
|
28
|
-
* _DEPRECATED_ (Use popover slot instead. This property will be removed in November 2025 release.)
|
|
29
|
-
* Change color of an icon that triggers tooltip to one of the Riverty color tokens
|
|
30
|
-
* */
|
|
31
|
-
tooltipIconColor?: string;
|
|
32
16
|
/** Specifies a name for an input for submitting within formData object. */
|
|
33
17
|
name: string;
|
|
34
18
|
/** Label for phone input */
|
|
@@ -1,26 +1,8 @@
|
|
|
1
|
-
import type { IconName } from '../icon/exports';
|
|
2
|
-
import { TooltipPosition } from '../tooltip/exports';
|
|
3
1
|
/**
|
|
4
2
|
* Utility component, mostly used internally in other design system components,
|
|
5
3
|
* for consistent presentation of text with optional associated tooltip.
|
|
6
4
|
*/
|
|
7
5
|
export declare class RLabel {
|
|
8
|
-
/**
|
|
9
|
-
* _DEPRECATED_ (This property will be removed in November 2025 release.)
|
|
10
|
-
* Tooltip represents additional description */
|
|
11
|
-
tooltip?: string;
|
|
12
|
-
/**
|
|
13
|
-
* _DEPRECATED_ (This property will be removed in November 2025 release.)
|
|
14
|
-
* Defines preferable position of the tooltip */
|
|
15
|
-
tooltipPosition?: TooltipPosition;
|
|
16
|
-
/**
|
|
17
|
-
* _DEPRECATED_ (This property will be removed in November 2025 release.)
|
|
18
|
-
* Icon tooltip trigger by name from the set */
|
|
19
|
-
tooltipIcon?: IconName;
|
|
20
|
-
/**
|
|
21
|
-
* _DEPRECATED_ (This property will be removed in November 2025 release.)
|
|
22
|
-
* Change color of an icon that triggers tooltip to one of the Riverty color tokens */
|
|
23
|
-
tooltipIconColor?: string;
|
|
24
6
|
/** Text of an additional marker */
|
|
25
7
|
fieldIndicator?: string;
|
|
26
8
|
render(): any;
|