@covalent/components 11.9.0 → 11.10.0

package/app-shell.js

@@ -23,6 +23,7 @@
           </cv-top-app-bar-fixed>
         </span>
         <nav
+          part="navigation"
           class="navigation mdc-drawer ${p.o(n)}"
           @mouseenter="${this._handleNavMouseOver}"
           @mouseleave="${this._handleNavMouseOut}"
@@ -40,7 +41,7 @@
         </nav>
         ${d}
         <slot name="mini-list"></slot>
-        <div class="main mdc-drawer-app-content">
+        <div part="main-wrapper" class="main mdc-drawer-app-content">
           <div class="main-wrapper">
             <slot name="user-menu"></slot>
             ${this.renderMain()}

package/app-shell.mjs

@@ -1,4 +1,4 @@
-import { r as g, i as v, l as m, A as p, x as s, e as f } from "./query-assigned-elements-D930kELM.mjs";
+import { r as g, i as v, l as m, A as c, x as s, e as f } from "./query-assigned-elements-D930kELM.mjs";
 import { n } from "./property-DJzm_oB9.mjs";
 import { o as h } from "./class-map-DPUylGZM.mjs";
 import { D as u } from "./mwc-drawer-base-BKjve51A.mjs";
@@ -7,8 +7,8 @@ import "./icon-button.mjs";
 import "./card.mjs";
 const w = '.mdc-drawer .mdc-drawer__title{color:#000000de}.mdc-drawer .mdc-deprecated-list-group__subheader,.mdc-drawer .mdc-drawer__subtitle{color:#0009}.mdc-drawer{border-color:#0000001f;background-color:#fff;background-color:var(--mdc-theme-surface, #fff)}.mdc-drawer .mdc-deprecated-list-item__graphic{color:#0009}.mdc-drawer .mdc-deprecated-list-item{color:#000000de}.mdc-drawer .mdc-deprecated-list-item--activated .mdc-deprecated-list-item__graphic{color:#6200ee}.mdc-drawer .mdc-deprecated-list-item--activated{color:#6200eede}.mdc-drawer{border-top-left-radius:0;border-top-right-radius:0;border-top-right-radius:var(--mdc-shape-large, 0);border-bottom-right-radius:0;border-bottom-right-radius:var(--mdc-shape-large, 0);border-bottom-left-radius:0}[dir=rtl] .mdc-drawer,.mdc-drawer[dir=rtl]{border-top-left-radius:0;border-top-left-radius:var(--mdc-shape-large, 0);border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:0;border-bottom-left-radius:var(--mdc-shape-large, 0)}.mdc-drawer .mdc-deprecated-list-item{border-radius:4px;border-radius:var(--mdc-shape-small, 4px)}.mdc-drawer{z-index:6;width:256px}.mdc-drawer.mdc-drawer--open:not(.mdc-drawer--closing)+.mdc-drawer-app-content{margin-left:256px;margin-right:0}[dir=rtl] .mdc-drawer.mdc-drawer--open:not(.mdc-drawer--closing)+.mdc-drawer-app-content,.mdc-drawer.mdc-drawer--open:not(.mdc-drawer--closing)+.mdc-drawer-app-content[dir=rtl]{margin-left:0;margin-right:256px}.mdc-drawer{display:flex;flex-direction:column;flex-shrink:0;box-sizing:border-box;height:100%;border-right-width:1px;border-right-style:solid;overflow:hidden}[dir=rtl] .mdc-drawer,.mdc-drawer[dir=rtl]{border-right-width:0;border-left-width:1px;border-right-style:none;border-left-style:solid}.mdc-drawer{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1)}.mdc-drawer .mdc-deprecated-list-item{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-subtitle2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.875rem;font-size:var(--mdc-typography-subtitle2-font-size, .875rem);line-height:1.375rem;line-height:var(--mdc-typography-subtitle2-line-height, 1.375rem);font-weight:500;font-weight:var(--mdc-typography-subtitle2-font-weight, 500);letter-spacing:.0071428571em;letter-spacing:var(--mdc-typography-subtitle2-letter-spacing, .0071428571em);text-decoration:inherit;text-decoration:var(--mdc-typography-subtitle2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle2-text-transform, inherit);height:40px;margin:8px;padding:0 8px}.mdc-drawer .mdc-deprecated-list-item:nth-child(1){margin-top:2px}.mdc-drawer .mdc-deprecated-list-item:nth-last-child(1){margin-bottom:0}.mdc-drawer .mdc-deprecated-list-group__subheader{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.875rem;font-size:var(--mdc-typography-body2-font-size, .875rem);line-height:1.25rem;line-height:var(--mdc-typography-body2-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:.0178571429em;letter-spacing:var(--mdc-typography-body2-letter-spacing, .0178571429em);text-decoration:inherit;text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-body2-text-transform, inherit);display:block}.mdc-drawer .mdc-deprecated-list-group__subheader:before{display:inline-block;width:0;height:24px;content:"";vertical-align:0}.mdc-drawer .mdc-deprecated-list-group__subheader{line-height:normal;margin:0;padding:0 16px}.mdc-drawer .mdc-deprecated-list-divider{margin:3px 0 4px}.mdc-drawer .mdc-deprecated-list-item__text,.mdc-drawer .mdc-deprecated-list-item__graphic{pointer-events:none}.mdc-drawer--animate{transform:translate(-100%)}[dir=rtl] .mdc-drawer--animate,.mdc-drawer--animate[dir=rtl]{transform:translate(100%)}.mdc-drawer--opening,[dir=rtl] .mdc-drawer--opening,.mdc-drawer--opening[dir=rtl]{transform:translate(0)}.mdc-drawer--opening{transition-duration:.25s}.mdc-drawer--closing{transform:translate(-100%)}[dir=rtl] .mdc-drawer--closing,.mdc-drawer--closing[dir=rtl]{transform:translate(100%)}.mdc-drawer--closing{transition-duration:.2s}.mdc-drawer__header{flex-shrink:0;box-sizing:border-box;min-height:64px;padding:0 16px 4px}.mdc-drawer__title{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-headline6-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:1.25rem;font-size:var(--mdc-typography-headline6-font-size, 1.25rem);line-height:2rem;line-height:var(--mdc-typography-headline6-line-height, 2rem);font-weight:500;font-weight:var(--mdc-typography-headline6-font-weight, 500);letter-spacing:.0125em;letter-spacing:var(--mdc-typography-headline6-letter-spacing, .0125em);text-decoration:inherit;text-decoration:var(--mdc-typography-headline6-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-headline6-text-transform, inherit);display:block}.mdc-drawer__title:before{display:inline-block;width:0;height:36px;content:"";vertical-align:0}.mdc-drawer__title:after{display:inline-block;width:0;height:20px;content:"";vertical-align:-20px}.mdc-drawer__title{margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-drawer__subtitle{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto,sans-serif;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:.875rem;font-size:var(--mdc-typography-body2-font-size, .875rem);line-height:1.25rem;line-height:var(--mdc-typography-body2-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:.0178571429em;letter-spacing:var(--mdc-typography-body2-letter-spacing, .0178571429em);text-decoration:inherit;text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-body2-text-transform, inherit);display:block}.mdc-drawer__subtitle:before{display:inline-block;width:0;height:20px;content:"";vertical-align:0}.mdc-drawer__subtitle{margin-top:0;line-height:normal;margin-bottom:0}.mdc-drawer__content{height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch}.mdc-drawer--dismissible{left:0;right:initial}[dir=rtl] .mdc-drawer--dismissible,.mdc-drawer--dismissible[dir=rtl]{left:initial;right:0}.mdc-drawer--dismissible{display:none;position:absolute}.mdc-drawer--dismissible.mdc-drawer--open{display:flex}.mdc-drawer-app-content,[dir=rtl] .mdc-drawer-app-content,.mdc-drawer-app-content[dir=rtl]{margin-left:0;margin-right:0}.mdc-drawer-app-content{position:relative}.mdc-drawer--modal+.mdc-drawer-scrim{background-color:#00000052}.mdc-drawer--modal{box-shadow:0 8px 10px -5px #0003,0 16px 24px 2px #00000024,0 6px 30px 5px #0000001f;left:0;right:initial}[dir=rtl] .mdc-drawer--modal,.mdc-drawer--modal[dir=rtl]{left:initial;right:0}.mdc-drawer--modal{display:none;position:fixed}.mdc-drawer--modal.mdc-drawer--open{display:flex}.mdc-drawer-scrim{display:none;position:fixed;top:0;left:0;width:100%;height:100%;z-index:5;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}.mdc-drawer--open+.mdc-drawer-scrim{display:block}.mdc-drawer--animate+.mdc-drawer-scrim{opacity:0}.mdc-drawer--opening+.mdc-drawer-scrim{transition-duration:.25s;opacity:1}.mdc-drawer--closing+.mdc-drawer-scrim{transition-duration:.2s;opacity:0}:host{--cv-border-radius-outer: 28px}:host .navigation{--mdc-theme-surface: var(--mdc-theme-background);--mdc-list-vertical-padding: 0;--cv-list-padding-right: 0;--cv-list-padding-left: 12px;--cv-list-item-border-radius: 100px;--cv-list-item-width: 48px;--cv-list-item-height: 48px;--cv-list-item-graphic-margin-left: 0;--cv-list-menu-height: 0;--cv-list-item-expansion-icon-size: 0;--cv-list-item-selected-background-color: var(--cv-theme-primary-24);--cv-list-item-selected-color: var(--cv-theme-primary);--cv-divider-margin: 0 0 0 -6px;--cv-divider-padding-left: 12px;--cv-divider-padding-right: 24px}:host([open]) .navigation{--cv-list-padding-right: 12px;--cv-list-padding-left: 12px;--cv-list-item-width: 100%;--cv-list-item-height: inherit;--cv-list-item-graphic-margin-left: 0;--cv-list-item-expansion-icon-margin: -24px;--cv-list-item-expansion-icon-size: 24px;--cv-list-menu-height: inherit;--cv-list-item-selected-background-color: var( --cv-theme-on-surface-variant-8 );--cv-list-item-selected-color: var(--cv-theme-on-surface-variant);--cv-divider-margin: 0;--cv-divider-padding-right: 20px}@media only screen and (max-width: 768px){:host([helpOpen]) .app-shell,:host([helpOpen]) .main{height:100vh;overflow:hidden}}.app-shell{--mdc-theme-surface: var(--mdc-theme-background);background-color:var(--mdc-theme-background);display:grid;grid-template:"nav mini-list main help" min-content/auto auto 1fr;min-height:100%}@media only screen and (min-width: 768px){.app-shell{position:fixed;top:0;left:0;bottom:0;right:0;width:100%}}.app-shell .main-wrapper>:host(cv-card) .mdc-card{border-radius:var(--cv-border-radius-outer)}.cov-help--resizing .main,.cov-help--resizing .help{transition-duration:0ms}.main{height:100vh;grid-area:main;overflow:auto;transition:margin-left .2s ease-in-out,margin-right .2s ease-in-out}.main .main-wrapper{margin:0 auto;max-width:1200px}.cov-content--full-width .main .main-wrapper{margin:0;width:100%;max-width:100%}.main cv-card{margin:0 0 12px;display:block}.main cv-card.wrapper-card{--mdc-shape-medium: var(--cv-border-radius-outer)}.main cv-card.wrapper-card *{--mdc-shape-medium: initial}@media only screen and (min-width: 768px){.cov-drawer--hovered .main,.main.cov-drawer--hovered-closing{margin-left:72px;padding-right:24px}:not(.cov-drawer--forced-open) .main{margin-left:72px;padding-right:24px}.cov-drawer--open .main{margin-left:256px;padding-right:24px}.cov-help--open .main{margin-right:var(--cv-help-width, 320px);padding-right:0}}@media only screen and (max-width: 1600px){.main .main-wrapper{max-width:960px}}.help{grid-area:help;position:fixed;right:0;width:var(--cv-help-width, 320px);transition:width .2s;height:100vh;overflow-y:auto}.help .resize-handle{position:absolute;left:0;width:8px;height:100vh;cursor:ew-resize;z-index:1100;-webkit-user-select:none;user-select:none}.help .resize-handle:after{content:"";position:absolute;left:1px;top:0;width:4px;height:100%;background-color:var(--mdc-theme-primary);transform:translate(-50%);transition:opacity .3s ease;opacity:0}.help .resize-handle:hover:after,.help .resize-handle.helpResizable:after{opacity:1}.help :host([helpResizable]) .resize-handle{display:block}.help :host(:not([helpResizable])) .resize-handle{display:none}.cov-help--closed .help{width:0;border:none}@media only screen and (max-width: 768px){.help{background-color:var(--mdc-theme-surface);width:100%;z-index:100}}.current-section{align-items:center;display:flex;font-size:var(--mdc-typography-body2-font-size);font-family:var(--mdc-typography-body2-font-family);color:var(--cv-theme-on-surface);font-weight:600;justify-content:flex-start;overflow:hidden;min-height:48px;padding:8px 16px 8px 12px;position:relative;text-align:left}.current-section .current-section-name{opacity:0;transition:opacity .2s}:host([open]) .current-section .current-section-name{opacity:1}.header{--cv-top-app-bar-title-padding-left: 8px}.top-app-bar-title{display:flex;align-items:center}slot[name=splat-screen]{display:none}[name=user-menu]{position:sticky;top:0;display:block;z-index:var(--cv-app-shell-user-menu-z-index, 1)}[name=mini-list]{display:none;width:320px;height:100vh}@media only screen and (min-width: 768px){.cov-appshell--minilist [name=mini-list]{display:block}:not(.cov-drawer--forced-open) [name=mini-list]{margin-left:72px}}@media only screen and (max-width: 1000px){[name=mini-list]{display:none}}nav.navigation{grid-area:nav;height:100vh;overflow-y:auto;border-right:0;position:fixed;background-color:var(--mdc-theme-background);z-index:var(--cv-app-shell-navigation-z-index, 6)}nav.navigation .toggle-drawer{margin:8px auto}nav.navigation .navigation-toolbar{display:flex;align-items:center;position:sticky;top:0;background-color:var(--mdc-theme-background);z-index:2;padding-left:var(--cv-list-padding-left, 0)}nav.navigation slot[name=logo]{display:block}nav.navigation slot[name=navigation]{margin-top:8px;display:block}:not(.cov-drawer--forced-open) nav.navigation,:not(.cov-drawer--forced-open) nav.navigation.mdc-drawer--closed,:not(.cov-drawer--forced-open) nav.navigation.mdc-drawer--closing{top:0;left:0;bottom:0}:not(.cov-drawer--forced-open) nav.navigation slot[name=logo],:not(.cov-drawer--forced-open) nav.navigation.mdc-drawer--closed slot[name=logo],:not(.cov-drawer--forced-open) nav.navigation.mdc-drawer--closing slot[name=logo]{transition:all .2s;opacity:0}nav.navigation.mdc-drawer--open .toggle-drawer{margin-left:0;margin-right:0}nav.navigation.mdc-drawer--open slot[name=logo]{opacity:1}.cov-drawer--hovered nav.navigation{box-shadow:0 11px 15px -7px #0003,0 24px 38px 3px #00000024,0 9px 46px 8px #0000001f;background-color:var(--mdc-theme-surface)}[divider]{border-bottom:1px solid;margin:16px;border-color:var(--mdc-theme-border, rgba(0, 0, 0, .12))}@media only screen and (min-width: 768px){nav.navigation{display:flex;flex-direction:column;transition-property:width;transform:none}.mdc-drawer--dismissible{display:block;width:72px;position:static}.mdc-drawer--open,.mdc-drawer--opening{width:256px;transition-duration:.2s}.mdc-drawer--closing{width:72px;transition-duration:.2s}.header{display:none}}@media only screen and (max-width: 768px){.app-shell{grid-template-columns:1fr;grid-template-areas:"header" "main" "mini-list" "help"}[name=help]::slotted(*),.main{height:auto;width:auto;border:none;overflow-x:hidden}}@media only screen and (width <= 480px){.cov-splat-screen .main-wrapper{display:none}slot[name=splat-screen]{display:block}}';
 var y = Object.defineProperty, b = Object.getOwnPropertyDescriptor, r = (e, t, a, d) => {
-  for (var o = d > 1 ? void 0 : d ? b(t, a) : t, l = e.length - 1, c; l >= 0; l--)
-    (c = e[l]) && (o = (d ? c(t, a, o) : c(o)) || o);
+  for (var o = d > 1 ? void 0 : d ? b(t, a) : t, l = e.length - 1, p; l >= 0; l--)
+    (p = e[l]) && (o = (d ? p(t, a, o) : p(o)) || o);
   return d && o && y(t, a, o), o;
 };
 let i = class extends u {
@@ -119,7 +119,7 @@ let i = class extends u {
     return this.sectionName ? s`<div class="current-section">
           <slot name="section-action"></slot>
           <span class="current-section-name">${this.sectionName}</span>
-        </div>` : p;
+        </div>` : c;
   }
   renderMain() {
     return this.contained ? s`<cv-card part="main" class="wrapper-card"><slot></slot></cv-card>` : s`<slot></slot>`;
@@ -149,7 +149,7 @@ let i = class extends u {
     }, o = t ? s`<div
           class="mdc-drawer-scrim"
           @click="${this._handleScrimClick}"
-        ></div>` : p;
+        ></div>` : c;
     return s`
       <div part="app-shell" class="app-shell ${h(a)}">
         <span class="header"
@@ -167,6 +167,7 @@ let i = class extends u {
           </cv-top-app-bar-fixed>
         </span>
         <nav
+          part="navigation"
           class="navigation mdc-drawer ${h(d)}"
           @mouseenter="${this._handleNavMouseOver}"
           @mouseleave="${this._handleNavMouseOut}"
@@ -184,7 +185,7 @@ let i = class extends u {
         </nav>
         ${o}
         <slot name="mini-list"></slot>
-        <div class="main mdc-drawer-app-content">
+        <div part="main-wrapper" class="main mdc-drawer-app-content">
           <div class="main-wrapper">
             <slot name="user-menu"></slot>
             ${this.renderMain()}
@@ -192,7 +193,7 @@ let i = class extends u {
           <slot name="splat-screen"></slot>
         </div>
         <div class="help" @mousedown="${this._startResizing}">
-          ${this.helpResizable ? s`<div class="resize-handle"></div>` : p}
+          ${this.helpResizable ? s`<div class="resize-handle"></div>` : c}
           <slot name="help"></slot>
         </div>
       </div>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@covalent/components",
-  "version": "11.9.0",
+  "version": "11.10.0",
   "description": "a catalog of material components for covalent",
   "main": "./index.js",
   "module": "./index.mjs",