lightning-base-components 1.19.1-alpha → 1.19.2-alpha

package/metadata/raptor.json

@@ -154,6 +154,62 @@
       }
     ]
   },
+  "baseButton": {
+    "slotNames": [
+      "",
+      "end",
+      "start"
+    ],
+    "properties": [
+      {
+        "name": "disabled"
+      },
+      {
+        "name": "form"
+      },
+      {
+        "name": "name"
+      },
+      {
+        "name": "role"
+      },
+      {
+        "name": "type"
+      },
+      {
+        "name": "value"
+      },
+      {
+        "name": "variant"
+      }
+    ]
+  },
+  "baseContainer": {
+    "slotNames": [
+      "",
+      "footer",
+      "header",
+      "header-end",
+      "header-start"
+    ],
+    "properties": [
+      {
+        "name": "bodyDirection"
+      },
+      {
+        "name": "footerDirection"
+      },
+      {
+        "name": "headerDirection"
+      },
+      {
+        "name": "role"
+      },
+      {
+        "name": "variant"
+      }
+    ]
+  },
   "baseFormattedText": {
     "slotNames": [],
     "properties": [
@@ -165,6 +221,437 @@
       }
     ]
   },
+  "baseIcon": {
+    "slotNames": [
+      ""
+    ],
+    "properties": [
+      {
+        "name": "iconSets"
+      },
+      {
+        "name": "prefetch"
+      },
+      {
+        "name": "role"
+      },
+      {
+        "name": "set"
+      },
+      {
+        "name": "symbol"
+      }
+    ],
+    "methods": [
+      {
+        "name": "registerIconSet"
+      },
+      {
+        "name": "unregisterIconSet"
+      }
+    ]
+  },
+  "baseImage": {
+    "slotNames": [],
+    "properties": [
+      {
+        "name": "alt"
+      },
+      {
+        "name": "fit"
+      },
+      {
+        "name": "ratio"
+      },
+      {
+        "name": "sizes"
+      },
+      {
+        "name": "src"
+      },
+      {
+        "name": "srcset"
+      }
+    ]
+  },
+  "baseInputCheckbox": {
+    "slotNames": [
+      "",
+      "help-text",
+      "label-end",
+      "label-start",
+      "mark"
+    ],
+    "properties": [
+      {
+        "name": "checkbox"
+      },
+      {
+        "name": "checked"
+      },
+      {
+        "name": "disabled"
+      },
+      {
+        "name": "indeterminate"
+      },
+      {
+        "name": "invalid"
+      },
+      {
+        "name": "labelHidden"
+      },
+      {
+        "name": "name"
+      },
+      {
+        "name": "required"
+      },
+      {
+        "name": "validity"
+      },
+      {
+        "name": "validityMessage"
+      },
+      {
+        "name": "value"
+      }
+    ],
+    "methods": [
+      {
+        "name": "removeIndeterminate"
+      },
+      {
+        "name": "setIndeterminate"
+      }
+    ]
+  },
+  "baseInputCounter": {
+    "slotNames": [
+      "end",
+      "help-text",
+      "label",
+      "label-end",
+      "label-start",
+      "start",
+      "step-down",
+      "step-up"
+    ],
+    "properties": [
+      {
+        "name": "disabled"
+      },
+      {
+        "name": "form"
+      },
+      {
+        "name": "invalid"
+      },
+      {
+        "name": "label"
+      },
+      {
+        "name": "max"
+      },
+      {
+        "name": "min"
+      },
+      {
+        "name": "name"
+      },
+      {
+        "name": "placeholder"
+      },
+      {
+        "name": "readOnly"
+      },
+      {
+        "name": "required"
+      },
+      {
+        "name": "step"
+      },
+      {
+        "name": "stepDownLabel"
+      },
+      {
+        "name": "stepUpLabel"
+      },
+      {
+        "name": "validity"
+      },
+      {
+        "name": "validityMessage"
+      },
+      {
+        "name": "value"
+      }
+    ]
+  },
+  "baseInputDate": {
+    "slotNames": [
+      "end",
+      "help-text",
+      "label",
+      "label-end",
+      "label-start",
+      "start"
+    ],
+    "properties": [
+      {
+        "name": "day"
+      },
+      {
+        "name": "dayformat"
+      },
+      {
+        "name": "disabled"
+      },
+      {
+        "name": "invalid"
+      },
+      {
+        "name": "isoDate"
+      },
+      {
+        "name": "locale"
+      },
+      {
+        "name": "month"
+      },
+      {
+        "name": "monthformat"
+      },
+      {
+        "name": "name"
+      },
+      {
+        "name": "readonly"
+      },
+      {
+        "name": "required"
+      },
+      {
+        "name": "validity"
+      },
+      {
+        "name": "validityMessage"
+      },
+      {
+        "name": "value"
+      },
+      {
+        "name": "year"
+      }
+    ]
+  },
+  "baseInputRadio": {
+    "slotNames": [
+      "",
+      "label-end",
+      "label-start",
+      "mark"
+    ],
+    "properties": [
+      {
+        "name": "checked"
+      },
+      {
+        "name": "disabled"
+      },
+      {
+        "name": "invalid"
+      },
+      {
+        "name": "name"
+      },
+      {
+        "name": "required"
+      },
+      {
+        "name": "validity"
+      },
+      {
+        "name": "validityMessage"
+      },
+      {
+        "name": "value"
+      }
+    ]
+  },
+  "baseInputText": {
+    "slotNames": [
+      "end",
+      "help-text",
+      "label",
+      "label-end",
+      "label-start",
+      "start"
+    ],
+    "properties": [
+      {
+        "name": "disabled"
+      },
+      {
+        "name": "form"
+      },
+      {
+        "name": "invalid"
+      },
+      {
+        "name": "label"
+      },
+      {
+        "name": "labelHidden"
+      },
+      {
+        "name": "maxLength"
+      },
+      {
+        "name": "minLength"
+      },
+      {
+        "name": "name"
+      },
+      {
+        "name": "pattern"
+      },
+      {
+        "name": "placeholder"
+      },
+      {
+        "name": "readOnly"
+      },
+      {
+        "name": "required"
+      },
+      {
+        "name": "role"
+      },
+      {
+        "name": "type"
+      },
+      {
+        "name": "validity"
+      },
+      {
+        "name": "validityMessage"
+      },
+      {
+        "name": "value"
+      }
+    ]
+  },
+  "baseLink": {
+    "slotNames": [
+      "",
+      "end",
+      "start"
+    ],
+    "properties": [
+      {
+        "name": "disabled"
+      },
+      {
+        "name": "download"
+      },
+      {
+        "name": "href"
+      },
+      {
+        "name": "hreflang"
+      },
+      {
+        "name": "ping"
+      },
+      {
+        "name": "referrerpolicy"
+      },
+      {
+        "name": "rel"
+      },
+      {
+        "name": "target"
+      },
+      {
+        "name": "type"
+      }
+    ]
+  },
+  "baseListboxManager": {
+    "slotNames": [
+      ""
+    ],
+    "properties": [
+      {
+        "name": "multiselect"
+      },
+      {
+        "name": "orientation"
+      },
+      {
+        "name": "value"
+      }
+    ]
+  },
+  "baseTextarea": {
+    "slotNames": [
+      "end",
+      "help-text",
+      "label",
+      "label-end",
+      "label-start",
+      "start"
+    ],
+    "properties": [
+      {
+        "name": "cols"
+      },
+      {
+        "name": "disabled"
+      },
+      {
+        "name": "invalid"
+      },
+      {
+        "name": "label"
+      },
+      {
+        "name": "maxLength"
+      },
+      {
+        "name": "minLength"
+      },
+      {
+        "name": "name"
+      },
+      {
+        "name": "placeholder"
+      },
+      {
+        "name": "readOnly"
+      },
+      {
+        "name": "required"
+      },
+      {
+        "name": "rows"
+      },
+      {
+        "name": "validity"
+      },
+      {
+        "name": "validityMessage"
+      },
+      {
+        "name": "value"
+      },
+      {
+        "name": "wrap"
+      }
+    ]
+  },
+  "baseUtils": {},
   "billingBatchApi": {},
   "breadcrumb": {
     "minVersion": "0.0",
@@ -3489,6 +3976,7 @@
   },
   "serviceDataCategoryApi": {},
   "serviceNetworkDataCategoryApi": {},
+  "serviceServiceCatalogCategoryApi": {},
   "showToastEvent": {},
   "sitesApi": {},
   "slider": {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "lightning-base-components",
-    "version": "1.19.1-alpha",
+    "version": "1.19.2-alpha",
     "license": "MIT",
     "files": [
         "external",

package/src/lightning/alert/__docs__/alert.md

@@ -50,7 +50,7 @@ This component uses the Salesforce Lightning Design System (SLDS) [`prompt` blue
     -   `error`: red
     -   `offline`: ​black
 
-If an invalid value is provided, `LightningAlert` uses the `default` theme.
+If an invalid value is provided, `LightningAlert` uses the `default` theme. `LightningAlert` ignores the `style` attribute.
 
 #### Testing Your Component's Alert
 

package/src/lightning/baseCombobox/baseCombobox.js

@@ -761,7 +761,14 @@ export default class LightningBaseCombobox extends LightningElement {
             return;
         }
         // For details: https://developer.mozilla.org/en-US/docs/Web/API/Element/keydown_event
-        if (event.isComposing || event.keyCode === 229) {
+        // ctrl + option + arrow right should read the next item in the list and should not update aria-activedescendant.
+        // skip the updation of aria-activedescendant on ctrl.
+        if (
+            event.isComposing ||
+            event.keyCode === 229 ||
+            event.ctrlKey ||
+            event.altKey
+        ) {
             return;
         }
         if (this.hasInputPill) {

package/src/lightning/combobox/combobox.css

@@ -2,6 +2,8 @@
 @import './form-element.slds.css';
 @import './combobox.slds.css'; */
 
+@import 'lightning/sldsGenAiUtils';
+
 :host {
     display: block;
 }

package/src/lightning/combobox/combobox.html

@@ -1,6 +1,6 @@
 <template>
     <div part="combobox">
-        <label class={computedLabelClass} id="combobox-label" data-form-label>
+        <label class={computedLabelClass}>
             <template if:true={required}>
                 <abbr class="slds-required" title={i18n.required}>*</abbr>
             </template>

package/src/lightning/combobox/combobox.js

@@ -396,9 +396,7 @@ export default class LightningCombobox extends LightningElement {
         const describedByElements = [];
 
         if (this._helpMessage) {
-            const label = this.template.querySelector('[data-form-label]');
             const helpText = this.template.querySelector('[data-help-text]');
-            describedByElements.push(label);
             describedByElements.push(helpText);
         }
 

package/src/lightning/confirm/__docs__/confirm.md

@@ -53,7 +53,7 @@ This component uses the Salesforce Lightning Design System (SLDS) [`prompt` blue
     -   `error`: red
     -   `offline`: ​black​
 
-If an invalid value is provided, `LightningConfirm` uses the `default` theme.
+If an invalid value is provided, `LightningConfirm` uses the `default` theme. `LightningConfirm` ignores the `style` attribute.
 
 #### Testing Your Component's Confirm
 

package/src/lightning/datepicker/datepicker.html

@@ -1,7 +1,7 @@
 <template>
     <div class="slds-dropdown-trigger slds-dropdown-trigger_click slds-size_1-of-1" role="group" part="input-text">
         <template if:false={hasExternalLabel}>
-            <label class={computedLabelClass} for="input" part="label"  id="datepicker-label" data-form-label>
+            <label class={computedLabelClass} for="input" part="label">
                 <template if:true={required}>
                     <abbr class="slds-required" title={i18n.required}>*</abbr>
                 </template>
@@ -57,7 +57,7 @@
     </div>
 
     <template if:true={errorMessage}>
-        <div id="error-message" data-error-message class={computedClass} aria-live="assertive">{errorMessage}</div>
+        <div id="error-message" data-error-message class={computedClass}>{errorMessage}</div>
     </template>
 
 

package/src/lightning/datepicker/datepicker.js

@@ -98,11 +98,16 @@ export default class LightningDatePicker extends LightningElement {
 
     @api
     get rootAriaNode() {
-        return this.ariaObserver.root;
+        if (this.ariaObserver) {
+            return this.ariaObserver.root;
+        }
+        return null;
     }
 
     set rootAriaNode(root) {
-        this.ariaObserver.root = root;
+        if (this.ariaObserver) {
+            this.ariaObserver.root = root;
+        }
     }
 
     @api
@@ -192,12 +197,13 @@ export default class LightningDatePicker extends LightningElement {
 
     set ariaLabelledByElement(el) {
         this._ariaLabelledBy = el;
-
-        this.ariaObserver.connect({
-            attribute: ARIA_LABELLEDBY,
-            targetSelector: 'input',
-            relatedNodeIds: getRealDOMId(this._ariaLabelledBy),
-        });
+        if (this.ariaObserver) {
+            this.ariaObserver.connect({
+                attribute: ARIA_LABELLEDBY,
+                targetSelector: 'input',
+                relatedNodeIds: getRealDOMId(this._ariaLabelledBy),
+            });
+        }
     }
 
     @api
@@ -207,12 +213,13 @@ export default class LightningDatePicker extends LightningElement {
 
     set ariaControlsElement(el) {
         this._ariaControls = el;
-
-        this.ariaObserver.connect({
-            attribute: ARIA_CONTROLS,
-            targetSelector: 'input',
-            relatedNodeIds: getRealDOMId(this.ariaControlsElement),
-        });
+        if (this.ariaObserver) {
+            this.ariaObserver.connect({
+                attribute: ARIA_CONTROLS,
+                targetSelector: 'input',
+                relatedNodeIds: getRealDOMId(this.ariaControlsElement),
+            });
+        }
     }
 
     @api
@@ -415,10 +422,6 @@ export default class LightningDatePicker extends LightningElement {
         return this.template.querySelector('[data-error-message]');
     }
 
-    get labelElement() {
-        return this.template.querySelector('[data-form-label]');
-    }
-
     get rangeMessageElement() {
         return this.template.querySelector('[data-range-message]');
     }
@@ -457,7 +460,6 @@ export default class LightningDatePicker extends LightningElement {
         const elements = [this.ariaErrorMessageElement];
 
         if (this.errorMessage) {
-            elements.push(this.labelElement);
             elements.push(this.errorMessageElement);
         }
 
@@ -483,12 +485,14 @@ export default class LightningDatePicker extends LightningElement {
     }
 
     connectAriaDescribedBy() {
-        this.ariaObserver.connect({
-            attribute: ARIA_DESCRIBEDBY,
-            targetSelector: 'input',
-            relatedNodeIds: this.computedAriaDescribedby,
-            relatedNodes: this.ariaErrorMessageElements,
-        });
+        if (this.ariaObserver) {
+            this.ariaObserver.connect({
+                attribute: ARIA_DESCRIBEDBY,
+                targetSelector: 'input',
+                relatedNodeIds: this.computedAriaDescribedby,
+                relatedNodes: this.ariaErrorMessageElements,
+            });
+        }
     }
 
     get computedDatepickerButtonAriaDescribedby() {

package/src/lightning/datetimepicker/datetimepicker.html

@@ -54,7 +54,7 @@
                     </div>
                 </div>
             </div>
-            <div data-error-message id="errormessage" class={computedClass} aria-live="assertive">{customErrorMessage}</div>
+            <div data-error-message id="errormessage" class={computedClass}>{customErrorMessage}</div>
 
         </fieldset>
     </div>