@roadtrip/components 3.11.0 → 3.11.1

package/dist/roadtrip/{p-1974c993.entry.js → p-bf8336f1.entry.js}

@@ -1,2 +1,2 @@
-import{r,h as a,H as o}from"./p-abdbf6ac.js";const e=":host{position:relative;display:flex;align-items:flex-start;padding:0.5rem 1rem 0.5rem 0.5rem;font-family:var(--road-font, sans-serif);font-size:var(--road-body-medium);line-height:1.25;color:var(--road-on-surface);border:1px solid transparent;border-radius:0.25rem}.alert-icon{flex-shrink:0;width:2rem;height:2rem;margin-right:0.5rem}.alert-title{padding:0.375rem 0 0;font-weight:700}.alert-link{display:block;margin:0;color:var(--road-on-surface);text-decoration:underline}.alert-description{padding:0.375rem 0;margin:0}:host(.alert-info){color:var(--road-on-info-surface);background:var(--road-info-surface);border-color:var(--road-info-outline)}:host(.alert-info) ::slotted(road-icon){fill:var(--road-info-default)}:host(.alert-info) ::slotted(road-button){display:block;margin:0.375rem 0 0;color:var(--road-on-info-surface-inverse);background:var(--road-info-surface-inverse);fill:var(--road-on-info-surface-inverse)}:host(.alert-success){color:var(--road-on-success-surface);background:var(--road-success-surface);border-color:var(--road-success-outline)}:host(.alert-success) ::slotted(road-icon){fill:var(--road-success-icon)}:host(.alert-success) ::slotted(road-button){display:block;margin:0.375rem 0 0;color:var(--road-on-success-surface-inverse);background:var(--road-success-surface-inverse);fill:var(--road-on-success-surface-inverse)}:host(.alert-warning){color:var(--road-on-warning-surface);background:var(--road-warning-surface);border-color:var(--road-warning-outline)}:host(.alert-warning) ::slotted(road-icon){fill:var(--road-warning-icon)}:host(.alert-warning) ::slotted(road-button){display:block;margin:0.375rem 0 0;color:var(--road-on-warning-surface-inverse);background:var(--road-warning-surface-inverse);fill:var(--road-on-warning-surface-inverse)}:host(.alert-danger){color:var(--road-on-danger-surface);background:var(--road-danger-surface);border-color:var(--road-danger-outline)}:host(.alert-danger) ::slotted(road-icon){fill:var(--road-danger-icon)}:host(.alert-danger) ::slotted(road-button){display:block;margin:0.375rem 0 0;color:var(--road-on-danger-surface-inverse);background:var(--road-danger-surface-inverse);fill:var(--road-on-danger-surface-inverse)}";const n=class{constructor(a){r(this,a);this.color="info";this.label=undefined;this.button=undefined;this.link=undefined;this.url=undefined}render(){const r=this.color!==undefined?`alert-${this.color}`:"";return a(o,{class:r,role:"alert"},a("div",{class:"alert-icon"},a("slot",{name:"icon"})),a("div",null,this.label&&a("span",{class:"alert-title d-block"},this.label),a("p",{class:"alert-description"},a("slot",null),this.link&&a("a",{href:this.url,class:"alert-link link link-default"},this.link))))}};n.style=e;export{n as road_alert};
-//# sourceMappingURL=p-1974c993.entry.js.map
+import{r,h as a,H as o}from"./p-6475c1af.js";const e=":host{position:relative;display:flex;align-items:flex-start;padding:0.5rem 1rem 0.5rem 0.5rem;font-family:var(--road-font, sans-serif);font-size:var(--road-body-medium);line-height:1.25;color:var(--road-on-surface);border:1px solid transparent;border-radius:0.25rem}.alert-icon{flex-shrink:0;width:2rem;height:2rem;margin-right:0.5rem}.alert-title{padding:0.375rem 0 0;font-weight:700}.alert-link{display:block;margin:0;color:var(--road-on-surface);text-decoration:underline}.alert-description{padding:0.375rem 0;margin:0}:host(.alert-info){color:var(--road-on-info-surface);background:var(--road-info-surface);border-color:var(--road-info-outline)}:host(.alert-info) ::slotted(road-icon){fill:var(--road-info-default)}:host(.alert-info) ::slotted(road-button){display:block;margin:0.375rem 0 0;color:var(--road-on-info-surface-inverse);background:var(--road-info-surface-inverse);fill:var(--road-on-info-surface-inverse)}:host(.alert-success){color:var(--road-on-success-surface);background:var(--road-success-surface);border-color:var(--road-success-outline)}:host(.alert-success) ::slotted(road-icon){fill:var(--road-success-icon)}:host(.alert-success) ::slotted(road-button){display:block;margin:0.375rem 0 0;color:var(--road-on-success-surface-inverse);background:var(--road-success-surface-inverse);fill:var(--road-on-success-surface-inverse)}:host(.alert-warning){color:var(--road-on-warning-surface);background:var(--road-warning-surface);border-color:var(--road-warning-outline)}:host(.alert-warning) ::slotted(road-icon){fill:var(--road-warning-icon)}:host(.alert-warning) ::slotted(road-button){display:block;margin:0.375rem 0 0;color:var(--road-on-warning-surface-inverse);background:var(--road-warning-surface-inverse);fill:var(--road-on-warning-surface-inverse)}:host(.alert-danger){color:var(--road-on-danger-surface);background:var(--road-danger-surface);border-color:var(--road-danger-outline)}:host(.alert-danger) ::slotted(road-icon){fill:var(--road-danger-icon)}:host(.alert-danger) ::slotted(road-button){display:block;margin:0.375rem 0 0;color:var(--road-on-danger-surface-inverse);background:var(--road-danger-surface-inverse);fill:var(--road-on-danger-surface-inverse)}";const n=class{constructor(a){r(this,a);this.color="info";this.label=undefined;this.button=undefined;this.link=undefined;this.url=undefined}render(){const r=this.color!==undefined?`alert-${this.color}`:"";return a(o,{class:r,role:"alert"},a("div",{class:"alert-icon"},a("slot",{name:"icon"})),a("div",null,this.label&&a("span",{class:"alert-title d-block"},this.label),a("p",{class:"alert-description"},a("slot",null),this.link&&a("a",{href:this.url,class:"alert-link link link-default"},this.link))))}};n.style=e;export{n as road_alert};
+//# sourceMappingURL=p-bf8336f1.entry.js.map

package/dist/roadtrip/p-bf8336f1.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["alertCss","Alert","render","colorClass","this","color","undefined","h","Host","class","role","name","label","link","href","url"],"sources":["src/components/alert/alert.css?tag=road-alert&encapsulation=shadow","src/components/alert/alert.tsx"],"sourcesContent":["/*\n * Alert\n *\n * Index\n * - Alert\n * - Icon\n * - Description\n * - Feedback\n */\n\n\n/* ALERT\n -------------------- */\n\n:host {\n  position: relative;\n  display: flex;\n  align-items: flex-start;\n  padding: 0.5rem 1rem 0.5rem 0.5rem;\n  font-family: var(--road-font, sans-serif);\n  font-size: var(--road-body-medium);\n  line-height: 1.25;\n  color: var(--road-on-surface);\n  border: 1px solid transparent;\n  border-radius: 0.25rem;\n}\n\n/* ICON\n -------------------- */\n\n.alert-icon {\n  flex-shrink: 0;\n  width: 2rem;\n  height: 2rem;\n  margin-right: 0.5rem;\n}\n\n/* ALERT TITLE\n -------------------- */\n\n.alert-title {\n  padding: 0.375rem 0 0;\n  font-weight: 700;\n}\n\n/* ALERT LINK\n -------------------- */\n\n.alert-link {\n  display: block;\n  margin: 0;\n  color: var(--road-on-surface);\n  text-decoration: underline;\n}\n\n/* DESCRIPTION\n -------------------- */\n\n.alert-description {\n  padding: 0.375rem 0;\n  margin: 0;\n}\n\n/* FEEDBACK\n -------------------- */\n\n/**\n * Info\n */\n\n:host(.alert-info) {\n  color: var(--road-on-info-surface);\n  background: var(--road-info-surface);\n  border-color: var(--road-info-outline);\n}\n\n:host(.alert-info) ::slotted(road-icon) {\n  fill: var(--road-info-default);\n}\n\n:host(.alert-info) ::slotted(road-button) {\n  display: block;\n  margin: 0.375rem 0 0;\n  color: var(--road-on-info-surface-inverse);\n  background: var(--road-info-surface-inverse);\n  fill: var(--road-on-info-surface-inverse);\n}\n\n/**\n * Success\n */\n\n:host(.alert-success) {\n  color: var(--road-on-success-surface);\n  background: var(--road-success-surface);\n  border-color: var(--road-success-outline);\n}\n\n:host(.alert-success) ::slotted(road-icon) {\n  fill: var(--road-success-icon);\n}\n\n:host(.alert-success) ::slotted(road-button) {\n  display: block;\n  margin: 0.375rem 0 0;\n  color: var(--road-on-success-surface-inverse);\n  background: var(--road-success-surface-inverse);\n  fill: var(--road-on-success-surface-inverse);\n}\n\n/**\n * Warning\n */\n\n:host(.alert-warning) {\n  color: var(--road-on-warning-surface);\n  background: var(--road-warning-surface);\n  border-color: var(--road-warning-outline);\n}\n\n:host(.alert-warning) ::slotted(road-icon) {\n  fill: var(--road-warning-icon);\n}\n\n:host(.alert-warning) ::slotted(road-button) {\n  display: block;\n  margin: 0.375rem 0 0;\n  color: var(--road-on-warning-surface-inverse);\n  background: var(--road-warning-surface-inverse);\n  fill: var(--road-on-warning-surface-inverse);\n}\n\n/**\n * Danger\n */\n\n:host(.alert-danger) {\n  color: var(--road-on-danger-surface);\n  background: var(--road-danger-surface);\n  border-color: var(--road-danger-outline);\n}\n\n:host(.alert-danger) ::slotted(road-icon) {\n  fill: var(--road-danger-icon);\n}\n\n:host(.alert-danger) ::slotted(road-button) {\n  display: block;\n  margin: 0.375rem 0 0;\n  color: var(--road-on-danger-surface-inverse);\n  background: var(--road-danger-surface-inverse);\n  fill: var(--road-on-danger-surface-inverse);\n}\n","import { Component, Host, Prop, h } from '@stencil/core';\n\nimport { FeedbackColors } from '../../interface';\n\n/**\n * @slot icon - Icon of the alert, it should be a road-icon element.\n * @slot  - Message of the alert.\n */\n\n@Component({\n  tag: 'road-alert',\n  styleUrl: 'alert.css',\n  shadow: true,\n})\nexport class Alert {\n\n  /**\n   * Set the color of alert. e.g. info, success, warning, danger\n   */\n  @Prop() color: FeedbackColors = 'info';\n\n  /**\n   * Title display in the alert\n   */\n   @Prop() label?: string;\n\n   /**\n   * Button display in the alert\n   * `<road-button size=\"sm\">Label</road-button>`\n   */\n   @Prop() button?: string;\n\n   /**\n   * Text Link display in the alert\n   */\n   @Prop() link?: string;\n\n   /**\n    * url display in the link\n    */\n   @Prop() url?: string;\n\n   render() {\n     const colorClass = this.color !== undefined ? `alert-${this.color}` : '';\n\n     return (\n       <Host class={colorClass} role=\"alert\">\n         <div class=\"alert-icon\">\n           <slot name=\"icon\"/>\n         </div>\n         <div>\n           {this.label && <span class=\"alert-title d-block\">{this.label}</span>}\n           <p class=\"alert-description\">\n             <slot/>\n             {this.link && <a href={this.url} class=\"alert-link link link-default\">{this.link}</a>}\n           </p>\n         </div>\n       </Host>\n     );\n   }\n}"],"mappings":"6CAAA,MAAMA,EAAW,opE,MCcJC,EAAK,M,oCAKgB,O,kFAuB/B,MAAAC,GACE,MAAMC,EAAaC,KAAKC,QAAUC,UAAY,SAASF,KAAKC,QAAU,GAEtE,OACEE,EAACC,EAAI,CAACC,MAAON,EAAYO,KAAK,SAC5BH,EAAA,OAAKE,MAAM,cACTF,EAAA,QAAMI,KAAK,UAEbJ,EAAA,WACGH,KAAKQ,OAASL,EAAA,QAAME,MAAM,uBAAuBL,KAAKQ,OACvDL,EAAA,KAAGE,MAAM,qBACPF,EAAA,aACCH,KAAKS,MAAQN,EAAA,KAAGO,KAAMV,KAAKW,IAAKN,MAAM,gCAAgCL,KAAKS,Q"}

package/dist/roadtrip/{p-9036a1e6.entry.js → p-c29ce7c5.entry.js}

@@ -1,2 +1,2 @@
-import{r,e as a,h as s,f as t}from"./p-abdbf6ac.js";const i=":host{display:block}road-drawer{--background:var(--road-surface-inverse)}.duration-values{flex-wrap:nowrap;width:100%;padding:2.625rem 0 2.625rem 3rem;scroll-snap-type:x proximity;overflow:scroll}.duration-values>road-col:first-child{scroll-snap-align:center}.duration-values>road-col:not(:first-child){scroll-snap-align:start}road-card{--margin-bottom:0}road-card::part(native){padding:1rem}";const o=class{constructor(s){r(this,s);this.roadselected=a(this,"roadselected",7);this.isOpen=false;this.header="duration";this.min=15;this.max=300;this.step=15}handleClick(r){this.roadselected.emit({value:r.detail.value.toString(),label:r.detail.label});this.close()}async open(){this.isOpen=true}async close(){this.isOpen=false}render(){return s("road-drawer",{"is-open":this.isOpen,position:"bottom","drawer-title":this.header},s("road-grid",null,s("road-row",{class:"duration-values"},Array(Math.floor((this.max-this.min)/this.step)+1).fill(this.min).map(((r,a)=>r+a*this.step)).map((r=>s("road-col",{class:"col-3 col-md-2"},s("road-card",{button:true,value:r},s("road-label",null,Math.floor(r/60).toLocaleString("en-GB",{minimumIntegerDigits:2,useGrouping:false}),":",(r%60).toLocaleString("en-GB",{minimumIntegerDigits:2,useGrouping:false})))))))))}get el(){return t(this)}};o.style=i;export{o as road_duration};
-//# sourceMappingURL=p-9036a1e6.entry.js.map
+import{r,c as a,h as s,d as t}from"./p-6475c1af.js";const i=":host{display:block}road-drawer{--background:var(--road-surface-inverse)}.duration-values{flex-wrap:nowrap;width:100%;padding:2.625rem 0 2.625rem 3rem;scroll-snap-type:x proximity;overflow:scroll}.duration-values>road-col:first-child{scroll-snap-align:center}.duration-values>road-col:not(:first-child){scroll-snap-align:start}road-card{--margin-bottom:0}road-card::part(native){padding:1rem}";const o=class{constructor(s){r(this,s);this.roadselected=a(this,"roadselected",7);this.isOpen=false;this.header="duration";this.min=15;this.max=300;this.step=15}handleClick(r){this.roadselected.emit({value:r.detail.value.toString(),label:r.detail.label});this.close()}async open(){this.isOpen=true}async close(){this.isOpen=false}render(){return s("road-drawer",{"is-open":this.isOpen,position:"bottom","drawer-title":this.header},s("road-grid",null,s("road-row",{class:"duration-values"},Array(Math.floor((this.max-this.min)/this.step)+1).fill(this.min).map(((r,a)=>r+a*this.step)).map((r=>s("road-col",{class:"col-3 col-md-2"},s("road-card",{button:true,value:r},s("road-label",null,Math.floor(r/60).toLocaleString("en-GB",{minimumIntegerDigits:2,useGrouping:false}),":",(r%60).toLocaleString("en-GB",{minimumIntegerDigits:2,useGrouping:false})))))))))}get el(){return t(this)}};o.style=i;export{o as road_duration};
+//# sourceMappingURL=p-c29ce7c5.entry.js.map

package/dist/roadtrip/p-c29ce7c5.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["durationCss","Duration","handleClick","event","this","roadselected","emit","value","detail","toString","label","close","open","isOpen","render","h","position","header","class","Array","Math","floor","max","min","step","fill","map","item","index","button","toLocaleString","minimumIntegerDigits","useGrouping"],"sources":["src/components/duration/duration.css?tag=road-duration&encapsulation=shadow","src/components/duration/duration.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\nroad-drawer {\n  --background: var(--road-surface-inverse);\n}\n\n.duration-values {\n  flex-wrap: nowrap;\n  width: 100%;\n  padding: 2.625rem 0 2.625rem 3rem;\n  scroll-snap-type: x proximity;\n  overflow: scroll;\n}\n\n.duration-values > road-col:first-child {\n  scroll-snap-align: center;\n}\n\n.duration-values > road-col:not(:first-child) {\n  scroll-snap-align: start;\n}\n\nroad-card {\n  --margin-bottom: 0;\n}\n\nroad-card::part(native) {\n  padding: 1rem;\n}\n","import { Component, Element, Event, EventEmitter, h, Listen, Method, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'road-duration',\n  styleUrl: 'duration.css',\n  shadow: true,\n})\nexport class Duration {\n\n  /**\n   * Current reference of the duration element\n   */\n   @Element() el!: HTMLRoadDurationElement;\n\n  /**\n   * Set isOpen property to true to open the duration widget\n   */\n  @Prop({ mutable: true }) isOpen: boolean = false;\n\n  /**\n   * title of the widget\n   */\n  @Prop() header: string = 'duration';\n\n  /**\n   * The minimum value, which must not be greater than its maximum (max attribute) value in minutes.\n   */\n  @Prop() min: number = 15;\n\n  /**\n   * The maximum value, which must not be less than its minimum (min attribute) value in minutes.\n   */\n  @Prop() max: number = 300;\n\n  /**\n   * Works with the min and max attributes to limit the increments at which a value can be set in minutes.\n   */\n  @Prop() step: number = 15;\n\n  @Listen('roadcardclick')\n  handleClick(event: CustomEvent) {\n    this.roadselected.emit({\n      value: event.detail.value.toString(),\n      label: event.detail.label,\n    });\n    this.close();\n  }\n\n  /**\n   * Emitt the value and label of the selected option.\n   */\n  @Event() roadselected!: EventEmitter<{\n    value: string | undefined | null,\n    label: string\n  }>;\n\n  /**\n   * Open the widget\n   */\n  @Method()\n  async open() {\n    this.isOpen = true;\n  }\n\n  /**\n   * Close the widget\n   */\n  @Method()\n  async close() {\n    this.isOpen = false;\n  }\n\n  render() {\n    return (\n      <road-drawer is-open={this.isOpen} position=\"bottom\" drawer-title={this.header}>\n        <road-grid>\n          <road-row class=\"duration-values\">\n            {Array(Math.floor((this.max - this.min) / this.step) + 1).fill(this.min).map(((item, index) => (item + index * this.step))).map(item =>\n              <road-col class=\"col-3 col-md-2\">\n                <road-card button value={item}>\n                  <road-label>\n                    {Math.floor(item / 60).toLocaleString(\"en-GB\", {minimumIntegerDigits: 2, useGrouping: false})}:{(item % 60).toLocaleString(\"en-GB\", {minimumIntegerDigits: 2, useGrouping: false})}\n                  </road-label>\n                </road-card>\n              </road-col>\n            )}\n          </road-row>\n        </road-grid>\n      </road-drawer>\n    );\n  }\n\n}\n"],"mappings":"oDAAA,MAAMA,EAAc,2Y,MCOPC,EAAQ,M,gFAUwB,M,YAKlB,W,SAKH,G,SAKA,I,UAKC,E,CAGvB,WAAAC,CAAYC,GACVC,KAAKC,aAAaC,KAAK,CACrBC,MAAOJ,EAAMK,OAAOD,MAAME,WAC1BC,MAAOP,EAAMK,OAAOE,QAEtBN,KAAKO,O,CAeP,UAAMC,GACJR,KAAKS,OAAS,I,CAOhB,WAAMF,GACJP,KAAKS,OAAS,K,CAGhB,MAAAC,GACE,OACEC,EAAA,yBAAsBX,KAAKS,OAAQG,SAAS,SAAQ,eAAeZ,KAAKa,QACtEF,EAAA,iBACEA,EAAA,YAAUG,MAAM,mBACbC,MAAMC,KAAKC,OAAOjB,KAAKkB,IAAMlB,KAAKmB,KAAOnB,KAAKoB,MAAQ,GAAGC,KAAKrB,KAAKmB,KAAKG,KAAG,CAAGC,EAAMC,IAAWD,EAAOC,EAAQxB,KAAKoB,OAAQE,KAAIC,GAC9HZ,EAAA,YAAUG,MAAM,kBACdH,EAAA,aAAWc,OAAM,KAACtB,MAAOoB,GACvBZ,EAAA,kBACGK,KAAKC,MAAMM,EAAO,IAAIG,eAAe,QAAS,CAACC,qBAAsB,EAAGC,YAAa,QAAO,KAAIL,EAAO,IAAIG,eAAe,QAAS,CAACC,qBAAsB,EAAGC,YAAa,e"}

package/dist/roadtrip/p-ca775aae.entry.js

@@ -0,0 +1,2 @@
+import{r,c as o,h as a,H as i,d}from"./p-6475c1af.js";import"./p-1ccae339.js";const e='.sc-road-radio-h{position:relative;display:block;margin-bottom:1.5rem;font-family:var(--road-font, sans-serif);font-size:var(--road-body-medium);line-height:1.5;color:var(--road-on-surface)}.form-radio-inline.sc-road-radio-h{display:inline-flex;flex-wrap:wrap;align-items:center;margin-right:1.5rem;margin-bottom:0}.form-radio-input.sc-road-radio{position:absolute;z-index:-1;width:20px;height:20px;opacity:0}.form-radio-input.sc-road-radio:disabled{z-index:1;width:100%;cursor:not-allowed}.form-radio-label.sc-road-radio{position:relative;display:inline-flex;align-items:flex-start;margin:0;cursor:pointer;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.form-radio-label.sc-road-radio::before{box-sizing:border-box;display:block;flex-shrink:0;width:1.25rem;height:1.25rem;margin:0.1rem 0.75rem 0 0;content:"";background:var(--road-surface);border:1px solid var(--road-input-outline);border-radius:50%;transition:border-color 0.2s ease-in-out}.form-radio-label.sc-road-radio::after{position:absolute;top:0.285rem;left:0.1875rem;box-sizing:border-box;display:block;width:0.875rem;height:0.875rem;content:"";background:var(--road-grey-60);border:none;border-radius:50%;transition:background 0.2s ease-in-out, transform 0.2s ease-in-out;transform:scale(0);transform-origin:50% 50%}@media (hover: hover){.form-radio-input.sc-road-radio~.form-radio-label.sc-road-radio:hover::before{border-color:var(--road-input-surface)}.form-radio-input.sc-road-radio:checked~.form-radio-label.sc-road-radio:hover::after{background:var(--road-input-surface-variant)}}.form-radio-input.sc-road-radio:checked~.form-radio-label.sc-road-radio::after{background:var(--road-input-surface);opacity:1;transform:scale(1)}.form-radio-input.focus-visible.sc-road-radio~.form-radio-label.sc-road-radio::before{box-shadow:0 0 0 0.125rem var(--road-grey-100-new), 0 0 0 0.1875rem var(--road-input-outline-variant)}.form-radio-input.focus-visible.sc-road-radio:checked~.form-radio-label.sc-road-radio::after{background:var(--road-primary-700)}.form-radio-input.sc-road-radio:disabled~.form-radio-label.sc-road-radio,.form-radio-input[readonly].sc-road-radio~.form-radio-label.sc-road-radio{cursor:not-allowed}.form-radio-input.sc-road-radio:disabled~.form-radio-label.sc-road-radio::before,.form-radio-input[readonly].sc-road-radio~.form-radio-label.sc-road-radio::before{background:var(--road-on-surface-disabled);border:none}.form-radio-input.sc-road-radio:disabled~.form-radio-label.sc-road-radio::after,.form-radio-input[readonly].sc-road-radio~.form-radio-label.sc-road-radio::after{background:var(--road-grey-60)}.form-radio-input.is-invalid.sc-road-radio~.form-radio-label.sc-road-radio::before{border-color:var(--road-danger-outline)}.form-radio-inverse.sc-road-radio{display:flex;flex-direction:row-reverse;justify-content:space-between}.form-radio-inverse.sc-road-radio::before{margin:0 0 0 1rem}.form-radio-inverse.sc-road-radio::after{right:0.1875rem;left:auto}';const s=class{constructor(a){r(this,a);this.roadfocus=o(this,"roadfocus",7);this.roadFocus=o(this,"roadFocus",7);this.roadblur=o(this,"roadblur",7);this.roadBlur=o(this,"roadBlur",7);this.radioGroup=null;this.updateState=()=>{if(this.radioGroup){this.checked=this.radioGroup.value===this.value}};this.onFocus=()=>{this.roadfocus.emit();this.roadFocus.emit()};this.onBlur=()=>{this.roadblur.emit();this.roadBlur.emit()};this.radioId=`road-radio-${t++}`;this.checked=false;this.name=this.radioId;this.required=false;this.disabled=false;this.value=undefined;this.label=`${this.radioId}-label`;this.inverse=false;this.error=undefined;this.helper=undefined;this.inline=true}connectedCallback(){if(this.value===undefined){this.value=this.radioId}const r=this.radioGroup=this.el.closest("road-radio-group");if(r){this.updateState()}}disconnectedCallback(){const r=this.radioGroup;if(r){this.radioGroup=null}}onRoadChangedChanged(){this.updateState()}render(){const r=this.radioId+"-label";const o=this.inverse&&"form-radio-inverse";const d=this.error?"is-invalid":"";const e=this.inline?"form-radio-inline":"";return a(i,{class:`form-radio ${e}`},a("input",{class:`form-radio-input ${d}`,type:"radio",id:this.radioId,name:this.name,required:this.required,disabled:this.disabled,"aria-disabled":this.disabled?"true":null,checked:this.checked,"aria-checked":`${this.checked}`,"aria-labelledby":r,value:this.value,onFocus:this.onFocus,onBlur:this.onBlur}),a("label",{class:`form-radio-label ${o}`,id:r,htmlFor:this.radioId},this.label))}get el(){return d(this)}};let t=0;s.style=e;export{s as road_radio};
+//# sourceMappingURL=p-ca775aae.entry.js.map

package/dist/roadtrip/p-ca775aae.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["radioCss","Radio","this","radioGroup","updateState","checked","value","onFocus","roadfocus","emit","roadFocus","onBlur","roadblur","roadBlur","radioIds","radioId","connectedCallback","undefined","el","closest","disconnectedCallback","onRoadChangedChanged","render","labelId","inverseClass","inverse","isInvalidClass","error","inlineClass","inline","h","Host","class","type","id","name","required","disabled","htmlFor","label"],"sources":["src/components/radio/radio.css?tag=road-radio&encapsulation=scoped","src/components/radio/radio.tsx"],"sourcesContent":["/*\n * Radio\n *\n * For accessibility, we provide a style for focus only on Tab,\n * for that add the javascript polyfill for focus-visible\n * (https://github.com/WICG/focus-visible).\n *\n * Index\n * - Radio\n * - Label\n * - Error\n * - Position\n */\n\n/* RADIO\n -------------------- */\n\n:host {\n  position: relative;\n  display: block;\n  margin-bottom: 1.5rem;\n  font-family: var(--road-font, sans-serif);\n  font-size: var(--road-body-medium);\n  line-height: 1.5;\n  color: var(--road-on-surface);\n}\n\n/**\n * Inline radio\n */\n\n:host(.form-radio-inline) {\n  display: inline-flex;\n  flex-wrap: wrap;\n  align-items: center;\n  margin-right: 1.5rem;\n  margin-bottom: 0;\n}\n\n/**\n * Hide input\n */\n\n.form-radio-input {\n  position: absolute;\n  z-index: -1;\n  width: 20px;\n  height: 20px;\n  opacity: 0;\n}\n\n.form-radio-input:disabled {\n  z-index: 1;\n  width: 100%;\n  cursor: not-allowed;\n}\n\n/* LABEL\n -------------------- */\n\n.form-radio-label {\n  position: relative;\n  display: inline-flex;\n  align-items: flex-start;\n  margin: 0;\n  cursor: pointer;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n\n.form-radio-label::before {\n  box-sizing: border-box;\n  display: block;\n  flex-shrink: 0;\n  width: 1.25rem;\n  height: 1.25rem;\n  margin: 0.1rem 0.75rem 0 0;\n  content: \"\";\n  background: var(--road-surface);\n  border: 1px solid var(--road-input-outline);\n  border-radius: 50%;\n  transition: border-color 0.2s ease-in-out;\n}\n\n.form-radio-label::after {\n  position: absolute;\n  top: 0.285rem;\n  left: 0.1875rem;\n  box-sizing: border-box;\n  display: block;\n  width: 0.875rem;\n  height: 0.875rem;\n  content: \"\";\n  background: var(--road-grey-60);\n  border: none;\n  border-radius: 50%;\n  transition: background 0.2s ease-in-out, transform 0.2s ease-in-out;\n  transform: scale(0);\n  transform-origin: 50% 50%;\n}\n\n/**\n * Hover state\n */\n\n@media (hover: hover) {\n\n  .form-radio-input ~ .form-radio-label:hover::before {\n    border-color: var(--road-input-surface);\n  }\n\n  .form-radio-input:checked ~ .form-radio-label:hover::after {\n    background: var(--road-input-surface-variant);\n  }\n}\n\n/**\n * Checked state\n */\n\n.form-radio-input:checked ~ .form-radio-label::after {\n  background: var(--road-input-surface);\n  opacity: 1;\n  transform: scale(1);\n}\n\n/**\n * Focus on Tab\n */\n\n.form-radio-input.focus-visible ~ .form-radio-label::before {\n  box-shadow: 0 0 0 0.125rem var(--road-grey-100-new), 0 0 0 0.1875rem var(--road-input-outline-variant);\n}\n\n.form-radio-input.focus-visible:checked ~ .form-radio-label::after {\n  background: var(--road-primary-700);\n}\n\n/**\n * Disabled state\n */\n\n.form-radio-input:disabled ~ .form-radio-label,\n.form-radio-input[readonly] ~ .form-radio-label {\n  cursor: not-allowed;\n}\n\n.form-radio-input:disabled ~ .form-radio-label::before,\n.form-radio-input[readonly] ~ .form-radio-label::before {\n  background: var(--road-on-surface-disabled);\n  border: none;\n}\n\n.form-radio-input:disabled ~ .form-radio-label::after,\n.form-radio-input[readonly] ~ .form-radio-label::after {\n  background: var(--road-grey-60);\n}\n\n/* ERROR\n -------------------- */\n\n.form-radio-input.is-invalid ~ .form-radio-label::before {\n  border-color: var(--road-danger-outline);\n}\n\n/* POSITION\n -------------------- */\n\n.form-radio-inverse {\n  display: flex;\n  flex-direction: row-reverse;\n  justify-content: space-between;\n}\n\n.form-radio-inverse::before {\n  margin: 0 0 0 1rem;\n}\n\n.form-radio-inverse::after {\n  right: 0.1875rem;\n  left: auto;\n}\n","import { Component, Element, Event, EventEmitter, Host, Prop, State, h, Listen } from '@stencil/core';\nimport './../../utils/polyfill';\n\n@Component({\n  tag: 'road-radio',\n  styleUrl: 'radio.css',\n  scoped: true,\n})\nexport class Radio {\n\n  private radioGroup: HTMLRoadRadioGroupElement | null = null;\n\n  @Element() el!: HTMLRoadRadioElement;\n\n  /**\n   * The id of radio\n   */\n  @Prop() radioId: string = `road-radio-${radioIds++}`;\n\n  /**\n   * If `true`, the radio is selected.\n   */\n  @State() checked: boolean = false;\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name: string = this.radioId;\n\n  /**\n   * If `true`, the user must fill in a value before submitting a form.\n   */\n  @Prop() required: boolean = false;\n\n  /**\n   * If `true`, the user cannot interact with the radio.\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * Value the form will get\n   */\n  @Prop() value?: any | null;\n\n  /**\n   * Label for the field\n   */\n  @Prop() label: string = `${this.radioId}-label`;\n\n  /**\n   * If `true`, the label and the radio are inverse and spaced\n   */\n  @Prop() inverse: boolean = false;\n\n  /**\n   * Error message for the field\n   */\n  @Prop() error?: boolean;\n\n  /**\n   * Helper message for the field\n   */\n  @Prop() helper?: string;\n\n  /**\n   * Inline multiple radio\n   */\n  @Prop() inline: boolean = true;\n\n  /**\n   * Emitted when the radio button has focus.\n   */\n  @Event() roadfocus!: EventEmitter<void>;\n  /** @internal */\n  @Event() roadFocus!: EventEmitter<void>;\n\n  /**\n   * Emitted when the radio button loses focus.\n   */\n  @Event() roadblur!: EventEmitter<void>;\n  /** @internal */\n  @Event() roadBlur!: EventEmitter<void>;\n\n  connectedCallback() {\n    if (this.value === undefined) {\n      this.value = this.radioId;\n    }\n    const radioGroup = this.radioGroup = this.el.closest('road-radio-group');\n    if (radioGroup) {\n      this.updateState();\n    }\n  }\n\n  disconnectedCallback() {\n    const radioGroup = this.radioGroup;\n    if (radioGroup) {\n      this.radioGroup = null;\n    }\n  }\n\n  @Listen('roadChange', {target: 'window'})\n  @Listen('roadchange', {target: 'window'})\n  onRoadChangedChanged() {\n    this.updateState();\n  }\n\n  private updateState = () => {\n    if (this.radioGroup) {\n      this.checked = this.radioGroup.value === this.value;\n    }\n  };\n\n  private onFocus = () => {\n    this.roadfocus.emit();\n    this.roadFocus.emit();\n  };\n\n  private onBlur = () => {\n    this.roadblur.emit();\n    this.roadBlur.emit();\n  };\n\n  render() {\n    const labelId = this.radioId + '-label';\n    const inverseClass = this.inverse && 'form-radio-inverse';\n    const isInvalidClass = this.error ? 'is-invalid' : '';\n    const inlineClass = this.inline ? 'form-radio-inline' : '';\n\n    return (\n      <Host class={`form-radio ${inlineClass}`}>\n        <input\n          class={`form-radio-input ${isInvalidClass}`}\n          type=\"radio\"\n          id={this.radioId}\n          name={this.name}\n          required={this.required}\n          disabled={this.disabled}\n          aria-disabled={this.disabled ? 'true' : null}\n          checked={this.checked}\n          aria-checked={`${this.checked}`}\n          aria-labelledby={labelId}\n          value={this.value}\n          onFocus={this.onFocus}\n          onBlur={this.onBlur}\n        />\n        <label class={`form-radio-label ${inverseClass}`} id={labelId} htmlFor={this.radioId}>{this.label}</label>\n      </Host>\n    );\n  }\n}\n\nlet radioIds = 0;\n"],"mappings":"8EAAA,MAAMA,EAAW,43F,MCQJC,EAAK,M,yKAERC,KAAAC,WAA+C,KAgG/CD,KAAAE,YAAc,KACpB,GAAIF,KAAKC,WAAY,CACnBD,KAAKG,QAAUH,KAAKC,WAAWG,QAAUJ,KAAKI,K,GAI1CJ,KAAAK,QAAU,KAChBL,KAAKM,UAAUC,OACfP,KAAKQ,UAAUD,MAAM,EAGfP,KAAAS,OAAS,KACfT,KAAKU,SAASH,OACdP,KAAKW,SAASJ,MAAM,E,aAtGI,cAAcK,M,aAKZ,M,UAKLZ,KAAKa,Q,cAKA,M,cAKA,M,gCAUJ,GAAGb,KAAKa,gB,aAKL,M,uDAeD,I,CAgB1B,iBAAAC,GACE,GAAId,KAAKI,QAAUW,UAAW,CAC5Bf,KAAKI,MAAQJ,KAAKa,O,CAEpB,MAAMZ,EAAaD,KAAKC,WAAaD,KAAKgB,GAAGC,QAAQ,oBACrD,GAAIhB,EAAY,CACdD,KAAKE,a,EAIT,oBAAAgB,GACE,MAAMjB,EAAaD,KAAKC,WACxB,GAAIA,EAAY,CACdD,KAAKC,WAAa,I,EAMtB,oBAAAkB,GACEnB,KAAKE,a,CAmBP,MAAAkB,GACE,MAAMC,EAAUrB,KAAKa,QAAU,SAC/B,MAAMS,EAAetB,KAAKuB,SAAW,qBACrC,MAAMC,EAAiBxB,KAAKyB,MAAQ,aAAe,GACnD,MAAMC,EAAc1B,KAAK2B,OAAS,oBAAsB,GAExD,OACEC,EAACC,EAAI,CAACC,MAAO,cAAcJ,KACzBE,EAAA,SACEE,MAAO,oBAAoBN,IAC3BO,KAAK,QACLC,GAAIhC,KAAKa,QACToB,KAAMjC,KAAKiC,KACXC,SAAUlC,KAAKkC,SACfC,SAAUnC,KAAKmC,SAAQ,gBACRnC,KAAKmC,SAAW,OAAS,KACxChC,QAASH,KAAKG,QAAO,eACP,GAAGH,KAAKG,UAAS,kBACdkB,EACjBjB,MAAOJ,KAAKI,MACZC,QAASL,KAAKK,QACdI,OAAQT,KAAKS,SAEfmB,EAAA,SAAOE,MAAO,oBAAoBR,IAAgBU,GAAIX,EAASe,QAASpC,KAAKa,SAAUb,KAAKqC,O,2BAMpG,IAAIzB,EAAW,E"}

package/dist/roadtrip/p-d5d248f0.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as s,H as a,d as e}from"./p-6475c1af.js";const i=":host{display:block}:host(.tab-hidden){display:none}";const n=class{constructor(s){t(this,s);this.active=false;this.tab=undefined}async componentWillLoad(){if(this.active){await this.setActive()}}async setActive(){this.active=true}render(){const{tab:t,active:e}=this;return s(a,{role:"tabpanel","aria-hidden":!e?"true":null,"aria-labelledby":`tab-button-${t}`,class:{"tab-hidden":!e}},s("slot",null))}get el(){return e(this)}};n.style=i;export{n as road_tab};
+//# sourceMappingURL=p-d5d248f0.entry.js.map

package/dist/roadtrip/p-d5d248f0.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["tabCss","Tab","componentWillLoad","this","active","setActive","render","tab","h","Host","role","class"],"sources":["src/components/tab/tab.css?tag=road-tab&encapsulation=shadow","src/components/tab/tab.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n:host(.tab-hidden) {\n  display: none;\n}\n","import { Component, Element, Host, Method, Prop, h } from '@stencil/core';\n\n/**\n * @slot  - content of the tab sync with selected tab.\n */\n\n@Component({\n  tag: 'road-tab',\n  styleUrl: 'tab.css',\n  shadow: true,\n})\nexport class Tab {\n\n  @Element() el!: HTMLRoadTabElement;\n\n  /** @internal */\n  @Prop({ mutable: true }) active = false;\n\n  /**\n   * A tab id must be provided for each `road-tab`. It's used internally to reference\n   * the selected tab or by the router to switch between them.\n   */\n  @Prop() tab!: string;\n\n\n  async componentWillLoad() {\n    if (this.active) {\n      await this.setActive();\n    }\n  }\n\n  /** Set the active component for the tab */\n  @Method()\n  async setActive() {\n    this.active = true;\n  }\n\n  render() {\n    const { tab, active } = this;\n    return (\n      <Host\n        role=\"tabpanel\"\n        aria-hidden={!active ? 'true' : null}\n        aria-labelledby={`tab-button-${tab}`}\n        class={{\n          'tab-hidden': !active,\n        }}\n      >\n        <slot/>\n      </Host>\n    );\n  }\n}"],"mappings":"yDAAA,MAAMA,EAAS,uD,MCWFC,EAAG,M,qCAKoB,M,mBASlC,uBAAMC,GACJ,GAAIC,KAAKC,OAAQ,OACTD,KAAKE,W,EAMf,eAAMA,GACJF,KAAKC,OAAS,I,CAGhB,MAAAE,GACE,MAAMC,IAAEA,EAAGH,OAAEA,GAAWD,KACxB,OACEK,EAACC,EAAI,CACHC,KAAK,WAAU,eACDN,EAAS,OAAS,KAAI,kBACnB,cAAcG,IAC/BI,MAAO,CACL,cAAeP,IAGjBI,EAAA,a"}

package/dist/roadtrip/{p-7ec2d494.js → p-d637bb99.js}

@@ -1,2 +1,2 @@
-import{g as n}from"./p-abdbf6ac.js";let t;const r=()=>{if(typeof window==="undefined"){return new Map}else{if(!t){const n=window;n.Ionicons=n.Ionicons||{};t=n.Ionicons.map=n.Ionicons.map||new Map}return t}};const e=n=>{const t=r();Object.keys(n).forEach((r=>t.set(r,n[r])))};const s=n=>{let t=f(n.src);if(t){return t}t=o(n.name,n.illustration);if(t){return i(t)}if(n.illustration){t=f(n.illustration);if(t){return t}}return null};const i=t=>{const e=r().get(t);if(e){return e}return n(`svg/${t}.svg`)};const o=(n,t)=>{if(!n&&t&&!u(t)){n=t}if(c(n)){n=a(n)}if(!c(n)||n.trim()===""){return null}const r=n.replace(/[a-z]|-|\d/gi,"");if(r!==""){return null}return n};const f=n=>{if(c(n)){n=n.trim();if(u(n)){return n}}return null};const u=n=>n.length>0&&/(\/|\.)/.test(n);const c=n=>typeof n==="string";const a=n=>n.toLowerCase();export{e as a,o as b,s as g,c as i};
-//# sourceMappingURL=p-7ec2d494.js.map
+import{g as n}from"./p-6475c1af.js";let t;const r=()=>{if(typeof window==="undefined"){return new Map}else{if(!t){const n=window;n.Ionicons=n.Ionicons||{};t=n.Ionicons.map=n.Ionicons.map||new Map}return t}};const e=n=>{const t=r();Object.keys(n).forEach((r=>t.set(r,n[r])))};const s=n=>{let t=f(n.src);if(t){return t}t=o(n.name,n.illustration);if(t){return i(t)}if(n.illustration){t=f(n.illustration);if(t){return t}}return null};const i=t=>{const e=r().get(t);if(e){return e}return n(`svg/${t}.svg`)};const o=(n,t)=>{if(!n&&t&&!u(t)){n=t}if(c(n)){n=l(n)}if(!c(n)||n.trim()===""){return null}const r=n.replace(/[a-z]|-|\d/gi,"");if(r!==""){return null}return n};const f=n=>{if(c(n)){n=n.trim();if(u(n)){return n}}return null};const u=n=>n.length>0&&/(\/|\.)/.test(n);const c=n=>typeof n==="string";const l=n=>n.toLowerCase();export{e as a,o as b,s as g,c as i};
+//# sourceMappingURL=p-d637bb99.js.map

package/dist/roadtrip/p-d637bb99.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["CACHED_MAP","getIllustrationMap","window","Map","win","Ionicons","map","addIllustrations","illustrations","Object","keys","forEach","name","set","getUrl","i","url","getSrc","src","getName","illustration","getNamedUrl","illustrationName","get","getAssetPath","isSrc","isStr","toLower","trim","invalidChars","replace","str","length","test","val","toLowerCase"],"sources":["src/components/illustration/utils.ts"],"sourcesContent":["import { getAssetPath } from '@stencil/core';\nimport { Illustration } from './illustration';\n\n\nlet CACHED_MAP: Map<string, string>;\n\nexport const getIllustrationMap = (): Map<string, string> => {\n  if (typeof window === 'undefined') {\n    return new Map();\n  } else {\n    if (!CACHED_MAP) {\n      const win = window as any;\n      win.Ionicons = win.Ionicons || {};\n      CACHED_MAP = win.Ionicons.map = win.Ionicons.map || new Map();\n    }\n    return CACHED_MAP;\n  }\n};\n\nexport const addIllustrations = (illustrations: { [name: string]: string; }) => {\n  const map = getIllustrationMap();\n  Object.keys(illustrations).forEach(name => map.set(name, illustrations[name]));\n};\n\n\nexport const getUrl = (i: Illustration) => {\n  let url = getSrc(i.src);\n  if (url) {\n    return url;\n  }\n\n  url = getName(i.name, i.illustration);\n  if (url) {\n    return getNamedUrl(url);\n  }\n\n  if (i.illustration) {\n    url = getSrc(i.illustration);\n    if (url) {\n      return url;\n    }\n  }\n\n  return null;\n};\n\n\nconst getNamedUrl = (illustrationName: string) => {\n  const url = getIllustrationMap().get(illustrationName);\n  if (url) {\n    return url;\n  }\n  return getAssetPath(`svg/${illustrationName}.svg`);\n};\n\n\nexport const getName = (\n  illustrationName: string | undefined,\n  illustration: string | undefined\n) => {\n\n  if (!illustrationName && illustration && !isSrc(illustration)) {\n    illustrationName = illustration;\n  }\n  if (isStr(illustrationName)) {\n    illustrationName = toLower(illustrationName);\n  }\n\n  if (!isStr(illustrationName) || illustrationName.trim() === '') {\n    return null;\n  }\n\n  // only allow alpha characters and dash\n  const invalidChars = illustrationName.replace(/[a-z]|-|\\d/gi, '');\n  if (invalidChars !== '') {\n    return null;\n  }\n\n  return illustrationName;\n};\n\nexport const getSrc = (src: string | undefined) => {\n  if (isStr(src)) {\n    src = src.trim();\n    if (isSrc(src)) {\n      return src;\n    }\n  }\n  return null;\n};\n\nexport const isSrc = (str: string) => str.length > 0 && /(\\/|\\.)/.test(str);\n\nexport const isStr = (val: any): val is string => typeof val === 'string';\n\nexport const toLower = (val: string) => val.toLowerCase();"],"mappings":"oCAIA,IAAIA,EAEG,MAAMC,EAAqB,KAChC,UAAWC,SAAW,YAAa,CACjC,OAAO,IAAIC,G,KACN,CACL,IAAKH,EAAY,CACf,MAAMI,EAAMF,OACZE,EAAIC,SAAWD,EAAIC,UAAY,GAC/BL,EAAaI,EAAIC,SAASC,IAAMF,EAAIC,SAASC,KAAO,IAAIH,G,CAE1D,OAAOH,C,SAIEO,EAAoBC,IAC/B,MAAMF,EAAML,IACZQ,OAAOC,KAAKF,GAAeG,SAAQC,GAAQN,EAAIO,IAAID,EAAMJ,EAAcI,KAAO,E,MAInEE,EAAUC,IACrB,IAAIC,EAAMC,EAAOF,EAAEG,KACnB,GAAIF,EAAK,CACP,OAAOA,C,CAGTA,EAAMG,EAAQJ,EAAEH,KAAMG,EAAEK,cACxB,GAAIJ,EAAK,CACP,OAAOK,EAAYL,E,CAGrB,GAAID,EAAEK,aAAc,CAClBJ,EAAMC,EAAOF,EAAEK,cACf,GAAIJ,EAAK,CACP,OAAOA,C,EAIX,OAAO,IAAI,EAIb,MAAMK,EAAeC,IACnB,MAAMN,EAAMf,IAAqBsB,IAAID,GACrC,GAAIN,EAAK,CACP,OAAOA,C,CAET,OAAOQ,EAAa,OAAOF,QAAuB,E,MAIvCH,EAAU,CACrBG,EACAF,KAGA,IAAKE,GAAoBF,IAAiBK,EAAML,GAAe,CAC7DE,EAAmBF,C,CAErB,GAAIM,EAAMJ,GAAmB,CAC3BA,EAAmBK,EAAQL,E,CAG7B,IAAKI,EAAMJ,IAAqBA,EAAiBM,SAAW,GAAI,CAC9D,OAAO,I,CAIT,MAAMC,EAAeP,EAAiBQ,QAAQ,eAAgB,IAC9D,GAAID,IAAiB,GAAI,CACvB,OAAO,I,CAGT,OAAOP,CAAgB,EAGlB,MAAML,EAAUC,IACrB,GAAIQ,EAAMR,GAAM,CACdA,EAAMA,EAAIU,OACV,GAAIH,EAAMP,GAAM,CACd,OAAOA,C,EAGX,OAAO,IAAI,EAGN,MAAMO,EAASM,GAAgBA,EAAIC,OAAS,GAAK,UAAUC,KAAKF,G,MAE1DL,EAASQ,UAAmCA,IAAQ,SAE1D,MAAMP,EAAWO,GAAgBA,EAAIC,qB"}

package/dist/roadtrip/{p-4fd8c4db.entry.js → p-e2962889.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,e as o,h as r,H as t}from"./p-abdbf6ac.js";import"./p-e8c090a5.js";const g='.sc-road-toggle-h{--toggle-lever-width:4.5rem;position:relative;display:block;margin-bottom:1rem;font-family:var(--road-font, sans-serif);font-size:var(--road-label-medium);color:var(--road-on-surface)}.form-toggle-input.sc-road-toggle{position:absolute;z-index:-1;opacity:0}.form-toggle-label.sc-road-toggle{display:inline-flex;align-items:center;cursor:pointer;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.form-toggle-lever.sc-road-toggle{position:relative;box-sizing:border-box;display:flex;flex-shrink:0;align-items:center;justify-content:flex-end;width:var(--toggle-lever-width);height:2rem;padding:0.5rem 0.625rem;margin-right:0.75rem;font-size:0.625rem;font-weight:700;line-height:1.6;content:"";background:var(--road-on-surface-extra-weak);border:0.125rem solid transparent;border-radius:1.125rem;transition:background 0.2s ease-in-out}.form-toggle-lever.sc-road-toggle::before{font-size:0.625rem;font-weight:700;color:var(--road-surface);text-transform:uppercase;content:attr(data-off)}.form-toggle-lever.sc-road-toggle::after{position:absolute;top:0.0625rem;left:0.0625rem;display:block;width:1.625rem;height:1.625rem;content:"";background:var(--road-on-success-surface-inverse);border-radius:50%;box-shadow:var(--road-elevation-low);transition:transform 0.2s ease-in-out}.form-toggle-input.sc-road-toggle:checked~.form-toggle-label.sc-road-toggle .form-toggle-lever.sc-road-toggle{justify-content:flex-start;background:var(--road-success-surface-inverse)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-label.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-surface);content:attr(data-on)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-label.sc-road-toggle .form-toggle-lever.sc-road-toggle::after{transform:translateX(calc(var(--toggle-lever-width) - 2rem))}.form-toggle-input.focus-visible.sc-road-toggle~.form-toggle-label.sc-road-toggle .form-toggle-lever.sc-road-toggle{box-shadow:0 0 0 0.125rem var(--road-grey-100-new), 0 0 0 0.1875rem var(--road-primary)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-secondary.sc-road-toggle .form-toggle-lever.sc-road-toggle{background:var(--road-secondary)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-secondary.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-surface)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-info.sc-road-toggle .form-toggle-lever.sc-road-toggle{background:var(--road-info-surface-inverse)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-info.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-surface)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-success.sc-road-toggle .form-toggle-lever.sc-road-toggle{background:var(--road-success-surface-inverse)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-success.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-surface)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-warning.sc-road-toggle .form-toggle-lever.sc-road-toggle{background:var(--road-warning-surface-inverse)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-warning.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-on-warning-surface-inverse)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-danger.sc-road-toggle .form-toggle-lever.sc-road-toggle{background:var(--road-danger-surface-inverse)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-danger.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-surface)}.form-toggle-right.sc-road-toggle{margin-right:0;margin-left:0.75rem}.form-toggle-spaced.sc-road-toggle{display:flex;justify-content:space-between}';const a=class{constructor(r){e(this,r);this.roadchange=o(this,"roadchange",7);this.roadChange=o(this,"roadChange",7);this.roadfocus=o(this,"roadfocus",7);this.roadFocus=o(this,"roadFocus",7);this.roadblur=o(this,"roadblur",7);this.roadBlur=o(this,"roadBlur",7);this.onClick=()=>{this.checked=!this.checked};this.onFocus=()=>{this.roadfocus.emit();this.roadFocus.emit()};this.onBlur=()=>{this.roadBlur.emit();this.roadblur.emit()};this.toggleId=`road-toggle-${s++}`;this.name=this.toggleId;this.checked=false;this.disabled=false;this.label=`${this.toggleId}-label`;this.color="success";this.hasLeftLabel=false;this.isSpaced=false;this.value="on";this.on="yes";this.off="no"}checkedChanged(e){this.roadchange.emit({checked:e,value:this.value});this.roadChange.emit({checked:e,value:this.value})}render(){const e=this.toggleId+"-label";const o=r("label",{class:"form-toggle-label",id:e,htmlFor:this.toggleId},this.label);const g=this.color!==undefined?"form-toggle-"+this.color:"";const a=this.isSpaced&&"form-toggle-spaced";const s=this.hasLeftLabel?"form-toggle-right":"";return r(t,null,r("input",{class:"form-toggle-input",type:"checkbox",id:this.toggleId,name:this.name,checked:this.checked,disabled:this.disabled,value:this.value,"aria-checked":`${this.checked}`,"aria-disabled":this.disabled?"true":null,"aria-labelledby":e,onClick:this.onClick,onFocus:this.onFocus,onBlur:this.onBlur}),r("label",{class:`form-toggle-label ${a} ${g}`,htmlFor:this.toggleId},this.hasLeftLabel&&o,r("div",{class:`form-toggle-lever ${s}`,"data-off":this.off,"data-on":this.on}),this.hasLeftLabel?"":o))}static get watchers(){return{checked:["checkedChanged"]}}};let s=0;a.style=g;export{a as road_toggle};
-//# sourceMappingURL=p-4fd8c4db.entry.js.map
+import{r as e,c as o,h as r,H as t}from"./p-6475c1af.js";import"./p-1ccae339.js";const g='.sc-road-toggle-h{--toggle-lever-width:4.5rem;position:relative;display:block;margin-bottom:1rem;font-family:var(--road-font, sans-serif);font-size:var(--road-label-medium);color:var(--road-on-surface)}.form-toggle-input.sc-road-toggle{position:absolute;z-index:-1;opacity:0}.form-toggle-label.sc-road-toggle{display:inline-flex;align-items:center;cursor:pointer;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.form-toggle-lever.sc-road-toggle{position:relative;box-sizing:border-box;display:flex;flex-shrink:0;align-items:center;justify-content:flex-end;width:var(--toggle-lever-width);height:2rem;padding:0.5rem 0.625rem;margin-right:0.75rem;font-size:0.625rem;font-weight:700;line-height:1.6;content:"";background:var(--road-on-surface-extra-weak);border:0.125rem solid transparent;border-radius:1.125rem;transition:background 0.2s ease-in-out}.form-toggle-lever.sc-road-toggle::before{font-size:0.625rem;font-weight:700;color:var(--road-surface);text-transform:uppercase;content:attr(data-off)}.form-toggle-lever.sc-road-toggle::after{position:absolute;top:0.0625rem;left:0.0625rem;display:block;width:1.625rem;height:1.625rem;content:"";background:var(--road-on-success-surface-inverse);border-radius:50%;box-shadow:var(--road-elevation-low);transition:transform 0.2s ease-in-out}.form-toggle-input.sc-road-toggle:checked~.form-toggle-label.sc-road-toggle .form-toggle-lever.sc-road-toggle{justify-content:flex-start;background:var(--road-success-surface-inverse)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-label.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-surface);content:attr(data-on)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-label.sc-road-toggle .form-toggle-lever.sc-road-toggle::after{transform:translateX(calc(var(--toggle-lever-width) - 2rem))}.form-toggle-input.focus-visible.sc-road-toggle~.form-toggle-label.sc-road-toggle .form-toggle-lever.sc-road-toggle{box-shadow:0 0 0 0.125rem var(--road-grey-100-new), 0 0 0 0.1875rem var(--road-primary)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-secondary.sc-road-toggle .form-toggle-lever.sc-road-toggle{background:var(--road-secondary)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-secondary.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-surface)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-info.sc-road-toggle .form-toggle-lever.sc-road-toggle{background:var(--road-info-surface-inverse)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-info.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-surface)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-success.sc-road-toggle .form-toggle-lever.sc-road-toggle{background:var(--road-success-surface-inverse)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-success.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-surface)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-warning.sc-road-toggle .form-toggle-lever.sc-road-toggle{background:var(--road-warning-surface-inverse)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-warning.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-on-warning-surface-inverse)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-danger.sc-road-toggle .form-toggle-lever.sc-road-toggle{background:var(--road-danger-surface-inverse)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-danger.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-surface)}.form-toggle-right.sc-road-toggle{margin-right:0;margin-left:0.75rem}.form-toggle-spaced.sc-road-toggle{display:flex;justify-content:space-between}';const a=class{constructor(r){e(this,r);this.roadchange=o(this,"roadchange",7);this.roadChange=o(this,"roadChange",7);this.roadfocus=o(this,"roadfocus",7);this.roadFocus=o(this,"roadFocus",7);this.roadblur=o(this,"roadblur",7);this.roadBlur=o(this,"roadBlur",7);this.onClick=()=>{this.checked=!this.checked};this.onFocus=()=>{this.roadfocus.emit();this.roadFocus.emit()};this.onBlur=()=>{this.roadBlur.emit();this.roadblur.emit()};this.toggleId=`road-toggle-${s++}`;this.name=this.toggleId;this.checked=false;this.disabled=false;this.label=`${this.toggleId}-label`;this.color="success";this.hasLeftLabel=false;this.isSpaced=false;this.value="on";this.on="yes";this.off="no"}checkedChanged(e){this.roadchange.emit({checked:e,value:this.value});this.roadChange.emit({checked:e,value:this.value})}render(){const e=this.toggleId+"-label";const o=r("label",{class:"form-toggle-label",id:e,htmlFor:this.toggleId},this.label);const g=this.color!==undefined?"form-toggle-"+this.color:"";const a=this.isSpaced&&"form-toggle-spaced";const s=this.hasLeftLabel?"form-toggle-right":"";return r(t,null,r("input",{class:"form-toggle-input",type:"checkbox",id:this.toggleId,name:this.name,checked:this.checked,disabled:this.disabled,value:this.value,"aria-checked":`${this.checked}`,"aria-disabled":this.disabled?"true":null,"aria-labelledby":e,onClick:this.onClick,onFocus:this.onFocus,onBlur:this.onBlur}),r("label",{class:`form-toggle-label ${a} ${g}`,htmlFor:this.toggleId},this.hasLeftLabel&&o,r("div",{class:`form-toggle-lever ${s}`,"data-off":this.off,"data-on":this.on}),this.hasLeftLabel?"":o))}static get watchers(){return{checked:["checkedChanged"]}}};let s=0;a.style=g;export{a as road_toggle};
+//# sourceMappingURL=p-e2962889.entry.js.map

package/dist/roadtrip/p-e2962889.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["toggleCss","toggle","this","onClick","checked","onFocus","roadfocus","emit","roadFocus","onBlur","roadBlur","roadblur","toggleIds","toggleId","checkedChanged","isChecked","roadchange","value","roadChange","render","labelId","textLabel","h","class","id","htmlFor","label","colorClass","color","undefined","isSpacedClass","isSpaced","righttoggleClass","hasLeftLabel","Host","type","name","disabled","off","on"],"sources":["src/components/toggle/toggle.css?tag=road-toggle&encapsulation=scoped","src/components/toggle/toggle.tsx"],"sourcesContent":["/*\n * Toggle\n *\n * For accessibility, we provide a style for focus only on Tab,\n * for that add the javascript polyfill for focus-visible\n * (https://github.com/WICG/focus-visible).\n *\n * Index\n * - Toggle\n * - Label\n * - Lever\n * - Feedback\n * - Position\n */\n\n/**\n * @prop --toggle-lever-width: width of the lever\n */\n\n/* toggle\n -------------------- */\n\n:host {\n  --toggle-lever-width: 4.5rem;\n\n  position: relative;\n  display: block;\n  margin-bottom: 1rem;\n  font-family: var(--road-font, sans-serif);\n  font-size: var(--road-label-medium);\n  color: var(--road-on-surface);\n}\n\n/**\n * Hide input\n */\n\n.form-toggle-input {\n  position: absolute;\n  z-index: -1;\n  opacity: 0;\n}\n\n/* LABEL\n -------------------- */\n\n.form-toggle-label {\n  display: inline-flex;\n  align-items: center;\n  cursor: pointer;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n\n/* LEVER\n -------------------- */\n\n.form-toggle-lever {\n  position: relative;\n  box-sizing: border-box;\n  display: flex;\n  flex-shrink: 0;\n  align-items: center;\n  justify-content: flex-end;\n  width: var(--toggle-lever-width);\n  height: 2rem;\n  padding: 0.5rem 0.625rem;\n  margin-right: 0.75rem;\n  font-size: 0.625rem;\n  font-weight: 700;\n  line-height: 1.6;\n  content: \"\";\n  background: var(--road-on-surface-extra-weak);\n  border: 0.125rem solid transparent;\n  border-radius: 1.125rem;\n  transition: background 0.2s ease-in-out;\n}\n\n/**\n * Text in the toggle widget\n */\n\n.form-toggle-lever::before {\n  font-size: 0.625rem;\n  font-weight: 700;\n  color: var(--road-surface);\n  text-transform: uppercase;\n  content: attr(data-off);\n}\n\n/**\n * Round lever in the widget\n */\n\n.form-toggle-lever::after {\n  position: absolute;\n  top: 0.0625rem;\n  left: 0.0625rem;\n  display: block;\n  width: 1.625rem;\n  height: 1.625rem;\n  content: \"\";\n  background: var(--road-on-success-surface-inverse);\n  border-radius: 50%;\n  box-shadow: var(--road-elevation-low);\n  transition: transform 0.2s ease-in-out;\n}\n\n/**\n * Checked state\n */\n\n.form-toggle-input:checked ~ .form-toggle-label .form-toggle-lever {\n  justify-content: flex-start;\n  background: var(--road-success-surface-inverse);\n}\n\n.form-toggle-input:checked ~ .form-toggle-label .form-toggle-lever::before {\n  color: var(--road-surface);\n  content: attr(data-on);\n}\n\n.form-toggle-input:checked ~ .form-toggle-label .form-toggle-lever::after {\n  transform: translateX(calc(var(--toggle-lever-width) - 2rem));\n}\n\n/**\n * Focus on Tab\n */\n\n.form-toggle-input.focus-visible ~ .form-toggle-label .form-toggle-lever {\n  box-shadow: 0 0 0 0.125rem var(--road-grey-100-new), 0 0 0 0.1875rem var(--road-primary);\n}\n\n/* FEEDBACK\n -------------------- */\n\n/**\n * Secondary\n */\n\n.form-toggle-input:checked ~ .form-toggle-secondary .form-toggle-lever {\n  background: var(--road-secondary);\n}\n\n.form-toggle-input:checked ~ .form-toggle-secondary .form-toggle-lever::before {\n  color: var(--road-surface);\n}\n\n/**\n * Info\n */\n\n.form-toggle-input:checked ~ .form-toggle-info .form-toggle-lever {\n  background: var(--road-info-surface-inverse);\n}\n\n.form-toggle-input:checked ~ .form-toggle-info .form-toggle-lever::before {\n  color: var(--road-surface);\n}\n\n/**\n * Success\n */\n\n.form-toggle-input:checked ~ .form-toggle-success .form-toggle-lever {\n  background: var(--road-success-surface-inverse);\n}\n\n.form-toggle-input:checked ~ .form-toggle-success .form-toggle-lever::before {\n  color: var(--road-surface);\n}\n\n/**\n * Warning\n */\n\n.form-toggle-input:checked ~ .form-toggle-warning .form-toggle-lever {\n  background: var(--road-warning-surface-inverse);\n}\n\n.form-toggle-input:checked ~ .form-toggle-warning .form-toggle-lever::before {\n  color: var(--road-on-warning-surface-inverse);\n}\n\n/**\n * Danger\n */\n\n.form-toggle-input:checked ~ .form-toggle-danger .form-toggle-lever {\n  background: var(--road-danger-surface-inverse);\n}\n\n.form-toggle-input:checked ~ .form-toggle-danger .form-toggle-lever::before {\n  color: var(--road-surface);\n}\n\n/* POSITION\n -------------------- */\n\n.form-toggle-right {\n  margin-right: 0;\n  margin-left: 0.75rem;\n}\n\n.form-toggle-spaced {\n  display: flex;\n  justify-content: space-between;\n}\n","import { Component, Event, EventEmitter, Host, Prop, Watch, h } from '@stencil/core';\nimport '../../utils/polyfill';\n\nimport { FeedbackColors } from '../../interface';\n\n@Component({\n  tag: 'road-toggle',\n  styleUrl: 'toggle.css',\n  scoped: true,\n})\nexport class toggle {\n\n  /**\n   * The id of toggle\n   */\n  @Prop() toggleId: string = `road-toggle-${toggleIds++}`;\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name: string = this.toggleId;\n\n  /**\n   * If `true`, the toggle is checked.\n   */\n  @Prop({ mutable: true }) checked = false;\n\n  /**\n   * If `true`, the user cannot interact with the toggle.\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Label for the field\n   */\n  @Prop() label: string = `${this.toggleId}-label`;\n\n  /**\n   * Set the color of alert. e.g. info, success, warning, danger\n   */\n  @Prop() color?: 'success' | FeedbackColors = 'success';\n\n  /**\n   * If `true`, the label is at left of the toggle\n   */\n  @Prop() hasLeftLabel: boolean = false;\n\n  /**\n   * Add space between label and toggle element\n   */\n  @Prop() isSpaced: boolean = false;\n\n  /**\n   * Value the form will get\n   */\n  @Prop() value: string = 'on';\n\n  /**\n   * Text display for \"`on`\" state in the toggle lever\n   */\n  @Prop() on: string = \"yes\";\n\n  /**\n   * Text display for \"`off`\" state in the toggle lever\n   */\n  @Prop() off: string = \"no\";\n\n  /**\n   * Emitted when the checked property has changed.\n   */\n  @Event() roadchange!: EventEmitter<{\n    checked: boolean;\n    value: string | undefined | null\n  }>;\n  /** @internal */\n  @Event() roadChange!: EventEmitter<{\n    checked: boolean;\n    value: string | undefined | null\n  }>;\n\n  /**\n   * Emitted when the toggle has focus.\n   */\n  @Event() roadfocus!: EventEmitter<void>;\n  /** @internal */\n  @Event() roadFocus!: EventEmitter<void>;\n\n  /**\n   * Emitted when the toggle loses focus.\n   */\n  @Event() roadblur!: EventEmitter<void>;\n  /** @internal */\n  @Event() roadBlur!: EventEmitter<void>;\n\n  @Watch('checked')\n  checkedChanged(isChecked: boolean) {\n    this.roadchange.emit({\n      checked: isChecked,\n      value: this.value,\n    });\n    this.roadChange.emit({\n      checked: isChecked,\n      value: this.value,\n    });\n  }\n\n  private onClick = () => {\n    this.checked = !this.checked;\n  };\n\n  private onFocus = () => {\n    this.roadfocus.emit();\n    this.roadFocus.emit();\n  };\n\n  private onBlur = () => {\n    this.roadBlur.emit();\n    this.roadblur.emit();\n  };\n\n  render() {\n    const labelId = this.toggleId + '-label';\n    const textLabel = <label class=\"form-toggle-label\" id={labelId} htmlFor={this.toggleId}>{this.label}</label>;\n    const colorClass = this.color !== undefined ? 'form-toggle-' + this.color : '';\n    const isSpacedClass = this.isSpaced && 'form-toggle-spaced';\n    const righttoggleClass = this.hasLeftLabel ? 'form-toggle-right' : '';\n\n    return (\n      <Host>\n        <input\n          class=\"form-toggle-input\"\n          type=\"checkbox\"\n          id={this.toggleId}\n          name={this.name}\n          checked={this.checked}\n          disabled={this.disabled}\n          value={this.value}\n          aria-checked={`${this.checked}`}\n          aria-disabled={this.disabled ? 'true' : null}\n          aria-labelledby={labelId}\n          onClick={this.onClick}\n          onFocus={this.onFocus}\n          onBlur={this.onBlur}\n        />\n        <label class={`form-toggle-label ${isSpacedClass} ${colorClass}`} htmlFor={this.toggleId}>\n          {this.hasLeftLabel && textLabel}\n          <div class={`form-toggle-lever ${righttoggleClass}`} data-off={this.off} data-on={this.on}></div>\n          {this.hasLeftLabel ? '' : textLabel}\n        </label>\n      </Host>\n    );\n  }\n}\n\nlet toggleIds = 0;\n"],"mappings":"iFAAA,MAAMA,EAAY,umH,MCULC,EAAM,M,uPAgGTC,KAAAC,QAAU,KAChBD,KAAKE,SAAWF,KAAKE,OAAO,EAGtBF,KAAAG,QAAU,KAChBH,KAAKI,UAAUC,OACfL,KAAKM,UAAUD,MAAM,EAGfL,KAAAO,OAAS,KACfP,KAAKQ,SAASH,OACdL,KAAKS,SAASJ,MAAM,E,cAtGK,eAAeK,M,UAKnBV,KAAKW,S,aAKO,M,cAKhB,M,WAKK,GAAGX,KAAKW,iB,WAKa,U,kBAKb,M,cAKJ,M,WAKJ,K,QAKH,M,SAKC,I,CA8BtB,cAAAC,CAAeC,GACbb,KAAKc,WAAWT,KAAK,CACnBH,QAASW,EACTE,MAAOf,KAAKe,QAEdf,KAAKgB,WAAWX,KAAK,CACnBH,QAASW,EACTE,MAAOf,KAAKe,O,CAkBhB,MAAAE,GACE,MAAMC,EAAUlB,KAAKW,SAAW,SAChC,MAAMQ,EAAYC,EAAA,SAAOC,MAAM,oBAAoBC,GAAIJ,EAASK,QAASvB,KAAKW,UAAWX,KAAKwB,OAC9F,MAAMC,EAAazB,KAAK0B,QAAUC,UAAY,eAAiB3B,KAAK0B,MAAQ,GAC5E,MAAME,EAAgB5B,KAAK6B,UAAY,qBACvC,MAAMC,EAAmB9B,KAAK+B,aAAe,oBAAsB,GAEnE,OACEX,EAACY,EAAI,KACHZ,EAAA,SACEC,MAAM,oBACNY,KAAK,WACLX,GAAItB,KAAKW,SACTuB,KAAMlC,KAAKkC,KACXhC,QAASF,KAAKE,QACdiC,SAAUnC,KAAKmC,SACfpB,MAAOf,KAAKe,MAAK,eACH,GAAGf,KAAKE,UAAS,gBAChBF,KAAKmC,SAAW,OAAS,KAAI,kBAC3BjB,EACjBjB,QAASD,KAAKC,QACdE,QAASH,KAAKG,QACdI,OAAQP,KAAKO,SAEfa,EAAA,SAAOC,MAAO,qBAAqBO,KAAiBH,IAAcF,QAASvB,KAAKW,UAC7EX,KAAK+B,cAAgBZ,EACtBC,EAAA,OAAKC,MAAO,qBAAqBS,IAAkB,WAAY9B,KAAKoC,IAAG,UAAWpC,KAAKqC,KACtFrC,KAAK+B,aAAe,GAAKZ,G,4DAOpC,IAAIT,EAAY,E"}

package/dist/roadtrip/p-e345ea12.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,h as s,H as a,d as n}from"./p-6475c1af.js";import"./p-1ccae339.js";const i=":host{display:flex;max-width:500px}";const r=class{constructor(s){t(this,s);this.roadsegmentedbuttonbarchanged=e(this,"roadsegmentedbuttonbarchanged",7);this.roadSegmentedButtonBarChanged=e(this,"roadSegmentedButtonBarChanged",7);this.selectedTab=undefined}selectedTabChanged(){if(this.selectedTab!==undefined){this.roadsegmentedbuttonbarchanged.emit({tab:this.selectedTab});this.roadSegmentedButtonBarChanged.emit({tab:this.selectedTab})}}componentWillLoad(){this.selectedTabChanged()}render(){return s(a,{role:"tablist"},s("slot",null))}get el(){return n(this)}static get watchers(){return{selectedTab:["selectedTabChanged"]}}};r.style=i;export{r as road_segmented_button_bar};
+//# sourceMappingURL=p-e345ea12.entry.js.map

package/dist/roadtrip/p-e345ea12.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["segmentedButtonBarCss","ButtonBar","selectedTabChanged","this","selectedTab","undefined","roadsegmentedbuttonbarchanged","emit","tab","roadSegmentedButtonBarChanged","componentWillLoad","render","h","Host","role"],"sources":["src/components/segmented-button-bar/segmented-button-bar.css?tag=road-segmented-button-bar&encapsulation=shadow","src/components/segmented-button-bar/segmented-button-bar.tsx"],"sourcesContent":["/*\n * Segmented button bar\n *\n */\n\n:host {\n  display: flex;\n  max-width: 500px;\n}\n","import { Component, Element, Event, EventEmitter, Host, Prop, Watch, h } from '@stencil/core';\nimport '../../utils/polyfill';\n\n/**\n * @slot  - Content of the segmentedButtonBar, it should be road-segmented-button elements.\n */\n\n@Component({\n  tag: 'road-segmented-button-bar',\n  styleUrl: 'segmented-button-bar.css',\n  shadow: true,\n})\nexport class ButtonBar {\n\n  @Element() el!: HTMLRoadSegmentedButtonBarElement;\n\n\n  /**\n   * The selected tab component\n   */\n  @Prop() selectedTab?: string;\n  @Watch('selectedTab')\n  selectedTabChanged() {\n    if (this.selectedTab !== undefined) {\n      this.roadsegmentedbuttonbarchanged.emit({\n        tab: this.selectedTab,\n      });\n      this.roadSegmentedButtonBarChanged.emit({\n        tab: this.selectedTab,\n      });\n    }\n  }\n\n  /** @internal */\n  @Event() roadsegmentedbuttonbarchanged!: EventEmitter;\n  /** @internal */\n  @Event() roadSegmentedButtonBarChanged!: EventEmitter;\n\n  componentWillLoad() {\n    this.selectedTabChanged();\n  }\n\n  render() {\n    return (\n      <Host\n        role=\"tablist\"\n      >\n        <slot/>\n      </Host>\n    );\n  }\n}"],"mappings":"wFAAA,MAAMA,EAAwB,sC,MCYjBC,EAAS,M,8MAUpB,kBAAAC,GACE,GAAIC,KAAKC,cAAgBC,UAAW,CAClCF,KAAKG,8BAA8BC,KAAK,CACtCC,IAAKL,KAAKC,cAEZD,KAAKM,8BAA8BF,KAAK,CACtCC,IAAKL,KAAKC,a,EAUhB,iBAAAM,GACEP,KAAKD,oB,CAGP,MAAAS,GACE,OACEC,EAACC,EAAI,CACHC,KAAK,WAELF,EAAA,a"}

package/dist/roadtrip/{p-9dd06f01.entry.js → p-f13ca352.entry.js}

@@ -1,2 +1,2 @@
-import{r as t,e as r,h as e,H as i,f as o}from"./p-abdbf6ac.js";const a=":host{--border-radius:0.25rem;--font-size:var(--road-button-medium);--margin-bottom:1rem;--padding-start:1.5rem;--padding-end:1.5rem;box-sizing:border-box;flex:1;align-items:center;justify-content:center;max-height:2.5rem;font-size:var(--road-button-medium);font-weight:700;color:var(--road-primary);text-decoration:none;white-space:nowrap;vertical-align:middle;background-color:var(--road-surface);border-top:1px solid var(--road-primary);border-bottom:1px solid var(--road-primary);border-left:1px solid var(--road-primary);border-radius:0;transition:background 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms}:host(:first-child){border:1px solid var(--road-primary);border-right:0;border-radius:999em 0 0 999em}:host(:last-child){border:1px solid var(--road-primary);border-radius:0 999em 999em 0}:host(.btn-sm){height:2rem;font-size:var(--road-button-small)}:host(.tab-selected){color:var(--road-primary-contrast);background-color:var(--road-primary)}:host(.tab-selected:hover){background-color:var(--road-button-primary-variant)}:host(:hover){background:var(--road-primary-90)}:host(.focus-visible){background:var(--road-primary-90);outline:0}:host(.tab-selected.focus-visible){background-color:var(--road-button-primary-variant)}.button-native{position:relative;box-sizing:border-box;display:flex;flex-direction:inherit;align-items:inherit;justify-content:inherit;width:100%;height:100%;max-height:2.5rem;padding:0.75rem var(--padding-end, 1.5rem) 0.75rem var(--padding-start, 1.5rem);margin:0;overflow:hidden;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;-webkit-user-drag:none;border-color:initial;border-style:initial;border-width:0;border-radius:inherit;border-image:initial;outline:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}";const n=class{constructor(e){t(this,e);this.roadsegmentedbuttonclick=r(this,"roadsegmentedbuttonclick",7);this.roadSegmentedButtonClick=r(this,"roadSegmentedButtonClick",7);this.onKeyUp=t=>{if(t.key==="Enter"||t.key===" "){this.selectTab(t)}};this.onClick=t=>{this.selectTab(t)};this.size="md";this.selected=false;this.tab=undefined}onButtonBarChanged(t){const r=t.target;const e=this.el.parentElement;if(t.composedPath&&t.composedPath().includes(e)||r&&r.contains(this.el)){this.selected=this.tab===t.detail.tab}}selectTab(t){if(this.tab!==undefined){this.roadsegmentedbuttonclick.emit({tab:this.tab,selected:this.selected});this.roadSegmentedButtonClick.emit({tab:this.tab,selected:this.selected});t.preventDefault()}}get tabIndex(){const t=this.el.hasAttribute("tabindex");if(t){return this.el.getAttribute("tabindex")}return 0}render(){const{tabIndex:t,selected:r,tab:o}=this;const a=this.size!==undefined?`btn-${this.size}`:"";return e(i,{onClick:this.onClick,onKeyup:this.onKeyUp,role:"tab",tabindex:t,"aria-selected":r?"true":null,id:o!==undefined?`tab-button-${o}`:null,class:{"tab-selected":r,[`${a}`]:true}},e("button",{type:"button",tabIndex:-1,class:"button-native",part:"native"},e("slot",null)))}get el(){return o(this)}};n.style=a;export{n as road_segmented_button};
-//# sourceMappingURL=p-9dd06f01.entry.js.map
+import{r as t,c as r,h as e,H as i,d as o}from"./p-6475c1af.js";const a=":host{--border-radius:0.25rem;--font-size:var(--road-button-medium);--margin-bottom:1rem;--padding-start:1.5rem;--padding-end:1.5rem;box-sizing:border-box;flex:1;align-items:center;justify-content:center;max-height:2.5rem;font-size:var(--road-button-medium);font-weight:700;color:var(--road-primary);text-decoration:none;white-space:nowrap;vertical-align:middle;background-color:var(--road-surface);border-top:1px solid var(--road-primary);border-bottom:1px solid var(--road-primary);border-left:1px solid var(--road-primary);border-radius:0;transition:background 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms}:host(:first-child){border:1px solid var(--road-primary);border-right:0;border-radius:999em 0 0 999em}:host(:last-child){border:1px solid var(--road-primary);border-radius:0 999em 999em 0}:host(.btn-sm){height:2rem;font-size:var(--road-button-small)}:host(.tab-selected){color:var(--road-primary-contrast);background-color:var(--road-primary)}:host(.tab-selected:hover){background-color:var(--road-button-primary-variant)}:host(:hover){background:var(--road-primary-90)}:host(.focus-visible){background:var(--road-primary-90);outline:0}:host(.tab-selected.focus-visible){background-color:var(--road-button-primary-variant)}.button-native{position:relative;box-sizing:border-box;display:flex;flex-direction:inherit;align-items:inherit;justify-content:inherit;width:100%;height:100%;max-height:2.5rem;padding:0.75rem var(--padding-end, 1.5rem) 0.75rem var(--padding-start, 1.5rem);margin:0;overflow:hidden;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;-webkit-user-drag:none;border-color:initial;border-style:initial;border-width:0;border-radius:inherit;border-image:initial;outline:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}";const n=class{constructor(e){t(this,e);this.roadsegmentedbuttonclick=r(this,"roadsegmentedbuttonclick",7);this.roadSegmentedButtonClick=r(this,"roadSegmentedButtonClick",7);this.onKeyUp=t=>{if(t.key==="Enter"||t.key===" "){this.selectTab(t)}};this.onClick=t=>{this.selectTab(t)};this.size="md";this.selected=false;this.tab=undefined}onButtonBarChanged(t){const r=t.target;const e=this.el.parentElement;if(t.composedPath&&t.composedPath().includes(e)||r&&r.contains(this.el)){this.selected=this.tab===t.detail.tab}}selectTab(t){if(this.tab!==undefined){this.roadsegmentedbuttonclick.emit({tab:this.tab,selected:this.selected});this.roadSegmentedButtonClick.emit({tab:this.tab,selected:this.selected});t.preventDefault()}}get tabIndex(){const t=this.el.hasAttribute("tabindex");if(t){return this.el.getAttribute("tabindex")}return 0}render(){const{tabIndex:t,selected:r,tab:o}=this;const a=this.size!==undefined?`btn-${this.size}`:"";return e(i,{onClick:this.onClick,onKeyup:this.onKeyUp,role:"tab",tabindex:t,"aria-selected":r?"true":null,id:o!==undefined?`tab-button-${o}`:null,class:{"tab-selected":r,[`${a}`]:true}},e("button",{type:"button",tabIndex:-1,class:"button-native",part:"native"},e("slot",null)))}get el(){return o(this)}};n.style=a;export{n as road_segmented_button};
+//# sourceMappingURL=p-f13ca352.entry.js.map

package/dist/roadtrip/p-f13ca352.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["segmentedButtonCss","SegmentedButton","this","onKeyUp","ev","key","selectTab","onClick","onButtonBarChanged","dispatchedFrom","target","parent","el","parentElement","composedPath","includes","contains","selected","tab","detail","undefined","roadsegmentedbuttonclick","emit","roadSegmentedButtonClick","preventDefault","tabIndex","hasTabIndex","hasAttribute","getAttribute","render","sizeClass","size","h","Host","onKeyup","role","tabindex","id","class","type","part"],"sources":["src/components/segmented-button/segmented-button.css?tag=road-segmented-button&encapsulation=shadow","src/components/segmented-button/segmented-button.tsx"],"sourcesContent":["/*\n * Tab button\n */\n\n\n/* BUTTON\n -------------------- */\n\n\n:host {\n  --border-radius: 0.25rem;\n  --font-size: var(--road-button-medium);\n  --margin-bottom: 1rem;\n  --padding-start: 1.5rem;\n  --padding-end: 1.5rem;\n  box-sizing: border-box;\n  flex: 1;\n  align-items: center;\n  justify-content: center;\n  max-height: 2.5rem;\n  font-size: var(--road-button-medium);\n  font-weight: 700;\n  color: var(--road-primary);\n  text-decoration: none;\n  white-space: nowrap;\n  vertical-align: middle;\n  background-color: var(--road-surface);\n  border-top: 1px solid var(--road-primary);\n  border-bottom: 1px solid var(--road-primary);\n  border-left: 1px solid var(--road-primary);\n  border-radius: 0;\n  transition: background 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}\n\n\n:host(:first-child){\n  border: 1px solid var(--road-primary);\n  border-right: 0;\n  border-radius: 999em 0 0 999em;\n}\n\n:host(:last-child){\n  border: 1px solid var(--road-primary);\n  border-radius: 0 999em 999em 0;\n}\n\n/**\n * Small\n */\n\n:host(.btn-sm) {\n  height: 2rem;\n  font-size: var(--road-button-small);\n}\n\n/**\n * Active state\n */\n\n:host(.tab-selected) {\n  color: var(--road-primary-contrast);\n  background-color: var(--road-primary);\n}\n\n:host(.tab-selected:hover) {\n  background-color: var(--road-button-primary-variant);\n}\n\n\n/**\n * Hover state\n */\n\n:host(:hover) {\n  background: var(--road-primary-90);\n}\n\n/**\n * Focus state\n */\n\n\n:host(.focus-visible) {\n  background: var(--road-primary-90);\n  outline: 0;\n}\n\n:host(.tab-selected.focus-visible){\n  background-color: var(--road-button-primary-variant);\n}\n\n\n/* NATIVE\n -------------------- */\n\n.button-native {\n  position: relative;\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: inherit;\n  align-items: inherit;\n  justify-content: inherit;\n  width: 100%;\n  height: 100%;\n  max-height: 2.5rem;\n  padding: 0.75rem var(--padding-end, 1.5rem) 0.75rem var(--padding-start, 1.5rem);\n  margin: 0;\n  overflow: hidden;\n  font-family: inherit;\n  font-size: inherit;\n  font-style: inherit;\n  font-weight: inherit;\n  color: inherit;\n  text-align: inherit;\n  text-decoration: none;\n  text-indent: inherit;\n  text-overflow: inherit;\n  text-transform: inherit;\n  letter-spacing: inherit;\n  white-space: inherit;\n  cursor: pointer;\n  background: transparent;\n  -webkit-user-drag: none;\n  border-color: initial;\n  border-style: initial;\n  border-width: 0;\n  border-radius: inherit;\n  border-image: initial;\n  outline: none;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n\n","import { Component, Element, Event, EventEmitter, Host, Listen, Prop, h } from '@stencil/core';\n\n/**\n *\n * @part native - The native HTML anchor element that wraps all child elements.\n */\n\n@Component({\n  tag: 'road-segmented-button',\n  styleUrl: 'segmented-button.css',\n  shadow: true,\n})\nexport class SegmentedButton {\n\n  @Element() el!: HTMLRoadSegmentedButtonElement;\n\n  /**\n    * The Segmented buttons size.\n    */\n   @Prop() size?: 'sm' | 'md' = 'md';\n\n  /**\n   * The selected tab component\n   */\n  @Prop({ mutable: true }) selected = false;\n\n  /**\n   * A tab id must be provided for each `road-tab`. It's used internally to reference\n   */\n  @Prop() tab?: string;\n\n  /**\n   * Emitted when the tab bar is clicked\n   * @internal\n   */\n  @Event() roadsegmentedbuttonclick!: EventEmitter;\n  /** @internal */\n  @Event() roadSegmentedButtonClick!: EventEmitter;\n\n  @Listen('roadSegmentedButtonBarChanged', { target: 'window' })\n  @Listen('roadSegmentedButtonbarchanged', { target: 'window' })\n  onButtonBarChanged(ev: CustomEvent) {\n    const dispatchedFrom = ev.target as HTMLElement;\n    const parent = this.el.parentElement as EventTarget;\n\n    if ((ev.composedPath && ev.composedPath().includes(parent)) || (dispatchedFrom && dispatchedFrom.contains(this.el))) {\n      this.selected = this.tab === ev.detail.tab;\n    }\n  }\n\n  private selectTab(ev: Event | KeyboardEvent) {\n    if (this.tab !== undefined) {\n      this.roadsegmentedbuttonclick.emit({\n        tab: this.tab,\n        selected: this.selected,\n      });\n      this.roadSegmentedButtonClick.emit({\n        tab: this.tab,\n        selected: this.selected,\n      });\n\n      ev.preventDefault();\n    }\n  }\n\n  private get tabIndex() {\n    const hasTabIndex = this.el.hasAttribute('tabindex');\n\n    if (hasTabIndex) {\n      return this.el.getAttribute('tabindex');\n    }\n\n    return 0;\n  }\n\n  private onKeyUp = (ev: KeyboardEvent) => {\n    if (ev.key === 'Enter' || ev.key === ' ') {\n      this.selectTab(ev);\n    }\n  };\n\n  private onClick = (ev: Event) => {\n    this.selectTab(ev);\n  };\n\n  render() {\n    const { tabIndex, selected, tab } = this;\n\n    const sizeClass = this.size !== undefined ? `btn-${this.size}` : '';\n\n\n    return (\n      <Host\n        onClick={this.onClick}\n        onKeyup={this.onKeyUp}\n        role=\"tab\"\n        tabindex={tabIndex}\n        aria-selected={selected ? 'true' : null}\n        id={tab !== undefined ? `tab-button-${tab}` : null}\n        class={{\n          'tab-selected': selected,\n          [`${sizeClass}`]: true,\n        }}\n      >\n        <button type=\"button\" tabIndex={-1} class=\"button-native\" part=\"native\">\n            <slot/>\n        </button>\n      </Host>\n    );\n  }\n}"],"mappings":"gEAAA,MAAMA,EAAqB,89D,MCYdC,EAAe,M,+JA+DlBC,KAAAC,QAAWC,IACjB,GAAIA,EAAGC,MAAQ,SAAWD,EAAGC,MAAQ,IAAK,CACxCH,KAAKI,UAAUF,E,GAIXF,KAAAK,QAAWH,IACjBF,KAAKI,UAAUF,EAAG,E,UA/DU,K,cAKM,M,mBAiBpC,kBAAAI,CAAmBJ,GACjB,MAAMK,EAAiBL,EAAGM,OAC1B,MAAMC,EAAST,KAAKU,GAAGC,cAEvB,GAAKT,EAAGU,cAAgBV,EAAGU,eAAeC,SAASJ,IAAaF,GAAkBA,EAAeO,SAASd,KAAKU,IAAM,CACnHV,KAAKe,SAAWf,KAAKgB,MAAQd,EAAGe,OAAOD,G,EAInC,SAAAZ,CAAUF,GAChB,GAAIF,KAAKgB,MAAQE,UAAW,CAC1BlB,KAAKmB,yBAAyBC,KAAK,CACjCJ,IAAKhB,KAAKgB,IACVD,SAAUf,KAAKe,WAEjBf,KAAKqB,yBAAyBD,KAAK,CACjCJ,IAAKhB,KAAKgB,IACVD,SAAUf,KAAKe,WAGjBb,EAAGoB,gB,EAIP,YAAYC,GACV,MAAMC,EAAcxB,KAAKU,GAAGe,aAAa,YAEzC,GAAID,EAAa,CACf,OAAOxB,KAAKU,GAAGgB,aAAa,W,CAG9B,OAAO,C,CAaT,MAAAC,GACE,MAAMJ,SAAEA,EAAQR,SAAEA,EAAQC,IAAEA,GAAQhB,KAEpC,MAAM4B,EAAY5B,KAAK6B,OAASX,UAAY,OAAOlB,KAAK6B,OAAS,GAGjE,OACEC,EAACC,EAAI,CACH1B,QAASL,KAAKK,QACd2B,QAAShC,KAAKC,QACdgC,KAAK,MACLC,SAAUX,EAAQ,gBACHR,EAAW,OAAS,KACnCoB,GAAInB,IAAQE,UAAY,cAAcF,IAAQ,KAC9CoB,MAAO,CACL,eAAgBrB,EAChB,CAAC,GAAGa,KAAc,OAGpBE,EAAA,UAAQO,KAAK,SAASd,UAAW,EAAGa,MAAM,gBAAgBE,KAAK,UAC3DR,EAAA,c"}