lightning-base-components 1.20.1-alpha → 1.20.2-alpha

package/package.json

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

package/src/lightning/input/__docs__/input.md

@@ -59,7 +59,7 @@ supports the following input types:
 -   `checkbox`
 -   `checkbox-button`
 -   `date`
--   `datetime`
+-   `datetime`/`datetime-local`
 -   `time`
 -   `email`
 -   `file`
@@ -71,7 +71,9 @@ supports the following input types:
 -   `text` (default)
 -   `toggle`
 
-The following HTML input types are not supported.
+There is no behavioral difference between the `datetime` and `datetime-local` types.
+
+The following HTML input types aren't supported.
 
 -   `button`
 -   `hidden`
@@ -79,6 +81,8 @@ The following HTML input types are not supported.
 -   `radio`
 -   `reset`
 -   `submit`
+-   `week`
+-   `month`
 
 Use [`lightning-button`](bundle/lightning-button/documentation)
 instead for input types `button`, `reset`, and
@@ -87,6 +91,8 @@ instead for input types `button`, `reset`, and
 Use [`lightning-radio-group`](bundle/lightning-radio-group/documentation)
 instead of input type `radio` for radio buttons.
 
+Use [`lightning-combobox`](bundle/lightning-combobox/documentation) or input type `number` instead of input types `week` and `month`. The `week` and `month` types are browser-dependent and may cause issues with styling, accessibility, and general functionality in specific browsers.
+
 When working with forms that interact with Salesforce records, consider using the record form components. The `lightning-record-form`, `lightning-record-view-form`, and `lightning-record-edit-form` components provide a form-based UI that's metadata-driven. The components are automatically wired up to your record data, labels, and field-level help text. For more information, see [Work with Records Using Base Components](https://developer.salesforce.com/docs/platform/lwc/guide/data-get-user-input-intro).
 
 Alternatively, to create your own custom UI to work with Salesforce records, use `lightning-input` with the `lightning/ui*Api` wire adapters and functions, such as `getRecord` and `updateRecord`. For more information, see [Use the Wire Service with Base Components](https://developer.salesforce.com/docs/platform/lwc/guide/data-wire-base-components).

package/src/lightning/input/input.js

@@ -1815,16 +1815,21 @@ export default class LightningInput extends LightningElement {
      * @returns {boolean} - wether the value is valid or not
      */
     _validateType(type) {
+        if (VALID_INPUT_TYPES.includes(type)) {
+            return true;
+        }
+
+        const invalidMsg = `<lightning-input> The type attribute value "${type}" is invalid.`;
         assert(
             type !== 'hidden',
-            `<lightning-input> The type attribute value "hidden" is invalid. Use a regular <input type="hidden"> instead.`
+            `${invalidMsg} Use a regular <input type="hidden"> instead.`
         );
         assert(
             type !== 'submit' &&
                 type !== 'reset' &&
                 type !== 'image' &&
                 type !== 'button',
-            `<lightning-input> The type attribute value "${type}" is invalid. Use <lightning:button> instead.`
+            `${invalidMsg} Use <lightning:button> instead.`
         );
         if (this.isTypeRadio) {
             assert(
@@ -1832,12 +1837,19 @@ export default class LightningInput extends LightningElement {
                 `<lightning-input> The required attribute is not supported on radio inputs directly. It should be implemented at the radio group level.`
             );
         }
+
         if (type === 'phone') {
             console.warn(
-                `<lightning-input> The type attribute value "phone" is invalid. Please use <lightning-input type="tel"> instead. Defaulting to text type.`
+                `${invalidMsg} Please use <lightning-input type="tel"> instead. Defaulting to text type.`
             );
+        } else if (type === 'week' || type === 'month') {
+            console.warn(
+                `${invalidMsg} Please use <lightning-combobox> and/or <lightning-input type="number"> instead to avoid inconsistencies and breakages across browsers.`
+            );
+        } else {
+            console.warn(`${invalidMsg} Defaulting to text type.`);
         }
-        return VALID_INPUT_TYPES.includes(type);
+        return false;
     }
 
     /**