lightning-base-components 1.18.2-alpha → 1.18.4-alpha

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

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<LightningComponentBundle xmlns="xmlns=http://soap.sforce.com/2006/04/metadata">
+    <isExposed>true</isExposed>
+</LightningComponentBundle>

package/src/lightning/sldsUtilsThemes/sldsUtilsThemes.css

@@ -0,0 +1,295 @@
+/* Copyright (c) 2015-present, salesforce.com, inc. All rights reserved
+Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
+
+/**
+ *
+ * TODO: all the .slds-button--neutral related lines are commented out because unused by LBC.
+ * They are related to some legacy usage of the theme utilities with the link variant of the button neutral.
+ * The SLDS _themes.css uses the old BEM syntax and there may be a bug with part of the code that uses the new one.
+ * Also, the documentation on the SLDS site doesn't show any relevant examples
+ * (https://www.lightningdesignsystem.com/utilities/themes/)
+ *
+ * In addition, in the Native Shadow world, this construct may not work as expected with nested shadows.
+ * At the moment it doesn't make sense to include them in here, but keeping them commented out for discussion if needed
+ *
+ */
+
+/* .slds-theme {} */
+
+.slds-theme_default {
+    background-color: var(--slds-g-color-neutral-base-100, #fff);
+    color: var(--slds-g-color-neutral-base-10, #181818);
+}
+
+.slds-theme_shade {
+    background-color: var(--slds-g-color-neutral-base-95, #f3f3f3);
+}
+
+.slds-theme_inverse {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+    background-color: var(--slds-g-color-brand-base-10, #001639);
+    border-color: var(--slds-g-color-brand-base-10, #001639);
+}
+
+/* .slds-theme_inverse a:not(.slds-button--neutral) {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+    text-decoration: underline;
+}
+
+.slds-theme_inverse a:not(.slds-button--neutral):link,
+.slds-theme_inverse a:not(.slds-button--neutral):visited {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+}
+
+.slds-theme_inverse a:not(.slds-button--neutral):hover,
+.slds-theme_inverse a:not(.slds-button--neutral):focus {
+    text-decoration: none;
+}
+
+.slds-theme_inverse a:not(.slds-button--neutral):active {
+    color: var(--slds-g-color-neutral-100-opacity-50, rgb(255 255 255 / 50%));
+}
+
+.slds-theme_inverse a:not(.slds-button--neutral)[disabled] {
+    color: var(--slds-g-color-neutral-100-opacity-10, rgb(255 255 255 / 15%));
+} */
+
+.slds-theme_alt-inverse {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+    background-color: var(--slds-g-color-brand-base-20, #032d60);
+    border-color: var(--slds-g-color-brand-base-20, #032d60);
+}
+
+/* .slds-theme_alt-inverse a:not(.slds-button--neutral) {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+    text-decoration: underline;
+}
+
+.slds-theme_alt-inverse a:not(.slds-button--neutral):link,
+.slds-theme_alt-inverse a:not(.slds-button--neutral):visited {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+}
+
+.slds-theme_alt-inverse a:not(.slds-button--neutral):hover,
+.slds-theme_alt-inverse a:not(.slds-button--neutral):focus {
+    text-decoration: none;
+}
+
+.slds-theme_alt-inverse a:not(.slds-button--neutral):active {
+    color: var(--slds-g-color-neutral-100-opacity-50, rgb(255 255 255 / 50%));
+}
+
+.slds-theme_alt-inverse a:not(.slds-button--neutral)[disabled] {
+    color: var(--slds-g-color-neutral-100-opacity-10, rgb(255 255 255 / 15%));
+} */
+
+.slds-theme_success {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+    background-color: var(--slds-g-color-success-base-50, #2e844a);
+}
+
+/* .slds-theme_success a:not(.slds-button--neutral) {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+    text-decoration: underline;
+}
+
+.slds-theme_success a:not(.slds-button--neutral):link,
+.slds-theme_success a:not(.slds-button--neutral):visited {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+}
+
+.slds-theme_success a:not(.slds-button--neutral):hover,
+.slds-theme_success a:not(.slds-button--neutral):focus {
+    text-decoration: none;
+}
+
+.slds-theme_success a:not(.slds-button--neutral):active {
+    color: var(--slds-g-color-neutral-100-opacity-50, rgb(255 255 255 / 50%));
+}
+
+.slds-theme_success a:not(.slds-button--neutral)[disabled] {
+    color: var(--slds-g-color-neutral-100-opacity-10, rgb(255 255 255 / 15%));
+} */
+
+.slds-theme_info {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+    background-color: var(--slds-g-color-neutral-base-50, #747474);
+}
+
+/* .slds-theme_info a:not(.slds-button--neutral) {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+    text-decoration: underline;
+}
+
+.slds-theme_info a:not(.slds-button--neutral):link,
+.slds-theme_info a:not(.slds-button--neutral):visited {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+}
+
+.slds-theme_info a:not(.slds-button--neutral):hover,
+.slds-theme_info a:not(.slds-button--neutral):focus {
+    text-decoration: none;
+}
+
+.slds-theme_info a:not(.slds-button--neutral):active {
+    color: var(--slds-g-color-neutral-100-opacity-50, rgb(255 255 255 / 50%));
+}
+
+.slds-theme_info a:not(.slds-button--neutral)[disabled] {
+    color: var(--slds-g-color-neutral-100-opacity-10, rgb(255 255 255 / 15%));
+} */
+
+.slds-theme_warning {
+    background-color: var(--slds-g-color-warning-base-60, #fe9339);
+    color: var(--slds-g-color-neutral-base-10, #181818);
+}
+
+/**
+ * TODO: Unsure why .slds-theme_warning involves more css for links and buttons
+ * It seems to be related to legacy implementation.
+ * However, the color contrast doesn't seem to be compliant.
+ * In addition, we may not want to have the same implementation in Native Shadow.
+ * For the time being it's better to keep these selectors disabled, and have the
+ * warning theme to have similar behavior as the other ones.
+ *
+ */
+
+/* .slds-theme_warning a {
+    color: var(--slds-g-color-neutral-base-10, #181818);
+    text-decoration: underline;
+}
+
+.slds-theme_warning a:link,
+.slds-theme_warning a:visited {
+    color: var(--slds-g-color-neutral-base-10, #181818);
+}
+
+.slds-theme_warning a:hover,
+.slds-theme_warning a:focus {
+    text-decoration: none;
+}
+
+.slds-theme_warning a:focus {
+    box-shadow: 0 0 3px var(--slds-g-color-neutral-base-30, #514f4d);
+    border: 1px solid var(--slds-g-color-neutral-base-30, #514f4d);
+}
+
+.slds-theme_warning a:active {
+    color: var(--slds-g-color-neutral-base-30, #514f4d);
+}
+
+.slds-theme_warning a[disabled] {
+    color: var(--slds-g-color-neutral-base-30, #514f4d);
+}
+
+.slds-theme_warning button {
+    color: var(--slds-g-color-neutral-base-30, #514f4d);
+    text-decoration: underline;
+}
+
+.slds-theme_warning button:hover {
+    color: var(--slds-g-color-neutral-base-50, #706e6b);
+}
+
+.slds-theme_warning button:focus {
+    color: var(--slds-g-color-neutral-base-30, #514f4d);
+    box-shadow: 0 0 3px var(--slds-g-color-neutral-base-30, #514f4d);
+    border: 1px solid var(--slds-g-color-neutral-base-30, #514f4d);
+}
+
+.slds-theme_warning button:active {
+    color: var(--slds-g-color-neutral-base-50, #706e6b);
+}
+
+.slds-theme_warning .slds-icon,
+.slds-theme_warning .slds-button__icon {
+    fill: var(--slds-g-color-neutral-base-30, #514f4d);
+} */
+
+.slds-theme_error {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+    background-color: var(--slds-g-color-error-base-40, #ea001e);
+}
+
+/* .slds-theme_error a:not(.slds-button--neutral) {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+    text-decoration: underline;
+}
+
+.slds-theme_error a:not(.slds-button--neutral):link,
+.slds-theme_error a:not(.slds-button--neutral):visited {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+}
+
+.slds-theme_error a:not(.slds-button--neutral):hover,
+.slds-theme_error a:not(.slds-button--neutral):focus {
+    text-decoration: none;
+}
+
+.slds-theme_error a:not(.slds-button--neutral):active {
+    color: var(--slds-g-color-neutral-100-opacity-50, rgb(255 255 255 / 50%));
+}
+
+.slds-theme_error a:not(.slds-button--neutral)[disabled] {
+    color: var(--slds-g-color-neutral-100-opacity-10, rgb(255 255 255 / 15%));
+} */
+
+.slds-theme_offline {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+    background-color: var(--slds-g-color-neutral-base-30, #444);
+}
+
+/* .slds-theme_offline a:not(.slds-button--neutral) {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+    text-decoration: underline;
+}
+
+.slds-theme_offline a:not(.slds-button--neutral):link,
+.slds-theme_offline a:not(.slds-button--neutral):visited {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+}
+
+.slds-theme_offline a:not(.slds-button--neutral):hover,
+.slds-theme_offline a:not(.slds-button--neutral):focus {
+    text-decoration: none;
+}
+
+.slds-theme_offline a:not(.slds-button--neutral):active {
+    color: var(--slds-g-color-neutral-100-opacity-50, rgb(255 255 255 / 50%));
+}
+
+.slds-theme_offline a:not(.slds-button--neutral)[disabled] {
+    color: var(--slds-g-color-neutral-100-opacity-10, rgb(255 255 255 / 15%));
+} */
+
+.slds-theme_alert-texture {
+    background-image: linear-gradient(45deg, rgb(0 0 0 / 2.5%) 25%, transparent 25%, transparent 50%, rgb(0 0 0 / 2.5%) 50%, rgb(0 0 0 / 2.5%) 75%, transparent 75%, transparent);
+    background-size: 64px 64px;
+}
+
+.slds-theme_inverse-text {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+}
+
+/* .slds-theme_inverse-text a:not(.slds-button--neutral) {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+    text-decoration: underline;
+}
+
+.slds-theme_inverse-text a:not(.slds-button--neutral):link,
+.slds-theme_inverse-text a:not(.slds-button--neutral):visited {
+    color: var(--slds-g-color-neutral-base-100, #fff);
+}
+
+.slds-theme_inverse-text a:not(.slds-button--neutral):hover,
+.slds-theme_inverse-text a:not(.slds-button--neutral):focus {
+    text-decoration: none;
+}
+
+.slds-theme_inverse-text a:not(.slds-button--neutral):active {
+    color: var(--slds-g-color-neutral-100-opacity-50, rgb(255 255 255 / 50%));
+}
+
+.slds-theme_inverse-text a:not(.slds-button--neutral)[disabled] {
+    color: var(--slds-g-color-neutral-100-opacity-10, rgb(255 255 255 / 15%));
+} */

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

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<LightningComponentBundle xmlns="xmlns=http://soap.sforce.com/2006/04/metadata">
+    <isExposed>true</isExposed>
+</LightningComponentBundle>

package/src/lightning/sldsUtilsTruncation/sldsUtilsTruncation.css

@@ -0,0 +1,14 @@
+/* Copyright (c) 2015-present, salesforce.com, inc. All rights reserved
+Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
+
+/**
+ * Notes:
+ * - Some of the selectors available in SLDS were not included here, because they are unused in LBC
+ */
+
+.slds-truncate {
+    max-width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}

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

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<LightningComponentBundle xmlns="xmlns=http://soap.sforce.com/2006/04/metadata">
+    <isExposed>true</isExposed>
+</LightningComponentBundle>

package/src/lightning/slider/__docs__/slider.md

@@ -86,8 +86,8 @@ To apply custom styling, use the `:host` selector. Use SLDS styling hooks to cus
 
 ```css
 :host {
-    --sds-c-slider-track-color-background: orange;
-    --sds-c-slider-thumb-color-foreground: black;
+    --slds-c-slider-track-color-background: orange;
+    --slds-c-slider-thumb-color-foreground: black;
 }
 ```
 

package/src/lightning/tabset/__docs__/tabset.md

@@ -133,11 +133,11 @@ To change the text color on the active tab, define a custom class using the `cla
 </lightning-tabset>
 ```
 
-Specify the text color using the `--sds-c-tabs-scoped-color-text-active` custom property.
+Specify the text color using the `--slds-c-tabs-scoped-color-text-active` custom property.
 
 ```css
 .tab-active {
-    --sds-c-tabs-scoped-color-text-active: red;
+    --slds-c-tabs-scoped-color-text-active: red;
 }
 ```
 

package/src/lightning/textarea/__docs__/textarea.md

@@ -226,11 +226,11 @@ This example adds padding on top of the textarea using an SLDS class.
 </lightning-textarea>
 ```
 
-To apply custom styling, use the `:host` selector. Use SLDS styling hooks to customize the component's styles. For example, specify the minimum height using the `--sds-c-textarea-sizing-min-height` custom property.
+To apply custom styling, use the `:host` selector. Use SLDS styling hooks to customize the component's styles. For example, specify the minimum height using the `--slds-c-textarea-sizing-min-height` custom property.
 
 ```css
 :host {
-    --sds-c-textarea-sizing-min-height: 200px;
+    --slds-c-textarea-sizing-min-height: 200px;
 }
 ```
 

package/src/lightning/timepicker/timepicker.js

@@ -4,7 +4,8 @@ import labelRangeOverflow from '@salesforce/label/LightningDateTimePicker.rangeO
 import labelRangeUnderflow from '@salesforce/label/LightningDateTimePicker.rangeUnderflow';
 import labelRequired from '@salesforce/label/LightningControl.required';
 import labelHelpTextAlternativeText from '@salesforce/label/LightningInput.helptextAlternativeText';
-import { LightningElement, track, api } from 'lwc';
+import { track, api } from 'lwc';
+import LightningShadowBaseClass from 'lightning/shadowBaseClassPrivate';
 import { getTimeToHighlight } from './utils';
 import { classSet, formatLabel } from 'lightning/utils';
 import {
@@ -40,7 +41,7 @@ const TIME_STYLE = {
     LONG: 'long',
 };
 
-export default class LightningTimePicker extends LightningElement {
+export default class LightningTimePicker extends LightningShadowBaseClass {
     static delegatesFocus = true;
 
     @track _disabled = false;
@@ -276,6 +277,7 @@ export default class LightningTimePicker extends LightningElement {
     }
 
     connectedCallback() {
+        super.connectedCallback();
         this.connected = true;
     }
 

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

@@ -1,4 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <LightningComponentBundle xmlns="xmlns=http://soap.sforce.com/2006/04/metadata">
     <isExposed>true</isExposed>
+     <minApiVersion>59.0</minApiVersion>
+    <support>BETA</support>
 </LightningComponentBundle>

package/src/lightning/toastContainer/__docs__/toastContainer.md

@@ -1,40 +1,24 @@
-The `lightning-toast-container` component manages a list of toast components and its order. Currently, a single page-level toast container is supported.
+Use the `lightning/toastContainer` module (Beta) to manage a list of toast components and their order. Pages support a single page-level toast container. 
 
-The component uses `LightningToast` as the toast component to display messages.
+This module is available only for LWR Sites for Experience Cloud. For more information, see [Create Components for LWR Sites](https://developer.salesforce.com/docs/atlas.en-us.exp_cloud_lwr.meta/exp_cloud_lwr/get_started_components.htm).
 
-Set the maximum of toasts shown at a time with the `maxToasts` attribute, set the position of the component relative to its container component with `containerPosition` attribute and set the toasts position with `toastPosition` attribute.
-
-The following example will create a toast container component. This component will handle and display all the page-level toast messages. Only 1 page-level container exists at a time.
-
-By default, the toast container shows, at most, 3 toast notifications at the same time.  The most recent toast will display visually at the top or first, and the oldest toast notification will be displayed at the bottom of the toast container, or last. The container position is fixed to the viewport and the toast component will display at the top and center of the container.
+This example creates a basic toast container component that handles and displays all the page-level toast messages.
 
 ```javascript
 const toastContainer = ToastContainer.instance();
 ```
 
-### Component attributes
-
-The `maxToasts` attribute sets the maximum number of toasts shown in the container. It accepts any non-zero positive number. Default value is 3.
+#### Customization
 
-The `containerPosition` attribute changes the container position. It supports these values.
+By default, the toast container shows a maximum of 3 toast notifications at the same time. Set the `maxToasts` attribute to change the maximum number of toasts shown at a time.
 
-| Value | Explanation  |
-|-------| ------------ |
-| `fixed` (default) |  positioned relative to the initial containing block established by the viewport |
-| `absolute` | positioned relative to its closest positioned ancestor |
+Toast components display at the top center of the container by default. The most recent toast displays at the top of the container, and the oldest toast notification displays at the bottom. Change the toasts' position in the container with the `toastPosition` attribute.
 
-The `toastPosition` attribute sets the toast components position in the container.
+The container position is fixed to the viewport. Adjust the position of the container relative to its parent element with the `containerPosition` attribute. This attribute has two values. 
+- `fixed` - positions the container relative to the initial containing block established by the viewport.
+- `absolute` - positions the container relative to a positioned parent element.
 
-| Value | Explanation  |
-|-------| ------------ |
-| `top-center` (default) | toasts shown at top-center in the container |
-| `top-left` | toasts shown at top-left in the container |
-| `top-right` | toasts shown at top-right in the container |
-| `bottom-center` | toasts shown at bottom-center in the container |
-| `bottom-left` | toasts shown at bottom-left in the container |
-| `bottom-right` | toasts shown at bottom-right in the container |
-
-The following example changes the page-level toast container to show at most 5 toast messages at one time at the top-right in the viewport (i.e. `containerPosition` is `fixed` by default).
+This example creates a page-level toast container in the top-right in the viewport that shows a maximum of 5 toast messages at one time.
 ```javascript
 // c/myApp.js
 import { LightningElement } from 'lwc';
@@ -49,11 +33,7 @@ export default class MyApp extends LightningElement {
 }
 ```
 
-### Keyboard accessibility
-Toast container is part of the [global focus orchestration](https://www.lightningdesignsystem.com/accessibility/guidelines/global-focus/#global-orchestration) which allows users to use the keyboard shortcut to navigate between toasts:
-- Press `Command` + `F6` for Mac OS or `Control` + `F6` for others to move focus to next toast, if any
-- Press `Shift` + `Command` + `F6` for Mac OS or `Shift` +`Control` + `F6` for others to move focus to the previous toast, if any.
-
-
-### Future support (244+)
-- Local toast container support - allows multiple toast containers in a page. A component can have its own toast container to display toast messages relevant to the component's context.
+#### Accessibility
+Toast container follows the SLDS [Global Focus Orchestration](https://www.lightningdesignsystem.com/accessibility/guidelines/global-focus/#global-orchestration) accessibility guidelines, which allow users to use the keyboard shortcut to navigate between toasts.
+- Press `Control` + `F6` or `Command` + `F6` for Mac OS to move focus to next toast, if any.
+- Press `Shift` + `Control` + `F6` or `Shift` + `Command` + `F6` for Mac OS to move focus to the previous toast, if any.

package/src/lightning/toastContainer/toastContainer.js

@@ -96,11 +96,9 @@ export default class ToastContainer extends LightningOverlay {
     }
 
     /**
-     * toast container position
-     * controls the position of the toast container div related to the containing element
-     * options: 'absolute', 'fixed'
-     * @returns {string}
-     * @default 'fixed'
+     * Controls the position of the toast container <div> related to the containing element. Supported values are 'absolute' and 'fixed'.
+     * @type {string}
+     * @default fixed
      */
     @api get containerPosition() {
         return this._containerPosition;
@@ -117,9 +115,8 @@ export default class ToastContainer extends LightningOverlay {
     }
 
     /**
-     * this attribute controls the maximum number of toast components shown at a given time
-     * if user enters a zero or negative number, the value will default to 3
-     * @returns {number}
+     * Sets the maximum number of toast components shown at a given time.
+     * @type {number}
      * @default 3
      */
     @api get maxToasts() {
@@ -134,7 +131,7 @@ export default class ToastContainer extends LightningOverlay {
     }
 
     /**
-     * return the div element which hosts the toast components
+     * Returns the <div> element that hosts the toast components.
      * @return {HTMLElement}
      */
     get root() {
@@ -142,11 +139,9 @@ export default class ToastContainer extends LightningOverlay {
     }
 
     /**
-     * toast position
-     * controls the final position of toast components shown in the toast container
-     * options: 'top-left', 'top-center', 'top-right', 'bottom-left', 'bottom-center', 'bottom-right'
-     * @returns {string}
-     * @default 'top-center'
+     * Controls the position of toast components inside the toast container. Supported values are 'top-left', 'top-center', 'top-right', 'bottom-left', 'bottom-center', and 'bottom-right'.
+     * @type {string}
+     * @default top-center
      */
     @api get toastPosition() {
         return this._toastPosition;
@@ -167,7 +162,7 @@ export default class ToastContainer extends LightningOverlay {
     }
 
     /**
-     * override function to "close" the toast container (i.e. remove it from the DOM)
+     * Overrides the "close" function of the toast container.
      */
     @api close() {
         // reset before closing the container

package/src/lightning/tooltipLibrary/tooltipLibrary.js

@@ -1,6 +1,6 @@
 import { createElement } from 'lwc';
 import { AutoPosition, Direction } from 'lightning/positionLibrary';
-import { assert, guid, normalizeString } from 'lightning/utilsPrivate';
+import { assert, guid, normalizeString, isCSR } from 'lightning/utilsPrivate';
 import LightningPrimitiveBubble from 'lightning/primitiveBubble';
 import AriaObserver from 'lightning/ariaObserver';
 export { Direction } from 'lightning/positionLibrary';
@@ -105,7 +105,7 @@ export class Tooltip {
 
         // If a tooltip element is not given, fall back on the globally shared instance.
         this._element = config.element;
-        if (!this._element) {
+        if (isCSR && !this._element) {
             this._element = getCachedBubbleElement;
             const bubbleElement = getCachedBubbleElement();
             if (bubbleElement.parentNode === null) {
@@ -173,9 +173,16 @@ export class Tooltip {
             );
             // Unlike the tooltip in Aura, we want clicks and keys to dismiss the tooltip.
             ['mouseleave', 'blur', 'click', 'keydown'].forEach((name) =>
-                target.addEventListener(name, (event) =>
-                    this.hideIfNotSelfCover(event)
-                )
+                target.addEventListener(name, (event) => {
+                    if (!this._visible) {
+                        return;
+                    }
+                    this.hideIfNotSelfCover(event);
+
+                    if (event.key === 'Escape') {
+                        event.stopPropagation();
+                    }
+                })
             );
         }
     }

package/src/lightning/iconUtils/isIframeInEdge.js

@@ -1,7 +0,0 @@
-// Taken from https://github.com/jonathantneal/svg4everybody/pull/139
-// Remove this iframe-in-edge check once the following is resolved https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/8323875/
-const isEdgeUA = /\bEdge\/.(\d+)\b/.test(navigator.userAgent);
-const inIframe = window.top !== window.self;
-const isIframeInEdge = isEdgeUA && inIframe;
-
-export default isIframeInEdge;

package/src/lightning/iconUtils/supportsSvg.js

@@ -1,16 +0,0 @@
-import isIframeInEdge from './isIframeInEdge';
-
-// Taken from https://git.soma.salesforce.com/aura/lightning-global/blob/999dc35f948246181510df6e56f45ad4955032c2/src/main/components/lightning/SVGLibrary/stamper.js#L89-L98
-// Which looks like it was inspired by https://github.com/jonathantneal/svg4everybody/blob/377d27208fcad3671ed466e9511556cb9c8b5bd8/lib/svg4everybody.js#L92-L107
-// Modify at your own risk!
-const newerIEUA = /\bTrident\/[567]\b|\bMSIE (?:9|10)\.0\b/;
-const webkitUA = /\bAppleWebKit\/(\d+)\b/;
-const olderEdgeUA = /\bEdge\/12\.(\d+)\b/;
-const isIE =
-    newerIEUA.test(navigator.userAgent) ||
-    (navigator.userAgent.match(olderEdgeUA) || [])[1] < 10547 ||
-    (navigator.userAgent.match(webkitUA) || [])[1] < 537;
-
-const supportsSvg = !isIE && !isIframeInEdge;
-
-export default supportsSvg;