@roadtrip/components 2.43.0 → 2.44.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@roadtrip/components",
-  "version": "2.43.0",
+  "version": "2.44.0",
   "description": "Web Component library for Roadtrip Design System",
   "license": "Apache-2.0",
   "homepage": "https://gitlab.com/mobivia-design/roadtrip/components",
@@ -34,7 +34,7 @@
     "dev": "stencil build --dev",
     "serve": "stencil build --dev --watch --serve",
     "test": "stencil test --e2e --screenshot",
-    "test:e2e": "stencil test --e2e",
+    "test:e2e": "stencil test --e2e --watch",
     "test:watch": "stencil test --e2e --watchAll",
     "generate": "stencil generate",
     "icons": "npm run svgo && node ./scripts/sprite-svg.mjs && node ./scripts/icons.mjs",

package/dist/cjs/road-badge_11.cjs.entry.js

@@ -1,532 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-a2306350.js');
-require('./polyfill-c7a0fa22.js');
-const index$1 = require('./index-b51ea273.js');
-const utils = require('./utils-5c31da25.js');
-
-const badgeCss = ":host{-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:1rem;min-height:1rem;padding:0 0.3125rem;font-family:var(--road-font, sans-serif);font-size:0.625rem;font-weight:700;white-space:nowrap;border-radius:1rem}:host(.badge-bubble){min-width:0.25rem;min-height:0.25rem;padding:0}:host(.badge-primary){color:var(--road-primary-contrast);background-color:var(--road-primary-500)}:host(.badge-secondary){color:var(--road-primary-contrast);background-color:var(--road-primary-500)}:host(.badge-accent){color:var(--road-secondary-contrast);background-color:var(--road-secondary-500)}:host(.badge-info){color:var(--road-info-contrast);background-color:var(--road-info-default)}:host(.badge-success){color:var(--road-success-contrast);background-color:var(--road-success-default)}:host(.badge-warning){color:var(--road-warning-contrast);background-color:var(--road-warning-default)}:host(.badge-danger){color:var(--road-danger-contrast);background-color:var(--road-danger-default)}";
-
-const Badge = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    /**
-     * Color of the badge
-     */
-    this.color = 'secondary';
-    /**
-     * if `true` the badge will be displayed has a little bubble
-     */
-    this.bubble = false;
-  }
-  render() {
-    const colorClass = this.color !== undefined ? `badge-${this.color}` : '';
-    const bubbleClass = this.bubble ? 'badge-bubble' : '';
-    return (index.h(index.Host, { class: `${colorClass} ${bubbleClass}` }, index.h("slot", null)));
-  }
-};
-Badge.style = badgeCss;
-
-const buttonCss = ":host{--border-radius:0.25rem;--font-size:1rem;--margin-bottom:1rem;--padding-start:1.5rem;--padding-end:1.5rem;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;height:3rem;padding:0;margin-bottom:var(--margin-bottom);font-family:var(--road-font, sans-serif);font-size:var(--font-size);font-weight:700;line-height:1.375;color:var(--road-grey-900);text-decoration:none;white-space:nowrap;vertical-align:middle;background:transparent;border:1px solid transparent;border-radius:var(--border-radius);-webkit-transition:background 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;transition:background 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms}:host(:hover){text-decoration:none}:host(.focus-visible){outline:0}.button-native{position:relative;z-index:1;display:-ms-flexbox;display:flex;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;padding:0 var(--padding-end) 0 var(--padding-start);margin:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-align:inherit;text-decoration:none;text-indent:inherit;text-overflow:inherit;text-transform:inherit;letter-spacing:inherit;white-space:inherit;cursor:pointer;background:transparent;border:none;outline:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}:host(.btn-default:not([disabled]).focus-visible){background:var(--road-grey-200)}:host(.btn-primary){color:var(--road-primary-contrast);background:var(--road-primary-500)}:host(.btn-primary) ::slotted(road-icon){color:var(--road-primary-contrast)}:host(.btn-primary:not([disabled]):hover),:host(.btn-primary:not([disabled]).focus-visible){background:var(--road-primary-700)}:host(.btn-secondary){color:var(--road-primary-contrast);background:var(--road-primary-500)}:host(.btn-secondary) ::slotted(road-icon){color:var(--road-primary-contrast)}:host(.btn-secondary:not([disabled]):hover),:host(.btn-secondary:not([disabled]).focus-visible){background:var(--road-primary-700)}:host(.btn-link){font-weight:400;color:var(--road-primary-500);background:transparent}:host(.btn-link:not([disabled]):hover),:host(.btn-link:not([disabled]).focus-visible){color:var(--road-primary-700)}:host(.btn-outline-primary),:host(.btn-outline-secondary),:host(.btn-outline-default){background:transparent}:host(.btn-outline-default){color:var(--road-grey-600);background:var(--road-grey-000);border-color:var(--road-grey-600)}:host(.btn-outline-default) ::slotted(road-icon){color:var(--road-grey-600)}:host(.btn-outline-default:hover),:host(.btn-outline-default.focus-visible){background:var(--road-grey-200)}:host(.btn-outline-primary){color:var(--road-primary-500);border-color:var(--road-primary-500)}:host(.btn-outline-primary) ::slotted(road-icon){color:var(--road-primary-500)}:host(.btn-outline-primary:hover),:host(.btn-outline-primary.focus-visible){background:var(--road-primary-100)}:host(.btn-outline-secondary){color:var(--road-primary-500);border-color:var(--road-primary-500)}:host(.btn-outline-secondary) ::slotted(road-icon){color:var(--road-primary-500)}:host(.btn-outline-secondary:hover),:host(.btn-outline-secondary.focus-visible){background:var(--road-primary-100)}:host([aria-disabled]){pointer-events:none;opacity:0.16}.button-native:disabled{cursor:not-allowed}::slotted([slot=\"start\"]){margin-right:0.5rem}::slotted([slot=\"end\"]){margin-left:0.5rem}:host(.btn-xl){height:3.5rem}:host(.btn-xl) ::slotted(road-icon){width:2rem;height:2rem}:host(.btn-md){--font-size:0.875rem;height:2.5rem}:host(.btn-md) ::slotted(road-icon){width:1.5rem;height:1.5rem}:host(.btn-sm){--font-size:0.875rem;height:2rem}:host(.btn-sm) ::slotted(road-icon){width:1.25rem;height:1.25rem}:host(.btn-block){width:100%}::slotted(road-badge){position:absolute;top:4px;left:calc(50% + 0.375rem);z-index:1;-webkit-box-sizing:border-box;box-sizing:border-box;height:auto}";
-
-const Button = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.roadfocus = index.createEvent(this, "roadfocus", 7);
-    this.roadFocus = index.createEvent(this, "roadFocus", 7);
-    this.roadblur = index.createEvent(this, "roadblur", 7);
-    this.roadBlur = index.createEvent(this, "roadBlur", 7);
-    /**
-     * The color to use from your application's color palette.
-     */
-    this.color = 'default';
-    /**
-      * The button size.
-      */
-    this.size = 'lg';
-    /**
-     * The type of the button.
-     */
-    this.buttonType = 'button';
-    /**
-     * If `true`, the user cannot interact with the button.
-     */
-    this.disabled = false;
-    /**
-     * Set to `true` for a full-width button.
-     */
-    this.expand = false;
-    /**
-     * Set to `true` for a transparent button with a border
-     */
-    this.outline = false;
-    this.onClick = (ev) => {
-      if (this.el.shadowRoot && this.el.attachShadow) {
-        // this button wants to specifically submit a form
-        // climb up the dom to see if we're in a <form>
-        // and if so, then use JS to submit it
-        const form = this.el.closest('form');
-        if (form) {
-          ev.preventDefault();
-          const fakeButton = document.createElement('button');
-          fakeButton.type = this.buttonType;
-          fakeButton.style.display = 'none';
-          form.appendChild(fakeButton);
-          fakeButton.click();
-          fakeButton.remove();
-        }
-      }
-    };
-    this.onFocus = () => {
-      this.roadfocus.emit();
-      this.roadFocus.emit();
-    };
-    this.onBlur = () => {
-      this.roadblur.emit();
-      this.roadBlur.emit();
-    };
-  }
-  render() {
-    const { buttonType, disabled, href, rel, target, color } = this;
-    const TagType = this.href === undefined ? 'button' : 'a';
-    const attrs = (TagType === 'button')
-      ? { type: buttonType }
-      : {
-        download: this.download,
-        href,
-        rel,
-        target,
-      };
-    const colorClass = this.outline ? `btn-outline-${color}` : `btn-${color}`;
-    const sizeClass = this.size !== undefined ? `btn-${this.size}` : '';
-    const expandClass = this.expand ? 'btn-block' : '';
-    return (index.h(index.Host, { class: `${colorClass} ${sizeClass} ${expandClass}`, onClick: this.onClick, "aria-disabled": disabled ? 'true' : null }, index.h(TagType, Object.assign({}, attrs, { class: "button-native", part: "native", disabled: disabled, onFocus: this.onFocus, onBlur: this.onBlur }), index.h("slot", { name: "start" }), index.h("slot", null), index.h("slot", { name: "end" }))));
-  }
-  get el() { return index.getElement(this); }
-};
-Button.style = buttonCss;
-
-const colCss = ":host{position:relative;-ms-flex-preferred-size:0;flex-basis:0;-ms-flex-positive:1;flex-grow:1;width:100%;max-width:100%;min-height:1px;padding-right:8px;padding-left:8px}:host(.col-auto){-ms-flex:0 0 auto;flex:0 0 auto;width:auto;max-width:none}:host(.col-1){-ms-flex:0 0 8.3333%;flex:0 0 8.3333%;max-width:8.3333%}:host(.col-2){-ms-flex:0 0 16.6667%;flex:0 0 16.6667%;max-width:16.6667%}:host(.col-3){-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}:host(.col-4){-ms-flex:0 0 33.3333%;flex:0 0 33.3333%;max-width:33.3333%}:host(.col-5){-ms-flex:0 0 41.6667%;flex:0 0 41.6667%;max-width:41.6667%}:host(.col-6){-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}:host(.col-7){-ms-flex:0 0 58.3333%;flex:0 0 58.3333%;max-width:58.3333%}:host(.col-8){-ms-flex:0 0 66.6667%;flex:0 0 66.6667%;max-width:66.6667%}:host(.col-9){-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}:host(.col-10){-ms-flex:0 0 83.3333%;flex:0 0 83.3333%;max-width:83.3333%}:host(.col-11){-ms-flex:0 0 91.6667%;flex:0 0 91.6667%;max-width:91.6667%}:host(.col-12){-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}:host(.offset-1){margin-left:8.3333%}:host(.offset-2){margin-left:16.6667%}:host(.offset-3){margin-left:25%}:host(.offset-4){margin-left:33.3333%}:host(.offset-5){margin-left:41.6667%}:host(.offset-6){margin-left:50%}:host(.offset-7){margin-left:58.3333%}:host(.offset-8){margin-left:66.6667%}:host(.offset-9){margin-left:75%}:host(.offset-10){margin-left:83.3333%}:host(.offset-11){margin-left:91.6667%}@media (min-width: 576px){:host(.col-sm){-ms-flex-preferred-size:0;flex-basis:0;-ms-flex-positive:1;flex-grow:1;max-width:100%}:host(.col-sm-auto){-ms-flex:0 0 auto;flex:0 0 auto;width:auto;max-width:none}:host(.col-sm-1){-ms-flex:0 0 8.3333%;flex:0 0 8.3333%;max-width:8.3333%}:host(.col-sm-2){-ms-flex:0 0 16.6667%;flex:0 0 16.6667%;max-width:16.6667%}:host(.col-sm-3){-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}:host(.col-sm-4){-ms-flex:0 0 33.3333%;flex:0 0 33.3333%;max-width:33.3333%}:host(.col-sm-5){-ms-flex:0 0 41.6667%;flex:0 0 41.6667%;max-width:41.6667%}:host(.col-sm-6){-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}:host(.col-sm-7){-ms-flex:0 0 58.3333%;flex:0 0 58.3333%;max-width:58.3333%}:host(.col-sm-8){-ms-flex:0 0 66.6667%;flex:0 0 66.6667%;max-width:66.6667%}:host(.col-sm-9){-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}:host(.col-sm-10){-ms-flex:0 0 83.3333%;flex:0 0 83.3333%;max-width:83.3333%}:host(.col-sm-11){-ms-flex:0 0 91.6667%;flex:0 0 91.6667%;max-width:91.6667%}:host(.col-sm-12){-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}:host(.offset-sm-0){margin-left:0}:host(.offset-sm-1){margin-left:8.3333%}:host(.offset-sm-2){margin-left:16.6667%}:host(.offset-sm-3){margin-left:25%}:host(.offset-sm-4){margin-left:33.3333%}:host(.offset-sm-5){margin-left:41.6667%}:host(.offset-sm-6){margin-left:50%}:host(.offset-sm-7){margin-left:58.3333%}:host(.offset-sm-8){margin-left:66.6667%}:host(.offset-sm-9){margin-left:75%}:host(.offset-sm-10){margin-left:83.3333%}:host(.offset-sm-11){margin-left:91.6667%}}@media (min-width: 768px){:host(.col-md){-ms-flex-preferred-size:0;flex-basis:0;-ms-flex-positive:1;flex-grow:1;max-width:100%}:host(.col-md-auto){-ms-flex:0 0 auto;flex:0 0 auto;width:auto;max-width:none}:host(.col-md-1){-ms-flex:0 0 8.3333%;flex:0 0 8.3333%;max-width:8.3333%}:host(.col-md-2){-ms-flex:0 0 16.6667%;flex:0 0 16.6667%;max-width:16.6667%}:host(.col-md-3){-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}:host(.col-md-4){-ms-flex:0 0 33.3333%;flex:0 0 33.3333%;max-width:33.3333%}:host(.col-md-5){-ms-flex:0 0 41.6667%;flex:0 0 41.6667%;max-width:41.6667%}:host(.col-md-6){-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}:host(.col-md-7){-ms-flex:0 0 58.3333%;flex:0 0 58.3333%;max-width:58.3333%}:host(.col-md-8){-ms-flex:0 0 66.6667%;flex:0 0 66.6667%;max-width:66.6667%}:host(.col-md-9){-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}:host(.col-md-10){-ms-flex:0 0 83.3333%;flex:0 0 83.3333%;max-width:83.3333%}:host(.col-md-11){-ms-flex:0 0 91.6667%;flex:0 0 91.6667%;max-width:91.6667%}:host(.col-md-12){-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}:host(.offset-md-0){margin-left:0}:host(.offset-md-1){margin-left:8.3333%}:host(.offset-md-2){margin-left:16.6667%}:host(.offset-md-3){margin-left:25%}:host(.offset-md-4){margin-left:33.3333%}:host(.offset-md-5){margin-left:41.6667%}:host(.offset-md-6){margin-left:50%}:host(.offset-md-7){margin-left:58.3333%}:host(.offset-md-8){margin-left:66.6667%}:host(.offset-md-9){margin-left:75%}:host(.offset-md-10){margin-left:83.3333%}:host(.offset-md-11){margin-left:91.6667%}}@media (min-width: 992px){:host(.col-lg){-ms-flex-preferred-size:0;flex-basis:0;-ms-flex-positive:1;flex-grow:1;max-width:100%}:host(.col-lg-auto){-ms-flex:0 0 auto;flex:0 0 auto;width:auto;max-width:none}:host(.col-lg-1){-ms-flex:0 0 8.3333%;flex:0 0 8.3333%;max-width:8.3333%}:host(.col-lg-2){-ms-flex:0 0 16.6667%;flex:0 0 16.6667%;max-width:16.6667%}:host(.col-lg-3){-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}:host(.col-lg-4){-ms-flex:0 0 33.3333%;flex:0 0 33.3333%;max-width:33.3333%}:host(.col-lg-5){-ms-flex:0 0 41.6667%;flex:0 0 41.6667%;max-width:41.6667%}:host(.col-lg-6){-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}:host(.col-lg-7){-ms-flex:0 0 58.3333%;flex:0 0 58.3333%;max-width:58.3333%}:host(.col-lg-8){-ms-flex:0 0 66.6667%;flex:0 0 66.6667%;max-width:66.6667%}:host(.col-lg-9){-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}:host(.col-lg-10){-ms-flex:0 0 83.3333%;flex:0 0 83.3333%;max-width:83.3333%}:host(.col-lg-11){-ms-flex:0 0 91.6667%;flex:0 0 91.6667%;max-width:91.6667%}:host(.col-lg-12){-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}:host(.offset-lg-0){margin-left:0}:host(.offset-lg-1){margin-left:8.3333%}:host(.offset-lg-2){margin-left:16.6667%}:host(.offset-lg-3){margin-left:25%}:host(.offset-lg-4){margin-left:33.3333%}:host(.offset-lg-5){margin-left:41.6667%}:host(.offset-lg-6){margin-left:50%}:host(.offset-lg-7){margin-left:58.3333%}:host(.offset-lg-8){margin-left:66.6667%}:host(.offset-lg-9){margin-left:75%}:host(.offset-lg-10){margin-left:83.3333%}:host(.offset-lg-11){margin-left:91.6667%}}@media (min-width: 1200px){:host(.col-xl){-ms-flex-preferred-size:0;flex-basis:0;-ms-flex-positive:1;flex-grow:1;max-width:100%}:host(.col-xl-auto){-ms-flex:0 0 auto;flex:0 0 auto;width:auto;max-width:none}:host(.col-xl-1){-ms-flex:0 0 8.3333%;flex:0 0 8.3333%;max-width:8.3333%}:host(.col-xl-2){-ms-flex:0 0 16.6667%;flex:0 0 16.6667%;max-width:16.6667%}:host(.col-xl-3){-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}:host(.col-xl-4){-ms-flex:0 0 33.3333%;flex:0 0 33.3333%;max-width:33.3333%}:host(.col-xl-5){-ms-flex:0 0 41.6667%;flex:0 0 41.6667%;max-width:41.6667%}:host(.col-xl-6){-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}:host(.col-xl-7){-ms-flex:0 0 58.3333%;flex:0 0 58.3333%;max-width:58.3333%}:host(.col-xl-8){-ms-flex:0 0 66.6667%;flex:0 0 66.6667%;max-width:66.6667%}:host(.col-xl-9){-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}:host(.col-xl-10){-ms-flex:0 0 83.3333%;flex:0 0 83.3333%;max-width:83.3333%}:host(.col-xl-11){-ms-flex:0 0 91.6667%;flex:0 0 91.6667%;max-width:91.6667%}:host(.col-xl-12){-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}:host(.offset-xl-0){margin-left:0}:host(.offset-xl-1){margin-left:8.3333%}:host(.offset-xl-2){margin-left:16.6667%}:host(.offset-xl-3){margin-left:25%}:host(.offset-xl-4){margin-left:33.3333%}:host(.offset-xl-5){margin-left:41.6667%}:host(.offset-xl-6){margin-left:50%}:host(.offset-xl-7){margin-left:58.3333%}:host(.offset-xl-8){margin-left:66.6667%}:host(.offset-xl-9){margin-left:75%}:host(.offset-xl-10){margin-left:83.3333%}:host(.offset-xl-11){margin-left:91.6667%}}";
-
-const Col = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-  }
-  render() {
-    return (index.h("slot", null));
-  }
-};
-Col.style = colCss;
-
-const drawerDarkCss = ":host{--background:var(--road-grey-000);--color:var(--road-grey-900);--header-icon:var(--road-grey-900);--header-color:var(--road-grey-900);--header-background:var(--road-grey-000);--header-delimiter:0;--back-chevron-color:var(--road-grey-900);--max-height:auto;--z-index:10;position:fixed;top:0;left:0;z-index:var(--z-index);display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start;width:100%;height:100%;overflow:hidden;font-family:var(--road-font, sans-serif);line-height:1.5;color:var(--color);visibility:hidden !important;opacity:0;-webkit-transition:opacity 0.15s linear, visibility 0.15s;transition:opacity 0.15s linear, visibility 0.15s}.drawer-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:block;-ms-touch-action:none;touch-action:none;cursor:pointer;background:var(--road-overlay)}.drawer-dialog{position:relative;width:100%;pointer-events:none;-webkit-transition:-webkit-transform 0.3s ease-out;transition:-webkit-transform 0.3s ease-out;transition:transform 0.3s ease-out;transition:transform 0.3s ease-out, -webkit-transform 0.3s ease-out;-webkit-transform:translateX(-100%);transform:translateX(-100%)}:host(.drawer-right){-ms-flex-pack:end;justify-content:flex-end}:host(.drawer-right) .drawer-dialog{-webkit-transform:translateX(100%);transform:translateX(100%)}:host(.drawer-bottom){-ms-flex-align:end;align-items:flex-end}:host(.drawer-bottom) .drawer-dialog{width:100%;max-height:var(--max-height);-webkit-transform:translateY(100%);transform:translateY(100%)}:host(.drawer-bottom) .drawer-content{height:auto}.drawer-content{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:100%;height:100vh;pointer-events:auto;background-color:var(--background);background-clip:padding-box;-webkit-box-shadow:0 0.1875rem 0.375rem rgba(0, 0, 0, 0.16);box-shadow:0 0.1875rem 0.375rem rgba(0, 0, 0, 0.16)}.drawer-header{display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end;height:3.5rem;color:var(--header-color);background:var(--header-background);border-color:var(--road-grey-300);border-style:solid;border-width:var(--header-delimiter)}.drawer-header road-icon{-ms-flex-negative:0;flex-shrink:0;color:var(--header-icon)}.drawer-header-inverse{--header-icon:var(--road-primary-contrast);--header-color:var(--road-primary-contrast);--header-background:var(--road-primary-900);margin-bottom:2.5rem}.drawer-action,.drawer-close{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;height:3.5rem;padding:0.5rem;font-family:inherit;font-size:0.875rem;color:inherit;cursor:pointer;background:transparent;border:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.drawer-header:not(.drawer-header-inverse) .drawer-action road-icon{color:var(--back-chevron-color)}.drawer-action~.drawer-title,.drawer-close~.drawer-title{padding-left:0}.drawer-action-left,.drawer-close-left{margin-right:auto}.drawer-title{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;height:3.5rem;padding-left:3.5rem;margin:0;font-size:1rem;font-weight:400}.drawer-body{overflow-y:auto}:host(.drawer-right) .drawer-body,:host(.drawer-left) .drawer-body{height:calc(100vh - 3.5rem)}.drawer-inner{padding:0 1rem 2.5rem}@media (min-width: 768px){.drawer-inner{padding:0 2rem 2.5rem}}:host(.drawer-open){visibility:visible !important;opacity:1}:host(.drawer-open) .drawer-dialog{-webkit-transform:none;transform:none}:host{--background:var(--road-grey-999);--color:var(--road-grey-000);--header-icon:var(--road-grey-000)}";
-
-const drawerLightCss = ":host{--background:var(--road-grey-000);--color:var(--road-grey-900);--header-icon:var(--road-grey-900);--header-color:var(--road-grey-900);--header-background:var(--road-grey-000);--header-delimiter:0;--back-chevron-color:var(--road-grey-900);--max-height:auto;--z-index:10;position:fixed;top:0;left:0;z-index:var(--z-index);display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start;width:100%;height:100%;overflow:hidden;font-family:var(--road-font, sans-serif);line-height:1.5;color:var(--color);visibility:hidden !important;opacity:0;-webkit-transition:opacity 0.15s linear, visibility 0.15s;transition:opacity 0.15s linear, visibility 0.15s}.drawer-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:block;-ms-touch-action:none;touch-action:none;cursor:pointer;background:var(--road-overlay)}.drawer-dialog{position:relative;width:100%;pointer-events:none;-webkit-transition:-webkit-transform 0.3s ease-out;transition:-webkit-transform 0.3s ease-out;transition:transform 0.3s ease-out;transition:transform 0.3s ease-out, -webkit-transform 0.3s ease-out;-webkit-transform:translateX(-100%);transform:translateX(-100%)}:host(.drawer-right){-ms-flex-pack:end;justify-content:flex-end}:host(.drawer-right) .drawer-dialog{-webkit-transform:translateX(100%);transform:translateX(100%)}:host(.drawer-bottom){-ms-flex-align:end;align-items:flex-end}:host(.drawer-bottom) .drawer-dialog{width:100%;max-height:var(--max-height);-webkit-transform:translateY(100%);transform:translateY(100%)}:host(.drawer-bottom) .drawer-content{height:auto}.drawer-content{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:100%;height:100vh;pointer-events:auto;background-color:var(--background);background-clip:padding-box;-webkit-box-shadow:0 0.1875rem 0.375rem rgba(0, 0, 0, 0.16);box-shadow:0 0.1875rem 0.375rem rgba(0, 0, 0, 0.16)}.drawer-header{display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end;height:3.5rem;color:var(--header-color);background:var(--header-background);border-color:var(--road-grey-300);border-style:solid;border-width:var(--header-delimiter)}.drawer-header road-icon{-ms-flex-negative:0;flex-shrink:0;color:var(--header-icon)}.drawer-header-inverse{--header-icon:var(--road-primary-contrast);--header-color:var(--road-primary-contrast);--header-background:var(--road-primary-900);margin-bottom:2.5rem}.drawer-action,.drawer-close{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;height:3.5rem;padding:0.5rem;font-family:inherit;font-size:0.875rem;color:inherit;cursor:pointer;background:transparent;border:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.drawer-header:not(.drawer-header-inverse) .drawer-action road-icon{color:var(--back-chevron-color)}.drawer-action~.drawer-title,.drawer-close~.drawer-title{padding-left:0}.drawer-action-left,.drawer-close-left{margin-right:auto}.drawer-title{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;height:3.5rem;padding-left:3.5rem;margin:0;font-size:1rem;font-weight:400}.drawer-body{overflow-y:auto}:host(.drawer-right) .drawer-body,:host(.drawer-left) .drawer-body{height:calc(100vh - 3.5rem)}.drawer-inner{padding:0 1rem 2.5rem}@media (min-width: 768px){.drawer-inner{padding:0 2rem 2.5rem}}:host(.drawer-open){visibility:visible !important;opacity:1}:host(.drawer-open) .drawer-dialog{-webkit-transform:none;transform:none}";
-
-const Drawer = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.onOpen = index.createEvent(this, "open", 7);
-    this.onClose = index.createEvent(this, "close", 7);
-    this.onBack = index.createEvent(this, "back", 7);
-    /**
-     * Set isOpen property to true to open the drawer
-     */
-    this.isOpen = false;
-    /**
-     * position of the drawer. e.g. left, right, bottom
-     */
-    this.position = 'left';
-    /**
-     * Width of the drawer
-     */
-    this.drawerWidth = 480;
-    /**
-     * Inverse header colors
-     */
-    this.hasInverseHeader = false;
-    /**
-     * Show / hide back icon
-     */
-    this.hasBackIcon = false;
-    /**
-     * Show / hide close icon
-     */
-    this.hasCloseIcon = true;
-    /**
-     * Close the dialog when clicking on the cross or layer
-     */
-    this.onClick = (ev) => {
-      ev.stopPropagation();
-      ev.preventDefault();
-      this.close();
-    };
-    /**
-     * Close the dialog when clicking on the cross or layer
-     */
-    this.onClickBack = (event) => {
-      event.stopPropagation();
-      event.preventDefault();
-      this.back();
-    };
-  }
-  /**
-   * Open the drawer
-   */
-  async open() {
-    this.isOpen = true;
-  }
-  /**
-   * Close the drawer
-   */
-  async close() {
-    this.isOpen = false;
-  }
-  /**
-   * Return to previous state of the drawer content
-   */
-  async back() {
-    this.onBack.emit();
-  }
-  handleOpen(openValue) {
-    if (openValue === true) {
-      this.onOpen.emit();
-    }
-    else {
-      this.el.addEventListener('transitionend', () => {
-        this.onClose.emit();
-        this.el.shadowRoot && (this.el.shadowRoot.querySelector('.drawer-body').scrollTop = 0);
-      }, { once: true });
-    }
-  }
-  /**
-   * Close the dialog when press Escape key
-   */
-  onEscape(event) {
-    if (event.key === 'Escape' || event.key === "Esc") {
-      this.close();
-    }
-  }
-  /**
-   * Call close function when clicking an element with data-dismiss="modal" attribute
-   */
-  componentDidLoad() {
-    this.el.querySelectorAll('[data-dismiss="modal"]').forEach(item => {
-      item.addEventListener('click', () => this.close());
-    });
-  }
-  render() {
-    const drawerIsOpenClass = this.isOpen ? 'drawer-open' : '';
-    const inverseHeaderClass = this.hasInverseHeader ? 'drawer-header-inverse' : '';
-    const drawerDelimiterClass = this.drawerTitle !== undefined && !this.hasInverseHeader ? 'drawer-delimiter' : '';
-    const backIconElement = this.hasBackIcon ? index.h("button", { type: "button", class: "drawer-action", "aria-label": "Back", onClick: this.onClickBack }, index.h("road-icon", { icon: index$1.navigationChevron, rotate: "180" }), this.backText) : '';
-    const closeIconElement = this.hasCloseIcon ? index.h("button", { type: "button", class: "drawer-close", onClick: this.onClick, "aria-label": "Close" }, index.h("road-icon", { icon: index$1.navigationClose, "aria-hidden": "true" })) : '';
-    const drawerWidthValue = this.position === 'bottom' ? '100%' : this.drawerWidth + 'px';
-    return (index.h(index.Host, { class: `drawer ${drawerIsOpenClass} drawer-${this.position}`, tabindex: "-1", role: "dialog" }, index.h("div", { class: "drawer-overlay", onClick: this.onClick, tabindex: "-1" }), index.h("div", { class: "drawer-dialog", style: { maxWidth: `${drawerWidthValue}` }, role: "document", tabindex: "0" }, index.h("div", { class: "drawer-content" }, index.h("header", { class: `drawer-header ${inverseHeaderClass} ${drawerDelimiterClass}` }, backIconElement, this.drawerTitle !== undefined ? index.h("h2", { class: "drawer-title" }, this.drawerTitle) : index.h("div", { class: "drawer-title" }, index.h("slot", { name: "title" })), closeIconElement), index.h("div", { class: "drawer-body" }, index.h("slot", null))))));
-  }
-  get el() { return index.getElement(this); }
-  static get watchers() { return {
-    "isOpen": ["handleOpen"]
-  }; }
-};
-Drawer.style = {
-  dark: drawerDarkCss,
-  light: drawerLightCss
-};
-
-const gridCss = ":host{-webkit-box-sizing:border-box;box-sizing:border-box;display:block;width:100%;padding-right:8px;padding-left:8px;margin-right:auto;margin-left:auto}@media (min-width: 768px){:host{padding-right:24px;padding-left:24px}}";
-
-const Grid = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-  }
-  render() {
-    return (index.h("slot", null));
-  }
-};
-Grid.style = gridCss;
-
-const validateContent = (svgContent) => {
-  const div = document.createElement('div');
-  div.innerHTML = svgContent;
-  // setup this way to ensure it works on our buddy IE
-  for (let i = div.childNodes.length - 1; i >= 0; i--) {
-    if (div.childNodes[i].nodeName.toLowerCase() !== 'svg') {
-      div.removeChild(div.childNodes[i]);
-    }
-  }
-  // must only have 1 root element
-  const svgElm = div.firstElementChild;
-  if (svgElm && svgElm.nodeName.toLowerCase() === 'svg') {
-    const svgClass = svgElm.getAttribute('class') || '';
-    svgElm.setAttribute('class', (svgClass + ' s-ion-icon').trim());
-    // root element must be an svg
-    // lets double check we've got valid elements
-    // do not allow scripts
-    if (isValid(svgElm)) {
-      return div.innerHTML;
-    }
-  }
-  return '';
-};
-const isValid = (elm) => {
-  if (elm.nodeType === 1) {
-    if (elm.nodeName.toLowerCase() === 'script') {
-      return false;
-    }
-    for (let i = 0; i < elm.attributes.length; i++) {
-      const val = elm.attributes[i].value;
-      if (utils.isStr(val) && val.toLowerCase().indexOf('on') === 0) {
-        return false;
-      }
-    }
-    for (let i = 0; i < elm.childNodes.length; i++) {
-      if (!isValid(elm.childNodes[i])) {
-        return false;
-      }
-    }
-  }
-  return true;
-};
-
-const roadiconContent = new Map();
-const requests = new Map();
-const getSvgContent = (url, sanitize) => {
-  // see if we already have a request for this url
-  let req = requests.get(url);
-  if (!req) {
-    if (typeof fetch !== 'undefined' && typeof document !== 'undefined') {
-      // we don't already have a request
-      // @ts-ignore
-      req = fetch(url).then((rsp) => {
-        if (rsp.ok) {
-          return rsp.text().then((svgContent) => {
-            if (svgContent && sanitize !== false) {
-              svgContent = validateContent(svgContent);
-            }
-            roadiconContent.set(url, svgContent || '');
-          });
-        }
-        roadiconContent.set(url, '');
-      });
-      // cache for the same requests
-      requests.set(url, req);
-    }
-    else {
-      // set to empty for ssr scenarios and resolve promise
-      roadiconContent.set(url, '');
-      return Promise.resolve();
-    }
-  }
-  return req;
-};
-
-const iconCss = ":host{-webkit-box-sizing:content-box;box-sizing:content-box;display:inline-block;color:var(--road-grey-900);-webkit-transition:fill 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;transition:fill 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;fill:currentColor;contain:strict}:host svg{display:block;width:100%;height:100%}:host(.icon-sm){width:1.25rem;height:1.25rem}:host(.icon-md){width:1.5rem;height:1.5rem}:host(.icon-lg){width:2rem;height:2rem}:host(.icon-3x){width:3rem;height:3rem}:host(.icon-4x){width:4rem;height:4rem}:host(.icon-primary){color:var(--road-primary-900)}:host(.icon-secondary){color:var(--road-primary-500)}:host(.icon-accent){color:var(--road-secondary-500)}:host(.icon-info){color:var(--road-info-default)}:host(.icon-success){color:var(--road-success-default)}:host(.icon-warning){color:var(--road-warning-default)}:host(.icon-danger){color:var(--road-danger-default)}:host(.icon-default){color:var(--road-grey-900)}:host(.icon-white){color:var(--road-grey-000)}:host(.icon-rotate-90){-webkit-transform:rotate(90deg);transform:rotate(90deg)}:host(.icon-rotate-180){-webkit-transform:rotate(180deg);transform:rotate(180deg)}:host(.icon-rotate-270){-webkit-transform:rotate(270deg);transform:rotate(270deg)}";
-
-const Icon = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.isVisible = false;
-    /**
-     * The size of the icon.
-     * Available options are: `"sm"`, `"md"`, `"lg"`, `"3x"` and `"4x"`.
-     */
-    this.size = "lg";
-    /**
-     * If enabled, road-icon will be loaded lazily when it's visible in the viewport.
-     * Default, `false`.
-     */
-    this.lazy = false;
-    /**
-     * When set to `false`, SVG content that is HTTP fetched will not be checked
-     * if the response SVG content has any `<script>` elements, or any attributes
-     * that start with `on`, such as `onclick`.
-     */
-    this.sanitize = true;
-  }
-  componentWillLoad() {
-    this.waitUntilVisible(this.el, '50px', () => {
-      this.isVisible = true;
-      this.loadIcon();
-    });
-  }
-  disconnectedCallback() {
-    if (this.io) {
-      this.io.disconnect();
-      this.io = undefined;
-    }
-  }
-  waitUntilVisible(el, rootMargin, cb) {
-    if (this.lazy && window.IntersectionObserver) {
-      const io = this.io = new window.IntersectionObserver((data) => {
-        if (data[0].isIntersecting) {
-          io.disconnect();
-          this.io = undefined;
-          cb();
-        }
-      }, { rootMargin });
-      io.observe(el);
-    }
-    else {
-      // browser doesn't support IntersectionObserver
-      // so just fallback to always show it
-      cb();
-    }
-  }
-  loadIcon() {
-    if (this.isVisible) {
-      const url = utils.getUrl(this);
-      if (url) {
-        if (roadiconContent.has(url)) {
-          // sync if it's already loaded
-          this.svgContent = roadiconContent.get(url);
-        }
-        else {
-          // async if it hasn't been loaded
-          getSvgContent(url, this.sanitize).then(() => (this.svgContent = roadiconContent.get(url)));
-        }
-      }
-    }
-    if (!this.ariaLabel && this.ariaHidden !== 'true') {
-      const label = utils.getName(this.name, this.icon);
-      // user did not provide a label
-      // come up with the label based on the icon name
-      if (label) {
-        this.ariaLabel = label.replace(/-/g, ' ');
-      }
-    }
-  }
-  render() {
-    const colorClass = this.color !== undefined ? `icon-${this.color}` : '';
-    const sizeClass = this.size !== undefined ? `icon-${this.size}` : '';
-    const rotateClass = this.rotate !== undefined ? `icon-rotate-${this.rotate}` : '';
-    return (index.h(index.Host, { class: `${colorClass} ${sizeClass} ${rotateClass}`, "aria-hidden": "true" }, ((this.svgContent !== '')
-      ? index.h("div", { class: "icon-inner", innerHTML: this.svgContent })
-      : index.h("div", { class: "icon-inner" }))));
-  }
-  static get assetsDirs() { return ["svg"]; }
-  get el() { return index.getElement(this); }
-  static get watchers() { return {
-    "name": ["loadIcon"],
-    "src": ["loadIcon"],
-    "icon": ["loadIcon"]
-  }; }
-};
-Icon.style = iconCss;
-
-const itemCss = ":host{--border-radius:0.25rem;--background-color:transparent;--detail-color:var(--road-grey-900);--inner-padding:1rem 0.5rem 1rem 0;--min-height:3.5rem;--padding-left:1rem;position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;overflow:hidden;text-decoration:none;outline:none}.item-native{position:relative;z-index:1;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-align:inherit;align-items:inherit;-ms-flex-pack:inherit;justify-content:inherit;width:100%;min-height:var(--min-height);padding:0 0 0 var(--padding-left);margin:0;overflow:inherit;font-family:inherit;font-size:inherit;color:var(--road-grey-900);background-color:var(--background-color);border-color:var(--road-grey-300);border-style:solid;border-width:var(--border-width, 0);border-radius:var(--border-radius);outline:none;-webkit-transition:background 0.15s ease-in-out;transition:background 0.15s ease-in-out;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.item-active{background-color:var(--road-grey-100)}button.item-native:not(:disabled):not(.item-active):hover,button.item-native:not(:disabled):not(.item-active):focus{background-color:var(--road-grey-100)}.item-native::-moz-focus-inner{border:0}button,a{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none}.item-inner{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:center;align-items:center;-ms-flex-item-align:stretch;align-self:stretch;width:100%;min-height:inherit;padding:var(--inner-padding);overflow:inherit;text-align:inherit;text-decoration:none;border-color:var(--road-grey-300);border-style:solid;border-width:var(--inner-border-width, 0);outline:0}.input-wrapper{-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:inherit;flex-direction:inherit;-ms-flex-align:inherit;align-items:inherit;-ms-flex-item-align:stretch;align-self:stretch;overflow:inherit;text-overflow:ellipsis}.item-detail-icon{color:var(--detail-color)}::slotted(road-icon){-ms-flex-negative:0;flex-shrink:0;margin-right:0.5rem}::slotted(road-img){-ms-flex-negative:0;flex-shrink:0;width:3rem;height:3rem;-o-object-fit:cover;object-fit:cover;min-height:inherit;margin-right:1rem}::slotted(road-button){--padding-start:0.5rem;--padding-end:0.5rem;--margin-bottom:0}:host(.item-lines-none){--border-width:0 !important;--inner-border-width:0 !important}:host(.item-lines-full){--border-width:0 0 1px 0 !important;--inner-border-width:0 !important}:host(.item-lines-inset){--inner-border-width:0 0 1px 0 !important}";
-
-const Item = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.multipleInputs = false;
-    /**
-     * If `true`, a button tag will be rendered and the item will be tappable.
-     */
-    this.button = false;
-    /**
-     * The icon to use when `detail` is set to `true`.
-     */
-    this.detailIcon = index$1.navigationChevron;
-    /**
-     * If `true`, the user cannot interact with the item.
-     */
-    this.disabled = false;
-    /**
-     * The type of the button. Only used when an `onclick` or `button` property is present.
-     */
-    this.type = 'button';
-  }
-  // If the item has an href or button property it will render a native
-  // anchor or button that is clickable
-  isClickable() {
-    return (this.href !== undefined || this.button);
-  }
-  render() {
-    const { detail, detailIcon, download, lines, disabled, href, rel, target } = this;
-    const clickable = this.isClickable();
-    const TagType = clickable ? (href === undefined ? 'button' : 'a') : 'div';
-    const attrs = (TagType === 'button')
-      ? { type: this.type }
-      : {
-        download,
-        href,
-        rel,
-        target,
-      };
-    const showDetail = detail !== undefined && detail;
-    return (index.h(index.Host, { "aria-disabled": disabled ? 'true' : null, class: {
-        [`item-lines-${lines}`]: lines !== undefined,
-      } }, index.h(TagType, Object.assign({}, attrs, { class: {
-        'item-native': true,
-        'item-active': this.active,
-      }, part: "native", disabled: disabled }), index.h("slot", { name: "start" }), index.h("div", { class: "item-inner" }, index.h("div", { class: "input-wrapper" }, index.h("slot", null)), index.h("slot", { name: "end" }), showDetail && index.h("road-icon", { icon: detailIcon, lazy: false, class: "item-detail-icon" })))));
-  }
-  get el() { return index.getElement(this); }
-};
-Item.style = itemCss;
-
-const labelCss = ":host{-webkit-box-sizing:border-box;box-sizing:border-box;display:block;overflow:hidden;font-size:0.875rem;color:currentColor;text-overflow:ellipsis;white-space:nowrap}";
-
-const Label = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-  }
-  render() {
-    return (index.h("slot", null));
-  }
-};
-Label.style = labelCss;
-
-const listCss = ":host{display:block;contain:content;list-style-type:none}:host(.list-lines-none) ::slotted(road-item){--border-width:0;--inner-border-width:0}:host(.list-lines-full){border:1px solid var(--road-grey-300);border-bottom:0}:host(.list-lines-full),:host(.list-lines-full) ::slotted(road-item){--border-width:0 0 1px 0;--inner-border-width:0}:host(.item-lines-inset),:host(.list-lines-inset) ::slotted(road-item){--inner-border-width:0 0 1px 0}";
-
-const List = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-  }
-  render() {
-    const { lines } = this;
-    return (index.h(index.Host, { class: {
-        [`list-lines-${lines}`]: lines !== undefined,
-      } }, index.h("slot", null)));
-  }
-};
-List.style = listCss;
-
-const rowCss = ":host{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;max-width:1440px;margin-right:-8px;margin-left:-8px}@media (min-width: 1440px){:host{margin-right:auto;margin-left:auto}}:host(.flex-wrap){-ms-flex-wrap:wrap;flex-wrap:wrap}:host(.flex-nowrap){-ms-flex-wrap:nowrap;flex-wrap:nowrap}:host(.justify-content-start){-ms-flex-pack:start;justify-content:flex-start}:host(.justify-content-end){-ms-flex-pack:end;justify-content:flex-end}:host(.justify-content-center){-ms-flex-pack:center;justify-content:center}:host(.justify-content-between){-ms-flex-pack:justify;justify-content:space-between}:host(.justify-content-around){-ms-flex-pack:distribute;justify-content:space-around}:host(.align-items-start){-ms-flex-align:start;align-items:flex-start}:host(.align-items-end){-ms-flex-align:end;align-items:flex-end}:host(.align-items-center){-ms-flex-align:center;align-items:center}:host(.align-items-baseline){-ms-flex-align:baseline;align-items:baseline}:host(.align-items-stretch){-ms-flex-align:stretch;align-items:stretch}@media (min-width: 576px){:host(.flex-sm-wrap){-ms-flex-wrap:wrap;flex-wrap:wrap}:host(.flex-sm-nowrap){-ms-flex-wrap:nowrap;flex-wrap:nowrap}:host(.justify-content-sm-start){-ms-flex-pack:start;justify-content:flex-start}:host(.justify-content-sm-end){-ms-flex-pack:end;justify-content:flex-end}:host(.justify-content-sm-center){-ms-flex-pack:center;justify-content:center}:host(.justify-content-sm-between){-ms-flex-pack:justify;justify-content:space-between}:host(.justify-content-sm-around){-ms-flex-pack:distribute;justify-content:space-around}:host(.align-items-sm-start){-ms-flex-align:start;align-items:flex-start}:host(.align-items-sm-end){-ms-flex-align:end;align-items:flex-end}:host(.align-items-sm-center){-ms-flex-align:center;align-items:center}:host(.align-items-sm-baseline){-ms-flex-align:baseline;align-items:baseline}:host(.align-items-sm-stretch){-ms-flex-align:stretch;align-items:stretch}}@media (min-width: 768px){:host(.flex-md-wrap){-ms-flex-wrap:wrap;flex-wrap:wrap}:host(.flex-md-nowrap){-ms-flex-wrap:nowrap;flex-wrap:nowrap}:host(.justify-content-md-start){-ms-flex-pack:start;justify-content:flex-start}:host(.justify-content-md-end){-ms-flex-pack:end;justify-content:flex-end}:host(.justify-content-md-center){-ms-flex-pack:center;justify-content:center}:host(.justify-content-md-between){-ms-flex-pack:justify;justify-content:space-between}:host(.justify-content-md-around){-ms-flex-pack:distribute;justify-content:space-around}:host(.align-items-md-start){-ms-flex-align:start;align-items:flex-start}:host(.align-items-md-end){-ms-flex-align:end;align-items:flex-end}:host(.align-items-md-center){-ms-flex-align:center;align-items:center}:host(.align-items-md-baseline){-ms-flex-align:baseline;align-items:baseline}:host(.align-items-md-stretch){-ms-flex-align:stretch;align-items:stretch}}@media (min-width: 992px){:host(.flex-lg-wrap){-ms-flex-wrap:wrap;flex-wrap:wrap}:host(.flex-lg-nowrap){-ms-flex-wrap:nowrap;flex-wrap:nowrap}:host(.justify-content-lg-start){-ms-flex-pack:start;justify-content:flex-start}:host(.justify-content-lg-end){-ms-flex-pack:end;justify-content:flex-end}:host(.justify-content-lg-center){-ms-flex-pack:center;justify-content:center}:host(.justify-content-lg-between){-ms-flex-pack:justify;justify-content:space-between}:host(.justify-content-lg-around){-ms-flex-pack:distribute;justify-content:space-around}:host(.align-items-lg-start){-ms-flex-align:start;align-items:flex-start}:host(.align-items-lg-end){-ms-flex-align:end;align-items:flex-end}:host(.align-items-lg-center){-ms-flex-align:center;align-items:center}:host(.align-items-lg-baseline){-ms-flex-align:baseline;align-items:baseline}:host(.align-items-lg-stretch){-ms-flex-align:stretch;align-items:stretch}}@media (min-width: 1200px){:host(.flex-xl-wrap){-ms-flex-wrap:wrap;flex-wrap:wrap}:host(.flex-xl-nowrap){-ms-flex-wrap:nowrap;flex-wrap:nowrap}:host(.justify-content-xl-start){-ms-flex-pack:start;justify-content:flex-start}:host(.justify-content-xl-end){-ms-flex-pack:end;justify-content:flex-end}:host(.justify-content-xl-center){-ms-flex-pack:center;justify-content:center}:host(.justify-content-xl-between){-ms-flex-pack:justify;justify-content:space-between}:host(.justify-content-xl-around){-ms-flex-pack:distribute;justify-content:space-around}:host(.align-items-xl-start){-ms-flex-align:start;align-items:flex-start}:host(.align-items-xl-end){-ms-flex-align:end;align-items:flex-end}:host(.align-items-xl-center){-ms-flex-align:center;align-items:center}:host(.align-items-xl-baseline){-ms-flex-align:baseline;align-items:baseline}:host(.align-items-xl-stretch){-ms-flex-align:stretch;align-items:stretch}}:host(.align-content-start){-ms-flex-line-pack:start;align-content:flex-start}:host(.align-content-end){-ms-flex-line-pack:end;align-content:flex-end}:host(.align-content-center){-ms-flex-line-pack:center;align-content:center}:host(.align-content-between){-ms-flex-line-pack:justify;align-content:space-between}:host(.align-content-around){-ms-flex-line-pack:distribute;align-content:space-around}:host(.align-content-stretch){-ms-flex-line-pack:stretch;align-content:stretch}:host(.align-self-auto){-ms-flex-item-align:auto;align-self:auto}:host(.align-self-start){-ms-flex-item-align:start;align-self:flex-start}:host(.align-self-end){-ms-flex-item-align:end;align-self:flex-end}:host(.align-self-center){-ms-flex-item-align:center;align-self:center}:host(.align-self-baseline){-ms-flex-item-align:baseline;align-self:baseline}:host(.align-self-stretch){-ms-flex-item-align:stretch;align-self:stretch}";
-
-const Row = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-  }
-  render() {
-    return (index.h(index.Host, null, index.h("slot", null)));
-  }
-};
-Row.style = rowCss;
-
-const toolbarCss = ":host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;display:block;width:100%;contain:content;color:var(--road-grey-900);background:var(--road-grey-000);border-bottom:1px solid var(--road-grey-300)}.toolbar-container{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;width:100%;min-height:3.5rem;contain:content;overflow:hidden}.toolbar-content{-ms-flex:1 1 0%;flex:1 1 0%;min-width:0;max-width:100%}::slotted(road-button){--margin-bottom:0;--padding-start:0.5rem;--padding-end:0.5rem;--border-radius:1.5rem;font-size:0.875rem;font-weight:400}:host(.toolbar-primary){color:var(--road-primary-contrast);background:var(--road-primary-900)}:host(.toolbar-secondary){color:var(--road-primary-contrast);background:var(--road-primary-500)}";
-
-const Toolbar = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-  }
-  render() {
-    const colorClass = this.color !== undefined ? `toolbar-${this.color}` : '';
-    return (index.h(index.Host, { class: colorClass }, index.h("div", { class: "toolbar-container" }, index.h("slot", { name: "start" }), index.h("slot", { name: "primary" }), index.h("div", { class: "toolbar-content" }, index.h("slot", null)), index.h("slot", { name: "secondary" }), index.h("slot", { name: "end" }))));
-  }
-};
-Toolbar.style = toolbarCss;
-
-exports.road_badge = Badge;
-exports.road_button = Button;
-exports.road_col = Col;
-exports.road_drawer = Drawer;
-exports.road_grid = Grid;
-exports.road_icon = Icon;
-exports.road_item = Item;
-exports.road_label = Label;
-exports.road_list = List;
-exports.road_row = Row;
-exports.road_toolbar = Toolbar;

package/dist/cjs/road-counter.cjs.entry.js

@@ -1,70 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-a2306350.js');
-
-const counterCss = ".sc-road-counter-h{--counter-margin-bottom:1rem;display:block}road-input.sc-road-counter{--input-text-align:center;--border-radius:0;--margin-bottom:var(--counter-margin-bottom)}road-button.sc-road-counter{font-size:1.5rem;line-height:1.4;background:var(--road-grey-100);border:1px solid var(--road-grey-500)}road-button.sc-road-counter:hover{background:var(--road-grey-200)}.counter-md.sc-road-counter road-input.sc-road-counter{--height:2.5rem}.counter-md.sc-road-counter road-button.sc-road-counter{min-width:2.5rem}.counter-sm.sc-road-counter road-input.sc-road-counter{--height:2rem}.counter-sm.sc-road-counter road-button.sc-road-counter{min-width:2rem}";
-
-const Counter = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.roadincrease = index.createEvent(this, "roadincrease", 7);
-    this.roadIncrease = index.createEvent(this, "roadIncrease", 7);
-    this.checkvalue = index.createEvent(this, "checkvalue", 7);
-    this.checkValue = index.createEvent(this, "checkValue", 7);
-    this.roaddecrease = index.createEvent(this, "roaddecrease", 7);
-    this.roadDecrease = index.createEvent(this, "roadDecrease", 7);
-    /**
-     * The id of counter
-     */
-    this.inputId = `road-counter-${counterIds++}`;
-    /**
-     * The value of the counter.
-     */
-    this.value = 1;
-    /**
-    * Set to `true` to add icon.
-    */
-    this.icon = false;
-    this.increase = () => {
-      this.el.querySelector('input').stepUp();
-      var valueInput = this.el.querySelector('input').value;
-      var nb = parseInt(valueInput);
-      if (this.icon && nb > 1) {
-        let attribut = document.getElementById("iconCounterLess");
-        attribut.setAttribute('name', 'navigation-add-less');
-      }
-      else if (this.icon) {
-        let attribut = document.getElementById("iconCounterLess");
-        attribut.setAttribute('name', 'delete-forever');
-      }
-      this.roadincrease.emit();
-      this.roadIncrease.emit();
-    };
-    this.decrease = () => {
-      this.el.querySelector('input').stepDown();
-      var valueInput = this.el.querySelector('input').value;
-      var nb = parseInt(valueInput);
-      if (this.icon && nb > 1) {
-        let attribut = document.getElementById("iconCounterLess");
-        attribut.setAttribute('name', 'navigation-add-less');
-      }
-      else if (this.icon) {
-        let attribut = document.getElementById("iconCounterLess");
-        attribut.setAttribute('name', 'delete-forever');
-      }
-      this.roaddecrease.emit();
-      this.roadDecrease.emit();
-    };
-  }
-  render() {
-    var icon = this.icon ? 'delete-forever' : 'navigation-add-less';
-    return (index.h("road-input-group", { class: this.size && `counter-${this.size}` }, index.h("road-button", { slot: "prepend", size: this.size, onClick: this.decrease }, index.h("road-icon", { name: icon, id: "iconCounterLess", size: this.size })), index.h("road-input", { type: "number", min: this.min, max: this.max, step: this.step, value: this.value }), index.h("road-button", { slot: "append", size: this.size, onClick: this.increase }, index.h("road-icon", { name: "navigation-add-more", size: this.size }))));
-  }
-  get el() { return index.getElement(this); }
-};
-let counterIds = 0;
-Counter.style = counterCss;
-
-exports.road_counter = Counter;