@limetech/lime-elements 37.4.2 → 37.6.0

package/dist/cjs/{limel-circular-progress_2.cjs.entry.js → limel-linear-progress.cjs.entry.js}

@@ -3,40 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-38eb64b5.js');
-const format = require('./format-138091fd.js');
 const component = require('./component-b37fd9bc.js');
 const util = require('./util-b0f5741e.js');
-require('./_commonjsHelpers-0c557e26.js');
-
-const circularProgressCss = "@charset \"UTF-8\";:host{--mdc-theme-primary:var(\n      --lime-primary-color,\n      rgb(var(--color-teal-default))\n  );--mdc-theme-secondary:var(\n      --lime-secondary-color,\n      rgb(var(--contrast-1100))\n  );--mdc-theme-on-primary:var(\n      --lime-on-primary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-secondary:var(\n      --lime-on-secondary-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-text-disabled-on-background:var(\n      --lime-text-disabled-on-background-color,\n      rgba(var(--contrast-1700), 0.38)\n  );--mdc-theme-text-primary-on-background:var(\n      --lime-text-primary-on-background-color,\n      rgba(var(--contrast-1700), 0.87)\n  );--mdc-theme-text-secondary-on-background:var(\n      --lime-text-secondary-on-background-color,\n      rgba(var(--contrast-1700), 0.54)\n  );--mdc-theme-error:var(\n      --lime-error-background-color,\n      rgb(var(--color-red-dark))\n  );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n      --lime-surface-background-color,\n      rgb(var(--contrast-100))\n  );--mdc-theme-on-surface:var(\n      --lime-on-surface-color,\n      rgb(var(--contrast-1500))\n  )}:host{display:block;box-sizing:border-box;isolation:isolate}:host([size=x-small]){--circular-progress-size:1.5rem;font-weight:bold}:host([size=x-small]) .value{letter-spacing:-0.0625rem}:host([size=small]){--circular-progress-size:2rem;font-weight:bold}:host([size=small]) .value{letter-spacing:-0.03125rem}:host([size=medium]){--circular-progress-size:3rem}:host([size=large]){--circular-progress-size:4rem}:host([size=x-large]){--circular-progress-size:5rem}.lime-circular-progress{--size:var(--circular-progress-size, 3rem);--fill-color:var(--circular-progress-fill-color, var(--mdc-theme-primary));--track-color:var(\n      --circular-progress-track-color,\n      rgb(var(--contrast-400))\n  );position:relative;display:flex;align-items:center;justify-content:center;width:var(--size);height:var(--size);border-radius:50%;line-height:normal;box-shadow:0 0 0 0.125rem rgb(var(--contrast-100), 0.7);background:conic-gradient(var(--fill-color) 0% var(--percentage), var(--track-color) var(--percentage) 100%)}.lime-circular-progress:before{content:\"\";position:absolute;width:calc(var(--size) * 0.75 + 0.25rem);height:calc(var(--size) * 0.75 + 0.25rem);border-radius:50%;background-color:var(--circular-progress-background-color, rgb(var(--contrast-100)));box-shadow:var(--button-shadow-pressed)}.prefix{font-size:clamp(0.5rem, var(--size) * 0.16, 2.25rem);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:center;color:var(--circular-progress-prefix-color, rgb(var(--contrast-1000)));width:45%;top:20%;position:absolute}.value{display:flex;font-size:clamp(0.5rem, var(--size) * 0.25, 4rem);color:var(--circular-progress-text-color, rgb(var(--contrast-1200)));z-index:1;cursor:default}.suffix{font-size:clamp(0.5rem, var(--size) * 0.18, 2.5rem);color:var(--circular-progress-suffix-color, rgb(var(--contrast-1000)));padding-top:4%}.displays-percentage-colors[style^=\"--percentage:1\"]{--circular-progress-fill-color:var(--color-percent--10to20)}.displays-percentage-colors[style^=\"--percentage:2\"]{--circular-progress-fill-color:var(--color-percent--20to30)}.displays-percentage-colors[style^=\"--percentage:3\"]{--circular-progress-fill-color:var(--color-percent--30to40)}.displays-percentage-colors[style^=\"--percentage:4\"]{--circular-progress-fill-color:var(--color-percent--40to50)}.displays-percentage-colors[style^=\"--percentage:5\"]{--circular-progress-fill-color:var(--color-percent--50to60)}.displays-percentage-colors[style^=\"--percentage:6\"]{--circular-progress-fill-color:var(--color-percent--60to70)}.displays-percentage-colors[style^=\"--percentage:7\"]{--circular-progress-fill-color:var(--color-percent--70to80)}.displays-percentage-colors[style^=\"--percentage:8\"]{--circular-progress-fill-color:var(--color-percent--80to90)}.displays-percentage-colors[style^=\"--percentage:9\"],.displays-percentage-colors[style=\"--percentage:100%;\"]{--circular-progress-fill-color:var(--color-percent--90to100)}.displays-percentage-colors[style=\"--percentage:1%;\"],.displays-percentage-colors[style=\"--percentage:2%;\"],.displays-percentage-colors[style=\"--percentage:3%;\"],.displays-percentage-colors[style=\"--percentage:4%;\"],.displays-percentage-colors[style=\"--percentage:5%;\"],.displays-percentage-colors[style=\"--percentage:6%;\"],.displays-percentage-colors[style=\"--percentage:7%;\"],.displays-percentage-colors[style=\"--percentage:8%;\"],.displays-percentage-colors[style=\"--percentage:9%;\"]{--circular-progress-fill-color:var(--color-percent--0to10)}";
-
-const PERCENT = 100;
-const CircularProgress = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.renderPrefix = () => {
-      if (this.prefix) {
-        return index.h("span", { class: "prefix" }, this.prefix);
-      }
-    };
-    this.value = 0;
-    this.maxValue = PERCENT;
-    this.prefix = null;
-    this.suffix = '%';
-    this.displayPercentageColors = false;
-    this.size = undefined;
-  }
-  render() {
-    const classList = {
-      'lime-circular-progress': true,
-      'displays-percentage-colors': this.displayPercentageColors,
-    };
-    const currentPercentage = (this.value * PERCENT) / this.maxValue + '%';
-    const value = Math.round(this.value * 10) / 10; // eslint-disable-line no-magic-numbers
-    return (index.h("div", { role: "progressbar", class: classList, "aria-label": "%", "aria-valuemin": "0", "aria-valuemax": this.maxValue, "aria-valuenow": this.value, style: { '--percentage': currentPercentage } }, this.renderPrefix(), index.h("span", { class: "value" }, format.abbreviate(value), index.h("span", { class: "suffix" }, this.suffix))));
-  }
-};
-CircularProgress.style = circularProgressCss;
 
 /**
  * @license
@@ -458,7 +426,6 @@ const LinearProgress = class {
 };
 LinearProgress.style = linearProgressCss;
 
-exports.limel_circular_progress = CircularProgress;
 exports.limel_linear_progress = LinearProgress;
 
-//# sourceMappingURL=limel-circular-progress_2.cjs.entry.js.map
+//# sourceMappingURL=limel-linear-progress.cjs.entry.js.map

package/dist/cjs/limel-linear-progress.cjs.entry.js.map

@@ -0,0 +1 @@
+{"file":"limel-linear-progress.entry.cjs.js","mappings":";;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,IAAI,UAAU,GAAG;AACxB,IAAI,YAAY,EAAE,6BAA6B;AAC/C,IAAI,0BAA0B,EAAE,2CAA2C;AAC3E,IAAI,mBAAmB,EAAE,oCAAoC;AAC7D,IAAI,cAAc,EAAE,+BAA+B;AACnD,IAAI,qBAAqB,EAAE,sCAAsC;AACjE,CAAC,CAAC;AACK,IAAI,OAAO,GAAG;AACrB,IAAI,WAAW,EAAE,aAAa;AAC9B,IAAI,aAAa,EAAE,eAAe;AAClC,IAAI,aAAa,EAAE,eAAe;AAClC,IAAI,aAAa,EAAE,eAAe;AAClC,IAAI,mBAAmB,EAAE,kCAAkC;AAC3D,IAAI,UAAU,EAAE,YAAY;AAC5B,IAAI,oBAAoB,EAAE,mCAAmC;AAC7D,CAAC,CAAC;AACF;AACO,IAAI,6BAA6B,GAAG;AAC3C,IAAI,YAAY,EAAE,QAAQ;AAC1B,IAAI,YAAY,EAAE,UAAU;AAC5B,IAAI,iBAAiB,EAAE,SAAS;AAChC,IAAI,cAAc,EAAE,SAAS;AAC7B,IAAI,cAAc,EAAE,UAAU;AAC9B,CAAC;;AC7CD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAKA,IAAI,2BAA2B,kBAAkB,UAAU,MAAM,EAAE;AACnE,IAAIA,mBAAS,CAAC,2BAA2B,EAAE,MAAM,CAAC,CAAC;AACnD,IAAI,SAAS,2BAA2B,CAAC,OAAO,EAAE;AAClD,QAAQ,IAAI,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,IAAI,EAAEC,kBAAQ,CAACA,kBAAQ,CAAC,EAAE,EAAE,2BAA2B,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC,CAAC,IAAI,IAAI,CAAC;AAC3H,QAAQ,KAAK,CAAC,QAAQ,GAAG,IAAI,CAAC;AAC9B,QAAQ,OAAO,KAAK,CAAC;AACrB,KAAK;AACL,IAAI,MAAM,CAAC,cAAc,CAAC,2BAA2B,EAAE,YAAY,EAAE;AACrE,QAAQ,GAAG,EAAE,YAAY;AACzB,YAAY,OAAO,UAAU,CAAC;AAC9B,SAAS;AACT,QAAQ,UAAU,EAAE,KAAK;AACzB,QAAQ,YAAY,EAAE,IAAI;AAC1B,KAAK,CAAC,CAAC;AACP,IAAI,MAAM,CAAC,cAAc,CAAC,2BAA2B,EAAE,SAAS,EAAE;AAClE,QAAQ,GAAG,EAAE,YAAY;AACzB,YAAY,OAAO,OAAO,CAAC;AAC3B,SAAS;AACT,QAAQ,UAAU,EAAE,KAAK;AACzB,QAAQ,YAAY,EAAE,IAAI;AAC1B,KAAK,CAAC,CAAC;AACP,IAAI,MAAM,CAAC,cAAc,CAAC,2BAA2B,EAAE,gBAAgB,EAAE;AACzE,QAAQ,GAAG,EAAE,YAAY;AACzB,YAAY,OAAO;AACnB,gBAAgB,QAAQ,EAAE,YAAY,EAAE,OAAO,SAAS,CAAC,EAAE;AAC3D,gBAAgB,oBAAoB,EAAE,YAAY,EAAE,OAAO,IAAI,CAAC,EAAE;AAClE,gBAAgB,WAAW,EAAE,YAAY,EAAE,OAAO,SAAS,CAAC,EAAE;AAC9D,gBAAgB,QAAQ,EAAE,YAAY,EAAE,OAAO,CAAC,CAAC,EAAE;AACnD,gBAAgB,QAAQ,EAAE,YAAY,EAAE,OAAO,KAAK,CAAC,EAAE;AACvD,gBAAgB,iBAAiB,EAAE,YAAY,EAAE,OAAO,IAAI,CAAC,EAAE;AAC/D,gBAAgB,kBAAkB,EAAE,YAAY,EAAE,OAAO,IAAI,CAAC,EAAE;AAChE,gBAAgB,QAAQ,EAAE,YAAY,EAAE,OAAO,SAAS,CAAC,EAAE;AAC3D,gBAAgB,eAAe,EAAE,YAAY,EAAE,OAAO,SAAS,CAAC,EAAE;AAClE,gBAAgB,WAAW,EAAE,YAAY,EAAE,OAAO,SAAS,CAAC,EAAE;AAC9D,gBAAgB,YAAY,EAAE,YAAY,EAAE,OAAO,SAAS,CAAC,EAAE;AAC/D,aAAa,CAAC;AACd,SAAS;AACT,QAAQ,UAAU,EAAE,KAAK;AACzB,QAAQ,YAAY,EAAE,IAAI;AAC1B,KAAK,CAAC,CAAC;AACP,IAAI,2BAA2B,CAAC,SAAS,CAAC,IAAI,GAAG,YAAY;AAC7D,QAAQ,IAAI,KAAK,GAAG,IAAI,CAAC;AACzB,QAAQ,IAAI,CAAC,WAAW,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,mBAAmB,CAAC,CAAC;AAClF,QAAQ,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,qBAAqB,CAAC,CAAC;AAChE,QAAQ,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;AAC1B,QAAQ,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC;AACxB,QAAQ,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC,UAAU,OAAO,EAAE;AAC7E,YAAY,IAAI,GAAG,EAAE,EAAE,CAAC;AACxB,YAAY,IAAI,KAAK,CAAC,WAAW,EAAE;AACnC,gBAAgB,OAAO;AACvB,aAAa;AACb,YAAY,IAAI;AAChB,gBAAgB,KAAK,IAAI,SAAS,GAAGC,kBAAQ,CAAC,OAAO,CAAC,EAAE,WAAW,GAAG,SAAS,CAAC,IAAI,EAAE,EAAE,CAAC,WAAW,CAAC,IAAI,EAAE,WAAW,GAAG,SAAS,CAAC,IAAI,EAAE,EAAE;AAC3I,oBAAoB,IAAI,KAAK,GAAG,WAAW,CAAC,KAAK,CAAC;AAClD,oBAAoB,IAAI,KAAK,CAAC,WAAW,EAAE;AAC3C,wBAAwB,KAAK,CAAC,yBAAyB,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AACjF,qBAAqB;AACrB,iBAAiB;AACjB,aAAa;AACb,YAAY,OAAO,KAAK,EAAE,EAAE,GAAG,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,EAAE;AACrD,oBAAoB;AACpB,gBAAgB,IAAI;AACpB,oBAAoB,IAAI,WAAW,IAAI,CAAC,WAAW,CAAC,IAAI,KAAK,EAAE,GAAG,SAAS,CAAC,MAAM,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;AACxG,iBAAiB;AACjB,wBAAwB,EAAE,IAAI,GAAG,EAAE,MAAM,GAAG,CAAC,KAAK,CAAC,EAAE;AACrD,aAAa;AACb,SAAS,CAAC,CAAC;AACX,QAAQ,IAAI,CAAC,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,QAAQ,EAAE;AAChD,YAAY,IAAI,CAAC,yBAAyB,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,CAAC;AACpE,SAAS;AACT,KAAK,CAAC;AACN,IAAI,2BAA2B,CAAC,SAAS,CAAC,cAAc,GAAG,UAAU,aAAa,EAAE;AACpF,QAAQ,IAAI,CAAC,WAAW,GAAG,aAAa,CAAC;AACzC,QAAQ,IAAI,IAAI,CAAC,WAAW,EAAE;AAC9B,YAAY,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,UAAU,CAAC,mBAAmB,CAAC,CAAC;AACrE,YAAY,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC,aAAa,EAAE,IAAI,CAAC,QAAQ,CAAC,QAAQ,EAAE,CAAC,CAAC;AACvF,YAAY,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC,aAAa,EAAE,GAAG,CAAC,CAAC;AAClE,YAAY,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC,aAAa,EAAE,GAAG,CAAC,CAAC;AAClE,YAAY,IAAI,CAAC,qBAAqB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;AACtD,YAAY,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;AACnD,YAAY,OAAO;AACnB,SAAS;AACT,QAAQ,IAAI,IAAI,CAAC,QAAQ,EAAE;AAC3B,YAAY,IAAI,CAAC,yBAAyB,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,CAAC;AACpE,SAAS;AACT,QAAQ,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,mBAAmB,CAAC,CAAC;AAC9D,QAAQ,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;AAC5D,QAAQ,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;AAC5D,QAAQ,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;AAC5D,QAAQ,IAAI,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC;AACtC,QAAQ,IAAI,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAAC;AACrC,KAAK,CAAC;AACN,IAAI,2BAA2B,CAAC,SAAS,CAAC,aAAa,GAAG,YAAY;AACtE,QAAQ,OAAO,IAAI,CAAC,WAAW,CAAC;AAChC,KAAK,CAAC;AACN,IAAI,2BAA2B,CAAC,SAAS,CAAC,WAAW,GAAG,UAAU,KAAK,EAAE;AACzE,QAAQ,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;AAC9B,QAAQ,IAAI,IAAI,CAAC,WAAW,EAAE;AAC9B,YAAY,IAAI,CAAC,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAC9C,YAAY,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC,aAAa,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC;AAC/E,SAAS;AACT,KAAK,CAAC;AACN,IAAI,2BAA2B,CAAC,SAAS,CAAC,WAAW,GAAG,YAAY;AACpE,QAAQ,OAAO,IAAI,CAAC,QAAQ,CAAC;AAC7B,KAAK,CAAC;AACN,IAAI,2BAA2B,CAAC,SAAS,CAAC,SAAS,GAAG,UAAU,KAAK,EAAE;AACvE,QAAQ,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;AAC5B,QAAQ,IAAI,IAAI,CAAC,WAAW,EAAE;AAC9B,YAAY,IAAI,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC;AAC7C,SAAS;AACT,KAAK,CAAC;AACN,IAAI,2BAA2B,CAAC,SAAS,CAAC,SAAS,GAAG,YAAY;AAClE,QAAQ,OAAO,IAAI,CAAC,MAAM,CAAC;AAC3B,KAAK,CAAC;AACN,IAAI,2BAA2B,CAAC,SAAS,CAAC,IAAI,GAAG,YAAY;AAC7D,QAAQ,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC;AAC1D,QAAQ,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,UAAU,CAAC,0BAA0B,CAAC,CAAC;AACxE,QAAQ,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;AAC1D,KAAK,CAAC;AACN,IAAI,2BAA2B,CAAC,SAAS,CAAC,KAAK,GAAG,YAAY;AAC9D,QAAQ,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC;AACvD,QAAQ,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;AAC/D,KAAK,CAAC;AACN,IAAI,2BAA2B,CAAC,SAAS,CAAC,QAAQ,GAAG,YAAY;AACjE,QAAQ,OAAO,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC;AAC9D,KAAK,CAAC;AACN;AACA;AACA;AACA;AACA;AACA,IAAI,2BAA2B,CAAC,SAAS,CAAC,mBAAmB,GAAG,YAAY;AAC5E,QAAQ,IAAI,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,YAAY,CAAC,EAAE;AAC5D,YAAY,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,0BAA0B,CAAC,CAAC;AACzE,SAAS;AACT,KAAK,CAAC;AACN,IAAI,2BAA2B,CAAC,SAAS,CAAC,OAAO,GAAG,YAAY;AAChE,QAAQ,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAC5C,QAAQ,IAAI,IAAI,CAAC,QAAQ,EAAE;AAC3B,YAAY,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;AACvC,SAAS;AACT,KAAK,CAAC;AACN,IAAI,2BAA2B,CAAC,SAAS,CAAC,gBAAgB,GAAG,YAAY;AACzE,QAAQ,IAAI,CAAC,OAAO,CAAC,WAAW,CAAC,UAAU,CAAC,qBAAqB,CAAC,CAAC;AACnE,QAAQ,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,CAAC;AACnC,QAAQ,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,qBAAqB,CAAC,CAAC;AAChE,KAAK,CAAC;AACN,IAAI,2BAA2B,CAAC,SAAS,CAAC,qBAAqB,GAAG,UAAU,aAAa,EAAE;AAC3F,QAAQ,IAAI,KAAK,GAAG,SAAS,GAAG,aAAa,GAAG,GAAG,CAAC;AACpD;AACA;AACA,QAAQ,IAAI,aAAa,GAAG,OAAO,MAAM,KAAK,WAAW;AACzD,YAAYC,2BAAsB,CAAC,MAAM,EAAE,WAAW,CAAC;AACvD,YAAY,WAAW,CAAC;AACxB,QAAQ,IAAI,CAAC,OAAO,CAAC,kBAAkB,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC;AAC9D,KAAK,CAAC;AACN,IAAI,2BAA2B,CAAC,SAAS,CAAC,oBAAoB,GAAG,UAAU,aAAa,EAAE;AAC1F,QAAQ,IAAI,KAAK,GAAG,aAAa,GAAG,GAAG,GAAG,GAAG,CAAC;AAC9C,QAAQ,IAAI,CAAC,OAAO,CAAC,iBAAiB,CAAC,OAAO,CAAC,UAAU,EAAE,KAAK,CAAC,CAAC;AAClE,KAAK,CAAC;AACN,IAAI,2BAA2B,CAAC,SAAS,CAAC,yBAAyB,GAAG,UAAU,KAAK,EAAE;AACvF,QAAQ,IAAI,WAAW,GAAG,KAAK,GAAGC,6BAAQ,CAAC,YAAY,CAAC;AACxD,QAAQ,IAAI,WAAW,GAAG,KAAK,GAAGA,6BAAQ,CAAC,YAAY,CAAC;AACxD,QAAQ,IAAI,gBAAgB,GAAG,KAAK,GAAGA,6BAAQ,CAAC,iBAAiB,CAAC;AAClE,QAAQ,IAAI,aAAa,GAAG,KAAK,GAAGA,6BAAQ,CAAC,cAAc,CAAC;AAC5D,QAAQ,IAAI,aAAa,GAAG,KAAK,GAAGA,6BAAQ,CAAC,cAAc,CAAC;AAC5D,QAAQ,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,oCAAoC,EAAE,WAAW,GAAG,IAAI,CAAC,CAAC;AACxF,QAAQ,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,wCAAwC,EAAE,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;AAC7F,QAAQ,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,oCAAoC,EAAE,WAAW,GAAG,IAAI,CAAC,CAAC;AACxF,QAAQ,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,wCAAwC,EAAE,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;AAC7F,QAAQ,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,yCAAyC,EAAE,gBAAgB,GAAG,IAAI,CAAC,CAAC;AAClG,QAAQ,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,6CAA6C,EAAE,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;AACvG,QAAQ,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,sCAAsC,EAAE,aAAa,GAAG,IAAI,CAAC,CAAC;AAC5F,QAAQ,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,0CAA0C,EAAE,CAAC,aAAa,GAAG,IAAI,CAAC,CAAC;AACjG,QAAQ,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,sCAAsC,EAAE,aAAa,GAAG,IAAI,CAAC,CAAC;AAC5F,QAAQ,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,0CAA0C,EAAE,CAAC,aAAa,GAAG,IAAI,CAAC,CAAC;AACjG;AACA,QAAQ,IAAI,CAAC,gBAAgB,EAAE,CAAC;AAChC,KAAK,CAAC;AACN,IAAI,OAAO,2BAA2B,CAAC;AACvC,CAAC,CAACC,uBAAa,CAAC,CAAC;;AC9MjB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA,IAAI,iBAAiB,kBAAkB,UAAU,MAAM,EAAE;AACzD,IAAIL,mBAAS,CAAC,iBAAiB,EAAE,MAAM,CAAC,CAAC;AACzC,IAAI,SAAS,iBAAiB,GAAG;AACjC,QAAQ,OAAO,MAAM,KAAK,IAAI,IAAI,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,SAAS,CAAC,IAAI,IAAI,CAAC;AACxE,KAAK;AACL,IAAI,iBAAiB,CAAC,QAAQ,GAAG,UAAU,IAAI,EAAE;AACjD,QAAQ,OAAO,IAAI,iBAAiB,CAAC,IAAI,CAAC,CAAC;AAC3C,KAAK,CAAC;AACN,IAAI,MAAM,CAAC,cAAc,CAAC,iBAAiB,CAAC,SAAS,EAAE,aAAa,EAAE;AACtE,QAAQ,GAAG,EAAE,UAAU,KAAK,EAAE;AAC9B,YAAY,IAAI,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;AAClD,SAAS;AACT,QAAQ,UAAU,EAAE,KAAK;AACzB,QAAQ,YAAY,EAAE,IAAI;AAC1B,KAAK,CAAC,CAAC;AACP,IAAI,MAAM,CAAC,cAAc,CAAC,iBAAiB,CAAC,SAAS,EAAE,UAAU,EAAE;AACnE,QAAQ,GAAG,EAAE,UAAU,KAAK,EAAE;AAC9B,YAAY,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAC/C,SAAS;AACT,QAAQ,UAAU,EAAE,KAAK;AACzB,QAAQ,YAAY,EAAE,IAAI;AAC1B,KAAK,CAAC,CAAC;AACP,IAAI,MAAM,CAAC,cAAc,CAAC,iBAAiB,CAAC,SAAS,EAAE,QAAQ,EAAE;AACjE,QAAQ,GAAG,EAAE,UAAU,KAAK,EAAE;AAC9B,YAAY,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;AAC7C,SAAS;AACT,QAAQ,UAAU,EAAE,KAAK;AACzB,QAAQ,YAAY,EAAE,IAAI;AAC1B,KAAK,CAAC,CAAC;AACP,IAAI,iBAAiB,CAAC,SAAS,CAAC,IAAI,GAAG,YAAY;AACnD,QAAQ,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;AAC/B,KAAK,CAAC;AACN,IAAI,iBAAiB,CAAC,SAAS,CAAC,KAAK,GAAG,YAAY;AACpD,QAAQ,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,CAAC;AAChC,KAAK,CAAC;AACN,IAAI,iBAAiB,CAAC,SAAS,CAAC,kBAAkB,GAAG,YAAY;AACjE,QAAQ,IAAI,KAAK,GAAG,IAAI,CAAC;AACzB,QAAQ,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,eAAe,EAAE,YAAY;AAChE,YAAY,KAAK,CAAC,UAAU,CAAC,mBAAmB,EAAE,CAAC;AACnD,SAAS,CAAC,CAAC;AACX,KAAK,CAAC;AACN,IAAI,iBAAiB,CAAC,SAAS,CAAC,oBAAoB,GAAG,YAAY;AACnE,QAAQ,IAAI,KAAK,GAAG,IAAI,CAAC;AACzB;AACA;AACA;AACA,QAAQ,IAAI,OAAO,GAAG;AACtB,YAAY,QAAQ,EAAE,UAAU,SAAS,EAAE;AAC3C,gBAAgB,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;AACpD,aAAa;AACb,YAAY,WAAW,EAAE,YAAY;AACrC,gBAAgB,KAAK,CAAC,IAAI,CAAC,qBAAqB,EAAE,CAAC;AACnD,aAAa;AACb,YAAY,iBAAiB,EAAE,UAAU,aAAa,EAAE,KAAK,EAAE;AAC/D,gBAAgB,IAAI,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,2BAA2B,CAAC,OAAO,CAAC,mBAAmB,CAAC,CAAC;AAClH,gBAAgB,IAAI,SAAS,EAAE;AAC/B,oBAAoB,SAAS,CAAC,KAAK,CAAC,WAAW,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC;AACtE,iBAAiB;AACjB,aAAa;AACb,YAAY,kBAAkB,EAAE,UAAU,aAAa,EAAE,KAAK,EAAE;AAChE,gBAAgB,IAAI,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,2BAA2B,CAAC,OAAO,CAAC,oBAAoB,CAAC,CAAC;AACpH,gBAAgB,IAAI,UAAU,EAAE;AAChC,oBAAoB,UAAU,CAAC,KAAK,CAAC,WAAW,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC;AACvE,iBAAiB;AACjB,aAAa;AACb,YAAY,QAAQ,EAAE,UAAU,SAAS,EAAE,EAAE,OAAO,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,EAAE;AAC/F,YAAY,eAAe,EAAE,UAAU,aAAa,EAAE;AACtD,gBAAgB,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;AAC1D,aAAa;AACb,YAAY,WAAW,EAAE,UAAU,SAAS,EAAE;AAC9C,gBAAgB,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;AACvD,aAAa;AACb,YAAY,YAAY,EAAE,UAAU,aAAa,EAAE,KAAK,EAAE;AAC1D,gBAAgB,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,aAAa,EAAE,KAAK,CAAC,CAAC;AAC9D,aAAa;AACb,YAAY,QAAQ,EAAE,UAAU,IAAI,EAAE,KAAK,EAAE;AAC7C,gBAAgB,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;AAC1D,aAAa;AACb,YAAY,oBAAoB,EAAE,UAAU,QAAQ,EAAE;AACtD,gBAAgB,IAAI,EAAE,GAAG,MAAM,CAAC,cAAc,CAAC;AAC/C,gBAAgB,IAAI,EAAE,EAAE;AACxB,oBAAoB,IAAI,EAAE,GAAG,IAAI,EAAE,CAAC,QAAQ,CAAC,CAAC;AAC9C,oBAAoB,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;AAC3C,oBAAoB,OAAO,EAAE,CAAC;AAC9B,iBAAiB;AACjB,gBAAgB,OAAO,IAAI,CAAC;AAC5B,aAAa;AACb,YAAY,QAAQ,EAAE,YAAY,EAAE,OAAO,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE;AACpE,SAAS,CAAC;AACV,QAAQ,OAAO,IAAI,2BAA2B,CAAC,OAAO,CAAC,CAAC;AACxD,KAAK,CAAC;AACN,IAAI,OAAO,iBAAiB,CAAC;AAC7B,CAAC,CAACM,sBAAY,CAAC,CAAC;;ACrHhB,MAAM,iBAAiB,GAAG,k1SAAk1S;;MCa/1S,cAAc;;;iBAKA,CAAC;yBAMQ,KAAK;;EAO9B,iBAAiB;IACpB,IAAI,CAAC,UAAU,EAAE,CAAC;GACrB;EAEM,gBAAgB;IACnB,IAAI,CAAC,UAAU,EAAE,CAAC;GACrB;EAEO,UAAU;IACd,MAAM,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,CAC9C,sBAAsB,CACzB,CAAC;IACF,IAAI,CAAC,OAAO,EAAE;MACV,OAAO;KACV;IAED,IAAI,CAAC,iBAAiB,GAAG,IAAI,iBAAiB,CAAC,OAAO,CAAC,CAAC;IACxD,IAAI,CAAC,iBAAiB,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC;GAChD;EAEM,oBAAoB;IACvB,IAAI,IAAI,CAAC,iBAAiB,EAAE;MACxB,IAAI,CAAC,iBAAiB,CAAC,OAAO,EAAE,CAAC;KACpC;GACJ;EAEM,MAAM;IACT,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;MAC5B,OAAO;KACV;IAED,MAAM,SAAS,GAAG;MACd,qBAAqB,EAAE,IAAI;MAC3B,oCAAoC,EAAE,IAAI,CAAC,aAAa;KAC3D,CAAC;IAEF,QACIC,iBACI,IAAI,EAAC,aAAa,EAClB,KAAK,EAAE,SAAS,gBACL,cAAc,mBACX,GAAG,mBACH,GAAG,mBACF,IAAI,CAAC,KAAK,IAEzBA,iBAAK,KAAK,EAAC,6BAA6B,IACpCA,iBAAK,KAAK,EAAC,iCAAiC,GAAO,CACjD,EACNA,iBAAK,KAAK,EAAC,2DAA2D,IAClEA,kBAAM,KAAK,EAAC,gCAAgC,GAAG,CAC7C,EACNA,iBAAK,KAAK,EAAC,6DAA6D,IACpEA,kBAAM,KAAK,EAAC,gCAAgC,GAAG,CAC7C,CACJ,EACR;GACL;EAGS,UAAU,CAAC,QAAQ;IACzB,IAAI,CAAC,IAAI,CAAC,iBAAiB,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;MACrD,OAAO;KACV;IAED,IAAI,CAAC,iBAAiB,CAAC,QAAQ,GAAG,QAAQ,CAAC;GAC9C;EAEO,QAAQ,CAAC,KAAc;IAC3B,OAAO,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;GACjC;;;;;;;;;;","names":["__extends","__assign","__values","getCorrectPropertyName","percents","MDCFoundation","MDCComponent","h"],"sources":["./node_modules/@material/linear-progress/constants.js","./node_modules/@material/linear-progress/foundation.js","./node_modules/@material/linear-progress/component.js","./src/components/linear-progress/linear-progress.scss?tag=limel-linear-progress&encapsulation=shadow","./src/components/linear-progress/linear-progress.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2017 Google Inc.\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in\n * all copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n * THE SOFTWARE.\n */\nexport var cssClasses = {\n    CLOSED_CLASS: 'mdc-linear-progress--closed',\n    CLOSED_ANIMATION_OFF_CLASS: 'mdc-linear-progress--closed-animation-off',\n    INDETERMINATE_CLASS: 'mdc-linear-progress--indeterminate',\n    REVERSED_CLASS: 'mdc-linear-progress--reversed',\n    ANIMATION_READY_CLASS: 'mdc-linear-progress--animation-ready',\n};\nexport var strings = {\n    ARIA_HIDDEN: 'aria-hidden',\n    ARIA_VALUEMAX: 'aria-valuemax',\n    ARIA_VALUEMIN: 'aria-valuemin',\n    ARIA_VALUENOW: 'aria-valuenow',\n    BUFFER_BAR_SELECTOR: '.mdc-linear-progress__buffer-bar',\n    FLEX_BASIS: 'flex-basis',\n    PRIMARY_BAR_SELECTOR: '.mdc-linear-progress__primary-bar',\n};\n// these are percentages pulled from keyframes.scss\nexport var animationDimensionPercentages = {\n    PRIMARY_HALF: .8367142,\n    PRIMARY_FULL: 2.00611057,\n    SECONDARY_QUARTER: .37651913,\n    SECONDARY_HALF: .84386165,\n    SECONDARY_FULL: 1.60277782,\n};\n//# sourceMappingURL=constants.js.map","/**\n * @license\n * Copyright 2017 Google Inc.\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in\n * all copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n * THE SOFTWARE.\n */\nimport { __assign, __extends, __values } from \"tslib\";\nimport { getCorrectPropertyName } from '@material/animation/util';\nimport { MDCFoundation } from '@material/base/foundation';\nimport { animationDimensionPercentages as percents, cssClasses, strings } from './constants';\nvar MDCLinearProgressFoundation = /** @class */ (function (_super) {\n    __extends(MDCLinearProgressFoundation, _super);\n    function MDCLinearProgressFoundation(adapter) {\n        var _this = _super.call(this, __assign(__assign({}, MDCLinearProgressFoundation.defaultAdapter), adapter)) || this;\n        _this.observer = null;\n        return _this;\n    }\n    Object.defineProperty(MDCLinearProgressFoundation, \"cssClasses\", {\n        get: function () {\n            return cssClasses;\n        },\n        enumerable: false,\n        configurable: true\n    });\n    Object.defineProperty(MDCLinearProgressFoundation, \"strings\", {\n        get: function () {\n            return strings;\n        },\n        enumerable: false,\n        configurable: true\n    });\n    Object.defineProperty(MDCLinearProgressFoundation, \"defaultAdapter\", {\n        get: function () {\n            return {\n                addClass: function () { return undefined; },\n                attachResizeObserver: function () { return null; },\n                forceLayout: function () { return undefined; },\n                getWidth: function () { return 0; },\n                hasClass: function () { return false; },\n                setBufferBarStyle: function () { return null; },\n                setPrimaryBarStyle: function () { return null; },\n                setStyle: function () { return undefined; },\n                removeAttribute: function () { return undefined; },\n                removeClass: function () { return undefined; },\n                setAttribute: function () { return undefined; },\n            };\n        },\n        enumerable: false,\n        configurable: true\n    });\n    MDCLinearProgressFoundation.prototype.init = function () {\n        var _this = this;\n        this.determinate = !this.adapter.hasClass(cssClasses.INDETERMINATE_CLASS);\n        this.adapter.addClass(cssClasses.ANIMATION_READY_CLASS);\n        this.progress = 0;\n        this.buffer = 1;\n        this.observer = this.adapter.attachResizeObserver(function (entries) {\n            var e_1, _a;\n            if (_this.determinate) {\n                return;\n            }\n            try {\n                for (var entries_1 = __values(entries), entries_1_1 = entries_1.next(); !entries_1_1.done; entries_1_1 = entries_1.next()) {\n                    var entry = entries_1_1.value;\n                    if (entry.contentRect) {\n                        _this.calculateAndSetDimensions(entry.contentRect.width);\n                    }\n                }\n            }\n            catch (e_1_1) { e_1 = { error: e_1_1 }; }\n            finally {\n                try {\n                    if (entries_1_1 && !entries_1_1.done && (_a = entries_1.return)) _a.call(entries_1);\n                }\n                finally { if (e_1) throw e_1.error; }\n            }\n        });\n        if (!this.determinate && this.observer) {\n            this.calculateAndSetDimensions(this.adapter.getWidth());\n        }\n    };\n    MDCLinearProgressFoundation.prototype.setDeterminate = function (isDeterminate) {\n        this.determinate = isDeterminate;\n        if (this.determinate) {\n            this.adapter.removeClass(cssClasses.INDETERMINATE_CLASS);\n            this.adapter.setAttribute(strings.ARIA_VALUENOW, this.progress.toString());\n            this.adapter.setAttribute(strings.ARIA_VALUEMAX, '1');\n            this.adapter.setAttribute(strings.ARIA_VALUEMIN, '0');\n            this.setPrimaryBarProgress(this.progress);\n            this.setBufferBarProgress(this.buffer);\n            return;\n        }\n        if (this.observer) {\n            this.calculateAndSetDimensions(this.adapter.getWidth());\n        }\n        this.adapter.addClass(cssClasses.INDETERMINATE_CLASS);\n        this.adapter.removeAttribute(strings.ARIA_VALUENOW);\n        this.adapter.removeAttribute(strings.ARIA_VALUEMAX);\n        this.adapter.removeAttribute(strings.ARIA_VALUEMIN);\n        this.setPrimaryBarProgress(1);\n        this.setBufferBarProgress(1);\n    };\n    MDCLinearProgressFoundation.prototype.isDeterminate = function () {\n        return this.determinate;\n    };\n    MDCLinearProgressFoundation.prototype.setProgress = function (value) {\n        this.progress = value;\n        if (this.determinate) {\n            this.setPrimaryBarProgress(value);\n            this.adapter.setAttribute(strings.ARIA_VALUENOW, value.toString());\n        }\n    };\n    MDCLinearProgressFoundation.prototype.getProgress = function () {\n        return this.progress;\n    };\n    MDCLinearProgressFoundation.prototype.setBuffer = function (value) {\n        this.buffer = value;\n        if (this.determinate) {\n            this.setBufferBarProgress(value);\n        }\n    };\n    MDCLinearProgressFoundation.prototype.getBuffer = function () {\n        return this.buffer;\n    };\n    MDCLinearProgressFoundation.prototype.open = function () {\n        this.adapter.removeClass(cssClasses.CLOSED_CLASS);\n        this.adapter.removeClass(cssClasses.CLOSED_ANIMATION_OFF_CLASS);\n        this.adapter.removeAttribute(strings.ARIA_HIDDEN);\n    };\n    MDCLinearProgressFoundation.prototype.close = function () {\n        this.adapter.addClass(cssClasses.CLOSED_CLASS);\n        this.adapter.setAttribute(strings.ARIA_HIDDEN, 'true');\n    };\n    MDCLinearProgressFoundation.prototype.isClosed = function () {\n        return this.adapter.hasClass(cssClasses.CLOSED_CLASS);\n    };\n    /**\n     * Handles the transitionend event emitted after `close()` is called and the\n     * opacity fades out. This is so that animations are removed only after the\n     * progress indicator is completely hidden.\n     */\n    MDCLinearProgressFoundation.prototype.handleTransitionEnd = function () {\n        if (this.adapter.hasClass(cssClasses.CLOSED_CLASS)) {\n            this.adapter.addClass(cssClasses.CLOSED_ANIMATION_OFF_CLASS);\n        }\n    };\n    MDCLinearProgressFoundation.prototype.destroy = function () {\n        _super.prototype.destroy.call(this);\n        if (this.observer) {\n            this.observer.disconnect();\n        }\n    };\n    MDCLinearProgressFoundation.prototype.restartAnimation = function () {\n        this.adapter.removeClass(cssClasses.ANIMATION_READY_CLASS);\n        this.adapter.forceLayout();\n        this.adapter.addClass(cssClasses.ANIMATION_READY_CLASS);\n    };\n    MDCLinearProgressFoundation.prototype.setPrimaryBarProgress = function (progressValue) {\n        var value = \"scaleX(\" + progressValue + \")\";\n        // Accessing `window` without a `typeof` check will throw on Node\n        // environments.\n        var transformProp = typeof window !== 'undefined' ?\n            getCorrectPropertyName(window, 'transform') :\n            'transform';\n        this.adapter.setPrimaryBarStyle(transformProp, value);\n    };\n    MDCLinearProgressFoundation.prototype.setBufferBarProgress = function (progressValue) {\n        var value = progressValue * 100 + \"%\";\n        this.adapter.setBufferBarStyle(strings.FLEX_BASIS, value);\n    };\n    MDCLinearProgressFoundation.prototype.calculateAndSetDimensions = function (width) {\n        var primaryHalf = width * percents.PRIMARY_HALF;\n        var primaryFull = width * percents.PRIMARY_FULL;\n        var secondaryQuarter = width * percents.SECONDARY_QUARTER;\n        var secondaryHalf = width * percents.SECONDARY_HALF;\n        var secondaryFull = width * percents.SECONDARY_FULL;\n        this.adapter.setStyle('--mdc-linear-progress-primary-half', primaryHalf + \"px\");\n        this.adapter.setStyle('--mdc-linear-progress-primary-half-neg', -primaryHalf + \"px\");\n        this.adapter.setStyle('--mdc-linear-progress-primary-full', primaryFull + \"px\");\n        this.adapter.setStyle('--mdc-linear-progress-primary-full-neg', -primaryFull + \"px\");\n        this.adapter.setStyle('--mdc-linear-progress-secondary-quarter', secondaryQuarter + \"px\");\n        this.adapter.setStyle('--mdc-linear-progress-secondary-quarter-neg', -secondaryQuarter + \"px\");\n        this.adapter.setStyle('--mdc-linear-progress-secondary-half', secondaryHalf + \"px\");\n        this.adapter.setStyle('--mdc-linear-progress-secondary-half-neg', -secondaryHalf + \"px\");\n        this.adapter.setStyle('--mdc-linear-progress-secondary-full', secondaryFull + \"px\");\n        this.adapter.setStyle('--mdc-linear-progress-secondary-full-neg', -secondaryFull + \"px\");\n        // need to restart animation for custom props to apply to keyframes\n        this.restartAnimation();\n    };\n    return MDCLinearProgressFoundation;\n}(MDCFoundation));\nexport { MDCLinearProgressFoundation };\n// tslint:disable-next-line:no-default-export Needed for backward compatibility with MDC Web v0.44.0 and earlier.\nexport default MDCLinearProgressFoundation;\n//# sourceMappingURL=foundation.js.map","/**\n * @license\n * Copyright 2017 Google Inc.\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in\n * all copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n * THE SOFTWARE.\n */\nimport { __extends } from \"tslib\";\nimport { MDCComponent } from '@material/base/component';\nimport { MDCLinearProgressFoundation } from './foundation';\nvar MDCLinearProgress = /** @class */ (function (_super) {\n    __extends(MDCLinearProgress, _super);\n    function MDCLinearProgress() {\n        return _super !== null && _super.apply(this, arguments) || this;\n    }\n    MDCLinearProgress.attachTo = function (root) {\n        return new MDCLinearProgress(root);\n    };\n    Object.defineProperty(MDCLinearProgress.prototype, \"determinate\", {\n        set: function (value) {\n            this.foundation.setDeterminate(value);\n        },\n        enumerable: false,\n        configurable: true\n    });\n    Object.defineProperty(MDCLinearProgress.prototype, \"progress\", {\n        set: function (value) {\n            this.foundation.setProgress(value);\n        },\n        enumerable: false,\n        configurable: true\n    });\n    Object.defineProperty(MDCLinearProgress.prototype, \"buffer\", {\n        set: function (value) {\n            this.foundation.setBuffer(value);\n        },\n        enumerable: false,\n        configurable: true\n    });\n    MDCLinearProgress.prototype.open = function () {\n        this.foundation.open();\n    };\n    MDCLinearProgress.prototype.close = function () {\n        this.foundation.close();\n    };\n    MDCLinearProgress.prototype.initialSyncWithDOM = function () {\n        var _this = this;\n        this.root.addEventListener('transitionend', function () {\n            _this.foundation.handleTransitionEnd();\n        });\n    };\n    MDCLinearProgress.prototype.getDefaultFoundation = function () {\n        var _this = this;\n        // DO NOT INLINE this variable. For backward compatibility, foundations take\n        // a Partial<MDCFooAdapter>. To ensure we don't accidentally omit any\n        // methods, we need a separate, strongly typed adapter variable.\n        var adapter = {\n            addClass: function (className) {\n                _this.root.classList.add(className);\n            },\n            forceLayout: function () {\n                _this.root.getBoundingClientRect();\n            },\n            setBufferBarStyle: function (styleProperty, value) {\n                var bufferBar = _this.root.querySelector(MDCLinearProgressFoundation.strings.BUFFER_BAR_SELECTOR);\n                if (bufferBar) {\n                    bufferBar.style.setProperty(styleProperty, value);\n                }\n            },\n            setPrimaryBarStyle: function (styleProperty, value) {\n                var primaryBar = _this.root.querySelector(MDCLinearProgressFoundation.strings.PRIMARY_BAR_SELECTOR);\n                if (primaryBar) {\n                    primaryBar.style.setProperty(styleProperty, value);\n                }\n            },\n            hasClass: function (className) { return _this.root.classList.contains(className); },\n            removeAttribute: function (attributeName) {\n                _this.root.removeAttribute(attributeName);\n            },\n            removeClass: function (className) {\n                _this.root.classList.remove(className);\n            },\n            setAttribute: function (attributeName, value) {\n                _this.root.setAttribute(attributeName, value);\n            },\n            setStyle: function (name, value) {\n                _this.root.style.setProperty(name, value);\n            },\n            attachResizeObserver: function (callback) {\n                var RO = window.ResizeObserver;\n                if (RO) {\n                    var ro = new RO(callback);\n                    ro.observe(_this.root);\n                    return ro;\n                }\n                return null;\n            },\n            getWidth: function () { return _this.root.offsetWidth; },\n        };\n        return new MDCLinearProgressFoundation(adapter);\n    };\n    return MDCLinearProgress;\n}(MDCComponent));\nexport { MDCLinearProgress };\n//# sourceMappingURL=component.js.map","@use '../../style/internal/lime-theme';\n@use '@material/linear-progress';\n\n/**\n * @prop --background-color: Color to use for progress-bar track.\n */\n\n@include linear-progress.core-styles;\n\n.mdc-linear-progress {\n    text-align: left;\n}\n\n@include linear-progress.buffer-color(\n    var(--background-color, rgba(var(--contrast-800), 0.5))\n);\n","import { MDCLinearProgress } from '@material/linear-progress';\nimport { Component, Element, h, Prop, Watch } from '@stencil/core';\n\n/**\n * @exampleComponent limel-example-linear-progress\n * @exampleComponent limel-example-linear-progress-color\n * @exampleComponent limel-example-linear-progress-indeterminate\n */\n@Component({\n    tag: 'limel-linear-progress',\n    shadow: true,\n    styleUrl: 'linear-progress.scss',\n})\nexport class LinearProgress {\n    /**\n     * The value of the progress bar. Should be between `0` and `1`.\n     */\n    @Prop({ reflect: true })\n    public value: number = 0;\n\n    /**\n     * Puts the progress bar in an indeterminate state\n     */\n    @Prop({ reflect: true })\n    public indeterminate: boolean = false;\n\n    @Element()\n    private host: HTMLLimelLinearProgressElement;\n\n    private mdcLinearProgress: MDCLinearProgress;\n\n    public connectedCallback() {\n        this.initialize();\n    }\n\n    public componentDidLoad() {\n        this.initialize();\n    }\n\n    private initialize() {\n        const element = this.host.shadowRoot.querySelector(\n            '.mdc-linear-progress',\n        );\n        if (!element) {\n            return;\n        }\n\n        this.mdcLinearProgress = new MDCLinearProgress(element);\n        this.mdcLinearProgress.progress = this.value;\n    }\n\n    public disconnectedCallback() {\n        if (this.mdcLinearProgress) {\n            this.mdcLinearProgress.destroy();\n        }\n    }\n\n    public render() {\n        if (!this.isFinite(this.value)) {\n            return;\n        }\n\n        const classList = {\n            'mdc-linear-progress': true,\n            'mdc-linear-progress--indeterminate': this.indeterminate,\n        };\n\n        return (\n            <div\n                role=\"progressbar\"\n                class={classList}\n                aria-label=\"Progress Bar\"\n                aria-valuemin=\"0\"\n                aria-valuemax=\"1\"\n                aria-valuenow={this.value}\n            >\n                <div class=\"mdc-linear-progress__buffer\">\n                    <div class=\"mdc-linear-progress__buffer-bar\"></div>\n                </div>\n                <div class=\"mdc-linear-progress__bar mdc-linear-progress__primary-bar\">\n                    <span class=\"mdc-linear-progress__bar-inner\" />\n                </div>\n                <div class=\"mdc-linear-progress__bar mdc-linear-progress__secondary-bar\">\n                    <span class=\"mdc-linear-progress__bar-inner\" />\n                </div>\n            </div>\n        );\n    }\n\n    @Watch('value')\n    protected watchValue(newValue) {\n        if (!this.mdcLinearProgress || !this.isFinite(newValue)) {\n            return;\n        }\n\n        this.mdcLinearProgress.progress = newValue;\n    }\n\n    private isFinite(value: unknown) {\n        return Number.isFinite(value);\n    }\n}\n"],"version":3}

package/dist/cjs/loader.cjs.js

@@ -14,7 +14,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return index.bootstrapLazy(JSON.parse("[[\"limel-action-bar.cjs\",[[1,\"limel-action-bar\",{\"actions\":[16],\"accessibleLabel\":[513,\"accessible-label\"],\"layout\":[513],\"openDirection\":[513,\"open-direction\"],\"overflowCutoff\":[32]}]]],[\"limel-split-button.cjs\",[[1,\"limel-split-button\",{\"label\":[513],\"primary\":[516],\"icon\":[513],\"disabled\":[516],\"items\":[16]}]]],[\"limel-file-viewer.cjs\",[[1,\"limel-file-viewer\",{\"url\":[513],\"filename\":[513],\"alt\":[513],\"allowFullscreen\":[516,\"allow-fullscreen\"],\"allowOpenInNewTab\":[516,\"allow-open-in-new-tab\"],\"allowDownload\":[516,\"allow-download\"],\"language\":[1],\"officeViewer\":[513,\"office-viewer\"],\"actions\":[16],\"isFullscreen\":[32],\"fileType\":[32],\"loading\":[32],\"fileUrl\":[32]}]]],[\"limel-color-picker.cjs\",[[1,\"limel-color-picker\",{\"value\":[513],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"tooltipLabel\":[513,\"tooltip-label\"],\"required\":[516],\"readonly\":[516],\"isOpen\":[32]}]]],[\"limel-picker.cjs\",[[1,\"limel-picker\",{\"disabled\":[4],\"readonly\":[516],\"label\":[1],\"searchLabel\":[1,\"search-label\"],\"helperText\":[513,\"helper-text\"],\"leadingIcon\":[1,\"leading-icon\"],\"emptyResultMessage\":[1,\"empty-result-message\"],\"required\":[4],\"invalid\":[516],\"value\":[16],\"searcher\":[16],\"multiple\":[4],\"delimiter\":[513],\"actions\":[16],\"actionPosition\":[1,\"action-position\"],\"actionScrollBehavior\":[1,\"action-scroll-behavior\"],\"badgeIcons\":[516,\"badge-icons\"],\"items\":[32],\"textValue\":[32],\"loading\":[32],\"chips\":[32]}]]],[\"limel-dock.cjs\",[[1,\"limel-dock\",{\"dockItems\":[16],\"dockFooterItems\":[16],\"accessibleLabel\":[513,\"accessible-label\"],\"expanded\":[516],\"allowResize\":[516,\"allow-resize\"],\"mobileBreakPoint\":[514,\"mobile-break-point\"],\"useMobileLayout\":[32]}]]],[\"limel-date-picker.cjs\",[[1,\"limel-date-picker\",{\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"label\":[513],\"placeholder\":[513],\"helperText\":[513,\"helper-text\"],\"required\":[516],\"value\":[16],\"type\":[513],\"format\":[513],\"language\":[513],\"formatter\":[16],\"formattedValue\":[32],\"internalFormat\":[32],\"showPortal\":[32]}]]],[\"limel-snackbar.cjs\",[[1,\"limel-snackbar\",{\"message\":[1],\"timeout\":[2],\"actionText\":[1,\"action-text\"],\"dismissible\":[4],\"multiline\":[4],\"language\":[1],\"show\":[64]}]]],[\"limel-tab-panel.cjs\",[[1,\"limel-tab-panel\",{\"tabs\":[1040]}]]],[\"limel-button-group.cjs\",[[1,\"limel-button-group\",{\"value\":[16],\"disabled\":[516],\"selectedButtonId\":[32]}]]],[\"limel-collapsible-section.cjs\",[[1,\"limel-collapsible-section\",{\"isOpen\":[1540,\"is-open\"],\"header\":[513],\"actions\":[16]}]]],[\"limel-file.cjs\",[[1,\"limel-file\",{\"value\":[16],\"label\":[513],\"required\":[516],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"accept\":[513],\"language\":[1],\"isDraggingOverDropZone\":[32]}]]],[\"limel-help.cjs\",[[1,\"limel-help\",{\"value\":[1],\"trigger\":[1],\"readMoreLink\":[16],\"openDirection\":[513,\"open-direction\"],\"isOpen\":[32]}]]],[\"limel-select.cjs\",[[1,\"limel-select\",{\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"required\":[516],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"value\":[16],\"options\":[16],\"multiple\":[4],\"menuOpen\":[32]}]]],[\"limel-info-tile.cjs\",[[1,\"limel-info-tile\",{\"value\":[520],\"icon\":[1],\"label\":[513],\"prefix\":[513],\"suffix\":[513],\"disabled\":[516],\"badge\":[520],\"loading\":[516],\"link\":[16],\"progress\":[16]}]]],[\"limel-table.cjs\",[[1,\"limel-table\",{\"data\":[16],\"columns\":[16],\"mode\":[1],\"layout\":[1],\"pageSize\":[2,\"page-size\"],\"totalRows\":[2,\"total-rows\"],\"sorting\":[16],\"activeRow\":[1040],\"movableColumns\":[4,\"movable-columns\"],\"loading\":[4],\"page\":[2],\"emptyMessage\":[1,\"empty-message\"],\"aggregates\":[16],\"selectable\":[4],\"selection\":[16]}]]],[\"limel-dialog.cjs\",[[1,\"limel-dialog\",{\"heading\":[1],\"fullscreen\":[516],\"open\":[1540],\"closingActions\":[16]}]]],[\"limel-progress-flow.cjs\",[[1,\"limel-progress-flow\",{\"flowItems\":[16],\"disabled\":[4],\"readonly\":[4]}]]],[\"limel-shortcut.cjs\",[[1,\"limel-shortcut\",{\"icon\":[513],\"label\":[513],\"disabled\":[516],\"badge\":[520],\"link\":[16]}]]],[\"limel-banner.cjs\",[[1,\"limel-banner\",{\"message\":[513],\"icon\":[513],\"isOpen\":[32],\"open\":[64],\"close\":[64]}]]],[\"limel-callout.cjs\",[[1,\"limel-callout\",{\"heading\":[513],\"icon\":[513],\"type\":[513],\"language\":[1]}]]],[\"limel-slider.cjs\",[[1,\"limel-slider\",{\"disabled\":[516],\"readonly\":[516],\"factor\":[514],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"unit\":[513],\"value\":[514],\"valuemax\":[514],\"valuemin\":[514],\"step\":[514],\"percentageClass\":[32]}]]],[\"limel-switch.cjs\",[[1,\"limel-switch\",{\"label\":[513],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"value\":[516],\"helperText\":[513,\"helper-text\"],\"fieldId\":[32]}]]],[\"limel-code-editor.cjs\",[[1,\"limel-code-editor\",{\"value\":[1],\"language\":[1],\"readonly\":[4],\"lineNumbers\":[4,\"line-numbers\"],\"fold\":[4],\"lint\":[4],\"colorScheme\":[1,\"color-scheme\"],\"random\":[32]}]]],[\"limel-config.cjs\",[[1,\"limel-config\",{\"config\":[16]}]]],[\"limel-flex-container.cjs\",[[1,\"limel-flex-container\",{\"direction\":[513],\"justify\":[513],\"align\":[513],\"reverse\":[516]}]]],[\"limel-form.cjs\",[[1,\"limel-form\",{\"schema\":[16],\"value\":[16],\"disabled\":[4],\"propsFactory\":[16],\"transformErrors\":[16],\"errors\":[16]}]]],[\"limel-grid.cjs\",[[1,\"limel-grid\"]]],[\"limel-dock-button.cjs\",[[0,\"limel-dock-button\",{\"item\":[16],\"expanded\":[516],\"useMobileLayout\":[516,\"use-mobile-layout\"],\"isOpen\":[32]}]]],[\"limel-color-picker-palette.cjs\",[[1,\"limel-color-picker-palette\",{\"value\":[513],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"required\":[516]}]]],[\"limel-tab-bar.cjs\",[[1,\"limel-tab-bar\",{\"tabs\":[1040],\"canScrollLeft\":[32],\"canScrollRight\":[32]},[[9,\"resize\",\"handleWindowResize\"]]]]],[\"limel-checkbox.cjs\",[[1,\"limel-checkbox\",{\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"checked\":[516],\"indeterminate\":[516],\"required\":[516],\"modified\":[32]}]]],[\"limel-header.cjs\",[[1,\"limel-header\",{\"icon\":[1],\"heading\":[1],\"subheading\":[1],\"supportingText\":[1,\"supporting-text\"],\"subheadingDivider\":[1,\"subheading-divider\"]}]]],[\"limel-help-content.cjs\",[[1,\"limel-help-content\",{\"value\":[1],\"readMoreLink\":[16]}]]],[\"limel-icon.cjs\",[[1,\"limel-icon\",{\"size\":[513],\"name\":[513],\"badge\":[516]}]]],[\"limel-progress-flow-item.cjs\",[[0,\"limel-progress-flow-item\",{\"item\":[16],\"disabled\":[4],\"readonly\":[4],\"currentStep\":[4,\"current-step\"]}]]],[\"limel-flatpickr-adapter.cjs\",[[1,\"limel-flatpickr-adapter\",{\"value\":[16],\"type\":[1],\"format\":[1],\"isOpen\":[4,\"is-open\"],\"inputElement\":[16],\"language\":[1],\"formatter\":[16]}]]],[\"limel-helper-line.cjs\",[[1,\"limel-helper-line\",{\"helperText\":[513,\"helper-text\"],\"length\":[514],\"maxLength\":[514,\"max-length\"],\"invalid\":[516],\"helperTextId\":[513,\"helper-text-id\"]}]]],[\"limel-action-bar-item_2.cjs\",[[0,\"limel-action-bar-overflow-menu\",{\"items\":[16],\"openDirection\":[513,\"open-direction\"]}],[0,\"limel-action-bar-item\",{\"item\":[16],\"isVisible\":[516,\"is-visible\"]}]]],[\"limel-button.cjs\",[[1,\"limel-button\",{\"label\":[513],\"primary\":[516],\"outlined\":[516],\"icon\":[513],\"disabled\":[516],\"loading\":[516],\"loadingFailed\":[516,\"loading-failed\"],\"justLoaded\":[32]}]]],[\"limel-circular-progress_2.cjs\",[[1,\"limel-circular-progress\",{\"value\":[2],\"maxValue\":[2,\"max-value\"],\"prefix\":[513],\"suffix\":[1],\"displayPercentageColors\":[4,\"display-percentage-colors\"],\"size\":[513]}],[1,\"limel-linear-progress\",{\"value\":[514],\"indeterminate\":[516]}]]],[\"limel-markdown.cjs\",[[1,\"limel-markdown\",{\"value\":[1]}]]],[\"limel-icon-button.cjs\",[[1,\"limel-icon-button\",{\"icon\":[513],\"elevated\":[516],\"label\":[513],\"disabled\":[516]}]]],[\"limel-badge.cjs\",[[1,\"limel-badge\",{\"label\":[520]}]]],[\"limel-chip_2.cjs\",[[1,\"limel-chip-set\",{\"value\":[16],\"type\":[513],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"inputType\":[513,\"input-type\"],\"maxItems\":[514,\"max-items\"],\"required\":[516],\"searchLabel\":[513,\"search-label\"],\"emptyInputOnBlur\":[516,\"empty-input-on-blur\"],\"clearAllButton\":[4,\"clear-all-button\"],\"leadingIcon\":[513,\"leading-icon\"],\"delimiter\":[513],\"language\":[1],\"editMode\":[32],\"textValue\":[32],\"blurred\":[32],\"inputChipIndexSelected\":[32],\"selectedChipIds\":[32],\"getEditMode\":[64],\"setFocus\":[64],\"emptyInput\":[64]}],[1,\"limel-chip\",{\"language\":[513],\"text\":[513],\"icon\":[1],\"link\":[16],\"badge\":[520],\"disabled\":[516],\"readonly\":[516],\"selected\":[516],\"removable\":[516],\"type\":[513],\"identifier\":[520]}]]],[\"limel-popover_2.cjs\",[[1,\"limel-popover\",{\"open\":[4],\"openDirection\":[513,\"open-direction\"]}],[1,\"limel-popover-surface\",{\"contentCollection\":[16]}]]],[\"limel-spinner.cjs\",[[1,\"limel-spinner\",{\"size\":[513],\"limeBranded\":[4,\"lime-branded\"]}]]],[\"limel-portal_3.cjs\",[[1,\"limel-tooltip\",{\"elementId\":[513,\"element-id\"],\"label\":[513],\"helperLabel\":[513,\"helper-label\"],\"maxlength\":[514],\"openDirection\":[513,\"open-direction\"],\"open\":[32]}],[1,\"limel-tooltip-content\",{\"label\":[513],\"helperLabel\":[513,\"helper-label\"],\"maxlength\":[514]}],[1,\"limel-portal\",{\"openDirection\":[513,\"open-direction\"],\"position\":[513],\"containerId\":[513,\"container-id\"],\"containerStyle\":[16],\"parent\":[16],\"inheritParentWidth\":[516,\"inherit-parent-width\"],\"visible\":[516],\"anchor\":[16]}]]],[\"limel-input-field_3.cjs\",[[1,\"limel-input-field\",{\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"label\":[513],\"placeholder\":[513],\"helperText\":[513,\"helper-text\"],\"prefix\":[513],\"suffix\":[513],\"required\":[516],\"value\":[513],\"trailingIcon\":[513,\"trailing-icon\"],\"leadingIcon\":[513,\"leading-icon\"],\"pattern\":[513],\"type\":[513],\"formatNumber\":[516,\"format-number\"],\"step\":[520],\"max\":[514],\"min\":[514],\"maxlength\":[514],\"minlength\":[514],\"completions\":[16],\"showLink\":[516,\"show-link\"],\"locale\":[513],\"isFocused\":[32],\"isModified\":[32],\"showCompletions\":[32]}],[1,\"limel-list\",{\"items\":[16],\"badgeIcons\":[4,\"badge-icons\"],\"iconSize\":[1,\"icon-size\"],\"type\":[1],\"maxLinesSecondaryText\":[2,\"max-lines-secondary-text\"]}],[1,\"limel-menu-surface\",{\"open\":[4],\"allowClicksElement\":[16]}]]],[\"limel-breadcrumbs_3.cjs\",[[1,\"limel-menu\",{\"items\":[16],\"disabled\":[516],\"openDirection\":[513,\"open-direction\"],\"surfaceWidth\":[513,\"surface-width\"],\"open\":[1540],\"badgeIcons\":[516,\"badge-icons\"],\"gridLayout\":[516,\"grid-layout\"],\"loading\":[516],\"currentSubMenu\":[1040],\"searcher\":[16],\"emptyResultMessage\":[1,\"empty-result-message\"],\"loadingSubItems\":[32],\"menuBreadCrumb\":[32],\"searchValue\":[32],\"searchResults\":[32]}],[1,\"limel-breadcrumbs\",{\"items\":[16],\"divider\":[1]}],[1,\"limel-menu-list\",{\"items\":[16],\"badgeIcons\":[4,\"badge-icons\"],\"iconSize\":[1,\"icon-size\"],\"type\":[1],\"maxLinesSecondaryText\":[2,\"max-lines-secondary-text\"]}]]]]"), options);
+  return index.bootstrapLazy(JSON.parse("[[\"limel-action-bar.cjs\",[[1,\"limel-action-bar\",{\"actions\":[16],\"accessibleLabel\":[513,\"accessible-label\"],\"layout\":[513],\"openDirection\":[513,\"open-direction\"],\"overflowCutoff\":[32]}]]],[\"limel-split-button.cjs\",[[1,\"limel-split-button\",{\"label\":[513],\"primary\":[516],\"icon\":[513],\"disabled\":[516],\"items\":[16]}]]],[\"limel-file-viewer.cjs\",[[1,\"limel-file-viewer\",{\"url\":[513],\"filename\":[513],\"alt\":[513],\"allowFullscreen\":[516,\"allow-fullscreen\"],\"allowOpenInNewTab\":[516,\"allow-open-in-new-tab\"],\"allowDownload\":[516,\"allow-download\"],\"language\":[1],\"officeViewer\":[513,\"office-viewer\"],\"actions\":[16],\"isFullscreen\":[32],\"fileType\":[32],\"loading\":[32],\"fileUrl\":[32]}]]],[\"limel-color-picker.cjs\",[[1,\"limel-color-picker\",{\"value\":[513],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"tooltipLabel\":[513,\"tooltip-label\"],\"required\":[516],\"readonly\":[516],\"isOpen\":[32]}]]],[\"limel-picker.cjs\",[[1,\"limel-picker\",{\"disabled\":[4],\"readonly\":[516],\"label\":[1],\"searchLabel\":[1,\"search-label\"],\"helperText\":[513,\"helper-text\"],\"leadingIcon\":[1,\"leading-icon\"],\"emptyResultMessage\":[1,\"empty-result-message\"],\"required\":[4],\"invalid\":[516],\"value\":[16],\"searcher\":[16],\"multiple\":[4],\"delimiter\":[513],\"actions\":[16],\"actionPosition\":[1,\"action-position\"],\"actionScrollBehavior\":[1,\"action-scroll-behavior\"],\"badgeIcons\":[516,\"badge-icons\"],\"items\":[32],\"textValue\":[32],\"loading\":[32],\"chips\":[32]}]]],[\"limel-dock.cjs\",[[1,\"limel-dock\",{\"dockItems\":[16],\"dockFooterItems\":[16],\"accessibleLabel\":[513,\"accessible-label\"],\"expanded\":[516],\"allowResize\":[516,\"allow-resize\"],\"mobileBreakPoint\":[514,\"mobile-break-point\"],\"useMobileLayout\":[32]}]]],[\"limel-date-picker.cjs\",[[1,\"limel-date-picker\",{\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"label\":[513],\"placeholder\":[513],\"helperText\":[513,\"helper-text\"],\"required\":[516],\"value\":[16],\"type\":[513],\"format\":[513],\"language\":[513],\"formatter\":[16],\"formattedValue\":[32],\"internalFormat\":[32],\"showPortal\":[32]}]]],[\"limel-snackbar.cjs\",[[1,\"limel-snackbar\",{\"message\":[1],\"timeout\":[2],\"actionText\":[1,\"action-text\"],\"dismissible\":[4],\"multiline\":[4],\"language\":[1],\"show\":[64]}]]],[\"limel-tab-panel.cjs\",[[1,\"limel-tab-panel\",{\"tabs\":[1040]}]]],[\"limel-file.cjs\",[[1,\"limel-file\",{\"value\":[16],\"label\":[513],\"required\":[516],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"accept\":[513],\"language\":[1],\"isDraggingOverDropZone\":[32]}]]],[\"limel-button-group.cjs\",[[1,\"limel-button-group\",{\"value\":[16],\"disabled\":[516],\"selectedButtonId\":[32]}]]],[\"limel-collapsible-section.cjs\",[[1,\"limel-collapsible-section\",{\"isOpen\":[1540,\"is-open\"],\"header\":[513],\"actions\":[16]}]]],[\"limel-help.cjs\",[[1,\"limel-help\",{\"value\":[1],\"trigger\":[1],\"readMoreLink\":[16],\"openDirection\":[513,\"open-direction\"],\"isOpen\":[32]}]]],[\"limel-select.cjs\",[[1,\"limel-select\",{\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"required\":[516],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"value\":[16],\"options\":[16],\"multiple\":[4],\"menuOpen\":[32]}]]],[\"limel-info-tile.cjs\",[[1,\"limel-info-tile\",{\"value\":[520],\"icon\":[1],\"label\":[513],\"prefix\":[513],\"suffix\":[513],\"disabled\":[516],\"badge\":[520],\"loading\":[516],\"link\":[16],\"progress\":[16]}]]],[\"limel-table.cjs\",[[1,\"limel-table\",{\"data\":[16],\"columns\":[16],\"mode\":[1],\"layout\":[1],\"pageSize\":[2,\"page-size\"],\"totalRows\":[2,\"total-rows\"],\"sorting\":[16],\"activeRow\":[1040],\"movableColumns\":[4,\"movable-columns\"],\"loading\":[4],\"page\":[2],\"emptyMessage\":[1,\"empty-message\"],\"aggregates\":[16],\"selectable\":[4],\"selection\":[16]}]]],[\"limel-dialog.cjs\",[[1,\"limel-dialog\",{\"heading\":[1],\"fullscreen\":[516],\"open\":[1540],\"closingActions\":[16]}]]],[\"limel-progress-flow.cjs\",[[1,\"limel-progress-flow\",{\"flowItems\":[16],\"disabled\":[4],\"readonly\":[4]}]]],[\"limel-shortcut.cjs\",[[1,\"limel-shortcut\",{\"icon\":[513],\"label\":[513],\"disabled\":[516],\"badge\":[520],\"link\":[16]}]]],[\"limel-banner.cjs\",[[1,\"limel-banner\",{\"message\":[513],\"icon\":[513],\"isOpen\":[32],\"open\":[64],\"close\":[64]}]]],[\"limel-callout.cjs\",[[1,\"limel-callout\",{\"heading\":[513],\"icon\":[513],\"type\":[513],\"language\":[1]}]]],[\"limel-slider.cjs\",[[1,\"limel-slider\",{\"disabled\":[516],\"readonly\":[516],\"factor\":[514],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"unit\":[513],\"value\":[514],\"valuemax\":[514],\"valuemin\":[514],\"step\":[514],\"percentageClass\":[32]}]]],[\"limel-switch.cjs\",[[1,\"limel-switch\",{\"label\":[513],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"value\":[516],\"helperText\":[513,\"helper-text\"],\"fieldId\":[32]}]]],[\"limel-code-editor.cjs\",[[1,\"limel-code-editor\",{\"value\":[1],\"language\":[1],\"readonly\":[4],\"lineNumbers\":[4,\"line-numbers\"],\"fold\":[4],\"lint\":[4],\"colorScheme\":[1,\"color-scheme\"],\"random\":[32]}]]],[\"limel-config.cjs\",[[1,\"limel-config\",{\"config\":[16]}]]],[\"limel-flex-container.cjs\",[[1,\"limel-flex-container\",{\"direction\":[513],\"justify\":[513],\"align\":[513],\"reverse\":[516]}]]],[\"limel-form.cjs\",[[1,\"limel-form\",{\"schema\":[16],\"value\":[16],\"disabled\":[4],\"propsFactory\":[16],\"transformErrors\":[16],\"errors\":[16]}]]],[\"limel-grid.cjs\",[[1,\"limel-grid\"]]],[\"limel-dock-button.cjs\",[[0,\"limel-dock-button\",{\"item\":[16],\"expanded\":[516],\"useMobileLayout\":[516,\"use-mobile-layout\"],\"isOpen\":[32]}]]],[\"limel-color-picker-palette.cjs\",[[1,\"limel-color-picker-palette\",{\"value\":[513],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"required\":[516]}]]],[\"limel-tab-bar.cjs\",[[1,\"limel-tab-bar\",{\"tabs\":[1040],\"canScrollLeft\":[32],\"canScrollRight\":[32]},[[9,\"resize\",\"handleWindowResize\"]]]]],[\"limel-helper-line.cjs\",[[1,\"limel-helper-line\",{\"helperText\":[513,\"helper-text\"],\"length\":[514],\"maxLength\":[514,\"max-length\"],\"invalid\":[516],\"helperTextId\":[513,\"helper-text-id\"]}]]],[\"limel-checkbox.cjs\",[[1,\"limel-checkbox\",{\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"checked\":[516],\"indeterminate\":[516],\"required\":[516],\"modified\":[32]}]]],[\"limel-header.cjs\",[[1,\"limel-header\",{\"icon\":[1],\"heading\":[1],\"subheading\":[1],\"supportingText\":[1,\"supporting-text\"],\"subheadingDivider\":[1,\"subheading-divider\"]}]]],[\"limel-help-content.cjs\",[[1,\"limel-help-content\",{\"value\":[1],\"readMoreLink\":[16]}]]],[\"limel-icon.cjs\",[[1,\"limel-icon\",{\"size\":[513],\"name\":[513],\"badge\":[516]}]]],[\"limel-progress-flow-item.cjs\",[[0,\"limel-progress-flow-item\",{\"item\":[16],\"disabled\":[4],\"readonly\":[4],\"currentStep\":[4,\"current-step\"]}]]],[\"limel-circular-progress.cjs\",[[1,\"limel-circular-progress\",{\"value\":[2],\"maxValue\":[2,\"max-value\"],\"prefix\":[513],\"suffix\":[1],\"displayPercentageColors\":[4,\"display-percentage-colors\"],\"size\":[513]}]]],[\"limel-flatpickr-adapter.cjs\",[[1,\"limel-flatpickr-adapter\",{\"value\":[16],\"type\":[1],\"format\":[1],\"isOpen\":[4,\"is-open\"],\"inputElement\":[16],\"language\":[1],\"formatter\":[16]}]]],[\"limel-breadcrumbs_3.cjs\",[[1,\"limel-menu\",{\"items\":[16],\"disabled\":[516],\"openDirection\":[513,\"open-direction\"],\"surfaceWidth\":[513,\"surface-width\"],\"open\":[1540],\"badgeIcons\":[516,\"badge-icons\"],\"gridLayout\":[516,\"grid-layout\"],\"loading\":[516],\"currentSubMenu\":[1040],\"searcher\":[16],\"emptyResultMessage\":[1,\"empty-result-message\"],\"loadingSubItems\":[32],\"menuBreadCrumb\":[32],\"searchValue\":[32],\"searchResults\":[32]}],[1,\"limel-breadcrumbs\",{\"items\":[16],\"divider\":[1]}],[1,\"limel-menu-list\",{\"items\":[16],\"badgeIcons\":[4,\"badge-icons\"],\"iconSize\":[1,\"icon-size\"],\"type\":[1],\"maxLinesSecondaryText\":[2,\"max-lines-secondary-text\"]}]]],[\"limel-action-bar-item_2.cjs\",[[0,\"limel-action-bar-overflow-menu\",{\"items\":[16],\"openDirection\":[513,\"open-direction\"]}],[0,\"limel-action-bar-item\",{\"item\":[16],\"isVisible\":[516,\"is-visible\"]}]]],[\"limel-button.cjs\",[[1,\"limel-button\",{\"label\":[513],\"primary\":[516],\"outlined\":[516],\"icon\":[513],\"disabled\":[516],\"loading\":[516],\"loadingFailed\":[516,\"loading-failed\"],\"justLoaded\":[32]}]]],[\"limel-markdown.cjs\",[[1,\"limel-markdown\",{\"value\":[1]}]]],[\"limel-icon-button.cjs\",[[1,\"limel-icon-button\",{\"icon\":[513],\"elevated\":[516],\"label\":[513],\"disabled\":[516]}]]],[\"limel-linear-progress.cjs\",[[1,\"limel-linear-progress\",{\"value\":[514],\"indeterminate\":[516]}]]],[\"limel-chip_2.cjs\",[[1,\"limel-chip-set\",{\"value\":[16],\"type\":[513],\"label\":[513],\"helperText\":[513,\"helper-text\"],\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"inputType\":[513,\"input-type\"],\"maxItems\":[514,\"max-items\"],\"required\":[516],\"searchLabel\":[513,\"search-label\"],\"emptyInputOnBlur\":[516,\"empty-input-on-blur\"],\"clearAllButton\":[4,\"clear-all-button\"],\"leadingIcon\":[513,\"leading-icon\"],\"delimiter\":[513],\"language\":[1],\"editMode\":[32],\"textValue\":[32],\"blurred\":[32],\"inputChipIndexSelected\":[32],\"selectedChipIds\":[32],\"getEditMode\":[64],\"setFocus\":[64],\"emptyInput\":[64]}],[1,\"limel-chip\",{\"language\":[513],\"text\":[513],\"icon\":[1],\"link\":[16],\"badge\":[520],\"disabled\":[516],\"readonly\":[516],\"selected\":[516],\"invalid\":[516],\"removable\":[516],\"type\":[513],\"loading\":[516],\"progress\":[514],\"identifier\":[520]}]]],[\"limel-popover_2.cjs\",[[1,\"limel-popover\",{\"open\":[4],\"openDirection\":[513,\"open-direction\"]}],[1,\"limel-popover-surface\",{\"contentCollection\":[16]}]]],[\"limel-spinner.cjs\",[[1,\"limel-spinner\",{\"size\":[513],\"limeBranded\":[4,\"lime-branded\"]}]]],[\"limel-badge.cjs\",[[1,\"limel-badge\",{\"label\":[520]}]]],[\"limel-portal_3.cjs\",[[1,\"limel-tooltip\",{\"elementId\":[513,\"element-id\"],\"label\":[513],\"helperLabel\":[513,\"helper-label\"],\"maxlength\":[514],\"openDirection\":[513,\"open-direction\"],\"open\":[32]}],[1,\"limel-tooltip-content\",{\"label\":[513],\"helperLabel\":[513,\"helper-label\"],\"maxlength\":[514]}],[1,\"limel-portal\",{\"openDirection\":[513,\"open-direction\"],\"position\":[513],\"containerId\":[513,\"container-id\"],\"containerStyle\":[16],\"parent\":[16],\"inheritParentWidth\":[516,\"inherit-parent-width\"],\"visible\":[516],\"anchor\":[16]}]]],[\"limel-input-field_3.cjs\",[[1,\"limel-input-field\",{\"disabled\":[516],\"readonly\":[516],\"invalid\":[516],\"label\":[513],\"placeholder\":[513],\"helperText\":[513,\"helper-text\"],\"prefix\":[513],\"suffix\":[513],\"required\":[516],\"value\":[513],\"trailingIcon\":[513,\"trailing-icon\"],\"leadingIcon\":[513,\"leading-icon\"],\"pattern\":[513],\"type\":[513],\"formatNumber\":[516,\"format-number\"],\"step\":[520],\"max\":[514],\"min\":[514],\"maxlength\":[514],\"minlength\":[514],\"completions\":[16],\"showLink\":[516,\"show-link\"],\"locale\":[513],\"isFocused\":[32],\"isModified\":[32],\"showCompletions\":[32]}],[1,\"limel-list\",{\"items\":[16],\"badgeIcons\":[4,\"badge-icons\"],\"iconSize\":[1,\"icon-size\"],\"type\":[1],\"maxLinesSecondaryText\":[2,\"max-lines-secondary-text\"]}],[1,\"limel-menu-surface\",{\"open\":[4],\"allowClicksElement\":[16]}]]]]"), options);
   });
 };
 

package/dist/collection/components/chip/chip.css

@@ -54,6 +54,7 @@
 */
 /**
 * @prop --chip-max-width: Maximum width of the chip. Defaults to `10rem`. Keep in mind that the chips should not appear too big.
+* @prop --chip-progress-color: Color of the progress bar. Defaults to `rgb(var(--contrast-700))`.
 */
 :host(limel-chip) {
   --limel-chip-height: 1.75rem;
@@ -171,6 +172,15 @@
   box-shadow: 0 0 0.375rem 0 rgb(var(--color-green-light)), 0 0 0 1px rgb(var(--color-white)) inset;
 }
 
+:host(limel-chip[invalid]) .chip {
+  background: url("data:image/svg+xml;charset=utf-8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8' style='fill-rule:evenodd;'><path fill='rgba(186,186,192,0.16)' d='M0 0h4v4H0zM4 4h4v4H4z'/></svg>");
+  background-size: 0.5rem;
+  background-color: rgb(var(--color-red-default));
+}
+:host(limel-chip[invalid]) .text {
+  color: rgb(var(--color-white));
+}
+
 limel-icon {
   flex-shrink: 0;
   width: calc(var(--limel-chip-height) - 0.25rem);
@@ -222,4 +232,83 @@ limel-badge {
 }
 .trailing-button:hover svg {
   transform: scale(0.8);
+}
+
+.text {
+  transition: padding-left 0.4s ease;
+}
+
+limel-linear-progress {
+  position: absolute;
+  z-index: 1;
+  margin: auto;
+  left: 0.25rem;
+  width: 1.25rem;
+  border-radius: 1rem;
+  overflow: hidden;
+}
+
+:host(limel-chip[loading]) .chip:before {
+  content: "";
+  position: absolute;
+  left: 0;
+  width: var(--limel-chip-height);
+  height: var(--limel-chip-height);
+  border-radius: 50%;
+  scale: 0.9;
+  background-color: rgba(var(--contrast-600), 0.8);
+}
+:host(limel-chip[loading]) .chip:not(:has(limel-icon)) .text {
+  padding-left: calc(var(--limel-chip-height) + 0.25rem);
+}
+
+div[role=progressbar] {
+  --limel-chip-progressbar-offset: 0.1875rem;
+  --limel-chip-progressbar-stripe-color: rgb(var(--contrast-100), 0.3);
+  --limel-chip-progressbar-stripe-size: 1.5rem;
+  pointer-events: none;
+  position: absolute;
+  display: flex;
+  align-items: center;
+  justify-content: end;
+  inset: var(--limel-chip-progressbar-offset);
+  max-width: calc(100% - var(--limel-chip-progressbar-offset) * 2);
+  border-radius: inherit;
+  background-color: var(--chip-progress-color, rgb(var(--contrast-700)));
+  width: var(--limel-chip-progress-percentage);
+  opacity: 0.8;
+  mix-blend-mode: var(--limel-chip-progress-mix-blend-mode);
+}
+div[role=progressbar] span {
+  padding: 0 0.125rem;
+  border-radius: inherit;
+  height: 100%;
+  font-size: 0.625rem;
+  text-align: center;
+  transform: translateY(calc(-50% - 0.125rem));
+}
+div[role=progressbar]:after {
+  content: "";
+  transform: translate3d(0, 0, 0);
+  position: absolute;
+  inset: 1px;
+  background-image: linear-gradient(-45deg, var(--limel-chip-progressbar-stripe-color) 25%, transparent 25%, transparent 50%, var(--limel-chip-progressbar-stripe-color) 50%, var(--limel-chip-progressbar-stripe-color) 75%, transparent 75%, transparent);
+  z-index: 1;
+  background-size: var(--limel-chip-progressbar-stripe-size) var(--limel-chip-progressbar-stripe-size);
+  animation: move 2.5s linear infinite;
+  border-radius: inherit;
+}
+@media (prefers-reduced-motion) {
+  div[role=progressbar]:after {
+    animation: none;
+  }
+}
+
+@keyframes move {
+  0% {
+    background-position: 0 0;
+  }
+  100% {
+    background-position: calc(var(--limel-chip-progressbar-stripe-size) * -1) calc(var(--limel-chip-progressbar-stripe-size) * -1);
+  }
 }

package/dist/collection/components/chip/chip.js

@@ -42,19 +42,21 @@ import { BACKSPACE, BACKSPACE_KEY_CODE, DELETE, DELETE_KEY_CODE, } from '../../u
  * @exampleComponent limel-example-chip-badge
  * @exampleComponent limel-example-chip-filter
  * @exampleComponent limel-example-chip-removable
+ * @exampleComponent limel-example-chip-loading
+ * @exampleComponent limel-example-chip-progress
  * @exampleComponent limel-example-chip-aria-role
  */
 export class Chip {
   constructor() {
     this.renderAsButton = () => {
       return [
-        h("button", { id: 'chip-' + this.identifier, class: "chip", role: "button", disabled: this.disabled || this.readonly, onKeyDown: this.handleDeleteKeyDown }, this.renderIcon(), this.renderLabel(), this.renderBadge()),
+        h("button", { id: 'chip-' + this.identifier, class: "chip", role: "button", disabled: this.disabled || this.readonly, onKeyDown: this.handleDeleteKeyDown }, this.renderSpinner(), this.renderIcon(), this.renderLabel(), this.renderBadge(), this.renderProgressBar()),
         this.renderRemoveButton(),
       ];
     };
     this.renderAsLink = () => {
       return [
-        h("a", { id: 'chip-' + this.identifier, class: "chip", href: this.link.href, title: this.link.title, target: this.link.target, "aria-disabled": this.disabled || this.readonly, tabindex: this.disabled || this.readonly ? -1 : 0, onKeyDown: this.handleDeleteKeyDown }, this.renderIcon(), this.renderLabel(), this.renderBadge()),
+        h("a", { id: 'chip-' + this.identifier, class: "chip", href: this.link.href, title: this.link.title, target: this.link.target, "aria-disabled": this.disabled || this.readonly, tabindex: this.disabled || this.readonly ? -1 : 0, onKeyDown: this.handleDeleteKeyDown }, this.renderSpinner(), this.renderIcon(), this.renderLabel(), this.renderBadge(), this.renderProgressBar()),
         this.renderRemoveButton(),
       ];
     };
@@ -91,8 +93,11 @@ export class Chip {
     this.disabled = false;
     this.readonly = false;
     this.selected = false;
+    this.invalid = false;
     this.removable = false;
     this.type = 'default';
+    this.loading = false;
+    this.progress = undefined;
     this.identifier = crypto.randomUUID();
   }
   componentWillLoad() {
@@ -128,6 +133,22 @@ export class Chip {
     const svgData = '<svg viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg"><path fill="none" stroke="currentColor" stroke-width="2" d="m8 8 16 16M24 8 8 24"/></svg>';
     return (h("button", { class: "trailing-button remove-button", tabIndex: -1, "aria-label": this.removeChipLabel, "aria-controls": 'chip-' + this.identifier, innerHTML: svgData, onClick: this.handleRemoveClick }));
   }
+  renderSpinner() {
+    if (!this.loading) {
+      return;
+    }
+    return h("limel-linear-progress", { indeterminate: true });
+  }
+  renderProgressBar() {
+    if (!this.progress) {
+      return;
+    }
+    const currentPercentage = this.progress + '%';
+    const progress = Math.round(this.progress);
+    return (h("div", { role: "progressbar", "aria-label": "%", "aria-valuemin": "0", "aria-valuemax": "100", "aria-valuenow": this.progress, style: {
+        '--limel-chip-progress-percentage': currentPercentage,
+      } }, h("span", null, progress, "%")));
+  }
   static get is() { return "limel-chip"; }
   static get encapsulation() { return "shadow"; }
   static get originalStyleUrls() {
@@ -298,6 +319,24 @@ export class Chip {
         "reflect": true,
         "defaultValue": "false"
       },
+      "invalid": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Set to `true` to visualize the chip in an \"invalid\" or \"error\" state."
+        },
+        "attribute": "invalid",
+        "reflect": true,
+        "defaultValue": "false"
+      },
       "removable": {
         "type": "boolean",
         "mutable": false,
@@ -342,6 +381,41 @@ export class Chip {
         "reflect": true,
         "defaultValue": "'default'"
       },
+      "loading": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Set to `true` to put the component in the `loading` state,\nand render an indeterminate progress indicator inside the chip.\nThis does _not_ disable the interactivity of the chip!"
+        },
+        "attribute": "loading",
+        "reflect": true,
+        "defaultValue": "false"
+      },
+      "progress": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Reflects the current value of a progress bar on the chip,\nvisualizing the percentage of an ongoing process.\nMust be a number between `0` and `100`."
+        },
+        "attribute": "progress",
+        "reflect": true
+      },
       "identifier": {
         "type": "any",
         "mutable": false,

package/dist/collection/components/chip/chip.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip.js","sourceRoot":"","sources":["../../../src/components/chip/chip.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Prop,\n} from '@stencil/core';\nimport { Icon, Languages, Link } from '../../interface';\nimport { getIconName } from '../icon/get-icon-props';\nimport {\n    makeEnterClickable,\n    removeEnterClickable,\n} from '../../util/make-enter-clickable';\nimport translate from '../../global/translations';\nimport {\n    BACKSPACE,\n    BACKSPACE_KEY_CODE,\n    DELETE,\n    DELETE_KEY_CODE,\n} from '../../util/keycodes';\nimport { ChipType, Chip as OldChipInterface } from '../chip-set/chip.types';\n\ninterface ChipInterface extends Omit<OldChipInterface, 'id' | 'badge'> {\n    /**\n     * Identifier for the chip. Must be unique.\n     */\n    identifier?: number | string;\n\n    /**\n     * The value of the badge.\n     */\n    badge?: string | number;\n}\n\n/**\n * Chips and buttons are both interactive elements in UI design,\n * but they serve different purposes and are used in different contexts.\n *\n * :::warning\n * Do not use the chip component carelessly, as an alternative for\n * [`limel-button`](#/component/limel-button/) in the UI design!\n *\n * **Buttons:**\n * Buttons are used to trigger actions. They are typically used to\n * submit forms, open dialogs, initiate a process, or perform any action\n * that changes the state of the application.\n * Buttons' labels usually contain action words, in other words, the labels is\n * a _verb in imperative mood_ such as \"Submit\" or \"Delete\".\n * Buttons are placed in areas where it's clear they will initiate\n * an action when clicked.\n *\n * **Chips:**\n * Chips however are elements which may look like buttons, but they are\n * representing choices, filters, or tags, in a small block\n * or clearly bundled into a group. Chips are rarely used alone in the\n * user interface.\n * They are often used in a so called \"chip-set\", or placed together in\n * a section of the UI, where the user can expect more than one chip to be present.\n *\n * For example, a chip may represent a filter in a filter bar, or a tag in a tag list,\n * or an item in a shopping list.\n * Clicking a chip can also trigger an action, for example toggling a filter ON or OFF,\n * or opening a page with all posts tagged with the tag represented by the chip,\n * or navigating to a page with more information about the item in the shopping list.\n * :::\n *\n * @private\n * @exampleComponent limel-example-chip-button\n * @exampleComponent limel-example-chip-link\n * @exampleComponent limel-example-chip-icon-colors\n * @exampleComponent limel-example-chip-badge\n * @exampleComponent limel-example-chip-filter\n * @exampleComponent limel-example-chip-removable\n * @exampleComponent limel-example-chip-aria-role\n */\n@Component({\n    tag: 'limel-chip',\n    shadow: true,\n    styleUrl: 'chip.scss',\n})\nexport class Chip implements ChipInterface {\n    /**\n     * Defines the language for translations.\n     * Will translate the translatable strings on the components.\n     */\n    @Prop({ reflect: true })\n    public language: Languages = 'en';\n\n    /**\n     * Label displayed on the chip\n     */\n    @Prop({ reflect: true })\n    public text: string;\n\n    /**\n     * Icon of the chip.\n     */\n    @Prop()\n    public icon?: string | Icon;\n\n    /**\n     * If supplied, the chip will become a clickable link.\n     */\n    @Prop()\n    public link?: Omit<Link, 'text'>;\n\n    /**\n     * The value of the badge, displayed on the chip.\n     */\n    @Prop({ reflect: true })\n    public badge?: string | number;\n\n    /**\n     * Set to `true` to disable the chip.\n     */\n    @Prop({ reflect: true })\n    public disabled = false;\n\n    /**\n     * Set to `true` to render the chip as a static UI element.\n     * Useful when the parent component has a `readonly` state.\n     */\n    @Prop({ reflect: true })\n    public readonly = false;\n\n    /**\n     * Set to `true` to visualize the chip in a \"selected\" state.\n     * This is typically used when the chip is used in a chip-set\n     * along with other chips.\n     */\n    @Prop({ reflect: true })\n    public selected = false;\n\n    /**\n     * Set to `true` to render a remove button on the chip.\n     */\n    @Prop({ reflect: true })\n    public removable = false;\n\n    /**\n     * Set to `filter` to render the chip with a distinct style\n     * suitable for visualizing filters.\n     *\n     * @beta\n     */\n    @Prop({ reflect: true })\n    public type?: ChipType = 'default';\n\n    /**\n     * Identifier for the chip. Must be unique.\n     */\n    @Prop({ reflect: true })\n    public identifier?: number | string = crypto.randomUUID();\n\n    /**\n     * Fired when clicking on the remove button of a `removable` chip.\n     * The value of `identifier` is emitted as the event detail.\n     */\n    @Event()\n    public remove: EventEmitter<number | string>;\n\n    @Element()\n    private host: HTMLLimelChipElement;\n\n    public componentWillLoad() {\n        makeEnterClickable(this.host);\n    }\n\n    public disconnectedCallback() {\n        removeEnterClickable(this.host);\n    }\n\n    public render() {\n        return (\n            <Host onClick={this.filterClickWhenDisabled}>\n                {this.link ? this.renderAsLink() : this.renderAsButton()}\n            </Host>\n        );\n    }\n\n    private renderAsButton = () => {\n        return [\n            <button\n                id={'chip-' + this.identifier}\n                class=\"chip\"\n                role=\"button\"\n                disabled={this.disabled || this.readonly}\n                onKeyDown={this.handleDeleteKeyDown}\n            >\n                {this.renderIcon()}\n                {this.renderLabel()}\n                {this.renderBadge()}\n            </button>,\n            this.renderRemoveButton(),\n        ];\n    };\n\n    private renderAsLink = () => {\n        return [\n            <a\n                id={'chip-' + this.identifier}\n                class=\"chip\"\n                href={this.link.href}\n                title={this.link.title}\n                target={this.link.target}\n                aria-disabled={this.disabled || this.readonly}\n                tabindex={this.disabled || this.readonly ? -1 : 0}\n                onKeyDown={this.handleDeleteKeyDown}\n            >\n                {this.renderIcon()}\n                {this.renderLabel()}\n                {this.renderBadge()}\n            </a>,\n            this.renderRemoveButton(),\n        ];\n    };\n\n    private renderLabel = () => {\n        return <span class=\"text\">{this.text}</span>;\n    };\n\n    private renderIcon() {\n        const icon = getIconName(this.icon);\n\n        if (!icon) {\n            return;\n        }\n\n        return (\n            <limel-icon\n                badge={true}\n                name={icon}\n                style={{\n                    color: `${(this.icon as Icon)?.color}`,\n                    'background-color': `${\n                        (this.icon as Icon)?.backgroundColor\n                    }`,\n                }}\n            />\n        );\n    }\n\n    private renderBadge() {\n        if (!this.badge) {\n            return;\n        }\n\n        return <limel-badge label={this.badge} />;\n    }\n\n    private renderRemoveButton() {\n        if (!this.removable || this.readonly || this.disabled) {\n            return;\n        }\n\n        const svgData =\n            '<svg viewBox=\"0 0 32 32\" xmlns=\"http://www.w3.org/2000/svg\"><path fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" d=\"m8 8 16 16M24 8 8 24\"/></svg>';\n\n        return (\n            <button\n                class=\"trailing-button remove-button\"\n                tabIndex={-1}\n                aria-label={this.removeChipLabel}\n                aria-controls={'chip-' + this.identifier}\n                innerHTML={svgData}\n                onClick={this.handleRemoveClick}\n            />\n        );\n    }\n\n    private filterClickWhenDisabled = (e) => {\n        if (this.disabled || this.readonly) {\n            e.preventDefault();\n        }\n    };\n\n    private handleRemoveClick = (event: MouseEvent | KeyboardEvent) => {\n        event.stopPropagation();\n        this.remove.emit(this.identifier);\n    };\n\n    private handleDeleteKeyDown = (event: KeyboardEvent) => {\n        if (!this.removable) {\n            return;\n        }\n\n        const keys = [DELETE, BACKSPACE];\n        const keycodes = [DELETE_KEY_CODE, BACKSPACE_KEY_CODE];\n\n        if (keys.includes(event.key) || keycodes.includes(event.keyCode)) {\n            this.handleRemoveClick(event);\n        }\n    };\n\n    private removeChipLabel = (): string => {\n        return translate.get('chip-set.remove-chip', this.language);\n    };\n}\n"]}
+{"version":3,"file":"chip.js","sourceRoot":"","sources":["../../../src/components/chip/chip.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n    Component,\n    Element,\n    Event,\n    EventEmitter,\n    h,\n    Host,\n    Prop,\n} from '@stencil/core';\nimport { Icon, Languages, Link } from '../../interface';\nimport { getIconName } from '../icon/get-icon-props';\nimport {\n    makeEnterClickable,\n    removeEnterClickable,\n} from '../../util/make-enter-clickable';\nimport translate from '../../global/translations';\nimport {\n    BACKSPACE,\n    BACKSPACE_KEY_CODE,\n    DELETE,\n    DELETE_KEY_CODE,\n} from '../../util/keycodes';\nimport { ChipType, Chip as OldChipInterface } from '../chip-set/chip.types';\n\ninterface ChipInterface extends Omit<OldChipInterface, 'id' | 'badge'> {\n    /**\n     * Identifier for the chip. Must be unique.\n     */\n    identifier?: number | string;\n\n    /**\n     * The value of the badge.\n     */\n    badge?: string | number;\n}\n\n/**\n * Chips and buttons are both interactive elements in UI design,\n * but they serve different purposes and are used in different contexts.\n *\n * :::warning\n * Do not use the chip component carelessly, as an alternative for\n * [`limel-button`](#/component/limel-button/) in the UI design!\n *\n * **Buttons:**\n * Buttons are used to trigger actions. They are typically used to\n * submit forms, open dialogs, initiate a process, or perform any action\n * that changes the state of the application.\n * Buttons' labels usually contain action words, in other words, the labels is\n * a _verb in imperative mood_ such as \"Submit\" or \"Delete\".\n * Buttons are placed in areas where it's clear they will initiate\n * an action when clicked.\n *\n * **Chips:**\n * Chips however are elements which may look like buttons, but they are\n * representing choices, filters, or tags, in a small block\n * or clearly bundled into a group. Chips are rarely used alone in the\n * user interface.\n * They are often used in a so called \"chip-set\", or placed together in\n * a section of the UI, where the user can expect more than one chip to be present.\n *\n * For example, a chip may represent a filter in a filter bar, or a tag in a tag list,\n * or an item in a shopping list.\n * Clicking a chip can also trigger an action, for example toggling a filter ON or OFF,\n * or opening a page with all posts tagged with the tag represented by the chip,\n * or navigating to a page with more information about the item in the shopping list.\n * :::\n *\n * @private\n * @exampleComponent limel-example-chip-button\n * @exampleComponent limel-example-chip-link\n * @exampleComponent limel-example-chip-icon-colors\n * @exampleComponent limel-example-chip-badge\n * @exampleComponent limel-example-chip-filter\n * @exampleComponent limel-example-chip-removable\n * @exampleComponent limel-example-chip-loading\n * @exampleComponent limel-example-chip-progress\n * @exampleComponent limel-example-chip-aria-role\n */\n@Component({\n    tag: 'limel-chip',\n    shadow: true,\n    styleUrl: 'chip.scss',\n})\nexport class Chip implements ChipInterface {\n    /**\n     * Defines the language for translations.\n     * Will translate the translatable strings on the components.\n     */\n    @Prop({ reflect: true })\n    public language: Languages = 'en';\n\n    /**\n     * Label displayed on the chip\n     */\n    @Prop({ reflect: true })\n    public text: string;\n\n    /**\n     * Icon of the chip.\n     */\n    @Prop()\n    public icon?: string | Icon;\n\n    /**\n     * If supplied, the chip will become a clickable link.\n     */\n    @Prop()\n    public link?: Omit<Link, 'text'>;\n\n    /**\n     * The value of the badge, displayed on the chip.\n     */\n    @Prop({ reflect: true })\n    public badge?: string | number;\n\n    /**\n     * Set to `true` to disable the chip.\n     */\n    @Prop({ reflect: true })\n    public disabled = false;\n\n    /**\n     * Set to `true` to render the chip as a static UI element.\n     * Useful when the parent component has a `readonly` state.\n     */\n    @Prop({ reflect: true })\n    public readonly = false;\n\n    /**\n     * Set to `true` to visualize the chip in a \"selected\" state.\n     * This is typically used when the chip is used in a chip-set\n     * along with other chips.\n     */\n    @Prop({ reflect: true })\n    public selected = false;\n\n    /**\n     * Set to `true` to visualize the chip in an \"invalid\" or \"error\" state.\n     */\n    @Prop({ reflect: true })\n    public invalid = false;\n\n    /**\n     * Set to `true` to render a remove button on the chip.\n     */\n    @Prop({ reflect: true })\n    public removable = false;\n\n    /**\n     * Set to `filter` to render the chip with a distinct style\n     * suitable for visualizing filters.\n     *\n     * @beta\n     */\n    @Prop({ reflect: true })\n    public type?: ChipType = 'default';\n\n    /**\n     * Set to `true` to put the component in the `loading` state,\n     * and render an indeterminate progress indicator inside the chip.\n     * This does _not_ disable the interactivity of the chip!\n     */\n    @Prop({ reflect: true })\n    public loading? = false;\n\n    /**\n     * Reflects the current value of a progress bar on the chip,\n     * visualizing the percentage of an ongoing process.\n     * Must be a number between `0` and `100`.\n     */\n    @Prop({ reflect: true })\n    public progress?: number;\n\n    /**\n     * Identifier for the chip. Must be unique.\n     */\n    @Prop({ reflect: true })\n    public identifier?: number | string = crypto.randomUUID();\n\n    /**\n     * Fired when clicking on the remove button of a `removable` chip.\n     * The value of `identifier` is emitted as the event detail.\n     */\n    @Event()\n    public remove: EventEmitter<number | string>;\n\n    @Element()\n    private host: HTMLLimelChipElement;\n\n    public componentWillLoad() {\n        makeEnterClickable(this.host);\n    }\n\n    public disconnectedCallback() {\n        removeEnterClickable(this.host);\n    }\n\n    public render() {\n        return (\n            <Host onClick={this.filterClickWhenDisabled}>\n                {this.link ? this.renderAsLink() : this.renderAsButton()}\n            </Host>\n        );\n    }\n\n    private renderAsButton = () => {\n        return [\n            <button\n                id={'chip-' + this.identifier}\n                class=\"chip\"\n                role=\"button\"\n                disabled={this.disabled || this.readonly}\n                onKeyDown={this.handleDeleteKeyDown}\n            >\n                {this.renderSpinner()}\n                {this.renderIcon()}\n                {this.renderLabel()}\n                {this.renderBadge()}\n                {this.renderProgressBar()}\n            </button>,\n            this.renderRemoveButton(),\n        ];\n    };\n\n    private renderAsLink = () => {\n        return [\n            <a\n                id={'chip-' + this.identifier}\n                class=\"chip\"\n                href={this.link.href}\n                title={this.link.title}\n                target={this.link.target}\n                aria-disabled={this.disabled || this.readonly}\n                tabindex={this.disabled || this.readonly ? -1 : 0}\n                onKeyDown={this.handleDeleteKeyDown}\n            >\n                {this.renderSpinner()}\n                {this.renderIcon()}\n                {this.renderLabel()}\n                {this.renderBadge()}\n                {this.renderProgressBar()}\n            </a>,\n            this.renderRemoveButton(),\n        ];\n    };\n\n    private renderLabel = () => {\n        return <span class=\"text\">{this.text}</span>;\n    };\n\n    private renderIcon() {\n        const icon = getIconName(this.icon);\n\n        if (!icon) {\n            return;\n        }\n\n        return (\n            <limel-icon\n                badge={true}\n                name={icon}\n                style={{\n                    color: `${(this.icon as Icon)?.color}`,\n                    'background-color': `${\n                        (this.icon as Icon)?.backgroundColor\n                    }`,\n                }}\n            />\n        );\n    }\n\n    private renderBadge() {\n        if (!this.badge) {\n            return;\n        }\n\n        return <limel-badge label={this.badge} />;\n    }\n\n    private renderRemoveButton() {\n        if (!this.removable || this.readonly || this.disabled) {\n            return;\n        }\n\n        const svgData =\n            '<svg viewBox=\"0 0 32 32\" xmlns=\"http://www.w3.org/2000/svg\"><path fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" d=\"m8 8 16 16M24 8 8 24\"/></svg>';\n\n        return (\n            <button\n                class=\"trailing-button remove-button\"\n                tabIndex={-1}\n                aria-label={this.removeChipLabel}\n                aria-controls={'chip-' + this.identifier}\n                innerHTML={svgData}\n                onClick={this.handleRemoveClick}\n            />\n        );\n    }\n\n    private filterClickWhenDisabled = (e) => {\n        if (this.disabled || this.readonly) {\n            e.preventDefault();\n        }\n    };\n\n    private handleRemoveClick = (event: MouseEvent | KeyboardEvent) => {\n        event.stopPropagation();\n        this.remove.emit(this.identifier);\n    };\n\n    private handleDeleteKeyDown = (event: KeyboardEvent) => {\n        if (!this.removable) {\n            return;\n        }\n\n        const keys = [DELETE, BACKSPACE];\n        const keycodes = [DELETE_KEY_CODE, BACKSPACE_KEY_CODE];\n\n        if (keys.includes(event.key) || keycodes.includes(event.keyCode)) {\n            this.handleRemoveClick(event);\n        }\n    };\n\n    private removeChipLabel = (): string => {\n        return translate.get('chip-set.remove-chip', this.language);\n    };\n\n    private renderSpinner() {\n        if (!this.loading) {\n            return;\n        }\n\n        return <limel-linear-progress indeterminate={true} />;\n    }\n\n    private renderProgressBar() {\n        if (!this.progress) {\n            return;\n        }\n\n        const currentPercentage = this.progress + '%';\n        const progress = Math.round(this.progress);\n\n        return (\n            <div\n                role=\"progressbar\"\n                aria-label=\"%\"\n                aria-valuemin=\"0\"\n                aria-valuemax=\"100\"\n                aria-valuenow={this.progress}\n                style={{\n                    '--limel-chip-progress-percentage': currentPercentage,\n                }}\n            >\n                <span>{progress}%</span>\n            </div>\n        );\n    }\n}\n"]}

package/dist/collection/style/color-palette-extended.css

@@ -7,6 +7,7 @@
  */
 
 :root {
+    --limel-chip-progress-mix-blend-mode: multiply;
     /* Lime Technologies Brand Colors (Do not have dark/light mode variants) */
     --lime-brand-color-deep-red: 240, 87, 80; /* #f05750 */
     --lime-brand-color-sellable-orange: 255, 112, 67; /* #ff7043 (FIXME: or 247-107-7; // #f76b07 ? --> can be replaced with orange-dark in light mode in this case) */
@@ -166,6 +167,8 @@
 }
 
 :root[data-theme="force-dark"] {
+    --limel-chip-progress-mix-blend-mode: screen;
+
     --contrast-100: 20, 20, 42; /* #14142a */
     --contrast-200: 25, 25, 44; /* #19192c */
     --contrast-300: 35, 35, 53; /* #232335 */
@@ -322,6 +325,8 @@
 
 @media (prefers-color-scheme: dark) {
     :root:not([data-theme="force-light"]) {
+        --limel-chip-progress-mix-blend-mode: screen;
+
         --contrast-100: 20, 20, 37; /* #141425 */
         --contrast-200: 25, 25, 44; /* #19192c */
         --contrast-300: 35, 35, 53; /* #232335 */