@brightspace-ui/core 2.2.1 → 2.3.2

package/components/inputs/input-text.js

@@ -1,11 +1,11 @@
 import '../tooltip/tooltip.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
-import { classMap } from 'lit-html/directives/class-map.js';
+import { css, html, LitElement } from 'lit';
+import { classMap } from 'lit/directives/class-map.js';
 import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { formatNumber } from '@brightspace-ui/intl/lib/number.js';
 import { FormElementMixin } from '../form/form-element-mixin.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
 import { inputLabelStyles } from './input-label-styles.js';
 import { inputStyles } from './input-styles.js';
 import { LabelledMixin } from '../../mixins/labelled-mixin.js';
@@ -13,7 +13,7 @@ import { offscreenStyles } from '../offscreen/offscreen.js';
 import { PerfMonitor } from '../../helpers/perfMonitor.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 import { SkeletonMixin } from '../skeleton/skeleton-mixin.js';
-import { styleMap } from 'lit-html/directives/style-map.js';
+import { styleMap } from 'lit/directives/style-map.js';
 
 /**
  * This component wraps the native "<input type="text">" tag and is intended primarily for inputting generic text, email addresses and URLs.

package/components/inputs/input-textarea.js

@@ -1,17 +1,17 @@
 import '../tooltip/tooltip.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { formatNumber } from '@brightspace-ui/intl/lib/number.js';
 import { FormElementMixin } from '../form/form-element-mixin.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
 import { inputLabelStyles } from './input-label-styles.js';
 import { inputStyles } from './input-styles.js';
 import { LabelledMixin } from '../../mixins/labelled-mixin.js';
 import { offscreenStyles } from '../offscreen/offscreen.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 import { SkeletonMixin } from '../skeleton/skeleton-mixin.js';
-import { styleMap } from 'lit-html/directives/style-map.js';
+import { styleMap } from 'lit/directives/style-map.js';
 
 /**
  * A wrapper around the native `<textarea>` element that provides auto-grow and validation behaviours intended for inputting unformatted multi-line text.

package/components/inputs/input-time-range.js

@@ -1,13 +1,13 @@
 import './input-date-time-range-to.js';
 import './input-fieldset.js';
 import '../tooltip/tooltip.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { formatDateInISOTime, formatTimeInISO, getAdjustedTime, getDateFromISOTime, isValidTime, parseISOTime } from '../../helpers/dateTime.js';
 import { getDefaultTime, getIntervalNumber, getTimeAtInterval } from './input-time.js';
 import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { FormElementMixin } from '../form/form-element-mixin.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
 import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 import { SkeletonMixin } from '../skeleton/skeleton-mixin.js';

package/components/inputs/input-time.js

@@ -3,14 +3,14 @@ import '../dropdown/dropdown-menu.js';
 import '../menu/menu.js';
 import '../menu/menu-item-radio.js';
 
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { formatDateInISOTime, getDateFromISOTime, getToday } from '../../helpers/dateTime.js';
 import { formatTime, parseTime } from '@brightspace-ui/intl/lib/dateTime.js';
 import { bodySmallStyles } from '../typography/styles.js';
 import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { FormElementMixin } from '../form/form-element-mixin.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
 import { inputLabelStyles } from './input-label-styles.js';
 import { inputStyles } from './input-styles.js';
 import { LabelledMixin } from '../../mixins/labelled-mixin.js';

package/components/link/README.md

@@ -76,7 +76,7 @@ Alternately, you can apply link styles to a native `<a>` element by importing th
 <!-- docs: demo code -->
 ```html
 <script type="module">
-  import { html, LitElement } from 'lit-element/lit-element.js';
+  import { html, LitElement } from 'lit';
   import { linkStyles } from '@brightspace-ui/core/components/link/link.js';
 
   class MyLinkElem extends LitElement {

package/components/link/link.js

@@ -1,8 +1,8 @@
 import '../colors/colors.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
-import { classMap } from 'lit-html/directives/class-map.js';
+import { css, html, LitElement } from 'lit';
+import { classMap } from 'lit/directives/class-map.js';
 import { FocusMixin } from '../../mixins/focus-mixin.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
 
 export const linkStyles = css`
 	.d2l-link, .d2l-link:visited, .d2l-link:active, .d2l-link:link {

package/components/list/README.md

@@ -221,7 +221,7 @@ If an item is draggable, the `drag-handle-text` attribute should be used to prov
   import '@brightspace-ui/core/components/list/list.js';
   import '@brightspace-ui/core/components/list/list-item.js';
   import '@brightspace-ui/core/components/list/list-item-content.js';
-  import { css, html, LitElement } from 'lit-element/lit-element.js';
+  import { css, html, LitElement } from 'lit';
 
   class ListDemoDragAndDropUsage extends LitElement {
     static get properties() {

package/components/list/demo/list-drag-and-drop-position.js

@@ -1,9 +1,9 @@
 import '../list-item-content.js';
 import '../list-item.js';
 import '../list.js';
-import { html, LitElement } from 'lit-element/lit-element.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
-import { repeat } from 'lit-html/directives/repeat.js';
+import { html, LitElement } from 'lit';
+import { ifDefined } from 'lit/directives/if-defined.js';
+import { repeat } from 'lit/directives/repeat.js';
 
 class ListDemoDragAndDropPosition extends LitElement {
 

package/components/list/demo/list-drag-and-drop.js

@@ -1,10 +1,10 @@
 import '../list-item-content.js';
 import '../list-item.js';
 import '../list.js';
-import { html, LitElement } from 'lit-element/lit-element.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
+import { html, LitElement } from 'lit';
+import { ifDefined } from 'lit/directives/if-defined.js';
 import { moveLocations } from '../list-item-drag-drop-mixin.js';
-import { repeat } from 'lit-html/directives/repeat.js';
+import { repeat } from 'lit/directives/repeat.js';
 
 class ListDemoDragAndDrop extends LitElement {
 

package/components/list/demo/list-item-custom.js

@@ -1,6 +1,6 @@
 import '../list.js';
 import '../list-item-content.js';
-import { html, LitElement } from 'lit-element/lit-element.js';
+import { html, LitElement } from 'lit';
 import { ListItemMixin } from '../list-item-mixin.js';
 
 const demoData = {

package/components/list/list-header.js

@@ -2,8 +2,8 @@ import '../overflow-group/overflow-group.js';
 import '../selection/selection-select-all.js';
 import '../selection/selection-select-all-pages.js';
 import '../selection/selection-summary.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
-import { classMap } from 'lit-html/directives/class-map.js';
+import { css, html, LitElement } from 'lit';
+import { classMap } from 'lit/directives/class-map.js';
 import { findComposedAncestor } from '../../helpers/dom.js';
 import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';

package/components/list/list-item-button-mixin.js

@@ -1,5 +1,5 @@
 import '../colors/colors.js';
-import { css, html } from 'lit-element/lit-element.js';
+import { css, html } from 'lit';
 import { getUniqueId } from '../../helpers/uniqueId.js';
 import { ListItemMixin } from './list-item-mixin.js';
 

package/components/list/list-item-button.js

@@ -1,5 +1,5 @@
 import { ListItemButtonMixin } from './list-item-button-mixin.js';
-import { LitElement } from 'lit-element/lit-element.js';
+import { LitElement } from 'lit';
 
 /**
  * A component for a "listitem" child within a list. It provides semantics, basic layout, breakpoints for responsiveness, a link for navigation, and selection.

package/components/list/list-item-checkbox-mixin.js

@@ -1,9 +1,8 @@
 import '../selection/selection-input.js';
-import { css, html } from 'lit-element/lit-element.js';
-import { classMap } from 'lit-html/directives/class-map.js';
+import { css, html, nothing } from 'lit';
+import { classMap } from 'lit/directives/class-map.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
 import { LabelledMixin } from '../../mixins/labelled-mixin.js';
-import { nothing } from 'lit-html';
 import { SelectionInfo } from '../selection/selection-mixin.js';
 import { SkeletonMixin } from '../skeleton/skeleton-mixin.js';
 

package/components/list/list-item-content.js

@@ -1,6 +1,6 @@
 import '../colors/colors.js';
 import { bodyCompactStyles, bodySmallStyles } from '../typography/styles.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 
 /**
  * A component for consistent layout of primary and secondary text in a list item.

package/components/list/list-item-drag-drop-mixin.js

@@ -1,12 +1,11 @@
 import './list-item-drag-image.js';
-import { css, html } from 'lit-element/lit-element.js';
+import { css, html, nothing } from 'lit';
 import { findComposedAncestor, isComposedAncestor } from '../../helpers/dom.js';
 import { announce } from '../../helpers/announce.js';
-import { classMap } from 'lit-html/directives/class-map.js';
+import { classMap } from 'lit/directives/class-map.js';
 import { dragActions } from './list-item-drag-handle.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
-import { nothing } from 'lit-html';
+import { ifDefined } from 'lit/directives/if-defined.js';
 import { SelectionInfo } from '../selection/selection-mixin.js';
 
 export const moveLocations = Object.freeze({

package/components/list/list-item-drag-handle.js

@@ -1,7 +1,7 @@
 import '../button/button-icon.js';
 import '../icons/icon.js';
 import '../tooltip/tooltip.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { buttonStyles } from '../button/button-styles.js';
 import { findComposedAncestor } from '../../helpers/dom.js';
 import { getFirstFocusableDescendant } from '../../helpers/focus.js';

package/components/list/list-item-drag-image.js

@@ -1,6 +1,6 @@
 import '../colors/colors.js';
 import '../inputs/input-checkbox.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { bodySmallStyles } from '../typography/styles.js';
 import { formatNumber } from '@brightspace-ui/intl/lib/number.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';

package/components/list/list-item-generic-layout.js

@@ -1,4 +1,4 @@
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { findComposedAncestor, getNextAncestorSibling, getPreviousAncestorSibling, isComposedAncestor } from '../../helpers/dom.js';
 import {
 	getComposedActiveElement,
@@ -121,6 +121,8 @@ class ListItemGenericLayout extends RtlMixin(LitElement) {
 			}
 			::slotted([slot="control-action"]) {
 				grid-column: control-start / end;
+				height: 100%;
+				width: 100%;
 				z-index: 2;
 			}
 			::slotted([slot="content-action"]) {

package/components/list/list-item-link-mixin.js

@@ -1,5 +1,5 @@
 import '../colors/colors.js';
-import { css, html } from 'lit-element/lit-element.js';
+import { css, html } from 'lit';
 import { getUniqueId } from '../../helpers/uniqueId.js';
 import { ListItemMixin } from './list-item-mixin.js';
 

package/components/list/list-item-mixin.js

@@ -2,17 +2,16 @@ import '../colors/colors.js';
 import './list-item-generic-layout.js';
 import './list-item-placement-marker.js';
 import '../tooltip/tooltip.js';
-import { css, html } from 'lit-element/lit-element.js';
+import { css, html, nothing } from 'lit';
 import { findComposedAncestor, getComposedParent } from '../../helpers/dom.js';
-import { classMap } from 'lit-html/directives/class-map.js';
+import { classMap } from 'lit/directives/class-map.js';
 import { getFirstFocusableDescendant } from '../../helpers/focus.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
 import { ListItemCheckboxMixin } from './list-item-checkbox-mixin.js';
 import { ListItemDragDropMixin } from './list-item-drag-drop-mixin.js';
 import { ListItemRoleMixin } from './list-item-role-mixin.js';
 import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
-import { nothing } from 'lit-html';
 import ResizeObserver from 'resize-observer-polyfill';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 

package/components/list/list-item-placement-marker.js

@@ -1,5 +1,5 @@
 import '../colors/colors.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 
 class ListItemPlacementMarker extends RtlMixin(LitElement) {

package/components/list/list-item.js

@@ -1,5 +1,5 @@
 import { ListItemLinkMixin } from './list-item-link-mixin.js';
-import { LitElement } from 'lit-element/lit-element.js';
+import { LitElement } from 'lit';
 
 /**
  * A component for a "listitem" child within a list. It provides semantics, basic layout, breakpoints for responsiveness, a link for navigation, and selection.

package/components/list/list.js

@@ -1,4 +1,4 @@
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { getNextFocusable, getPreviousFocusable } from '../../helpers/focus.js';
 import { SelectionInfo, SelectionMixin } from '../selection/selection-mixin.js';
 

package/components/loading-spinner/demo/loading-spinner-override.js

@@ -1,6 +1,6 @@
 import '../../colors/colors.js';
 import '../../loading-spinner/loading-spinner.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 
 class LoadingSpinnerOverride extends LitElement {
 

package/components/loading-spinner/loading-spinner.js

@@ -1,5 +1,5 @@
 import '../colors/colors.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 
 /**
  * A loading spinner component.

package/components/menu/demo/custom-menu-item.js

@@ -1,4 +1,4 @@
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { MenuItemMixin } from '../menu-item-mixin.js';
 import { menuItemStyles } from '../menu-item-styles.js';
 

package/components/menu/demo/custom-view.js

@@ -1,4 +1,4 @@
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { HierarchicalViewMixin } from '../../hierarchical-view/hierarchical-view-mixin.js';
 
 class CustomView extends HierarchicalViewMixin(LitElement) {

package/components/menu/menu-item-checkbox.js

@@ -1,5 +1,5 @@
 import '../icons/icon.js';
-import { html, LitElement } from 'lit-element/lit-element.js';
+import { html, LitElement } from 'lit';
 import { MenuItemSelectableMixin } from './menu-item-selectable-mixin.js';
 import { menuItemSelectableStyles } from './menu-item-selectable-styles.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';

package/components/menu/menu-item-link.js

@@ -1,5 +1,5 @@
-import { css, html, LitElement } from 'lit-element/lit-element.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
+import { css, html, LitElement } from 'lit';
+import { ifDefined } from 'lit/directives/if-defined.js';
 import { MenuItemMixin } from './menu-item-mixin.js';
 import { menuItemStyles } from './menu-item-styles.js';
 

package/components/menu/menu-item-radio.js

@@ -1,5 +1,5 @@
 import '../icons/icon.js';
-import { html, LitElement } from 'lit-element/lit-element.js';
+import { html, LitElement } from 'lit';
 import { MenuItemRadioMixin } from './menu-item-radio-mixin.js';
 import { menuItemSelectableStyles } from './menu-item-selectable-styles.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';

package/components/menu/menu-item-return.js

@@ -1,5 +1,5 @@
 import '../icons/icon.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { MenuItemMixin } from './menu-item-mixin.js';
 import { menuItemStyles } from './menu-item-styles.js';

package/components/menu/menu-item-selectable-styles.js

@@ -1,5 +1,5 @@
 import '../colors/colors.js';
-import { css } from 'lit-element/lit-element.js';
+import { css } from 'lit';
 import { menuItemStyles } from './menu-item-styles.js';
 
 export const menuItemSelectableStyles = [ menuItemStyles,

package/components/menu/menu-item-separator.js

@@ -1,4 +1,4 @@
-import { css, LitElement } from 'lit-element/lit-element.js';
+import { css, LitElement } from 'lit';
 
 /**
  * A component for displaying a more distinct separator between menu items.

package/components/menu/menu-item-styles.js

@@ -1,5 +1,5 @@
 import '../colors/colors.js';
-import { css } from 'lit-element/lit-element.js';
+import { css } from 'lit';
 
 export const menuItemStyles = css`
 	:host {

package/components/menu/menu-item.js

@@ -1,5 +1,5 @@
 import '../icons/icon.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { MenuItemMixin } from './menu-item-mixin.js';
 import { menuItemStyles } from './menu-item-styles.js';
 

package/components/menu/menu.js

@@ -1,7 +1,7 @@
 import '../colors/colors.js';
 import '../icons/icon.js';
 import './menu-item-return.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { HierarchicalViewMixin } from '../hierarchical-view/hierarchical-view-mixin.js';
 import { ThemeMixin } from '../../mixins/theme-mixin.js';
 

package/components/meter/meter-circle.js

@@ -1,7 +1,7 @@
 import '../colors/colors.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { bodyStandardStyles } from '../typography/styles.js';
-import { classMap } from 'lit-html/directives/class-map.js';
+import { classMap } from 'lit/directives/class-map.js';
 import { MeterMixin } from './meter-mixin.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 

package/components/meter/meter-linear.js

@@ -1,6 +1,6 @@
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { bodySmallStyles } from '../typography/styles.js';
-import { classMap } from 'lit-html/directives/class-map.js';
+import { classMap } from 'lit/directives/class-map.js';
 import { MeterMixin } from './meter-mixin.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 

package/components/meter/meter-radial.js

@@ -1,7 +1,7 @@
 import '../colors/colors.js';
 import { bodySmallStyles, heading4Styles } from '../typography/styles.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
-import { classMap } from 'lit-html/directives/class-map.js';
+import { css, html, LitElement } from 'lit';
+import { classMap } from 'lit/directives/class-map.js';
 import { MeterMixin } from './meter-mixin.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 

package/components/more-less/more-less.js

@@ -1,12 +1,12 @@
 import '../button/button-subtle.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { getComposedChildren, isComposedAncestor } from '../../helpers/dom.js';
-import { classMap } from 'lit-html/directives/class-map.js';
+import { classMap } from 'lit/directives/class-map.js';
 import { getUniqueId } from '../../helpers/uniqueId.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
 import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import ResizeObserver from 'resize-observer-polyfill/dist/ResizeObserver.es.js';
-import { styleMap } from 'lit-html/directives/style-map.js';
+import { styleMap } from 'lit/directives/style-map.js';
 
 /**
  * A component used to minimize the display of long content, while providing a way to reveal the full content.

package/components/offscreen/demo/offscreen-demo.js

@@ -1,4 +1,4 @@
-import { html, LitElement } from 'lit-element/lit-element.js';
+import { html, LitElement } from 'lit';
 import { offscreenStyles } from '../offscreen.js';
 
 class OffscreenDemo extends LitElement {

package/components/offscreen/offscreen.js

@@ -1,4 +1,4 @@
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 
 export const offscreenStyles = css`

package/components/overflow-group/overflow-group.js

@@ -10,8 +10,8 @@ import '../menu/menu.js';
 import '../menu/menu-item.js';
 import '../menu/menu-item-separator.js';
 import '../menu/menu-item-link.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
+import { css, html, LitElement } from 'lit';
+import { ifDefined } from 'lit/directives/if-defined.js';
 import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { offscreenStyles } from '../offscreen/offscreen.js';
 import ResizeObserver from 'resize-observer-polyfill/dist/ResizeObserver.es.js';

package/components/scroll-wrapper/demo/scroll-wrapper-test.js

@@ -1,8 +1,8 @@
 import '../scroll-wrapper.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { forceFocusVisible } from '../../../helpers/focus.js';
 import { RtlMixin } from '../../../mixins/rtl-mixin.js';
-import { styleMap } from 'lit-html/directives/style-map.js';
+import { styleMap } from 'lit/directives/style-map.js';
 
 class TestScrollWrapper extends RtlMixin(LitElement) {
 

package/components/scroll-wrapper/scroll-wrapper.js

@@ -1,8 +1,8 @@
 import '../colors/colors.js';
 import '../icons/icon.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { FocusVisiblePolyfillMixin } from '../../mixins/focus-visible-polyfill-mixin.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
 import ResizeObserver from 'resize-observer-polyfill/dist/ResizeObserver.es.js';
 import { RtlMixin } from '../../mixins/rtl-mixin.js';
 

package/components/selection/README.md

@@ -15,7 +15,7 @@ The selection components below work with a component that extends the `Selection
 <!-- docs: demo live name:d2l-demo-selection display:block -->
 ```html
 <script type="module">
-  import { css, html, LitElement } from 'lit-element/lit-element.js';
+  import { css, html, LitElement } from 'lit';
   import { SelectionMixin } from '@brightspace-ui/core/components/selection/selection-mixin.js';
 
   class CustomSelection extends SelectionMixin(LitElement) {

package/components/selection/demo/demo-selection.js

@@ -1,4 +1,4 @@
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { SelectionMixin } from '../selection-mixin.js';
 
 class DemoSelection extends SelectionMixin(LitElement) {

package/components/selection/selection-action-dropdown.js

@@ -1,9 +1,9 @@
 import '../button/button-subtle.js';
-import { html, LitElement } from 'lit-element/lit-element.js';
+import { html, LitElement } from 'lit';
 import { DropdownOpenerMixin } from '../dropdown/dropdown-opener-mixin.js';
 import { dropdownOpenerStyles } from '../dropdown/dropdown-opener-styles.js';
 import { FocusMixin } from '../../mixins/focus-mixin.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
 import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { SelectionActionMixin } from './selection-action-mixin.js';
 

package/components/selection/selection-action-menu-item.js

@@ -1,5 +1,5 @@
 import '../icons/icon.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { MenuItemMixin } from '../menu/menu-item-mixin.js';
 import { menuItemStyles } from '../menu/menu-item-styles.js';
 import { SelectionActionMixin } from './selection-action-mixin.js';

package/components/selection/selection-action.js

@@ -1,8 +1,8 @@
 import '../button/button-subtle.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { ButtonMixin } from '../button/button-mixin.js';
 import { FocusMixin } from '../../mixins/focus-mixin.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
 import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { SelectionActionMixin } from './selection-action-mixin.js';
 import { SelectionInfo } from './selection-mixin.js';

package/components/selection/selection-input.js

@@ -1,7 +1,7 @@
 import '../inputs/input-checkbox.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
-import { classMap } from 'lit-html/directives/class-map.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
+import { css, html, LitElement } from 'lit';
+import { classMap } from 'lit/directives/class-map.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
 import { LabelledMixin } from '../../mixins/labelled-mixin.js';
 import { radioStyles } from '../inputs/input-radio-styles.js';
 import { SkeletonMixin } from '../skeleton/skeleton-mixin.js';

package/components/selection/selection-select-all-pages.js

@@ -1,5 +1,5 @@
 import '../button/button-subtle.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { FocusMixin } from '../../mixins/focus-mixin.js';
 import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { SelectionInfo } from './selection-mixin.js';

package/components/selection/selection-select-all.js

@@ -1,7 +1,7 @@
 import '../inputs/input-checkbox.js';
-import { css, html, LitElement } from 'lit-element/lit-element.js';
+import { css, html, LitElement } from 'lit';
 import { FocusMixin } from '../../mixins/focus-mixin.js';
-import { ifDefined } from 'lit-html/directives/if-defined.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
 import { LocalizeCoreElement } from '../../helpers/localize-core-element.js';
 import { SelectionInfo } from './selection-mixin.js';
 import { SelectionObserverMixin } from './selection-observer-mixin.js';