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

package/src/lightning/toast/__docs__/toast.md

@@ -1,16 +1,14 @@
-The `LightningToast` component displays a toast notification with an icon, label, message, and links. Use a toast to convey small pieces of information to the user in a non-obtrusive way.
-
-This component is for internal use only.
+The `LightningToast` component displays a toast notification with an icon, label, message, and links. Use a toast to convey small pieces of information to the user, providing feedback and confirmation after the user takes an action. Toasts can disappear after a certain duration or until the user clicks the close button.
 
 ### Show a Toast
 
-To show a toast, simply calls the `Toast`'s static function `show(config, comp)` with the proper toast config and a reference of the local component as parameters.
+To show a toast, call the static function `show(config, comp)` from `lightning/toast` and provide a toast configuration and a reference of the local component as parameters.
 The function also creates a single page-level toast container if one does not exist.
 
 ```javascript
 // c/myComponent.js
 import { LightningElement } from 'lwc';
-import  Toast from 'lightning/toast';
+import Toast from 'lightning/toast';
 
 export default class MyComponent extends LightningElement {
     ...
@@ -42,28 +40,28 @@ export default class MyComponent extends LightningElement {
     }
 }
 ```
-Above shows a complete example a toast config, illustrating the two possible styles for specifying links (see note below). The container will display a sticky mode informational toast message with string stored in `label` as the toast title and string stored `message` as the toast message.  The `{0}`, `{1}`, and the `{salesforceLink}`, `{slackLink} `will be replaced with their specified link.
+In this example, the toast configuration uses two ways to specify links (see note below). The toast displays a sticky mode informational toast message with a `label` string as the toast title and a `message` string as the toast message.  The `{0}`, `{1}`, `{salesforceLink}`, and `{slackLink}` placeholders are replaced with their `url` specified links.
 
-The toast component will display and be managed in a page level `LightningToastContainer` component.
+A page-level [`LightningToastContainer` component](/docs/component-library/bundle/lightning-toast-container/documentation) manages and displays the toast component.
 
 **_NOTE:_** `label` can have index-based or name-based link placeholders. In the case of index-based link placeholders, `labelLinks` must be defined as an array, otherwise, `labelLinks` must be defined as a map. Same applies to `message`.
 
 ### Component Styling
 
-`LightningToast` implements the [toast](https://www.lightningdesignsystem.com/components/toast/) blueprint in the Salesforce Lightning Design System (SLDS).
+`LightningToast` implements the [toast](https://www.lightningdesignsystem.com/components/toast/) blueprint in the Salesforce Lightning Design System (SLDS). [SLDS styling hooks](https://www.lightningdesignsystem.com/components/toast/#Styling-Hooks-Overview) aren't supported with programmatic creation of toasts via `Toast.show()`.
 
 ### `config` attributes
 
- Attribute | Explanation  |
+ Attribute | Description  |
 |----------| ------------ |
-| `label` (required) | title of the toast, it can contain placeholders in the form of `{0} ... {N}` (index-based) or `{name} ... {someOtherName}` (name-based). The placeholders are replaced with the links on `labelLinks`. |
-| `labelLinks` | [{url, label}], which will replace the `{0} ... {N}` indexed placeholders in `label` or `{ name: {url, label} }`, which will replace the `{name} ... {someOtherName}` named placeholders in `label`. |
-| `message` | description of the toast, it can contain placeholders in the form of `{0} ... {N}` (index-based) or `{name} ... {someOtherName}` (name-based). The placeholders are replaced with the links on `messageLinks`. |
-| `messageLinks` | [{url, label}], which will replace the `{0} ... {N}` indexed placeholders in `message` or `{ name: {url, label} }`, which will replace the `{name} ... {someOtherName}` named placeholders in `message`. |
-| `variant` | appearance of the toast notice. |
-| `mode` | persistence of the toast. |
+| `label` (required) | Title of the toast, it can contain placeholders in the form of `{0} ... {N}` (index-based) or `{name} ... {someOtherName}` (name-based). The placeholders are replaced with the links on `labelLinks`. |
+| `labelLinks` | [{url, label}], which replaces the `{0} ... {N}` indexed placeholders in `label` or `{ name: {url, label} }`, which replaces the `{name} ... {someOtherName}` named placeholders in `label`. |
+| `message` | Description of the toast, it can contain placeholders in the form of `{0} ... {N}` (index-based) or `{name} ... {someOtherName}` (name-based). The placeholders are replaced with the links on `messageLinks`. |
+| `messageLinks` | [{url, label}], which replaces the `{0} ... {N}` indexed placeholders in `message` or `{ name: {url, label} }`, which replaces the `{name} ... {someOtherName}` named placeholders in `message`. |
+| `variant` | Appearance of the toast. |
+| `mode` | Persistence of the toast. |
 
-**_NOTE:_**  When `labelLinks` (or `messageLinks`) is provided in the config, the content of `label` (or `message`) will be rendered using [`lightning-formatted-rich-text`](https://developer.salesforce.com/docs/component-library/bundle/lightning-formatted-rich-text/documentation); consult the documentation for expected result when link presents.
+**_NOTE:_**  When `labelLinks` (or `messageLinks`) is passed to the `config` parameter, the content of `label` (or `message`) is rendered using [`lightning-formatted-rich-text`](https://developer.salesforce.com/docs/component-library/bundle/lightning-formatted-rich-text/documentation). consult the documentation for expected result when link presents.
 
 #### `variant` attribute
 
@@ -82,8 +80,8 @@ The `mode` attribute sets the component's dismissal. It supports these values.
 -   `dismissible` - The component automatically disappears after a certain duration. The user can dismiss it early by clicking the close button. The time duration for `dismissible` is 4.8 seconds, or 9.6 seconds if the toast contains a link.
 -   `sticky` - The component stays on screen until the user clicks the close button.
 
-##### Default Mode, When Mode Not Set
-If no `mode` is provided, the default `mode` will be determined by the value of `variant` and whether the `toast` has a link or links present in `label` or `message`.
+##### Default Mode
+If a `mode` value isn't provided, the default `mode` is determined by the value of `variant` and whether the `toast` has a link or links present in `label` or `message`.
 
 | Variant | Has link? | Default Mode |
 | --- | --- | --- |
@@ -98,6 +96,6 @@ If no `mode` is provided, the default `mode` will be determined by the value of
 
 #### Small screen / Mobile environment
 
-`LightningToast` is implemented to be responsive according to the screen resolution. For smaller screen or mobile environments, the toast's **icon** and **description** (i.e. text stored in `message`, and `messageLinks`) will **not be shown** due to the screen's width limitation (see [Toast blueprint screen variants](https://www.lightningdesignsystem.com/guidelines/messaging/components/toasts/#flavor-variants-screen).
+`LightningToast` is responsive to your screen resolution. For smaller screens or mobile environments, the toast's **icon** and **description** (i.e. text stored in `message`, and `messageLinks`) is **not shown** due to the screen's width limitation (see [Toast blueprint screen variants](https://www.lightningdesignsystem.com/guidelines/messaging/components/toasts/#flavor-variants-screen).
 
-The best practice where small screen and mobile environments are the primary use case is to only provide links in the toast's title (ie `label` and `labelLinks`) in order to have links visible and interactive.
+On small screens and mobile environments, we recommend that you provide links in the toast's title (ie `label` and `labelLinks`) in order to have links visible and interactive.

package/src/lightning/toast/toast.js-meta.xml

@@ -2,5 +2,5 @@
 <LightningComponentBundle xmlns="xmlns=http://soap.sforce.com/2006/04/metadata">
     <isExposed>true</isExposed>
      <minApiVersion>59.0</minApiVersion>
-    <support>BETA</support>
+    <support>GA</support>
 </LightningComponentBundle>

package/src/lightning/toastContainer/toastContainer.js-meta.xml

@@ -2,5 +2,5 @@
 <LightningComponentBundle xmlns="xmlns=http://soap.sforce.com/2006/04/metadata">
     <isExposed>true</isExposed>
     <minApiVersion>58.0</minApiVersion>
-    <support>BETA</support>
+    <support>GA</support>
 </LightningComponentBundle>

package/src/lightning/utilsPrivate/videoUtils.js

@@ -20,6 +20,7 @@ const ALLOWED_DOMAINS = new Set([
     's1.adis.ws',
     'scormanywhere.secure.force.com',
     'appiniummastertrial.secure.force.com',
+    'embed.app.guidde.com',
 ]);
 
 export function hasOnlyAllowedVideoIframes(htmlString) {
@@ -44,5 +45,15 @@ function isUrlAllowed(url) {
     const anchor = document.createElement('a');
     anchor.href = url;
 
-    return anchor.protocol === 'https:' && ALLOWED_DOMAINS.has(anchor.hostname);
+    if (anchor.protocol !== 'https:') {
+        return false;
+    }
+
+    if (anchor.hostname === 'vimeo.com') {
+        const path = anchor.pathname;
+        const regex = /^\/showcase\/\d+\/embed$/;
+        return path.match(regex) !== null;
+    }
+
+    return ALLOWED_DOMAINS.has(anchor.hostname);
 }