@roadtrip/components 2.26.0 → 2.28.0

package/dist/collection/components/duration/duration.js

@@ -0,0 +1,212 @@
+import { Component, Element, Event, h, Listen, Method, Prop } from '@stencil/core';
+export class Duration {
+  constructor() {
+    /**
+     * Set isOpen property to true to open the duration widget
+     */
+    this.isOpen = false;
+    /**
+     * title of the widget
+     */
+    this.header = 'duration';
+    /**
+     * The minimum value, which must not be greater than its maximum (max attribute) value in minutes.
+     */
+    this.min = 15;
+    /**
+     * The maximum value, which must not be less than its minimum (min attribute) value in minutes.
+     */
+    this.max = 300;
+    /**
+     * Works with the min and max attributes to limit the increments at which a value can be set in minutes.
+     */
+    this.step = 15;
+  }
+  handleClick(event) {
+    this.roadselected.emit({
+      value: event.detail.value.toString(),
+      label: event.detail.label,
+    });
+    this.close();
+  }
+  /**
+   * Open the widget
+   */
+  async open() {
+    this.isOpen = true;
+  }
+  /**
+   * Close the widget
+   */
+  async close() {
+    this.isOpen = false;
+  }
+  render() {
+    return (h("road-drawer", { "is-open": this.isOpen, position: "bottom", "drawer-title": this.header },
+      h("road-grid", null,
+        h("road-row", { class: "duration-values" }, Array(Math.floor((this.max - this.min) / this.step) + 1).fill(this.min).map(((item, index) => (item + index * this.step))).map(item => h("road-col", { class: "col-3 col-md-2" },
+          h("road-card", { button: true, value: item },
+            h("road-label", null,
+              Math.floor(item / 60).toLocaleString("en-GB", { minimumIntegerDigits: 2, useGrouping: false }),
+              ":",
+              (item % 60).toLocaleString("en-GB", { minimumIntegerDigits: 2, useGrouping: false })))))))));
+  }
+  static get is() { return "road-duration"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["duration.css"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["duration.css"]
+  }; }
+  static get properties() { return {
+    "isOpen": {
+      "type": "boolean",
+      "mutable": true,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Set isOpen property to true to open the duration widget"
+      },
+      "attribute": "is-open",
+      "reflect": false,
+      "defaultValue": "false"
+    },
+    "header": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "title of the widget"
+      },
+      "attribute": "header",
+      "reflect": false,
+      "defaultValue": "'duration'"
+    },
+    "min": {
+      "type": "number",
+      "mutable": false,
+      "complexType": {
+        "original": "number",
+        "resolved": "number",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "The minimum value, which must not be greater than its maximum (max attribute) value in minutes."
+      },
+      "attribute": "min",
+      "reflect": false,
+      "defaultValue": "15"
+    },
+    "max": {
+      "type": "number",
+      "mutable": false,
+      "complexType": {
+        "original": "number",
+        "resolved": "number",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "The maximum value, which must not be less than its minimum (min attribute) value in minutes."
+      },
+      "attribute": "max",
+      "reflect": false,
+      "defaultValue": "300"
+    },
+    "step": {
+      "type": "number",
+      "mutable": false,
+      "complexType": {
+        "original": "number",
+        "resolved": "number",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Works with the min and max attributes to limit the increments at which a value can be set in minutes."
+      },
+      "attribute": "step",
+      "reflect": false,
+      "defaultValue": "15"
+    }
+  }; }
+  static get events() { return [{
+      "method": "roadselected",
+      "name": "roadselected",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": "Emitt the value and label of the selected option."
+      },
+      "complexType": {
+        "original": "{\n    value: string | undefined | null,\n    label: string\n  }",
+        "resolved": "{ value: string | null | undefined; label: string; }",
+        "references": {}
+      }
+    }]; }
+  static get methods() { return {
+    "open": {
+      "complexType": {
+        "signature": "() => Promise<void>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<void>"
+      },
+      "docs": {
+        "text": "Open the widget",
+        "tags": []
+      }
+    },
+    "close": {
+      "complexType": {
+        "signature": "() => Promise<void>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<void>"
+      },
+      "docs": {
+        "text": "Close the widget",
+        "tags": []
+      }
+    }
+  }; }
+  static get elementRef() { return "el"; }
+  static get listeners() { return [{
+      "name": "roadcardclick",
+      "method": "handleClick",
+      "target": undefined,
+      "capture": false,
+      "passive": false
+    }]; }
+}

package/dist/collection/components/duration/duration.stories.js

@@ -0,0 +1,108 @@
+import { html } from 'lit-html';
+import { ifDefined } from 'lit-html/directives/if-defined';
+import { useEffect } from "@storybook/client-api";
+
+export default {
+  title: 'Forms/Duration',
+  component: 'road-duration',
+  parameters: {
+    backgrounds: {
+      default: 'grey',
+    },
+    layout: 'fullscreen',
+    actions: {
+      handles: ['open', 'close'],
+    },
+  },
+  argTypes: {
+    'is-open': {
+      control: 'boolean',
+    },
+    header: {
+      control: 'text',
+    },
+    min: {
+      control: 'number',
+    },
+    max: {
+      control: 'number',
+    },
+    step: {
+      control: 'number',
+      min: 15,
+    },
+    roadselected: {
+      action: 'roadselected',
+      control: {
+        type: null,
+      },
+    },
+    open : {
+      description: 'Open the widget.',
+      table: {
+        category: 'methods',
+        type: {
+          summary: 'void',
+        },
+      },
+      defaultValue: {
+        summary: null,
+      },
+    },
+    close : {
+      description: 'Close the widget.',
+      table: {
+        category: 'methods',
+        type: {
+          summary: 'void',
+        },
+        defaultValue: {
+          summary: null,
+        },
+      },
+    },
+  },
+  args: {
+    'is-open': true,
+  },
+};
+
+const Template = (args) => html`
+<road-duration 
+  is-open="${ifDefined(args['is-open'])}"
+  header="${ifDefined(args.header)}"
+  min="${ifDefined(args.min)}"
+  max="${ifDefined(args.max)}"
+  step="${ifDefined(args.step)}"
+  @roadselected=${event => args.roadselected(event.detail)}
+></road-duration>
+`;
+
+export const Playground = Template.bind({});
+
+export const Example = () => html`
+<road-label class="mb-8">Duration of the service</road-label>
+<div class="d-flex align-items-center">
+  <road-input 
+    class="input"
+    aria-label="Duration of the service" 
+    style="width: 100px" 
+    placeholder="00:15"
+    @roadfocus=${() => document.querySelector('.duration').open()}
+  ></road-input>
+  <div class="text-content ml-8">hour(s)</div>
+</div>
+
+<road-duration 
+  class="duration"
+  header="Duration of the service"
+  @roadselected=${event => document.querySelector('.input').value = event.detail.label}
+></road-duration>
+`;
+Example.parameters = {
+  docs: {
+    source: {
+      type: 'code',
+    },
+  },
+};

package/dist/collection/components/flap/flap.css

@@ -4,43 +4,54 @@
  * Index
  * - Flap
  * - Colors
+ * - Sizes
  */
 
 /* FLAP
  -------------------- */
 
 :host {
-  --flap-promo: #ea0000;
-  --flap-exclu: #eca000;
-  --flap-info: #002b6f;
-  --flap-ecology: #00ab6d;
-
   box-sizing: border-box;
   display: inline-flex;
+  align-items: center;
   justify-content: center;
-  min-width: 3.5rem;
-  padding: 0.25rem 0.5rem;
-  font-size: 0.75rem;
+  height: 1.5rem;
+  padding: 0 0.75rem;
+  font-size: 0.875rem;
   font-weight: 700;
-  border: 1px solid currentColor;
-  border-radius: 1.5625rem;
+  background: var(--road-grey-000);
+  border: 1px solid transparent;
+  border-radius: 1.5rem;
 }
 
 /* COLORS
  -------------------- */
 
 :host(.flap-promo) {
-  color: var(--flap-promo);
+  color: var(--road-danger-default);
+  border-color: var(--road-danger-default);
 }
 
 :host(.flap-exclu) {
-  color: var(--flap-exclu);
+  color: var(--road-warning-text);
+  border-color: var(--road-warning-default);
 }
 
 :host(.flap-info) {
-  color: var(--flap-info);
+  color: var(--road-info-text);
+  border-color: var(--road-info-default);
 }
 
 :host(.flap-ecology) {
-  color: var(--flap-ecology);
+  color: var(--road-success-text);
+  border-color: var(--road-success-default);
+}
+
+/* SIZES
+ -------------------- */
+
+:host(.flap-md) {
+  height: 2rem;
+  padding: 0 1rem;
+  font-size: 1rem;
 }

package/dist/collection/components/flap/flap.js

@@ -8,10 +8,14 @@ export class Flap {
      * Set the color of the flap.
      */
     this.color = 'promo';
+    /**
+      * The button size.
+      */
+    this.size = 'sm';
   }
   render() {
     const colorClass = `flap-${this.color}`;
-    return (h(Host, { class: colorClass },
+    return (h(Host, { class: `${colorClass} flap-${this.size}` },
       h("slot", null)));
   }
   static get is() { return "road-flap"; }
@@ -40,6 +44,24 @@ export class Flap {
       "attribute": "color",
       "reflect": false,
       "defaultValue": "'promo'"
+    },
+    "size": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "'sm' | 'md'",
+        "resolved": "\"md\" | \"sm\"",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "The button size."
+      },
+      "attribute": "size",
+      "reflect": true,
+      "defaultValue": "'sm'"
     }
   }; }
 }

package/dist/collection/components/flap/flap.stories.js

@@ -12,6 +12,12 @@ export default {
         type: 'select',
       },
     },
+    size: {
+      options: ['sm', 'md'],
+      control: {
+        type: 'select',
+      },
+    },
     ' ': {
       control: 'text',
     },
@@ -23,7 +29,7 @@ export default {
 };
 
 const Template = (args) => html`
-<road-flap color="${ifDefined(args.color)}">
+<road-flap color="${ifDefined(args.color)}" size="${ifDefined(args.size)}">
   ${unsafeHTML(args[' '])}
 </road-flap>
 `;
@@ -47,3 +53,8 @@ Ecology.args = {
   color: 'ecology',
   ' ': 'Ecology',
 };
+
+export const Sizes = Template.bind({});
+Sizes.args = {
+  size: 'md',
+};

package/dist/collection/components/icon/icon.css

@@ -10,7 +10,7 @@
 :host {
   box-sizing: content-box;
   display: inline-block;
-  color: var(--icon);
+  color: var(--road-grey-900);
   transition: fill 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
   fill: currentColor;
   contain: strict;
@@ -54,39 +54,39 @@
  -------------------- */
 
 :host(.icon-primary) {
-  color: var(--primary);
+  color: var(--road-primary-900);
 }
 
 :host(.icon-secondary) {
-  color: var(--secondary);
+  color: var(--road-primary-500);
 }
 
 :host(.icon-accent) {
-  color: var(--accent);
+  color: var(--road-secondary-500);
 }
 
 :host(.icon-info) {
-  color: var(--info);
+  color: var(--road-info-default);
 }
 
 :host(.icon-success) {
-  color: var(--success);
+  color: var(--road-success-default);
 }
 
 :host(.icon-warning) {
-  color: var(--warning);
+  color: var(--road-warning-default);
 }
 
 :host(.icon-danger) {
-  color: var(--danger);
+  color: var(--road-danger-default);
 }
 
 :host(.icon-default) {
-  color: var(--icon);
+  color: var(--road-grey-900);
 }
 
 :host(.icon-white) {
-  color: var(--white);
+  color: var(--road-grey-000);
 }
 
 /* ROTATION

package/dist/collection/components/icon/svg/device-smartphone-music-color.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M36.344,49.771l-.685-2.965L30.971,26.5l-2.435.562,4.125,17.867L10,50.165,2.552,17.916a1.971,1.971,0,0,1,1.476-2.363l16.5-3.809L19.97,9.307l-16.5,3.811a4.468,4.468,0,0,0-3.35,5.361L7.843,51.945l.965,4.184a4.468,4.468,0,0,0,5.361,3.349l18.825-4.345a4.471,4.471,0,0,0,3.35-5.362m-2.685,2.05a1.957,1.957,0,0,1-1.228.875L13.606,57.043a1.971,1.971,0,0,1-2.362-1.477L10.559,52.6l22.664-5.233.685,2.966a1.958,1.958,0,0,1-.249,1.487" transform="translate(8 0.617)"/><rect width="3.077" height="2.5" transform="translate(28.675 52.173) rotate(-12.991)"/><path d="M16.422,40.784a1.282,1.282,0,0,1-.356-.051,1.254,1.254,0,0,1-.862-.918l-2.43-10.523a1.249,1.249,0,0,1,1.6-1.47l9.983,3.237a1.251,1.251,0,0,1,.483,2.089L17.29,40.434a1.249,1.249,0,0,1-.868.35m-.715-9.9L17.144,37.1l4.464-4.307Z" transform="translate(8 0.617)" fill="var(--accent-hover, rgb(236, 160, 0))"/><path d="M48.343,12.01a5.506,5.506,0,0,1-2.361-2.728L43.588,3.819V20.665a4.584,4.584,0,0,0-2-.027c-2.241.464-4,2.338-4,4.266a2.962,2.962,0,0,0,1.1,2.336,3.771,3.771,0,0,0,2.4.794,5.08,5.08,0,0,0,4.983-4.25h.013V13.473c.306.24.6.436.862.613,1.057.708,1.638,1.1,1.638,3.7h2.5c0-3.652-1.138-4.7-2.745-5.774M41.585,25.481a1.609,1.609,0,0,1-1.312-.18.469.469,0,0,1-.185-.4c0-.662.856-1.58,2-1.818a2.506,2.506,0,0,1,.492-.052,1.317,1.317,0,0,1,.82.232.472.472,0,0,1,.185.4c0,.663-.857,1.58-2,1.817" transform="translate(8 0.617)"/><path d="M25.588,4.909V16.665a4.584,4.584,0,0,0-2-.027c-2.241.464-4,2.338-4,4.266a2.962,2.962,0,0,0,1.105,2.336,3.771,3.771,0,0,0,2.4.794,5.08,5.08,0,0,0,4.983-4.25h.013V10.659l8.5-3.091v5.1a4.584,4.584,0,0,0-2-.027c-2.241.464-4,2.338-4,4.266a2.962,2.962,0,0,0,1.105,2.336,3.771,3.771,0,0,0,2.4.794,5.08,5.08,0,0,0,4.983-4.25h.013V0Zm-2,16.572a1.616,1.616,0,0,1-1.313-.18.471.471,0,0,1-.184-.4c0-.662.856-1.58,2-1.818a2.506,2.506,0,0,1,.492-.052,1.317,1.317,0,0,1,.82.232.472.472,0,0,1,.185.4c0,.663-.857,1.58-2,1.817M28.088,8V6.66l8.5-3.091v1.34Zm6.5,9.481a1.613,1.613,0,0,1-1.312-.18.469.469,0,0,1-.185-.4c0-.662.856-1.58,2-1.818a2.506,2.506,0,0,1,.492-.052,1.317,1.317,0,0,1,.82.232.472.472,0,0,1,.185.4c0,.663-.857,1.58-2,1.817" transform="translate(8 0.617)"/></svg>

package/dist/collection/components/icon/svg/device-smartphone-music.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M36.344,49.771l-.685-2.965L30.971,26.5l-2.435.562,4.125,17.867L10,50.165,2.552,17.916a1.971,1.971,0,0,1,1.476-2.363l16.5-3.809L19.97,9.307l-16.5,3.811a4.468,4.468,0,0,0-3.35,5.361L7.843,51.945l.965,4.184a4.468,4.468,0,0,0,5.361,3.349l18.825-4.345a4.471,4.471,0,0,0,3.35-5.362m-2.685,2.05a1.957,1.957,0,0,1-1.228.875L13.606,57.043a1.971,1.971,0,0,1-2.362-1.477L10.559,52.6l22.664-5.233.685,2.966a1.958,1.958,0,0,1-.249,1.487" transform="translate(8 0.617)"/><rect width="3.077" height="2.5" transform="translate(28.675 52.173) rotate(-12.991)"/><path d="M16.422,40.784a1.282,1.282,0,0,1-.356-.051,1.254,1.254,0,0,1-.862-.918l-2.43-10.523a1.249,1.249,0,0,1,1.6-1.47l9.983,3.237a1.251,1.251,0,0,1,.483,2.089L17.29,40.434a1.249,1.249,0,0,1-.868.35m-.715-9.9L17.144,37.1l4.464-4.307Z" transform="translate(8 0.617)"/><path d="M48.343,12.01a5.506,5.506,0,0,1-2.361-2.728L43.588,3.819V20.665a4.584,4.584,0,0,0-2-.027c-2.241.464-4,2.338-4,4.266a2.962,2.962,0,0,0,1.1,2.336,3.771,3.771,0,0,0,2.4.794,5.08,5.08,0,0,0,4.983-4.25h.013V13.473c.306.24.6.436.862.613,1.057.708,1.638,1.1,1.638,3.7h2.5c0-3.652-1.138-4.7-2.745-5.774M41.585,25.481a1.609,1.609,0,0,1-1.312-.18.469.469,0,0,1-.185-.4c0-.662.856-1.58,2-1.818a2.506,2.506,0,0,1,.492-.052,1.317,1.317,0,0,1,.82.232.472.472,0,0,1,.185.4c0,.663-.857,1.58-2,1.817" transform="translate(8 0.617)"/><path d="M25.588,4.909V16.665a4.584,4.584,0,0,0-2-.027c-2.241.464-4,2.338-4,4.266a2.962,2.962,0,0,0,1.105,2.336,3.771,3.771,0,0,0,2.4.794,5.08,5.08,0,0,0,4.983-4.25h.013V10.659l8.5-3.091v5.1a4.584,4.584,0,0,0-2-.027c-2.241.464-4,2.338-4,4.266a2.962,2.962,0,0,0,1.105,2.336,3.771,3.771,0,0,0,2.4.794,5.08,5.08,0,0,0,4.983-4.25h.013V0Zm-2,16.572a1.616,1.616,0,0,1-1.313-.18.471.471,0,0,1-.184-.4c0-.662.856-1.58,2-1.818a2.506,2.506,0,0,1,.492-.052,1.317,1.317,0,0,1,.82.232.472.472,0,0,1,.185.4c0,.663-.857,1.58-2,1.817M28.088,8V6.66l8.5-3.091v1.34Zm6.5,9.481a1.613,1.613,0,0,1-1.312-.18.469.469,0,0,1-.185-.4c0-.662.856-1.58,2-1.818a2.506,2.506,0,0,1,.492-.052,1.317,1.317,0,0,1,.82.232.472.472,0,0,1,.185.4c0,.663-.857,1.58-2,1.817" transform="translate(8 0.617)"/></svg>

package/dist/collection/components/icon/svg/mic-off-outline-color.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g transform="translate(9 4)"><path d="M38.815,35.154l-2.289-1.005a14.768,14.768,0,0,0,1.248-5.978V19.279h2.5v8.892a17.267,17.267,0,0,1-1.459,6.983"/><path d="M33.232,29.116l-2.489-.227q.031-.354.031-.718V10.387a7.886,7.886,0,1,0-15.771,0v.347H12.5v-.347a10.385,10.385,0,1,1,20.771,0V28.171q0,.479-.042.945" fill="var(--accent-hover, rgb(236, 160, 0))"/><path d="M27.954,34.2A7.874,7.874,0,0,1,15,28.172V21.251l-2.5-2.5v9.421a10.377,10.377,0,0,0,17.225,7.8Z" fill="var(--accent-hover, rgb(236, 160, 0))"/><rect width="2.5" height="64.491" transform="translate(0 6.248) rotate(-45)"/><path d="M34.676,40.924,32.91,39.158A14.87,14.87,0,0,1,8,28.17V19.278H5.5V28.17A17.4,17.4,0,0,0,21.638,45.493V56.584h2.5V45.5a17.46,17.46,0,0,0,10.538-4.573"/></g></svg>

package/dist/collection/components/icon/svg/mic-off-outline.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g transform="translate(9 4)"><path d="M38.815,35.154l-2.289-1.005a14.768,14.768,0,0,0,1.248-5.978V19.279h2.5v8.892a17.267,17.267,0,0,1-1.459,6.983"/><path d="M33.232,29.116l-2.489-.227q.031-.354.031-.718V10.387a7.886,7.886,0,1,0-15.771,0v.347H12.5v-.347a10.385,10.385,0,1,1,20.771,0V28.171q0,.479-.042.945"/><path d="M27.954,34.2A7.874,7.874,0,0,1,15,28.172V21.251l-2.5-2.5v9.421a10.377,10.377,0,0,0,17.225,7.8Z"/><rect width="2.5" height="64.491" transform="translate(0 6.248) rotate(-45)"/><path d="M34.676,40.924,32.91,39.158A14.87,14.87,0,0,1,8,28.17V19.278H5.5V28.17A17.4,17.4,0,0,0,21.638,45.493V56.584h2.5V45.5a17.46,17.46,0,0,0,10.538-4.573"/></g></svg>

package/dist/collection/components/icon/svg/mic-off.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g transform="translate(9 3.707)"><path d="M32.612,31.79a10.308,10.308,0,0,0,.663-3.619V10.386a10.386,10.386,0,0,0-20.772,0v1.3Z" transform="translate(0.1 0)"/><path d="M37.833,37.012a17.253,17.253,0,0,0,2.442-8.841V19.279h-2.5v8.892a14.785,14.785,0,0,1-1.765,7.018Z" transform="translate(0.1 0)"/><path d="M12.5,18.752v9.42a10.372,10.372,0,0,0,17.222,7.8Z" transform="translate(0.1 0)"/><path d="M34.676,40.925,32.891,39.14A14.842,14.842,0,0,1,8,28.171V19.279H5.5v8.892A17.4,17.4,0,0,0,21.639,45.494V56.585h2.5V45.5a17.3,17.3,0,0,0,10.537-4.572" transform="translate(0.1 0)"/><rect width="2.5" height="64.491" transform="translate(0.1 6.248) rotate(-45)"/></g></svg>

package/dist/collection/components/icon/svg/people-community-outline-color.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g transform="translate(3.032 3.032)"><path d="M41.538,19.486l4.551-4.551a5.216,5.216,0,0,1-1.768-1.767L39.879,17.61a15.818,15.818,0,0,1,1.659,1.876"/><path d="M39.879,40.327l5.364,5.364.439-.439a5.3,5.3,0,0,1,.889-.889l.44-.439-5.473-5.473a15.818,15.818,0,0,1-1.659,1.876"/><path d="M18.057,17.61l-4.443-4.443a5.219,5.219,0,0,1-1.768,1.768L16.4,19.486a15.818,15.818,0,0,1,1.659-1.876"/><path d="M16.4,38.45,11.847,43a5.2,5.2,0,0,1,1.767,1.767l4.443-4.443A15.818,15.818,0,0,1,16.4,38.45"/><path d="M44.674,30.218h3.011a4.734,4.734,0,0,1,0-2.5H44.674c.033.414.063.828.063,1.25s-.03.836-.063,1.25"/><path d="M13.262,27.718H10.25a4.734,4.734,0,0,1,0,2.5h3.012c-.033-.414-.063-.828-.063-1.25s.03-.836.063-1.25"/><path d="M27.718,44.674v3.012a5.162,5.162,0,0,1,1.25-.169h0a5.207,5.207,0,0,1,1.249.168V44.674c-.414.033-.828.063-1.25.063s-.836-.03-1.25-.063"/><path d="M30.218,13.262V10.25a4.707,4.707,0,0,1-2.5,0v3.012c.414-.033.828-.063,1.25-.063s.836.03,1.25.063"/><path d="M34.7,30.547a12.406,12.406,0,0,0-4.041-1.271,5,5,0,0,0,3.324-4.7v-.513a5.012,5.012,0,0,0-10.023,0v.513a5,5,0,0,0,3.324,4.7,12.413,12.413,0,0,0-4.041,1.271,5.558,5.558,0,0,0-3.076,4.906V37.7h2.5V35.453a3.069,3.069,0,0,1,1.727-2.687,10.09,10.09,0,0,1,9.156,0,3.069,3.069,0,0,1,1.726,2.687V37.7h2.5V35.453A5.556,5.556,0,0,0,34.7,30.547m-8.24-5.969v-.513a2.512,2.512,0,0,1,5.023,0v.513a2.512,2.512,0,1,1-5.023,0" fill="var(--accent-hover, rgb(236, 160, 0))"/><path d="M28.968,44.737a15.769,15.769,0,1,1,15.77-15.769,15.788,15.788,0,0,1-15.77,15.769m0-29.038a13.269,13.269,0,1,0,13.27,13.269A13.285,13.285,0,0,0,28.968,15.7"/><path d="M48.767,15.7a5.21,5.21,0,1,1,0-10.419h0a5.21,5.21,0,1,1,0,10.419m0-7.919a2.71,2.71,0,1,0,2.711,2.709A2.692,2.692,0,0,0,48.766,7.78Z"/><path d="M49.767,53.656a5.209,5.209,0,1,1,5.21-5.21,5.216,5.216,0,0,1-5.21,5.21m0-7.919a2.709,2.709,0,1,0,2.71,2.709,2.713,2.713,0,0,0-2.71-2.709"/><path d="M9.169,15.7a5.21,5.21,0,1,1,0-10.419h0a5.21,5.21,0,0,1,0,10.419m0-7.919h0a2.709,2.709,0,1,0,1.916.793A2.713,2.713,0,0,0,9.169,7.78"/><path d="M9.169,52.656a5.209,5.209,0,1,1,5.21-5.21,5.216,5.216,0,0,1-5.21,5.21m0-7.919a2.709,2.709,0,1,0,2.71,2.709,2.713,2.713,0,0,0-2.71-2.709"/><path d="M52.727,34.177a5.209,5.209,0,1,1,5.209-5.209,5.215,5.215,0,0,1-5.209,5.209m0-7.919a2.71,2.71,0,1,0,2.709,2.71,2.713,2.713,0,0,0-2.709-2.71"/><path d="M5.209,34.177a5.209,5.209,0,1,1,5.21-5.209,5.215,5.215,0,0,1-5.21,5.209m0-7.919a2.71,2.71,0,1,0,2.71,2.71,2.713,2.713,0,0,0-2.71-2.71"/><path d="M28.968,57.936a5.21,5.21,0,1,1,0-10.419h0a5.21,5.21,0,0,1,0,10.419m0-7.919h0a2.709,2.709,0,1,0,1.916.793,2.713,2.713,0,0,0-1.916-.793"/><path d="M28.968,10.419a5.209,5.209,0,1,1,5.21-5.209,5.215,5.215,0,0,1-5.21,5.209m0-7.919a2.71,2.71,0,1,0,2.71,2.71,2.713,2.713,0,0,0-2.71-2.71"/></g></svg>

package/dist/collection/components/icon/svg/people-community-outline.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g transform="translate(3.032 3.032)"><path d="M41.538,19.486l4.551-4.551a5.216,5.216,0,0,1-1.768-1.767L39.879,17.61a15.818,15.818,0,0,1,1.659,1.876"/><path d="M39.879,40.327l5.364,5.364.439-.439a5.3,5.3,0,0,1,.889-.889l.44-.439-5.473-5.473a15.818,15.818,0,0,1-1.659,1.876"/><path d="M18.057,17.61l-4.443-4.443a5.219,5.219,0,0,1-1.768,1.768L16.4,19.486a15.818,15.818,0,0,1,1.659-1.876"/><path d="M16.4,38.45,11.847,43a5.2,5.2,0,0,1,1.767,1.767l4.443-4.443A15.818,15.818,0,0,1,16.4,38.45"/><path d="M44.674,30.218h3.011a4.734,4.734,0,0,1,0-2.5H44.674c.033.414.063.828.063,1.25s-.03.836-.063,1.25"/><path d="M13.262,27.718H10.25a4.734,4.734,0,0,1,0,2.5h3.012c-.033-.414-.063-.828-.063-1.25s.03-.836.063-1.25"/><path d="M27.718,44.674v3.012a5.162,5.162,0,0,1,1.25-.169h0a5.207,5.207,0,0,1,1.249.168V44.674c-.414.033-.828.063-1.25.063s-.836-.03-1.25-.063"/><path d="M30.218,13.262V10.25a4.707,4.707,0,0,1-2.5,0v3.012c.414-.033.828-.063,1.25-.063s.836.03,1.25.063"/><path d="M34.7,30.547a12.406,12.406,0,0,0-4.041-1.271,5,5,0,0,0,3.324-4.7v-.513a5.012,5.012,0,0,0-10.023,0v.513a5,5,0,0,0,3.324,4.7,12.413,12.413,0,0,0-4.041,1.271,5.558,5.558,0,0,0-3.076,4.906V37.7h2.5V35.453a3.069,3.069,0,0,1,1.727-2.687,10.09,10.09,0,0,1,9.156,0,3.069,3.069,0,0,1,1.726,2.687V37.7h2.5V35.453A5.556,5.556,0,0,0,34.7,30.547m-8.24-5.969v-.513a2.512,2.512,0,0,1,5.023,0v.513a2.512,2.512,0,1,1-5.023,0"/><path d="M28.968,44.737a15.769,15.769,0,1,1,15.77-15.769,15.788,15.788,0,0,1-15.77,15.769m0-29.038a13.269,13.269,0,1,0,13.27,13.269A13.285,13.285,0,0,0,28.968,15.7"/><path d="M48.767,15.7a5.21,5.21,0,1,1,0-10.419h0a5.21,5.21,0,1,1,0,10.419m0-7.919a2.71,2.71,0,1,0,2.711,2.709A2.692,2.692,0,0,0,48.766,7.78Z"/><path d="M49.767,53.656a5.209,5.209,0,1,1,5.21-5.21,5.216,5.216,0,0,1-5.21,5.21m0-7.919a2.709,2.709,0,1,0,2.71,2.709,2.713,2.713,0,0,0-2.71-2.709"/><path d="M9.169,15.7a5.21,5.21,0,1,1,0-10.419h0a5.21,5.21,0,0,1,0,10.419m0-7.919h0a2.709,2.709,0,1,0,1.916.793A2.713,2.713,0,0,0,9.169,7.78"/><path d="M9.169,52.656a5.209,5.209,0,1,1,5.21-5.21,5.216,5.216,0,0,1-5.21,5.21m0-7.919a2.709,2.709,0,1,0,2.71,2.709,2.713,2.713,0,0,0-2.71-2.709"/><path d="M52.727,34.177a5.209,5.209,0,1,1,5.209-5.209,5.215,5.215,0,0,1-5.209,5.209m0-7.919a2.71,2.71,0,1,0,2.709,2.71,2.713,2.713,0,0,0-2.709-2.71"/><path d="M5.209,34.177a5.209,5.209,0,1,1,5.21-5.209,5.215,5.215,0,0,1-5.21,5.209m0-7.919a2.71,2.71,0,1,0,2.71,2.71,2.713,2.713,0,0,0-2.71-2.71"/><path d="M28.968,57.936a5.21,5.21,0,1,1,0-10.419h0a5.21,5.21,0,0,1,0,10.419m0-7.919h0a2.709,2.709,0,1,0,1.916.793,2.713,2.713,0,0,0-1.916-.793"/><path d="M28.968,10.419a5.209,5.209,0,1,1,5.21-5.209,5.215,5.215,0,0,1-5.21,5.209m0-7.919a2.71,2.71,0,1,0,2.71,2.71,2.713,2.713,0,0,0-2.71-2.71"/></g></svg>

package/dist/collection/components/icon/svg/people-community.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g transform="translate(4.282 4.282)"><path d="M47.686,30.218a5.21,5.21,0,1,0,0-2.5H44.674a15.654,15.654,0,0,0-3.136-8.232l4.551-4.551a5.266,5.266,0,1,0-1.767-1.768L39.879,17.61a15.7,15.7,0,0,0-9.661-4.347V10.251a5.211,5.211,0,1,0-2.5,0v3.013a15.7,15.7,0,0,0-9.66,4.347l-4.443-4.443a5.153,5.153,0,0,0,.764-2.678A5.209,5.209,0,1,0,9.17,15.7a5.162,5.162,0,0,0,2.678-.764L16.4,19.486a15.654,15.654,0,0,0-3.136,8.232H10.252a5.21,5.21,0,1,0,0,2.5h3.011A15.654,15.654,0,0,0,16.4,38.45L11.848,43a5.162,5.162,0,0,0-2.678-.764,5.209,5.209,0,1,0,0,10.419h0a5.215,5.215,0,0,0,5.209-5.209,5.155,5.155,0,0,0-.764-2.678l4.443-4.443a15.707,15.707,0,0,0,9.66,4.348v3.011a5.21,5.21,0,1,0,2.5,0V44.674a15.7,15.7,0,0,0,9.661-4.347l5.365,5.364.445-.446a5.162,5.162,0,0,0-1.131,3.2,5.215,5.215,0,0,0,5.209,5.209h0a5.21,5.21,0,1,0-3.2-9.288l.444-.445-5.473-5.472a15.661,15.661,0,0,0,3.136-8.233Zm5.041-3.96a2.71,2.71,0,1,1-2.71,2.71,2.713,2.713,0,0,1,2.71-2.71M48.767,7.779a2.71,2.71,0,1,1-2.709,2.71,2.713,2.713,0,0,1,2.709-2.71M9.17,13.2a2.71,2.71,0,1,1,2.709-2.71A2.713,2.713,0,0,1,9.17,13.2M5.21,31.678a2.71,2.71,0,1,1,2.71-2.71,2.713,2.713,0,0,1-2.71,2.71M9.17,50.156h0a2.709,2.709,0,1,1,2.71-2.709,2.688,2.688,0,0,1-2.71,2.709M26.259,5.21a2.71,2.71,0,1,1,2.71,2.709h0A2.712,2.712,0,0,1,26.259,5.21M25.113,26.292a3.762,3.762,0,0,1,7.524,0V26.8a3.762,3.762,0,1,1-7.524,0Zm6.565,26.434a2.709,2.709,0,1,1-2.71-2.709,2.713,2.713,0,0,1,2.71,2.709m5.251-13.011a13.176,13.176,0,0,1-16.109,0V37.679a4.812,4.812,0,0,1,2.671-4.24,11.705,11.705,0,0,1,10.768,0,4.811,4.811,0,0,1,2.67,4.24Zm12.838,6.022a2.71,2.71,0,0,1,1.916,4.626,2.686,2.686,0,0,1-1.915.793h0a2.709,2.709,0,0,1,0-5.419" transform="translate(-1.25 -1.25)"/></g></svg>

package/dist/collection/components/icon/svg/people-coworker-color.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g transform="translate(0.969 0.114)"><path d="M44.736,37.95a29.784,29.784,0,0,0-27.41,0,12.237,12.237,0,0,0-6.793,10.782v6.973H51.528V48.732A12.233,12.233,0,0,0,44.736,37.95Zm4.292,15.255H13.033V48.732a9.746,9.746,0,0,1,5.446-8.564,27.656,27.656,0,0,1,25.1,0,9.748,9.748,0,0,1,5.444,8.564Z"/><path d="M31.031,31.859A10.847,10.847,0,0,0,41.865,21.025V19.72a10.834,10.834,0,0,0-21.668,0v1.305A10.847,10.847,0,0,0,31.031,31.859ZM22.7,19.72a8.334,8.334,0,0,1,16.668,0v1.305a8.334,8.334,0,0,1-16.668,0Z"/><path d="M20.2,39.362V53.205h2.5V38.436Q21.427,38.836,20.2,39.362Z" fill="var(--accent-hover, rgb(236, 160, 0))"/><path d="M36.587,50.9l-4.306-5.631v6.023h-2.5V40.819H31.53a1,1,0,0,1,.8.392l4.305,5.631V40.819h2.5V51.294H37.381A1,1,0,0,1,36.587,50.9Z"/></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M12.164,10.089A7.6,7.6,0,0,1,19.753,2.5h1.489a7.6,7.6,0,0,1,7.59,7.589V11.1h2.5V10.089A10.1,10.1,0,0,0,21.242,0H19.753A10.1,10.1,0,0,0,9.664,10.089V11.1h2.5Z" transform="translate(11.502 5.999)"/><path d="M28.831,13.6V15.14a8.334,8.334,0,1,1-16.668,0V13.6h-2.5V15.14a10.834,10.834,0,1,0,21.668,0V13.6Z" transform="translate(11.502 5.999)"/><path d="M36.427,13.6H9.663V11.1H36.427a1.25,1.25,0,0,1,0,2.5" transform="translate(11.502 5.999)"/><path d="M9.664,33.477V47.32h2.5V32.55q-1.272.4-2.5.927" transform="translate(11.502 5.999)" fill="var(--accent-hover, rgb(236, 160, 0))"/><path d="M31.331,47.32V33.477q-1.227-.527-2.5-.927V47.32Z" transform="translate(11.502 5.999)" fill="var(--accent-hover, rgb(236, 160, 0))"/><path d="M40.995,49.82H0V42.847A12.237,12.237,0,0,1,6.792,32.064a29.792,29.792,0,0,1,27.411,0,12.237,12.237,0,0,1,6.792,10.783ZM2.5,47.32H38.495V42.847a9.746,9.746,0,0,0-5.445-8.564,27.65,27.65,0,0,0-25.1,0A9.746,9.746,0,0,0,2.5,42.847Z" transform="translate(11.502 5.999)"/></svg>

package/dist/collection/components/icon/svg/people-coworker.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g transform="translate(0.969 0.114)"><path d="M44.736,37.95a29.784,29.784,0,0,0-27.41,0,12.237,12.237,0,0,0-6.793,10.782v6.973H51.528V48.732A12.233,12.233,0,0,0,44.736,37.95Zm4.292,15.255H13.033V48.732a9.746,9.746,0,0,1,5.446-8.564,27.656,27.656,0,0,1,25.1,0,9.748,9.748,0,0,1,5.444,8.564Z"/><path d="M31.031,31.859A10.847,10.847,0,0,0,41.865,21.025V19.72a10.834,10.834,0,0,0-21.668,0v1.305A10.847,10.847,0,0,0,31.031,31.859ZM22.7,19.72a8.334,8.334,0,0,1,16.668,0v1.305a8.334,8.334,0,0,1-16.668,0Z"/><path d="M20.2,39.362V53.205h2.5V38.436Q21.427,38.836,20.2,39.362Z"/><path d="M36.587,50.9l-4.306-5.631v6.023h-2.5V40.819H31.53a1,1,0,0,1,.8.392l4.305,5.631V40.819h2.5V51.294H37.381A1,1,0,0,1,36.587,50.9Z"/></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M12.164,10.089A7.6,7.6,0,0,1,19.753,2.5h1.489a7.6,7.6,0,0,1,7.59,7.589V11.1h2.5V10.089A10.1,10.1,0,0,0,21.242,0H19.753A10.1,10.1,0,0,0,9.664,10.089V11.1h2.5Z" transform="translate(11.502 5.999)"/><path d="M28.831,13.6V15.14a8.334,8.334,0,1,1-16.668,0V13.6h-2.5V15.14a10.834,10.834,0,1,0,21.668,0V13.6Z" transform="translate(11.502 5.999)"/><path d="M36.427,13.6H9.663V11.1H36.427a1.25,1.25,0,0,1,0,2.5" transform="translate(11.502 5.999)"/><path d="M9.664,33.477V47.32h2.5V32.55q-1.272.4-2.5.927" transform="translate(11.502 5.999)"/><path d="M31.331,47.32V33.477q-1.227-.527-2.5-.927V47.32Z" transform="translate(11.502 5.999)"/><path d="M40.995,49.82H0V42.847A12.237,12.237,0,0,1,6.792,32.064a29.792,29.792,0,0,1,27.411,0,12.237,12.237,0,0,1,6.792,10.783ZM2.5,47.32H38.495V42.847a9.746,9.746,0,0,0-5.445-8.564,27.65,27.65,0,0,0-25.1,0A9.746,9.746,0,0,0,2.5,42.847Z" transform="translate(11.502 5.999)"/></svg>

package/dist/collection/components/icon/svg/player-radio-music-outline-color.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g transform="translate(-127.123 75.724)"><path d="M57.836,61.446H3.345A3.348,3.348,0,0,1,0,58.1V39.066a3.348,3.348,0,0,1,3.345-3.345H30.621v2.5H3.345a.846.846,0,0,0-.845.845V58.1a.846.846,0,0,0,.845.845H57.836a.846.846,0,0,0,.845-.845V39.066a.846.846,0,0,0-.845-.845H47.59v-2.5H57.836a3.348,3.348,0,0,1,3.345,3.345V58.1a3.348,3.348,0,0,1-3.345,3.345" transform="translate(128.532 -74.447)"/><path d="M183.463-41.087H151.705a1.249,1.249,0,0,1-1.25-1.25v-8a1.25,1.25,0,0,1,1.25-1.25h31.758a1.25,1.25,0,0,1,1.25,1.25v8A1.249,1.249,0,0,1,183.463-41.087Zm-30.508-2.5h29.258v-5.5H152.955Z" transform="translate(0 17.86)" fill="var(--accent-hover, rgb(236, 160, 0))"/><path d="M170.084-35.862h-5a1.25,1.25,0,0,1-1.25-1.25,1.25,1.25,0,0,1,1.25-1.25h5a1.25,1.25,0,0,1,1.25,1.25A1.25,1.25,0,0,1,170.084-35.862Z" transform="translate(0 17.86)"/><path d="M157.705-35.862h-5a1.249,1.249,0,0,1-1.25-1.25,1.25,1.25,0,0,1,1.25-1.25h5a1.25,1.25,0,0,1,1.25,1.25A1.25,1.25,0,0,1,157.705-35.862Z" transform="translate(0 17.86)"/><path d="M140.775-36.974a6.758,6.758,0,0,1-6.75-6.75,6.758,6.758,0,0,1,6.75-6.75,6.758,6.758,0,0,1,6.75,6.75A6.758,6.758,0,0,1,140.775-36.974Zm0-11a4.255,4.255,0,0,0-4.25,4.25,4.255,4.255,0,0,0,4.25,4.25,4.255,4.255,0,0,0,4.25-4.25A4.255,4.255,0,0,0,140.775-47.974Z" transform="translate(0 17.86)"/><path d="M182.463-35.862h-5a1.25,1.25,0,0,1-1.25-1.25,1.25,1.25,0,0,1,1.25-1.25h5a1.25,1.25,0,0,1,1.25,1.25A1.249,1.249,0,0,1,182.463-35.862Z" transform="translate(0 17.86)"/><path d="M46.587,15.944a5.228,5.228,0,0,1-2.353-2.672L41.84,7.809V29.758a4.889,4.889,0,0,0-2.51-.112c-2.518.536-4.49,2.676-4.49,4.872a3.327,3.327,0,0,0,1.245,2.636,4.148,4.148,0,0,0,2.635.87,5.4,5.4,0,0,0,1.13-.122c2.517-.535,4.49-2.675,4.49-4.872,0-.092-.022-.178-.029-.269l.029.013V17.435c.318.243.623.438.9.614,1.067.683,1.6,1.027,1.6,3.6h2.5c0-3.655-1.141-4.669-2.753-5.7M39.33,35.457a2.039,2.039,0,0,1-1.672-.246.838.838,0,0,1-.318-.693,3.037,3.037,0,0,1,2.51-2.427,2.945,2.945,0,0,1,.612-.067,1.687,1.687,0,0,1,1.059.313.84.84,0,0,1,.319.693,3.035,3.035,0,0,1-2.51,2.427" transform="translate(128.532 -74.447)"/><path d="M35.34,0,18.84,5.893V22.758a4.889,4.889,0,0,0-2.51-.112c-2.518.536-4.49,2.676-4.49,4.872a3.327,3.327,0,0,0,1.245,2.636,4.148,4.148,0,0,0,2.635.87,5.4,5.4,0,0,0,1.13-.122c2.517-.535,4.49-2.675,4.49-4.872,0-.093-.022-.179-.029-.271l.029.015V12.655l11.5-4.107v9.21a4.888,4.888,0,0,0-2.51-.112c-2.518.536-4.49,2.676-4.49,4.872a3.327,3.327,0,0,0,1.245,2.636,4.148,4.148,0,0,0,2.635.87,5.4,5.4,0,0,0,1.13-.122c2.517-.535,4.49-2.675,4.49-4.872,0-.093-.022-.179-.029-.27l.029.014ZM16.33,28.457a2.038,2.038,0,0,1-1.672-.246.838.838,0,0,1-.318-.693,3.037,3.037,0,0,1,2.51-2.427,2.945,2.945,0,0,1,.612-.067,1.687,1.687,0,0,1,1.059.313.84.84,0,0,1,.319.693,3.035,3.035,0,0,1-2.51,2.427M21.34,10V7.655l11.5-4.107V5.893Zm8.99,13.457a2.04,2.04,0,0,1-1.672-.246.838.838,0,0,1-.318-.693,3.037,3.037,0,0,1,2.51-2.427,2.945,2.945,0,0,1,.612-.067,1.687,1.687,0,0,1,1.059.313.84.84,0,0,1,.319.693,3.035,3.035,0,0,1-2.51,2.427" transform="translate(128.532 -74.447)"/></g></svg>

package/dist/collection/components/icon/svg/player-radio-music-outline.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g transform="translate(-127.123 75.724)"><path d="M57.836,61.446H3.345A3.348,3.348,0,0,1,0,58.1V39.066a3.348,3.348,0,0,1,3.345-3.345H30.621v2.5H3.345a.846.846,0,0,0-.845.845V58.1a.846.846,0,0,0,.845.845H57.836a.846.846,0,0,0,.845-.845V39.066a.846.846,0,0,0-.845-.845H47.59v-2.5H57.836a3.348,3.348,0,0,1,3.345,3.345V58.1a3.348,3.348,0,0,1-3.345,3.345" transform="translate(128.532 -74.447)"/><path d="M183.463-41.087H151.705a1.249,1.249,0,0,1-1.25-1.25v-8a1.25,1.25,0,0,1,1.25-1.25h31.758a1.25,1.25,0,0,1,1.25,1.25v8A1.249,1.249,0,0,1,183.463-41.087Zm-30.508-2.5h29.258v-5.5H152.955Z" transform="translate(0 17.86)"/><path d="M170.084-35.862h-5a1.25,1.25,0,0,1-1.25-1.25,1.25,1.25,0,0,1,1.25-1.25h5a1.25,1.25,0,0,1,1.25,1.25A1.25,1.25,0,0,1,170.084-35.862Z" transform="translate(0 17.86)"/><path d="M157.705-35.862h-5a1.249,1.249,0,0,1-1.25-1.25,1.25,1.25,0,0,1,1.25-1.25h5a1.25,1.25,0,0,1,1.25,1.25A1.25,1.25,0,0,1,157.705-35.862Z" transform="translate(0 17.86)"/><path d="M140.775-36.974a6.758,6.758,0,0,1-6.75-6.75,6.758,6.758,0,0,1,6.75-6.75,6.758,6.758,0,0,1,6.75,6.75A6.758,6.758,0,0,1,140.775-36.974Zm0-11a4.255,4.255,0,0,0-4.25,4.25,4.255,4.255,0,0,0,4.25,4.25,4.255,4.255,0,0,0,4.25-4.25A4.255,4.255,0,0,0,140.775-47.974Z" transform="translate(0 17.86)"/><path d="M182.463-35.862h-5a1.25,1.25,0,0,1-1.25-1.25,1.25,1.25,0,0,1,1.25-1.25h5a1.25,1.25,0,0,1,1.25,1.25A1.249,1.249,0,0,1,182.463-35.862Z" transform="translate(0 17.86)"/><path d="M46.587,15.944a5.228,5.228,0,0,1-2.353-2.672L41.84,7.809V29.758a4.889,4.889,0,0,0-2.51-.112c-2.518.536-4.49,2.676-4.49,4.872a3.327,3.327,0,0,0,1.245,2.636,4.148,4.148,0,0,0,2.635.87,5.4,5.4,0,0,0,1.13-.122c2.517-.535,4.49-2.675,4.49-4.872,0-.092-.022-.178-.029-.269l.029.013V17.435c.318.243.623.438.9.614,1.067.683,1.6,1.027,1.6,3.6h2.5c0-3.655-1.141-4.669-2.753-5.7M39.33,35.457a2.039,2.039,0,0,1-1.672-.246.838.838,0,0,1-.318-.693,3.037,3.037,0,0,1,2.51-2.427,2.945,2.945,0,0,1,.612-.067,1.687,1.687,0,0,1,1.059.313.84.84,0,0,1,.319.693,3.035,3.035,0,0,1-2.51,2.427" transform="translate(128.532 -74.447)"/><path d="M35.34,0,18.84,5.893V22.758a4.889,4.889,0,0,0-2.51-.112c-2.518.536-4.49,2.676-4.49,4.872a3.327,3.327,0,0,0,1.245,2.636,4.148,4.148,0,0,0,2.635.87,5.4,5.4,0,0,0,1.13-.122c2.517-.535,4.49-2.675,4.49-4.872,0-.093-.022-.179-.029-.271l.029.015V12.655l11.5-4.107v9.21a4.888,4.888,0,0,0-2.51-.112c-2.518.536-4.49,2.676-4.49,4.872a3.327,3.327,0,0,0,1.245,2.636,4.148,4.148,0,0,0,2.635.87,5.4,5.4,0,0,0,1.13-.122c2.517-.535,4.49-2.675,4.49-4.872,0-.093-.022-.179-.029-.27l.029.014ZM16.33,28.457a2.038,2.038,0,0,1-1.672-.246.838.838,0,0,1-.318-.693,3.037,3.037,0,0,1,2.51-2.427,2.945,2.945,0,0,1,.612-.067,1.687,1.687,0,0,1,1.059.313.84.84,0,0,1,.319.693,3.035,3.035,0,0,1-2.51,2.427M21.34,10V7.655l11.5-4.107V5.893Zm8.99,13.457a2.04,2.04,0,0,1-1.672-.246.838.838,0,0,1-.318-.693,3.037,3.037,0,0,1,2.51-2.427,2.945,2.945,0,0,1,.612-.067,1.687,1.687,0,0,1,1.059.313.84.84,0,0,1,.319.693,3.035,3.035,0,0,1-2.51,2.427" transform="translate(128.532 -74.447)"/></g></svg>

package/dist/collection/components/icon/svg/station-electric-outline-color.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g transform="translate(3 5.272)"><path d="M21.8,22.731H7a1.25,1.25,0,0,1-1.25-1.25V7.327A1.25,1.25,0,0,1,7,6.077H21.8a1.25,1.25,0,0,1,1.25,1.25V21.481a1.25,1.25,0,0,1-1.25,1.25m-13.552-2.5h12.3V8.577H8.252Z" fill="var(--accent-hover, rgb(236, 160, 0))"/><path d="M12.979,44.162l-2.04-1.444,3.725-5.262H9.308l6.753-9.536,2.04,1.445-3.959,5.591H19.5Z"/><path d="M28.808,53.455H0V6.1A6.106,6.106,0,0,1,6.1,0H22.708a6.107,6.107,0,0,1,6.1,6.1ZM2.5,50.955H26.307V6.1a3.6,3.6,0,0,0-3.6-3.6H6.1A3.6,3.6,0,0,0,2.5,6.1Z"/><path d="M37.813,22.235a3.629,3.629,0,1,1,0-7.258h5.823a6.517,6.517,0,0,1,0-2.5H37.813a6.129,6.129,0,1,0,0,12.258,6.413,6.413,0,0,1,6.4,6.406v16.04a3.775,3.775,0,0,1-4.149,3.756,3.924,3.924,0,0,1-3.4-3.973V36.394a9.12,9.12,0,0,0-7.862-9.017V29.9a6.62,6.62,0,0,1,5.362,6.491v10.57a6.44,6.44,0,0,0,5.664,6.461c.2.019.4.029.6.029a6.272,6.272,0,0,0,6.287-6.273V31.141a8.916,8.916,0,0,0-8.9-8.906"/><path d="M58.1,15.97H53.61V11.482H58.1a1.25,1.25,0,0,0,0-2.5H53.61v-2H50.259a6.744,6.744,0,0,0,0,13.488H53.61v-2H58.1a1.25,1.25,0,1,0,0-2.5m-6.992,2h-.851a4.244,4.244,0,0,1,0-8.488h.851Z"/></g></svg>

package/dist/collection/components/icon/svg/station-electric-outline.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><g transform="translate(3 5.272)"><path d="M21.8,22.731H7a1.25,1.25,0,0,1-1.25-1.25V7.327A1.25,1.25,0,0,1,7,6.077H21.8a1.25,1.25,0,0,1,1.25,1.25V21.481a1.25,1.25,0,0,1-1.25,1.25m-13.552-2.5h12.3V8.577H8.252Z"/><path d="M12.979,44.162l-2.04-1.444,3.725-5.262H9.308l6.753-9.536,2.04,1.445-3.959,5.591H19.5Z"/><path d="M28.808,53.455H0V6.1A6.106,6.106,0,0,1,6.1,0H22.708a6.107,6.107,0,0,1,6.1,6.1ZM2.5,50.955H26.307V6.1a3.6,3.6,0,0,0-3.6-3.6H6.1A3.6,3.6,0,0,0,2.5,6.1Z"/><path d="M37.813,22.235a3.629,3.629,0,1,1,0-7.258h5.823a6.517,6.517,0,0,1,0-2.5H37.813a6.129,6.129,0,1,0,0,12.258,6.413,6.413,0,0,1,6.4,6.406v16.04a3.775,3.775,0,0,1-4.149,3.756,3.924,3.924,0,0,1-3.4-3.973V36.394a9.12,9.12,0,0,0-7.862-9.017V29.9a6.62,6.62,0,0,1,5.362,6.491v10.57a6.44,6.44,0,0,0,5.664,6.461c.2.019.4.029.6.029a6.272,6.272,0,0,0,6.287-6.273V31.141a8.916,8.916,0,0,0-8.9-8.906"/><path d="M58.1,15.97H53.61V11.482H58.1a1.25,1.25,0,0,0,0-2.5H53.61v-2H50.259a6.744,6.744,0,0,0,0,13.488H53.61v-2H58.1a1.25,1.25,0,1,0,0-2.5m-6.992,2h-.851a4.244,4.244,0,0,1,0-8.488h.851Z"/></g></svg>

package/dist/collection/components/img/img.css

@@ -31,7 +31,7 @@
  -------------------- */
 
 :host(.placeholder) {
-  background: var(--background);
+  background: var(--road-grey-200);
 }
 
 :host(.placeholder) img {