@assecosolutions/fox-list - npm Package Compare versions

Comparing version 1.5.10 to 1.5.12

index.d.ts

 export * from './lib/FoxList';
 export * from './lib/FoxListItem';
 export * from './lib/FoxCheckListItem';
+export * from './lib/FoxRadioListItem';

lib/FoxCheckListItem.d.ts

@@ -9,4 +9,7 @@ import { CheckListItemBase } from '@material/mwc-list/mwc-check-list-item-base';
 export declare class FoxCheckListItem extends CheckListItemBase {
+    /**
+     * @ignore
+     */
     static styles: import("lit-element").CSSResult[];
     render(): import("lit-element").TemplateResult;
 }

lib/FoxList.d.ts

@@ -9,3 +9,6 @@ import { ListBase } from '@material/mwc-list/mwc-list-base';
 export declare class FoxList extends ListBase {
+    /**
+     * @ignore
+     */
     static styles: import("lit-element").CSSResult[];
 }

lib/FoxListItem.d.ts

@@ -9,3 +9,8 @@ import { ListItemBase } from '@material/mwc-list/mwc-list-item-base';
 export declare class FoxListItem extends ListItemBase {
+    /**
+     * @ignore
+     */
     static styles: import("lit-element").CSSResult[];
+    render(): import("lit-element").TemplateResult;
+    protected renderBorder(): import("lit-element").TemplateResult;
 }

package.json

 {
   "name": "@assecosolutions/fox-list",
-  "version": "1.5.10",
+  "version": "1.5.12",
   "public": true,
@@ -5,0 +5,0 @@ "lib": {

README.md

@@ -13,4 +13,6 @@ # 🦊 Fox - Future Open Experience
 We use [Storybook](http://design-system.assecosolutions.com/) to deliver an interactive documentation of our Design system.
-There you can find Multiple examples, guidelines and the documentation of all FOX web components ####[Demo](http://design-system.assecosolutions.com/?path=/story/molecules-fox-list)
+There you can find Multiple examples, guidelines and the documentation of all FOX web components
 
+####[Demo](http://design-system.assecosolutions.com/?path=/story/molecules-fox-list)
+
 ## Contribute
@@ -17,0 +19,0 @@

shared-ui-molecules-fox-list.esm.js

@@ -6,7 +6,9 @@ import { css, customElement } from 'lit-element';
 import { ListItemBase } from '@material/mwc-list/mwc-list-item-base';
+import { html } from 'lit-html';
 import { style as style$1 } from '@material/mwc-list/mwc-list-item-css';
 import { CheckListItemBase } from '@material/mwc-list/mwc-check-list-item-base';
 import { style as style$2 } from '@material/mwc-list/mwc-control-list-item-css';
-import { html } from 'lit-html';
 import { classMap } from 'lit-html/directives/class-map';
+import { RadioListItemBase } from '@material/mwc-list/mwc-radio-list-item-base';
+import { ifDefined } from 'lit-html/directives/if-defined';
 
@@ -149,3 +151,3 @@ function _classCallCheck(instance, Constructor) {
 var _templateObject;
-var styles = css(_templateObject || (_templateObject = _taggedTemplateLiteral([":host([outline='dashed']) ::slotted(fox-list-item){border:1px dashed var(--fox-base-grey-40-color);margin:15px 0;border-radius:4px}:host([outline='solid']) ::slotted(fox-list-item){border:1px solid var(--fox-base-grey-80-color);border-radius:4px;margin:15px 0}:host{--mdc-list-item-meta-size: auto;--mdc-typography-font-family: Nunito, Roboto, sans-serif}\n"])));
+var styles = css(_templateObject || (_templateObject = _taggedTemplateLiteral([":host([outline='dashed']){--mdc-list-item-meta-size: auto}:host([outline='dashed']) ::slotted(fox-list-item){border:1px dotted var(--fox-base-grey-40-color, #cbd5df);margin:15px 0;border-radius:4px}:host([outline='dashed']) ::slotted(fox-list-item[activated]){border:1px dotted var(--fox-client-base-color, #4599ff)}:host{--mdc-list-inset-margin: 60px}\n"])));
 
@@ -165,3 +167,7 @@ var FoxList = /*#__PURE__*/function (_ListBase) {
 }(ListBase);
+/**
+ * @ignore
+ */
 
+
 FoxList.styles = [style, styles];
@@ -171,4 +177,6 @@ FoxList = __decorate([customElement('fox-list')], FoxList);
 var _templateObject$1;
-var styles$1 = css(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteral([":host{--mdc-theme-primary: var(--fox-client-base-color, #4599ff);--mdc-theme-text-primary-on-background: var(--fox-font-base-color, #003959);font-weight:var(--fox-font-weight-bold, 700);--mdc-theme-text-icon-on-background: var(\n    --mdc-theme-text-primary-on-background\n  );--mdc-theme-text-secondary-on-background: var(\n    --fox-font-light-color,\n    #738292\n  )}\n"])));
+var styles$1 = css(_templateObject$1 || (_templateObject$1 = _taggedTemplateLiteral([":host{--mdc-theme-text-primary-on-background: var(--fox-font-base-color, #0f1310);--mdc-typography-subtitle1-font-size: var(--fox-font-size-base, 14px);--mdc-typography-subtitle1-font-weight: var(--fox-font-semi-bold, 600);--mdc-typography-font-family: Nunito, Roboto, sans-serif;--mdc-theme-primary: var(--fox-client-base-color, #4599ff);--mdc-theme-text-secondary-on-background: var(\n    --fox-font-light-color,\n    #738292\n  );--mdc-theme-text-icon-on-background: var(\n    --mdc-theme-text-secondary-on-background\n  );font-family:var(--mdc-typography-font-family);--mdc-ripple-color: var(--fox-base-grey-60-color, #94a8bc);--mdc-ripple-hover-opacity: 0.1;--mdc-ripple-press-opacity: 0.15;transition:all ease-out 0.1s;--mdc-list-item-graphic-size: 32px;--mdc-list-item-graphic-margin: 12px}:host([compact]){height:30px}:host([compact]) .mdc-deprecated-list-item__secondary-text{display:none}:host([fullWidth]){width:100%}.mdc-deprecated-list-item{font-family:var(--mdc-typography-font-family)}.mdc-deprecated-list-item__text{display:block;line-height:18px;font-size:var(--mdc-typography-subtitle1-font-size);font-weight:var(--mdc-typography-subtitle1-font-weight)}.mdc-deprecated-list-item__secondary-text{display:block;line-height:12px;font-size:var(--fox-font-size-s, 12px)}:host([activated]){color:var(--mdc-theme-primary);--mdc-ripple-selected-opacity: 0;--mdc-ripple-activated-opacity: 0;--mdc-theme-text-secondary-on-background: var(--mdc-theme-primary);--mdc-theme-text-icon-on-background: var(--mdc-theme-primary)}:host([activated]) .mdc-deprecated-list-item__graphic{color:var(--mdc-theme-primary)}.activated-border{transition:all ease-out 0.1s;display:block;position:absolute;left:0;width:0;height:100%;background:var(--mdc-theme-primary);border-radius:0 4px 4px 0}.activated-border.active{width:5px}:host{cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;height:48px;display:flex;position:relative;align-items:center;justify-content:flex-start;overflow:hidden;padding:0;padding-left:var(--mdc-list-side-padding, 16px);padding-right:var(--mdc-list-side-padding, 16px);outline:none;color:var(--mdc-theme-text-primary-on-background, rgba(0,0,0,0.87))}:host:focus{outline:none}:host([activated]) .fake-activated-ripple::before{position:absolute;display:block;top:0;bottom:0;left:0;right:0;width:100%;height:100%;pointer-events:none;z-index:1;content:'';opacity:0.12;opacity:var(--mdc-ripple-activated-opacity, 0.12);background-color:#6200ee;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #6200ee))}.mdc-deprecated-list-item__graphic{flex-shrink:0;align-items:center;justify-content:center;fill:currentColor;display:inline-flex}.mdc-deprecated-list-item__graphic ::slotted(*){flex-shrink:0;align-items:center;justify-content:center;fill:currentColor;width:100%;height:100%;text-align:center}.mdc-deprecated-list-item__meta{width:var(--mdc-list-item-meta-size, 24px);height:var(--mdc-list-item-meta-size, 24px);margin-left:auto;margin-right:0;color:rgba(0,0,0,0.38);color:var(--mdc-theme-text-hint-on-background, rgba(0,0,0,0.38))}.mdc-deprecated-list-item__meta.multi{width:auto}.mdc-deprecated-list-item__meta ::slotted(*){width:var(--mdc-list-item-meta-size, 24px);line-height:var(--mdc-list-item-meta-size, 24px)}.mdc-deprecated-list-item__meta ::slotted(.material-icons),.mdc-deprecated-list-item__meta ::slotted(fox-icon){line-height:var(--mdc-list-item-meta-size, 24px) !important}.mdc-deprecated-list-item__meta ::slotted(:not(.material-icons):not(fox-icon)){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.75rem;font-size:var(--mdc-typography-caption-font-size, 0.75rem);line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight, 400);letter-spacing:0.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, 0.03333em);text-decoration:inherit;text-decoration:var(--mdc-typography-caption-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform, inherit)}[dir='rtl'] .mdc-deprecated-list-item__meta,.mdc-deprecated-list-item__meta[dir='rtl']{margin-left:0;margin-right:auto}.mdc-deprecated-list-item__meta ::slotted(*){width:100%;height:100%}.mdc-deprecated-list-item__text{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.mdc-deprecated-list-item__text ::slotted([for]),.mdc-deprecated-list-item__text[for]{pointer-events:none}* ::slotted(a),a{color:inherit;text-decoration:none}:host([twoline]){height:48px}:host([disabled]),:host([noninteractive]){cursor:default;pointer-events:none}:host([disabled]) .mdc-deprecated-list-item__text ::slotted(*){opacity:0.38}:host([disabled]) .mdc-deprecated-list-item__text ::slotted(*),:host([disabled]) .mdc-deprecated-list-item__primary-text ::slotted(*),:host([disabled]) .mdc-deprecated-list-item__secondary-text ::slotted(*){color:#000;color:var(--mdc-theme-on-surface, #000)}.mdc-deprecated-list-item__secondary-text ::slotted(*){color:rgba(0,0,0,0.54);color:var(--mdc-theme-text-secondary-on-background, rgba(0,0,0,0.54))}.mdc-deprecated-list-item__graphic ::slotted(*){background-color:transparent;color:rgba(0,0,0,0.38);color:var(--mdc-theme-text-icon-on-background, rgba(0,0,0,0.38))}.mdc-deprecated-list-group__subheader ::slotted(*){color:rgba(0,0,0,0.87);color:var(--mdc-theme-text-primary-on-background, rgba(0,0,0,0.87))}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic{width:var(--mdc-list-item-graphic-size, 40px);height:var(--mdc-list-item-graphic-size, 40px)}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic.multi{width:auto}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic ::slotted(*){width:var(--mdc-list-item-graphic-size, 40px);line-height:var(--mdc-list-item-graphic-size, 40px)}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic ::slotted(.material-icons),:host([graphic='avatar']) .mdc-deprecated-list-item__graphic ::slotted(fox-icon){line-height:var(--mdc-list-item-graphic-size, 40px) !important}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic ::slotted(*){border-radius:50%}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic,:host([graphic='medium']) .mdc-deprecated-list-item__graphic,:host([graphic='large']) .mdc-deprecated-list-item__graphic,:host([graphic='control']) .mdc-deprecated-list-item__graphic{margin-left:0;margin-right:var(--mdc-list-item-graphic-margin, 16px)}[dir='rtl'] :host([graphic='avatar']) .mdc-deprecated-list-item__graphic,:host([graphic='avatar']) .mdc-deprecated-list-item__graphic[dir='rtl'],[dir='rtl'] :host([graphic='medium']) .mdc-deprecated-list-item__graphic,:host([graphic='medium']) .mdc-deprecated-list-item__graphic[dir='rtl'],[dir='rtl'] :host([graphic='large']) .mdc-deprecated-list-item__graphic,:host([graphic='large']) .mdc-deprecated-list-item__graphic[dir='rtl'],[dir='rtl'] :host([graphic='control']) .mdc-deprecated-list-item__graphic,:host([graphic='control']) .mdc-deprecated-list-item__graphic[dir='rtl']{margin-left:var(--mdc-list-item-graphic-margin, 16px);margin-right:0}:host([graphic='icon']) .mdc-deprecated-list-item__graphic{width:var(--mdc-list-item-graphic-size, 24px);height:var(--mdc-list-item-graphic-size, 24px);margin-left:0;margin-right:var(--mdc-list-item-graphic-margin, 32px)}:host([graphic='icon']) .mdc-deprecated-list-item__graphic.multi{width:auto}:host([graphic='icon']) .mdc-deprecated-list-item__graphic ::slotted(*){width:var(--mdc-list-item-graphic-size, 24px);line-height:var(--mdc-list-item-graphic-size, 24px)}:host([graphic='icon']) .mdc-deprecated-list-item__graphic ::slotted(.material-icons),:host([graphic='icon']) .mdc-deprecated-list-item__graphic ::slotted(fox-icon){line-height:var(--mdc-list-item-graphic-size, 24px) !important}[dir='rtl'] :host([graphic='icon']) .mdc-deprecated-list-item__graphic,:host([graphic='icon']) .mdc-deprecated-list-item__graphic[dir='rtl']{margin-left:var(--mdc-list-item-graphic-margin, 32px);margin-right:0}:host([graphic='medium']:not([twoLine])),:host([graphic='large']:not([twoLine])){height:48px}:host([graphic='medium']) .mdc-deprecated-list-item__graphic,:host([graphic='large']) .mdc-deprecated-list-item__graphic{width:var(--mdc-list-item-graphic-size, 48px);height:var(--mdc-list-item-graphic-size, 48px)}:host([graphic='medium']) .mdc-deprecated-list-item__graphic.multi,:host([graphic='large']) .mdc-deprecated-list-item__graphic.multi{width:auto}:host([graphic='medium']) .mdc-deprecated-list-item__graphic ::slotted(*),:host([graphic='large']) .mdc-deprecated-list-item__graphic ::slotted(*){width:var(--mdc-list-item-graphic-size, 48px);line-height:var(--mdc-list-item-graphic-size, 48px)}:host([graphic='medium']) .mdc-deprecated-list-item__graphic ::slotted(.material-icons),:host([graphic='medium']) .mdc-deprecated-list-item__graphic ::slotted(fox-icon),:host([graphic='large']) .mdc-deprecated-list-item__graphic ::slotted(.material-icons),:host([graphic='large']) .mdc-deprecated-list-item__graphic ::slotted(fox-icon){line-height:var(--mdc-list-item-graphic-size, 48px) !important}\n"])));
 
+var _templateObject$2, _templateObject2, _templateObject3, _templateObject4;
+
 var FoxListItem = /*#__PURE__*/function (_ListItemBase) {
@@ -185,9 +193,28 @@ _inherits(FoxListItem, _ListItemBase);
 
+  _createClass(FoxListItem, [{
+    key: "render",
+    value: function render() {
+      var text = this.renderText();
+      var graphic = this.graphic ? this.renderGraphic() : html(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral([""])));
+      var meta = this.hasMeta ? this.renderMeta() : html(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral([""])));
+      return html(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["", " ", " ", " ", "\n    ", ""])), this.renderBorder(), this.renderRipple(), graphic, text, meta);
+    }
+  }, {
+    key: "renderBorder",
+    value: function renderBorder() {
+      return html(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["<div\n      class=\"activated-border ", "\"\n    ></div>"])), this.activated ? 'active' : '');
+    }
+  }]);
+
   return FoxListItem;
 }(ListItemBase);
+/**
+ * @ignore
+ */
 
-FoxListItem.styles = [style$1, styles$1];
+
+FoxListItem.styles = [styles$1];
 FoxListItem = __decorate([customElement('fox-list-item')], FoxListItem);
 
-var _templateObject$2, _templateObject2, _templateObject3;
+var _templateObject$3, _templateObject2$1, _templateObject3$1;
 
@@ -213,6 +240,6 @@ var FoxCheckListItem = /*#__PURE__*/function (_CheckListItemBase) {
       var text = this.renderText();
-      var graphic = this.graphic && this.graphic !== 'control' && !this.left ? this.renderGraphic() : html(_templateObject$2 || (_templateObject$2 = _taggedTemplateLiteral([""])));
-      var meta = this.hasMeta && this.left ? this.renderMeta() : html(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral([""])));
+      var graphic = this.graphic && this.graphic !== 'control' && !this.left ? this.renderGraphic() : html(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteral([""])));
+      var meta = this.hasMeta && this.left ? this.renderMeta() : html(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteral([""])));
       var ripple = this.renderRipple();
-      return html(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral([" ", " ", " ", "\n      <span class=", ">\n        <fox-checkbox\n          reducedTouchTarget\n          tabindex=", "\n          .checked=", "\n          ?disabled=", "\n          @change=", "\n        >\n        </fox-checkbox>\n      </span>\n      ", " ", ""])), ripple, graphic, this.left ? '' : text, classMap(checkboxClasses), this.tabindex, this.selected, this.disabled, this.onChange, this.left ? text : '', meta);
+      return html(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteral([" ", " ", " ", "\n      <span class=", ">\n        <fox-checkbox\n          reducedTouchTarget\n          tabindex=", "\n          .checked=", "\n          ?disabled=", "\n          @change=", "\n        >\n        </fox-checkbox>\n      </span>\n      ", " ", ""])), ripple, graphic, this.left ? '' : text, classMap(checkboxClasses), this.tabindex, this.selected, this.disabled, this.onChange, this.left ? text : '', meta);
     }
@@ -223,6 +250,48 @@ }]);
 }(CheckListItemBase);
+/**
+ * @ignore
+ */
 
+
 FoxCheckListItem.styles = [style$1, style$2, styles$1];
 FoxCheckListItem = __decorate([customElement('fox-check-list-item')], FoxCheckListItem);
 
-export { FoxCheckListItem, FoxList, FoxListItem };
+var _templateObject$4, _templateObject2$2, _templateObject3$2;
+
+var FoxRadioListItem = /*#__PURE__*/function (_RadioListItemBase) {
+  _inherits(FoxRadioListItem, _RadioListItemBase);
+
+  var _super = _createSuper(FoxRadioListItem);
+
+  function FoxRadioListItem() {
+    _classCallCheck(this, FoxRadioListItem);
+
+    return _super.apply(this, arguments);
+  }
+
+  _createClass(FoxRadioListItem, [{
+    key: "render",
+    value: function render() {
+      var radioClasses = {
+        'mdc-deprecated-list-item__graphic': this.left,
+        'mdc-deprecated-list-item__meta': !this.left
+      };
+      var text = this.renderText();
+      var graphic = this.graphic && this.graphic !== 'control' && !this.left ? this.renderGraphic() : html(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteral([""])));
+      var meta = this.hasMeta && this.left ? this.renderMeta() : html(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteral([""])));
+      var ripple = this.renderRipple();
+      return html(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteral([" ", " ", " ", "\n      <fox-radio\n        global\n        class=", "\n        tabindex=", "\n        name=", "\n        .checked=", "\n        ?disabled=", "\n        @checked=", "\n      >\n      </fox-radio>\n      ", " ", ""])), ripple, graphic, this.left ? '' : text, classMap(radioClasses), this.tabindex, ifDefined(this.group === null ? undefined : this.group), this.selected, this.disabled, this.onChange, this.left ? text : '', meta);
+    }
+  }]);
+
+  return FoxRadioListItem;
+}(RadioListItemBase);
+/**
+ * @ignore
+ */
+
+
+FoxRadioListItem.styles = [style$1, style$2, styles$1];
+FoxRadioListItem = __decorate([customElement('fox-radio-list-item')], FoxRadioListItem);
+
+export { FoxCheckListItem, FoxList, FoxListItem, FoxRadioListItem };

shared-ui-molecules-fox-list.umd.js

 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('lit-element'), require('@material/mwc-list/mwc-list-base'), require('@material/mwc-list/mwc-list-css'), require('@material/mwc-list/mwc-list-foundation'), require('@material/mwc-list/mwc-list-item-base'), require('@material/mwc-list/mwc-list-item-css'), require('@material/mwc-list/mwc-check-list-item-base'), require('@material/mwc-list/mwc-control-list-item-css'), require('lit-html'), require('lit-html/directives/class-map')) :
-    typeof define === 'function' && define.amd ? define(['exports', 'lit-element', '@material/mwc-list/mwc-list-base', '@material/mwc-list/mwc-list-css', '@material/mwc-list/mwc-list-foundation', '@material/mwc-list/mwc-list-item-base', '@material/mwc-list/mwc-list-item-css', '@material/mwc-list/mwc-check-list-item-base', '@material/mwc-list/mwc-control-list-item-css', 'lit-html', 'lit-html/directives/class-map'], factory) :
-    (global = global || self, factory(global.SharedUiMoleculesFoxList = {}, global.litElement, global.mwcListBase, global.mwcListCss, global.mwcListFoundation, global.mwcListItemBase, global.mwcListItemCss, global.mwcCheckListItemBase, global.mwcControlListItemCss, global.litHtml, global.classMap));
-}(this, (function (exports, litElement, mwcListBase, mwcListCss, mwcListFoundation, mwcListItemBase, mwcListItemCss, mwcCheckListItemBase, mwcControlListItemCss, litHtml, classMap) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('lit-element'), require('@material/mwc-list/mwc-list-base'), require('@material/mwc-list/mwc-list-css'), require('@material/mwc-list/mwc-list-foundation'), require('@material/mwc-list/mwc-list-item-base'), require('lit-html'), require('@material/mwc-list/mwc-list-item-css'), require('@material/mwc-list/mwc-check-list-item-base'), require('@material/mwc-list/mwc-control-list-item-css'), require('lit-html/directives/class-map'), require('@material/mwc-list/mwc-radio-list-item-base'), require('lit-html/directives/if-defined')) :
+    typeof define === 'function' && define.amd ? define(['exports', 'lit-element', '@material/mwc-list/mwc-list-base', '@material/mwc-list/mwc-list-css', '@material/mwc-list/mwc-list-foundation', '@material/mwc-list/mwc-list-item-base', 'lit-html', '@material/mwc-list/mwc-list-item-css', '@material/mwc-list/mwc-check-list-item-base', '@material/mwc-list/mwc-control-list-item-css', 'lit-html/directives/class-map', '@material/mwc-list/mwc-radio-list-item-base', 'lit-html/directives/if-defined'], factory) :
+    (global = global || self, factory(global.SharedUiMoleculesFoxList = {}, global.litElement, global.mwcListBase, global.mwcListCss, global.mwcListFoundation, global.mwcListItemBase, global.litHtml, global.mwcListItemCss, global.mwcCheckListItemBase, global.mwcControlListItemCss, global.classMap, global.mwcRadioListItemBase, global.ifDefined));
+}(this, (function (exports, litElement, mwcListBase, mwcListCss, mwcListFoundation, mwcListItemBase, litHtml, mwcListItemCss, mwcCheckListItemBase, mwcControlListItemCss, classMap, mwcRadioListItemBase, ifDefined) { 'use strict';
 
@@ -50,3 +50,3 @@ /*! *****************************************************************************
 
-    var styles = litElement.css(templateObject_1 || (templateObject_1 = __makeTemplateObject([":host([outline='dashed']) ::slotted(fox-list-item){border:1px dashed var(--fox-base-grey-40-color);margin:15px 0;border-radius:4px}:host([outline='solid']) ::slotted(fox-list-item){border:1px solid var(--fox-base-grey-80-color);border-radius:4px;margin:15px 0}:host{--mdc-list-item-meta-size: auto;--mdc-typography-font-family: Nunito, Roboto, sans-serif}\n"], [":host([outline='dashed']) ::slotted(fox-list-item){border:1px dashed var(--fox-base-grey-40-color);margin:15px 0;border-radius:4px}:host([outline='solid']) ::slotted(fox-list-item){border:1px solid var(--fox-base-grey-80-color);border-radius:4px;margin:15px 0}:host{--mdc-list-item-meta-size: auto;--mdc-typography-font-family: Nunito, Roboto, sans-serif}\n"])));
+    var styles = litElement.css(templateObject_1 || (templateObject_1 = __makeTemplateObject([":host([outline='dashed']){--mdc-list-item-meta-size: auto}:host([outline='dashed']) ::slotted(fox-list-item){border:1px dotted var(--fox-base-grey-40-color, #cbd5df);margin:15px 0;border-radius:4px}:host([outline='dashed']) ::slotted(fox-list-item[activated]){border:1px dotted var(--fox-client-base-color, #4599ff)}:host{--mdc-list-inset-margin: 60px}\n"], [":host([outline='dashed']){--mdc-list-item-meta-size: auto}:host([outline='dashed']) ::slotted(fox-list-item){border:1px dotted var(--fox-base-grey-40-color, #cbd5df);margin:15px 0;border-radius:4px}:host([outline='dashed']) ::slotted(fox-list-item[activated]){border:1px dotted var(--fox-client-base-color, #4599ff)}:host{--mdc-list-inset-margin: 60px}\n"])));
     var templateObject_1;
@@ -62,3 +62,7 @@
       }
+      /**
+       * @ignore
+       */
 
+
       FoxList.styles = [mwcListCss.style, styles];
@@ -69,3 +73,3 @@ FoxList = __decorate([litElement.customElement('fox-list')], FoxList);
 
-    var styles$1 = litElement.css(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject([":host{--mdc-theme-primary: var(--fox-client-base-color, #4599ff);--mdc-theme-text-primary-on-background: var(--fox-font-base-color, #003959);font-weight:var(--fox-font-weight-bold, 700);--mdc-theme-text-icon-on-background: var(\n    --mdc-theme-text-primary-on-background\n  );--mdc-theme-text-secondary-on-background: var(\n    --fox-font-light-color,\n    #738292\n  )}\n"], [":host{--mdc-theme-primary: var(--fox-client-base-color, #4599ff);--mdc-theme-text-primary-on-background: var(--fox-font-base-color, #003959);font-weight:var(--fox-font-weight-bold, 700);--mdc-theme-text-icon-on-background: var(\n    --mdc-theme-text-primary-on-background\n  );--mdc-theme-text-secondary-on-background: var(\n    --fox-font-light-color,\n    #738292\n  )}\n"])));
+    var styles$1 = litElement.css(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject([":host{--mdc-theme-text-primary-on-background: var(--fox-font-base-color, #0f1310);--mdc-typography-subtitle1-font-size: var(--fox-font-size-base, 14px);--mdc-typography-subtitle1-font-weight: var(--fox-font-semi-bold, 600);--mdc-typography-font-family: Nunito, Roboto, sans-serif;--mdc-theme-primary: var(--fox-client-base-color, #4599ff);--mdc-theme-text-secondary-on-background: var(\n    --fox-font-light-color,\n    #738292\n  );--mdc-theme-text-icon-on-background: var(\n    --mdc-theme-text-secondary-on-background\n  );font-family:var(--mdc-typography-font-family);--mdc-ripple-color: var(--fox-base-grey-60-color, #94a8bc);--mdc-ripple-hover-opacity: 0.1;--mdc-ripple-press-opacity: 0.15;transition:all ease-out 0.1s;--mdc-list-item-graphic-size: 32px;--mdc-list-item-graphic-margin: 12px}:host([compact]){height:30px}:host([compact]) .mdc-deprecated-list-item__secondary-text{display:none}:host([fullWidth]){width:100%}.mdc-deprecated-list-item{font-family:var(--mdc-typography-font-family)}.mdc-deprecated-list-item__text{display:block;line-height:18px;font-size:var(--mdc-typography-subtitle1-font-size);font-weight:var(--mdc-typography-subtitle1-font-weight)}.mdc-deprecated-list-item__secondary-text{display:block;line-height:12px;font-size:var(--fox-font-size-s, 12px)}:host([activated]){color:var(--mdc-theme-primary);--mdc-ripple-selected-opacity: 0;--mdc-ripple-activated-opacity: 0;--mdc-theme-text-secondary-on-background: var(--mdc-theme-primary);--mdc-theme-text-icon-on-background: var(--mdc-theme-primary)}:host([activated]) .mdc-deprecated-list-item__graphic{color:var(--mdc-theme-primary)}.activated-border{transition:all ease-out 0.1s;display:block;position:absolute;left:0;width:0;height:100%;background:var(--mdc-theme-primary);border-radius:0 4px 4px 0}.activated-border.active{width:5px}:host{cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;height:48px;display:flex;position:relative;align-items:center;justify-content:flex-start;overflow:hidden;padding:0;padding-left:var(--mdc-list-side-padding, 16px);padding-right:var(--mdc-list-side-padding, 16px);outline:none;color:var(--mdc-theme-text-primary-on-background, rgba(0,0,0,0.87))}:host:focus{outline:none}:host([activated]) .fake-activated-ripple::before{position:absolute;display:block;top:0;bottom:0;left:0;right:0;width:100%;height:100%;pointer-events:none;z-index:1;content:'';opacity:0.12;opacity:var(--mdc-ripple-activated-opacity, 0.12);background-color:#6200ee;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #6200ee))}.mdc-deprecated-list-item__graphic{flex-shrink:0;align-items:center;justify-content:center;fill:currentColor;display:inline-flex}.mdc-deprecated-list-item__graphic ::slotted(*){flex-shrink:0;align-items:center;justify-content:center;fill:currentColor;width:100%;height:100%;text-align:center}.mdc-deprecated-list-item__meta{width:var(--mdc-list-item-meta-size, 24px);height:var(--mdc-list-item-meta-size, 24px);margin-left:auto;margin-right:0;color:rgba(0,0,0,0.38);color:var(--mdc-theme-text-hint-on-background, rgba(0,0,0,0.38))}.mdc-deprecated-list-item__meta.multi{width:auto}.mdc-deprecated-list-item__meta ::slotted(*){width:var(--mdc-list-item-meta-size, 24px);line-height:var(--mdc-list-item-meta-size, 24px)}.mdc-deprecated-list-item__meta ::slotted(.material-icons),.mdc-deprecated-list-item__meta ::slotted(fox-icon){line-height:var(--mdc-list-item-meta-size, 24px) !important}.mdc-deprecated-list-item__meta ::slotted(:not(.material-icons):not(fox-icon)){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.75rem;font-size:var(--mdc-typography-caption-font-size, 0.75rem);line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight, 400);letter-spacing:0.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, 0.03333em);text-decoration:inherit;text-decoration:var(--mdc-typography-caption-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform, inherit)}[dir='rtl'] .mdc-deprecated-list-item__meta,.mdc-deprecated-list-item__meta[dir='rtl']{margin-left:0;margin-right:auto}.mdc-deprecated-list-item__meta ::slotted(*){width:100%;height:100%}.mdc-deprecated-list-item__text{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.mdc-deprecated-list-item__text ::slotted([for]),.mdc-deprecated-list-item__text[for]{pointer-events:none}* ::slotted(a),a{color:inherit;text-decoration:none}:host([twoline]){height:48px}:host([disabled]),:host([noninteractive]){cursor:default;pointer-events:none}:host([disabled]) .mdc-deprecated-list-item__text ::slotted(*){opacity:0.38}:host([disabled]) .mdc-deprecated-list-item__text ::slotted(*),:host([disabled]) .mdc-deprecated-list-item__primary-text ::slotted(*),:host([disabled]) .mdc-deprecated-list-item__secondary-text ::slotted(*){color:#000;color:var(--mdc-theme-on-surface, #000)}.mdc-deprecated-list-item__secondary-text ::slotted(*){color:rgba(0,0,0,0.54);color:var(--mdc-theme-text-secondary-on-background, rgba(0,0,0,0.54))}.mdc-deprecated-list-item__graphic ::slotted(*){background-color:transparent;color:rgba(0,0,0,0.38);color:var(--mdc-theme-text-icon-on-background, rgba(0,0,0,0.38))}.mdc-deprecated-list-group__subheader ::slotted(*){color:rgba(0,0,0,0.87);color:var(--mdc-theme-text-primary-on-background, rgba(0,0,0,0.87))}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic{width:var(--mdc-list-item-graphic-size, 40px);height:var(--mdc-list-item-graphic-size, 40px)}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic.multi{width:auto}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic ::slotted(*){width:var(--mdc-list-item-graphic-size, 40px);line-height:var(--mdc-list-item-graphic-size, 40px)}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic ::slotted(.material-icons),:host([graphic='avatar']) .mdc-deprecated-list-item__graphic ::slotted(fox-icon){line-height:var(--mdc-list-item-graphic-size, 40px) !important}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic ::slotted(*){border-radius:50%}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic,:host([graphic='medium']) .mdc-deprecated-list-item__graphic,:host([graphic='large']) .mdc-deprecated-list-item__graphic,:host([graphic='control']) .mdc-deprecated-list-item__graphic{margin-left:0;margin-right:var(--mdc-list-item-graphic-margin, 16px)}[dir='rtl'] :host([graphic='avatar']) .mdc-deprecated-list-item__graphic,:host([graphic='avatar']) .mdc-deprecated-list-item__graphic[dir='rtl'],[dir='rtl'] :host([graphic='medium']) .mdc-deprecated-list-item__graphic,:host([graphic='medium']) .mdc-deprecated-list-item__graphic[dir='rtl'],[dir='rtl'] :host([graphic='large']) .mdc-deprecated-list-item__graphic,:host([graphic='large']) .mdc-deprecated-list-item__graphic[dir='rtl'],[dir='rtl'] :host([graphic='control']) .mdc-deprecated-list-item__graphic,:host([graphic='control']) .mdc-deprecated-list-item__graphic[dir='rtl']{margin-left:var(--mdc-list-item-graphic-margin, 16px);margin-right:0}:host([graphic='icon']) .mdc-deprecated-list-item__graphic{width:var(--mdc-list-item-graphic-size, 24px);height:var(--mdc-list-item-graphic-size, 24px);margin-left:0;margin-right:var(--mdc-list-item-graphic-margin, 32px)}:host([graphic='icon']) .mdc-deprecated-list-item__graphic.multi{width:auto}:host([graphic='icon']) .mdc-deprecated-list-item__graphic ::slotted(*){width:var(--mdc-list-item-graphic-size, 24px);line-height:var(--mdc-list-item-graphic-size, 24px)}:host([graphic='icon']) .mdc-deprecated-list-item__graphic ::slotted(.material-icons),:host([graphic='icon']) .mdc-deprecated-list-item__graphic ::slotted(fox-icon){line-height:var(--mdc-list-item-graphic-size, 24px) !important}[dir='rtl'] :host([graphic='icon']) .mdc-deprecated-list-item__graphic,:host([graphic='icon']) .mdc-deprecated-list-item__graphic[dir='rtl']{margin-left:var(--mdc-list-item-graphic-margin, 32px);margin-right:0}:host([graphic='medium']:not([twoLine])),:host([graphic='large']:not([twoLine])){height:48px}:host([graphic='medium']) .mdc-deprecated-list-item__graphic,:host([graphic='large']) .mdc-deprecated-list-item__graphic{width:var(--mdc-list-item-graphic-size, 48px);height:var(--mdc-list-item-graphic-size, 48px)}:host([graphic='medium']) .mdc-deprecated-list-item__graphic.multi,:host([graphic='large']) .mdc-deprecated-list-item__graphic.multi{width:auto}:host([graphic='medium']) .mdc-deprecated-list-item__graphic ::slotted(*),:host([graphic='large']) .mdc-deprecated-list-item__graphic ::slotted(*){width:var(--mdc-list-item-graphic-size, 48px);line-height:var(--mdc-list-item-graphic-size, 48px)}:host([graphic='medium']) .mdc-deprecated-list-item__graphic ::slotted(.material-icons),:host([graphic='medium']) .mdc-deprecated-list-item__graphic ::slotted(fox-icon),:host([graphic='large']) .mdc-deprecated-list-item__graphic ::slotted(.material-icons),:host([graphic='large']) .mdc-deprecated-list-item__graphic ::slotted(fox-icon){line-height:var(--mdc-list-item-graphic-size, 48px) !important}\n"], [":host{--mdc-theme-text-primary-on-background: var(--fox-font-base-color, #0f1310);--mdc-typography-subtitle1-font-size: var(--fox-font-size-base, 14px);--mdc-typography-subtitle1-font-weight: var(--fox-font-semi-bold, 600);--mdc-typography-font-family: Nunito, Roboto, sans-serif;--mdc-theme-primary: var(--fox-client-base-color, #4599ff);--mdc-theme-text-secondary-on-background: var(\n    --fox-font-light-color,\n    #738292\n  );--mdc-theme-text-icon-on-background: var(\n    --mdc-theme-text-secondary-on-background\n  );font-family:var(--mdc-typography-font-family);--mdc-ripple-color: var(--fox-base-grey-60-color, #94a8bc);--mdc-ripple-hover-opacity: 0.1;--mdc-ripple-press-opacity: 0.15;transition:all ease-out 0.1s;--mdc-list-item-graphic-size: 32px;--mdc-list-item-graphic-margin: 12px}:host([compact]){height:30px}:host([compact]) .mdc-deprecated-list-item__secondary-text{display:none}:host([fullWidth]){width:100%}.mdc-deprecated-list-item{font-family:var(--mdc-typography-font-family)}.mdc-deprecated-list-item__text{display:block;line-height:18px;font-size:var(--mdc-typography-subtitle1-font-size);font-weight:var(--mdc-typography-subtitle1-font-weight)}.mdc-deprecated-list-item__secondary-text{display:block;line-height:12px;font-size:var(--fox-font-size-s, 12px)}:host([activated]){color:var(--mdc-theme-primary);--mdc-ripple-selected-opacity: 0;--mdc-ripple-activated-opacity: 0;--mdc-theme-text-secondary-on-background: var(--mdc-theme-primary);--mdc-theme-text-icon-on-background: var(--mdc-theme-primary)}:host([activated]) .mdc-deprecated-list-item__graphic{color:var(--mdc-theme-primary)}.activated-border{transition:all ease-out 0.1s;display:block;position:absolute;left:0;width:0;height:100%;background:var(--mdc-theme-primary);border-radius:0 4px 4px 0}.activated-border.active{width:5px}:host{cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;height:48px;display:flex;position:relative;align-items:center;justify-content:flex-start;overflow:hidden;padding:0;padding-left:var(--mdc-list-side-padding, 16px);padding-right:var(--mdc-list-side-padding, 16px);outline:none;color:var(--mdc-theme-text-primary-on-background, rgba(0,0,0,0.87))}:host:focus{outline:none}:host([activated]) .fake-activated-ripple::before{position:absolute;display:block;top:0;bottom:0;left:0;right:0;width:100%;height:100%;pointer-events:none;z-index:1;content:'';opacity:0.12;opacity:var(--mdc-ripple-activated-opacity, 0.12);background-color:#6200ee;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #6200ee))}.mdc-deprecated-list-item__graphic{flex-shrink:0;align-items:center;justify-content:center;fill:currentColor;display:inline-flex}.mdc-deprecated-list-item__graphic ::slotted(*){flex-shrink:0;align-items:center;justify-content:center;fill:currentColor;width:100%;height:100%;text-align:center}.mdc-deprecated-list-item__meta{width:var(--mdc-list-item-meta-size, 24px);height:var(--mdc-list-item-meta-size, 24px);margin-left:auto;margin-right:0;color:rgba(0,0,0,0.38);color:var(--mdc-theme-text-hint-on-background, rgba(0,0,0,0.38))}.mdc-deprecated-list-item__meta.multi{width:auto}.mdc-deprecated-list-item__meta ::slotted(*){width:var(--mdc-list-item-meta-size, 24px);line-height:var(--mdc-list-item-meta-size, 24px)}.mdc-deprecated-list-item__meta ::slotted(.material-icons),.mdc-deprecated-list-item__meta ::slotted(fox-icon){line-height:var(--mdc-list-item-meta-size, 24px) !important}.mdc-deprecated-list-item__meta ::slotted(:not(.material-icons):not(fox-icon)){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:Roboto, sans-serif;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));font-size:0.75rem;font-size:var(--mdc-typography-caption-font-size, 0.75rem);line-height:1.25rem;line-height:var(--mdc-typography-caption-line-height, 1.25rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight, 400);letter-spacing:0.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, 0.03333em);text-decoration:inherit;text-decoration:var(--mdc-typography-caption-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform, inherit)}[dir='rtl'] .mdc-deprecated-list-item__meta,.mdc-deprecated-list-item__meta[dir='rtl']{margin-left:0;margin-right:auto}.mdc-deprecated-list-item__meta ::slotted(*){width:100%;height:100%}.mdc-deprecated-list-item__text{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.mdc-deprecated-list-item__text ::slotted([for]),.mdc-deprecated-list-item__text[for]{pointer-events:none}* ::slotted(a),a{color:inherit;text-decoration:none}:host([twoline]){height:48px}:host([disabled]),:host([noninteractive]){cursor:default;pointer-events:none}:host([disabled]) .mdc-deprecated-list-item__text ::slotted(*){opacity:0.38}:host([disabled]) .mdc-deprecated-list-item__text ::slotted(*),:host([disabled]) .mdc-deprecated-list-item__primary-text ::slotted(*),:host([disabled]) .mdc-deprecated-list-item__secondary-text ::slotted(*){color:#000;color:var(--mdc-theme-on-surface, #000)}.mdc-deprecated-list-item__secondary-text ::slotted(*){color:rgba(0,0,0,0.54);color:var(--mdc-theme-text-secondary-on-background, rgba(0,0,0,0.54))}.mdc-deprecated-list-item__graphic ::slotted(*){background-color:transparent;color:rgba(0,0,0,0.38);color:var(--mdc-theme-text-icon-on-background, rgba(0,0,0,0.38))}.mdc-deprecated-list-group__subheader ::slotted(*){color:rgba(0,0,0,0.87);color:var(--mdc-theme-text-primary-on-background, rgba(0,0,0,0.87))}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic{width:var(--mdc-list-item-graphic-size, 40px);height:var(--mdc-list-item-graphic-size, 40px)}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic.multi{width:auto}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic ::slotted(*){width:var(--mdc-list-item-graphic-size, 40px);line-height:var(--mdc-list-item-graphic-size, 40px)}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic ::slotted(.material-icons),:host([graphic='avatar']) .mdc-deprecated-list-item__graphic ::slotted(fox-icon){line-height:var(--mdc-list-item-graphic-size, 40px) !important}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic ::slotted(*){border-radius:50%}:host([graphic='avatar']) .mdc-deprecated-list-item__graphic,:host([graphic='medium']) .mdc-deprecated-list-item__graphic,:host([graphic='large']) .mdc-deprecated-list-item__graphic,:host([graphic='control']) .mdc-deprecated-list-item__graphic{margin-left:0;margin-right:var(--mdc-list-item-graphic-margin, 16px)}[dir='rtl'] :host([graphic='avatar']) .mdc-deprecated-list-item__graphic,:host([graphic='avatar']) .mdc-deprecated-list-item__graphic[dir='rtl'],[dir='rtl'] :host([graphic='medium']) .mdc-deprecated-list-item__graphic,:host([graphic='medium']) .mdc-deprecated-list-item__graphic[dir='rtl'],[dir='rtl'] :host([graphic='large']) .mdc-deprecated-list-item__graphic,:host([graphic='large']) .mdc-deprecated-list-item__graphic[dir='rtl'],[dir='rtl'] :host([graphic='control']) .mdc-deprecated-list-item__graphic,:host([graphic='control']) .mdc-deprecated-list-item__graphic[dir='rtl']{margin-left:var(--mdc-list-item-graphic-margin, 16px);margin-right:0}:host([graphic='icon']) .mdc-deprecated-list-item__graphic{width:var(--mdc-list-item-graphic-size, 24px);height:var(--mdc-list-item-graphic-size, 24px);margin-left:0;margin-right:var(--mdc-list-item-graphic-margin, 32px)}:host([graphic='icon']) .mdc-deprecated-list-item__graphic.multi{width:auto}:host([graphic='icon']) .mdc-deprecated-list-item__graphic ::slotted(*){width:var(--mdc-list-item-graphic-size, 24px);line-height:var(--mdc-list-item-graphic-size, 24px)}:host([graphic='icon']) .mdc-deprecated-list-item__graphic ::slotted(.material-icons),:host([graphic='icon']) .mdc-deprecated-list-item__graphic ::slotted(fox-icon){line-height:var(--mdc-list-item-graphic-size, 24px) !important}[dir='rtl'] :host([graphic='icon']) .mdc-deprecated-list-item__graphic,:host([graphic='icon']) .mdc-deprecated-list-item__graphic[dir='rtl']{margin-left:var(--mdc-list-item-graphic-margin, 32px);margin-right:0}:host([graphic='medium']:not([twoLine])),:host([graphic='large']:not([twoLine])){height:48px}:host([graphic='medium']) .mdc-deprecated-list-item__graphic,:host([graphic='large']) .mdc-deprecated-list-item__graphic{width:var(--mdc-list-item-graphic-size, 48px);height:var(--mdc-list-item-graphic-size, 48px)}:host([graphic='medium']) .mdc-deprecated-list-item__graphic.multi,:host([graphic='large']) .mdc-deprecated-list-item__graphic.multi{width:auto}:host([graphic='medium']) .mdc-deprecated-list-item__graphic ::slotted(*),:host([graphic='large']) .mdc-deprecated-list-item__graphic ::slotted(*){width:var(--mdc-list-item-graphic-size, 48px);line-height:var(--mdc-list-item-graphic-size, 48px)}:host([graphic='medium']) .mdc-deprecated-list-item__graphic ::slotted(.material-icons),:host([graphic='medium']) .mdc-deprecated-list-item__graphic ::slotted(fox-icon),:host([graphic='large']) .mdc-deprecated-list-item__graphic ::slotted(.material-icons),:host([graphic='large']) .mdc-deprecated-list-item__graphic ::slotted(fox-icon){line-height:var(--mdc-list-item-graphic-size, 48px) !important}\n"])));
     var templateObject_1$1;
@@ -82,6 +86,22 @@
 
-      FoxListItem.styles = [mwcListItemCss.style, styles$1];
+      FoxListItem.prototype.render = function () {
+        var text = this.renderText();
+        var graphic = this.graphic ? this.renderGraphic() : litHtml.html(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject([""], [""])));
+        var meta = this.hasMeta ? this.renderMeta() : litHtml.html(templateObject_2 || (templateObject_2 = __makeTemplateObject([""], [""])));
+        return litHtml.html(templateObject_3 || (templateObject_3 = __makeTemplateObject(["", " ", " ", " ", "\n    ", ""], ["", " ", " ", " ", "\n    ", ""])), this.renderBorder(), this.renderRipple(), graphic, text, meta);
+      };
+
+      FoxListItem.prototype.renderBorder = function () {
+        return litHtml.html(templateObject_4 || (templateObject_4 = __makeTemplateObject(["<div\n      class=\"activated-border ", "\"\n    ></div>"], ["<div\n      class=\"activated-border ", "\"\n    ></div>"])), this.activated ? 'active' : '');
+      };
+      /**
+       * @ignore
+       */
+
+
+      FoxListItem.styles = [styles$1];
       FoxListItem = __decorate([litElement.customElement('fox-list-item')], FoxListItem);
       return FoxListItem;
     }(mwcListItemBase.ListItemBase);
+    var templateObject_1$2, templateObject_2, templateObject_3, templateObject_4;
 
@@ -103,8 +123,12 @@ var FoxCheckListItem =
         var text = this.renderText();
-        var graphic = this.graphic && this.graphic !== 'control' && !this.left ? this.renderGraphic() : litHtml.html(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject([""], [""])));
-        var meta = this.hasMeta && this.left ? this.renderMeta() : litHtml.html(templateObject_2 || (templateObject_2 = __makeTemplateObject([""], [""])));
+        var graphic = this.graphic && this.graphic !== 'control' && !this.left ? this.renderGraphic() : litHtml.html(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject([""], [""])));
+        var meta = this.hasMeta && this.left ? this.renderMeta() : litHtml.html(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject([""], [""])));
         var ripple = this.renderRipple();
-        return litHtml.html(templateObject_3 || (templateObject_3 = __makeTemplateObject([" ", " ", " ", "\n      <span class=", ">\n        <fox-checkbox\n          reducedTouchTarget\n          tabindex=", "\n          .checked=", "\n          ?disabled=", "\n          @change=", "\n        >\n        </fox-checkbox>\n      </span>\n      ", " ", ""], [" ", " ", " ", "\n      <span class=", ">\n        <fox-checkbox\n          reducedTouchTarget\n          tabindex=", "\n          .checked=", "\n          ?disabled=", "\n          @change=", "\n        >\n        </fox-checkbox>\n      </span>\n      ", " ", ""])), ripple, graphic, this.left ? '' : text, classMap.classMap(checkboxClasses), this.tabindex, this.selected, this.disabled, this.onChange, this.left ? text : '', meta);
+        return litHtml.html(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject([" ", " ", " ", "\n      <span class=", ">\n        <fox-checkbox\n          reducedTouchTarget\n          tabindex=", "\n          .checked=", "\n          ?disabled=", "\n          @change=", "\n        >\n        </fox-checkbox>\n      </span>\n      ", " ", ""], [" ", " ", " ", "\n      <span class=", ">\n        <fox-checkbox\n          reducedTouchTarget\n          tabindex=", "\n          .checked=", "\n          ?disabled=", "\n          @change=", "\n        >\n        </fox-checkbox>\n      </span>\n      ", " ", ""])), ripple, graphic, this.left ? '' : text, classMap.classMap(checkboxClasses), this.tabindex, this.selected, this.disabled, this.onChange, this.left ? text : '', meta);
       };
+      /**
+       * @ignore
+       */
 
+
       FoxCheckListItem.styles = [mwcListItemCss.style, mwcControlListItemCss.style, styles$1];
@@ -114,4 +138,35 @@ FoxCheckListItem = __decorate([litElement.customElement('fox-check-list-item')], FoxCheckListItem);
     }(mwcCheckListItemBase.CheckListItemBase);
-    var templateObject_1$2, templateObject_2, templateObject_3;
+    var templateObject_1$3, templateObject_2$1, templateObject_3$1;
 
+    var FoxRadioListItem =
+    /** @class */
+    function (_super) {
+      __extends(FoxRadioListItem, _super);
+
+      function FoxRadioListItem() {
+        return _super !== null && _super.apply(this, arguments) || this;
+      }
+
+      FoxRadioListItem.prototype.render = function () {
+        var radioClasses = {
+          'mdc-deprecated-list-item__graphic': this.left,
+          'mdc-deprecated-list-item__meta': !this.left
+        };
+        var text = this.renderText();
+        var graphic = this.graphic && this.graphic !== 'control' && !this.left ? this.renderGraphic() : litHtml.html(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject([""], [""])));
+        var meta = this.hasMeta && this.left ? this.renderMeta() : litHtml.html(templateObject_2$2 || (templateObject_2$2 = __makeTemplateObject([""], [""])));
+        var ripple = this.renderRipple();
+        return litHtml.html(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject([" ", " ", " ", "\n      <fox-radio\n        global\n        class=", "\n        tabindex=", "\n        name=", "\n        .checked=", "\n        ?disabled=", "\n        @checked=", "\n      >\n      </fox-radio>\n      ", " ", ""], [" ", " ", " ", "\n      <fox-radio\n        global\n        class=", "\n        tabindex=", "\n        name=", "\n        .checked=", "\n        ?disabled=", "\n        @checked=", "\n      >\n      </fox-radio>\n      ", " ", ""])), ripple, graphic, this.left ? '' : text, classMap.classMap(radioClasses), this.tabindex, ifDefined.ifDefined(this.group === null ? undefined : this.group), this.selected, this.disabled, this.onChange, this.left ? text : '', meta);
+      };
+      /**
+       * @ignore
+       */
+
+
+      FoxRadioListItem.styles = [mwcListItemCss.style, mwcControlListItemCss.style, styles$1];
+      FoxRadioListItem = __decorate([litElement.customElement('fox-radio-list-item')], FoxRadioListItem);
+      return FoxRadioListItem;
+    }(mwcRadioListItemBase.RadioListItemBase);
+    var templateObject_1$4, templateObject_2$2, templateObject_3$2;
+
     Object.defineProperty(exports, 'createSetFromIndex', {
@@ -138,2 +193,3 @@ enumerable: true,
     exports.FoxListItem = FoxListItem;
+    exports.FoxRadioListItem = FoxRadioListItem;
 
@@ -140,0 +196,0 @@ Object.defineProperty(exports, '__esModule', { value: true });

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

55527

increased by153.7%

Lines of code

569

increased by65.41%

Number of lines in readme file

26

increased by8.33%

Worsened metrics

Number of low supply chain risk alerts

3

increased byInfinity%

No dependency changes