@roadtrip/components 3.52.0 → 3.53.0

package/dist/roadtrip/p-3444d6fe.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as o,H as e,a as s}from"./p-d7aae05d.js";const r=":host{position:relative;box-sizing:border-box;display:block;margin-bottom:var(--margin-bottom, 1rem);background:var(--road-surface);border:1px solid var(--road-outline-weak);border-radius:var(--road-spacing-02);padding:var(--road-spacing-03)}:host(.card-elevation-none){box-shadow:none}:host(.card-elevation-lowest){box-shadow:var(--road-elevation-lowest)}:host(.card-elevation-average){box-shadow:var(--road-elevation-average)}:host(.is-button){border:1px solid var(--road-outline);padding:0}:host(.is-button:hover){border:1px solid var(--road-outline-variant);outline:2px solid var(--road-button-ghost-variant)}:host(.is-button:focus-visible),:host(.is-button:focus){border:1px solid var(--road-outline);outline-offset:1px;outline:2px solid var(--road-outline-variant)}:host(.is-button.is-disabled){cursor:not-allowed;pointer-events:none;border:1px solid var(--road-surface-disabled);background:var(--road-surface-disabled)}:host(.is-button.is-disabled) .card-native,:host(.is-button.selected.is-disabled) .card-native{background:none}:host(.is-button.selected){border:2px solid var(--road-primary);outline:none}:host(.is-button.selected:hover){border:2px solid var(--road-outline-variant);outline:2px solid var(--road-button-ghost-variant)}:host(.is-button.selected.is-single:hover){border:2px solid var(--road-primary);outline:2px solid var(--road-button-ghost-variant)}:host(.is-button.selected:focus-visible),:host(.is-button.selected:focus){border:2px solid var(--road-outline-variant);outline-offset:1px;outline:2px solid var(--road-outline-variant)}:host(.is-button.selected.is-single:focus){border:2px solid var(--road-primary);outline:2px solid var(--road-outline-variant)}:host(.is-button.selected.is-disabled){cursor:not-allowed;pointer-events:none;outline:none;background:var(--road-surface-disabled);border:2px solid var(--road-surface-disabled)}.card-native{box-sizing:border-box;display:block;width:100%;height:100%;padding:var(--road-spacing-06);margin:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-align:center;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;letter-spacing:inherit;white-space:inherit;background:var(--road-surface);border:0;border-radius:0.25rem;outline:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}a,button{cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}::slotted(road-icon){text-align:center}";const a=r;const n=class{constructor(o){t(this,o);this.roadcardclick=i(this,"roadcardclick",7);this.roadCardClick=i(this,"roadCardClick",7);this.elevation="none";this.button=false;this.selected=false;this.disabled=false;this.selectionMode="multiple";this.type="button";this.onClick=t=>{var i,o;const e=this.button&&this.href===undefined;if(e&&this.disabled){t.preventDefault();t.stopPropagation();return}this.selected=!this.selected;if(this.selectionMode==="single"){t.currentTarget.blur()}if(this.value!==undefined){this.roadcardclick.emit({value:this.value,label:(i=this.el.querySelector("road-label"))===null||i===void 0?void 0:i.textContent});this.roadCardClick.emit({value:this.value,label:(o=this.el.querySelector("road-label"))===null||o===void 0?void 0:o.textContent})}}}isClickable(){return this.href!==undefined||this.button}renderCard(){const t=this.isClickable();if(!t){return[o("slot",null)]}const{href:i}=this;const e=t?i===undefined?"button":"a":"div";const s=this.button&&i===undefined;const r=e==="button"?{type:this.type,disabled:s&&this.disabled,"aria-disabled":s&&this.disabled?"true":undefined}:{download:this.download,href:this.href,rel:this.rel,target:this.target};return o(e,Object.assign({},r,{class:"card-native",part:"native",onClick:this.onClick}),o("slot",null))}render(){const{elevation:t}=this;const i=this.button&&this.href===undefined;const s=this.elevation?`card-elevation-${t}`:``;const r=this.selected?"selected":"";const a=i?"is-button":"";const n=i&&this.disabled?"is-disabled":"";const d=i&&this.selectionMode==="single"?"is-single":"";return o(e,{key:"fc2636b92be59ddf232b162574c3cdd3a7042a50",class:`${s} ${r} ${a} ${n} ${d}`},this.renderCard())}get el(){return s(this)}};n.style=a;export{n as road_card};
+//# sourceMappingURL=p-3444d6fe.entry.js.map

package/dist/roadtrip/p-3444d6fe.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["cardCss","RoadCardStyle0","Card","constructor","hostRef","this","elevation","button","selected","disabled","selectionMode","type","onClick","e","isButtonMode","href","undefined","preventDefault","stopPropagation","currentTarget","blur","value","roadcardclick","emit","label","_a","el","querySelector","textContent","roadCardClick","_b","isClickable","renderCard","clickable","h","TagType","attrs","download","rel","target","Object","assign","class","part","render","elevationClass","selectedClass","isButtonClass","disabledClass","singleClass","Host","key"],"sources":["src/components/card/card.css?tag=road-card&encapsulation=shadow","src/components/card/card.tsx"],"sourcesContent":["/*\n * Card\n *\n * Index\n * - Card\n * - Native\n * - Icon\n */\n\n/* CARD\n -------------------- */\n\n:host {\n  position: relative;\n  box-sizing: border-box;\n  display: block;\n  margin-bottom: var(--margin-bottom, 1rem);\n  background: var(--road-surface);\n  border: 1px solid var(--road-outline-weak);\n  border-radius: var(--road-spacing-02);\n  padding: var(--road-spacing-03);\n}\n\n:host(.card-elevation-none) {\n  box-shadow: none;\n}\n\n:host(.card-elevation-lowest) {\n  box-shadow: var(--road-elevation-lowest);\n}\n\n:host(.card-elevation-average) {\n  box-shadow: var(--road-elevation-average);\n}\n\n/*\n* Card as a button (interactivity in Figma)\n*/\n\n:host(.is-button) {\n  border: 1px solid var(--road-outline);\n  padding: 0;\n}\n\n:host(.is-button:hover) {\n  border: 1px solid var(--road-outline-variant);\n  outline: 2px solid var(--road-button-ghost-variant);\n}\n\n:host(.is-button:focus-visible),\n:host(.is-button:focus) {\n  border: 1px solid var(--road-outline);\n  outline-offset: 1px;\n  outline: 2px solid var(--road-outline-variant);\n}\n\n:host(.is-button.is-disabled) {\n  cursor: not-allowed;\n  pointer-events: none;\n  border: 1px solid var(--road-surface-disabled);\n  background: var(--road-surface-disabled);\n}\n\n:host(.is-button.is-disabled) .card-native,\n:host(.is-button.selected.is-disabled) .card-native {\n  background: none;\n}\n\n:host(.is-button.selected) {\n  border: 2px solid var(--road-primary);\n  outline: none;\n}\n\n:host(.is-button.selected:hover) {\n  border: 2px solid var(--road-outline-variant);\n  outline: 2px solid var(--road-button-ghost-variant);\n}\n\n:host(.is-button.selected.is-single:hover) {\n  border: 2px solid var(--road-primary);\n  outline: 2px solid var(--road-button-ghost-variant);\n}\n\n:host(.is-button.selected:focus-visible),\n:host(.is-button.selected:focus) {\n  border: 2px solid var(--road-outline-variant);\n  outline-offset: 1px;\n  outline: 2px solid var(--road-outline-variant);\n}\n\n:host(.is-button.selected.is-single:focus) {\n  border: 2px solid var(--road-primary);\n  outline: 2px solid var(--road-outline-variant);\n}\n\n:host(.is-button.selected.is-disabled) {\n  cursor: not-allowed;\n  pointer-events: none;\n  outline: none;\n  background: var(--road-surface-disabled);\n  border: 2px solid var(--road-surface-disabled);\n}\n\n/* NATIVE\n -------------------- */\n\n.card-native {\n  box-sizing: border-box;\n  display: block;\n  width: 100%;\n  height: 100%;\n  padding: var(--road-spacing-06);\n  margin: 0;\n  font-family: inherit;\n  font-size: inherit;\n  font-style: inherit;\n  font-weight: inherit;\n  color: inherit;\n  text-align: center;\n  text-decoration: inherit;\n  text-indent: inherit;\n  text-overflow: inherit;\n  text-transform: inherit;\n  letter-spacing: inherit;\n  white-space: inherit;\n  background: var(--road-surface);\n  border: 0;\n  border-radius: 0.25rem;\n  outline: none;\n  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\n}\n\na,\nbutton {\n  cursor: pointer;\n  -webkit-user-select: none;\n          user-select: none;\n  -webkit-user-drag: none;\n}\n\n/* ICON\n -------------------- */\n\n::slotted(road-icon) {\n  text-align: center;\n}\n","import {\n  Component,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Element,\n  Host,\n} from \"@stencil/core\";\n\n/**\n * @slot  - Content of the card.\n *\n * @part native - The native HTML button, anchor, or div element that wraps all child elements.\n */\n\n@Component({\n  tag: \"road-card\",\n  styleUrl: \"card.css\",\n  shadow: true,\n})\nexport class Card {\n  @Element() el!: HTMLRoadCardElement;\n\n  /**\n   * The elevation.\n   */\n  @Prop() elevation?: \"none\" | \"lowest\" | \"average\" = \"none\";\n\n  /**\n   * If `true`, a button tag will be rendered and the card will be tappable.\n   */\n  @Prop() button: boolean = false;\n\n  /**\n   * value of the card\n   */\n  @Prop() value?: string;\n\n  /**\n   * If `true`, the card has the `selected` state and the `selected` class is applied on the host.\n   * Toggled automatically when the card is clicked (when clickable).\n   */\n  @Prop({ reflect: true }) selected: boolean = false;\n\n  /**\n   * If `true`, the card is disabled and cannot be clicked.\n   * Only applies when in button mode (button=true and no href).\n   */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * Defines the selection mode.\n   * - `\"single\"`: only one card can be selected at a time (focus outline disabled).\n   * - `\"multiple\"`: multiple cards can be selected simultaneously.\n   */\n  @Prop({ reflect: true }) selectionMode?: \"single\" | \"multiple\" = \"multiple\";\n\n\n  /**\n   * The type of the button. Only used when an `onclick` or `button` property is present.\n   */\n  @Prop() type: \"submit\" | \"reset\" | \"button\" = \"button\";\n\n  /**\n   * This attribute instructs browsers to download a URL instead of navigating to\n   * it, so the user will be prompted to save it as a local file. If the attribute\n   * has a value, it is used as the pre-filled file name in the Save prompt\n   * (the user can still change the file name if they want).\n   */\n  @Prop() download?: string;\n\n  /**\n   * Contains a URL or a URL fragment that the hyperlink points to.\n   * If this property is set, an anchor tag will be rendered.\n   */\n  @Prop() href?: string;\n\n  /**\n   * Specifies the relationship of the target object to the link object.\n   * The value is a space-separated list of [link types](https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types).\n   */\n  @Prop() rel?: string;\n\n  /**\n   * Specifies where to display the linked URL.\n   * Only applies when an `href` is provided.\n   * Special keywords: `\"_blank\"`, `\"_self\"`, `\"_parent\"`, `\"_top\"`.\n   */\n  @Prop() target?: string;\n\n  /**\n   * Emitted when the card is clicked and send the `value` of the card\n   */\n  @Event() roadcardclick!: EventEmitter<{\n    value: string | undefined | null;\n    label: string | undefined | null;\n  }>;\n  /** @internal */\n  @Event() roadCardClick!: EventEmitter<{\n    value: string | undefined | null;\n    label: string | undefined | null;\n  }>;\n\n  private isClickable(): boolean {\n    return this.href !== undefined || this.button;\n  }\n\n  private onClick = (e: Event) => {\n    // If disabled in button mode, prevent all interactions\n    const isButtonMode = this.button && this.href === undefined;\n    if (isButtonMode && this.disabled) {\n      e.preventDefault();\n      e.stopPropagation();\n      return;\n    }\n\n    // Toggle selected state on click for clickable cards\n    this.selected = !this.selected;\n    if (this.selectionMode === \"single\") {\n      (e.currentTarget as HTMLElement).blur();\n    }\n\n    if (this.value !== undefined) {\n      this.roadcardclick.emit({\n        value: this.value,\n        label: this.el.querySelector(\"road-label\")?.textContent,\n      });\n      this.roadCardClick.emit({\n        value: this.value,\n        label: this.el.querySelector(\"road-label\")?.textContent,\n      });\n    }\n  };\n\n  private renderCard() {\n    const clickable = this.isClickable();\n\n    if (!clickable) {\n      return [<slot />];\n    }\n    const { href } = this;\n    const TagType = clickable\n      ? href === undefined\n        ? \"button\"\n        : \"a\"\n      : (\"div\" as any);\n    const isButtonMode = this.button && href === undefined;\n    const attrs =\n      TagType === \"button\"\n        ? {\n            type: this.type,\n            disabled: isButtonMode && this.disabled,\n            \"aria-disabled\": isButtonMode && this.disabled ? \"true\" : undefined,\n          }\n        : {\n            download: this.download,\n            href: this.href,\n            rel: this.rel,\n            target: this.target,\n          };\n\n    return (\n      <TagType\n        {...attrs}\n        class=\"card-native\"\n        part=\"native\"\n        onClick={this.onClick}\n      >\n        <slot />\n      </TagType>\n    );\n  }\n\n  render() {\n    const { elevation } = this;\n    const isButtonMode = this.button && this.href === undefined;\n    const elevationClass = this.elevation ? `card-elevation-${elevation}` : ``;\n    const selectedClass = this.selected ? \"selected\" : \"\";\n    const isButtonClass = isButtonMode ? \"is-button\" : \"\";\n    const disabledClass = isButtonMode && this.disabled ? \"is-disabled\" : \"\";\n    const singleClass = isButtonMode && this.selectionMode === \"single\" ? \"is-single\" : \"\";\n    return (\n      <Host\n        class={`${elevationClass} ${selectedClass} ${isButtonClass} ${disabledClass} ${singleClass}`}\n      >\n        {this.renderCard()}\n      </Host>\n    );\n  }\n}\n"],"mappings":"gEAAA,MAAMA,EAAU,i6EAChB,MAAAC,EAAeD,E,MCoBFE,EAAI,MALjB,WAAAC,CAAAC,G,oGAWUC,KAAAC,UAA4C,OAK5CD,KAAAE,OAAkB,MAWDF,KAAAG,SAAoB,MAMpBH,KAAAI,SAAoB,MAOpBJ,KAAAK,cAAwC,WAMzDL,KAAAM,KAAsC,SA8CtCN,KAAAO,QAAWC,I,QAEjB,MAAMC,EAAeT,KAAKE,QAAUF,KAAKU,OAASC,UAClD,GAAIF,GAAgBT,KAAKI,SAAU,CACjCI,EAAEI,iBACFJ,EAAEK,kBACF,M,CAIFb,KAAKG,UAAYH,KAAKG,SACtB,GAAIH,KAAKK,gBAAkB,SAAU,CAClCG,EAAEM,cAA8BC,M,CAGnC,GAAIf,KAAKgB,QAAUL,UAAW,CAC5BX,KAAKiB,cAAcC,KAAK,CACtBF,MAAOhB,KAAKgB,MACZG,OAAOC,EAAApB,KAAKqB,GAAGC,cAAc,iBAAa,MAAAF,SAAA,SAAAA,EAAEG,cAE9CvB,KAAKwB,cAAcN,KAAK,CACtBF,MAAOhB,KAAKgB,MACZG,OAAOM,EAAAzB,KAAKqB,GAAGC,cAAc,iBAAa,MAAAG,SAAA,SAAAA,EAAEF,a,GA1B1C,WAAAG,GACN,OAAO1B,KAAKU,OAASC,WAAaX,KAAKE,M,CA8BjC,UAAAyB,GACN,MAAMC,EAAY5B,KAAK0B,cAEvB,IAAKE,EAAW,CACd,MAAO,CAACC,EAAA,a,CAEV,MAAMnB,KAAEA,GAASV,KACjB,MAAM8B,EAAUF,EACZlB,IAASC,UACP,SACA,IACD,MACL,MAAMF,EAAeT,KAAKE,QAAUQ,IAASC,UAC7C,MAAMoB,EACJD,IAAY,SACR,CACExB,KAAMN,KAAKM,KACXF,SAAUK,GAAgBT,KAAKI,SAC/B,gBAAiBK,GAAgBT,KAAKI,SAAW,OAASO,WAE5D,CACEqB,SAAUhC,KAAKgC,SACftB,KAAMV,KAAKU,KACXuB,IAAKjC,KAAKiC,IACVC,OAAQlC,KAAKkC,QAGrB,OACEL,EAACC,EAAOK,OAAAC,OAAA,GACFL,EAAK,CACTM,MAAM,cACNC,KAAK,SACL/B,QAASP,KAAKO,UAEdsB,EAAA,a,CAKN,MAAAU,GACE,MAAMtC,UAAEA,GAAcD,KACtB,MAAMS,EAAeT,KAAKE,QAAUF,KAAKU,OAASC,UAClD,MAAM6B,EAAiBxC,KAAKC,UAAY,kBAAkBA,IAAc,GACxE,MAAMwC,EAAgBzC,KAAKG,SAAW,WAAa,GACnD,MAAMuC,EAAgBjC,EAAe,YAAc,GACnD,MAAMkC,EAAgBlC,GAAgBT,KAAKI,SAAW,cAAgB,GACtE,MAAMwC,EAAcnC,GAAgBT,KAAKK,gBAAkB,SAAW,YAAc,GACpF,OACEwB,EAACgB,EAAI,CAAAC,IAAA,2CACHT,MAAO,GAAGG,KAAkBC,KAAiBC,KAAiBC,KAAiBC,KAE9E5C,KAAK2B,a","ignoreList":[]}

package/dist/roadtrip/roadtrip.esm.js

@@ -1,2 +1,2 @@
-import{p as e,b as a}from"./p-d7aae05d.js";export{s as setNonce}from"./p-d7aae05d.js";import{g as o}from"./p-06bfef98.js";var l=()=>{const a=import.meta.url;const o={};if(a!==""){o.resourcesUrl=new URL(".",a).href}return e(o)};l().then((async e=>{await o();return a(JSON.parse('[["p-2fef9c0f",[[2,"road-counter",{"inputId":[1,"input-id"],"min":[2],"max":[2],"step":[1],"value":[2],"size":[1],"dustbin":[4],"readonly":[4],"leftIconClasses":[32],"rightIconClasses":[32],"isDustbinVisible":[32]},null,{"value":["onValueChange"],"readonly":["onValueChange"]}],[1,"road-item",{"titleItem":[1,"title-item"],"text":[1],"button":[4],"detail":[4],"active":[4],"detailIcon":[1,"detail-icon"],"disabled":[4],"download":[1],"href":[1],"rel":[1],"lines":[1],"layout":[1],"target":[1],"type":[1],"multipleInputs":[32]}],[1,"road-list",{"lines":[1]}],[1,"road-toolbar",{"color":[1]}],[1,"road-drawer",{"isOpen":[1028,"is-open"],"removePadding":[1028,"remove-padding"],"position":[1],"drawerWidth":[2,"drawer-width"],"hasInverseHeader":[4,"has-inverse-header"],"hasBackIcon":[4,"has-back-icon"],"backText":[1,"back-text"],"drawerTitle":[1,"drawer-title"],"ariaLabel":[1,"aria-label"],"ariaLabelBack":[1,"aria-label-back"],"ariaLabelClose":[1,"aria-label-close"],"hasCloseIcon":[4,"has-close-icon"],"enabledFocusTrap":[4,"enabled-focus-trap"],"whitelistSelectors":[1040],"focusTrap":[32],"hasFooterContent":[32],"open":[64],"close":[64],"back":[64],"updateWhitelistSelectors":[64]},[[4,"keyup","onEscape"]],{"enabledFocusTrap":["handleFocusTrapProp"],"isOpen":["handleOpen"]}],[6,"road-input",{"inputId":[1,"input-id"],"autocapitalize":[1],"autocomplete":[1],"blockdecimal":[4],"autocorrect":[1],"autofocus":[4],"disabled":[4],"enterkeyhint":[1],"inputmode":[1],"max":[1],"maxlength":[2],"min":[1],"minlength":[2],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[4],"required":[4],"spellcheck":[4],"step":[1],"size":[2],"sizes":[1],"type":[1],"value":[1032],"label":[1],"error":[1],"success":[4],"helper":[1],"list":[1],"debounce":[2],"enforceMinMaxValue":[64],"focus":[64]},null,{"debounce":["debounceChanged"],"value":["valueChanged"]}],[1,"road-badge",{"color":[1],"bubble":[4],"size":[513]}],[1,"road-col"],[1,"road-grid"],[1,"road-row"],[1,"road-button",{"color":[1],"size":[513],"buttonType":[1,"button-type"],"inverse":[4],"iconOnly":[516,"icon-only"],"disabled":[516],"expand":[516],"download":[1],"href":[1],"rel":[1],"target":[1],"outline":[4]}],[1,"road-input-group",{"disabled":[4]},null,{"disabled":["handleDisabledChange"]}],[1,"road-label"],[1,"road-icon",{"color":[1],"ariaLabel":[1537,"aria-label"],"ariaHidden":[513,"aria-hidden"],"name":[1],"src":[1],"icon":[8],"size":[1],"rotate":[1],"lazy":[4],"sanitize":[4],"svgContent":[32],"isVisible":[32]},null,{"name":["loadIcon"],"src":["loadIcon"],"icon":["loadIcon"]}]]],["p-c23dbac2",[[1,"road-duration",{"isOpen":[1028,"is-open"],"header":[1],"min":[2],"max":[2],"step":[2],"open":[64],"close":[64]},[[0,"roadcardclick","handleClick"]]]]],["p-6cdb1bf4",[[1,"road-content-card",{"insetImage":[4,"inset-image"]}]]],["p-163df174",[[2,"road-plate-number",{"country":[1],"disabled":[4],"placeholder":[1],"readonly":[4],"value":[1032],"motorbike":[4]},null,{"value":["valueChanged"]}]]],["p-3b906900",[[1,"road-profil-dropdown",{"isOpen":[1028,"is-open"]},[[4,"click","handleDocumentClick"]]]]],["p-e8d82a2e",[[1,"road-rating",{"size":[513],"rate":[2],"showreviews":[4],"readonly":[4],"reviews":[2],"reviewsText":[1,"reviews-text"],"url":[1]}]]],["p-df4cf8bb",[[1,"road-accordion",{"isOpen":[1028,"is-open"],"isLight":[4,"is-light"],"isLightSeparator":[4,"is-light-separator"],"isSmall":[4,"is-small"]}]]],["p-23b0d708",[[1,"road-alert",{"color":[1],"layout":[1],"label":[1],"button":[1],"link":[1],"url":[1],"hasCloseIcon":[4,"has-close-icon"],"isOpen":[1028,"is-open"],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["p-e2ba76f7",[[1,"road-banner",{"isOpen":[1028,"is-open"],"label":[1],"link":[1],"url":[1],"close":[64]}]]],["p-2d68aa3a",[[1,"road-carousel",{"options":[8],"pager":[4],"pagertype":[1],"arrows":[4],"update":[64],"updateAutoHeight":[64],"slideTo":[64],"slideNext":[64],"slidePrev":[64],"getActiveIndex":[64],"getPreviousIndex":[64],"length":[64],"isEnd":[64],"isBeginning":[64],"startAutoplay":[64],"stopAutoplay":[64],"lockSwipeToNext":[64],"lockSwipeToPrev":[64],"lockSwipes":[64],"getSwiper":[64]},null,{"options":["optionsChanged"]}]]],["p-741d74fd",[[6,"road-checkbox",{"checkboxId":[1,"checkbox-id"],"name":[1],"required":[4],"checked":[1028],"indeterminate":[4],"disabled":[4],"value":[1],"label":[1],"secondaryLabel":[1,"secondary-label"],"inverse":[4],"error":[1],"helper":[1],"size":[513]},null,{"checked":["checkedChanged"]}]]],["p-f99639e8",[[1,"road-chip",{"color":[1],"outline":[4],"size":[1],"hasCloseIcon":[4,"has-close-icon"]}]]],["p-39b17e20",[[1,"road-collapse",{"isOpen":[1028,"is-open"],"showMore":[1,"show-more"],"showLess":[1,"show-less"],"centered":[4]}]]],["p-a1101905",[[1,"road-dialog",{"isOpen":[1028,"is-open"],"hasCloseIcon":[4,"has-close-icon"],"color":[1],"icon":[1],"label":[1],"description":[1],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["p-d344a749",[[1,"road-dropdown",{"isOpen":[1028,"is-open"],"isLight":[4,"is-light"],"isMedium":[4,"is-medium"],"position":[513],"direction":[513]},[[4,"click","handleDocumentClick"]]]]],["p-2301c9e2",[[1,"road-modal",{"maxWidth":[2,"max-width"],"isOpen":[1028,"is-open"],"hasInverseHeader":[4,"has-inverse-header"],"modalTitle":[1,"modal-title"],"hasCloseIcon":[4,"has-close-icon"],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["p-ad5538c1",[[2,"road-phone-number-input",{"disabled":[4],"countryData":[16],"language":[1],"codeLabel":[1,"code-label"],"phoneLabel":[1,"phone-label"],"phoneValue":[1,"phone-value"],"countryCode":[1,"country-code"],"errorMessage":[1,"error-message"],"required":[4],"selectedCountry":[32],"selectedCountryCode":[32],"phoneNumber":[32],"countryOptions":[32],"returnObject":[32]}]]],["p-d7a56b79",[[6,"road-range",{"rangeId":[1,"range-id"],"value":[1032],"min":[1],"max":[1],"step":[1],"showValue":[4,"show-value"],"showTick":[4,"show-tick"],"showLabels":[4,"show-labels"],"disabled":[4]},[[2,"focus","handleFocus"],[2,"blur","handleBlur"]],{"value":["valueChanged"]}]]],["p-41dbdb75",[[1,"road-segmented-button",{"size":[1],"selected":[1028],"tab":[1],"badge":[1]},[[8,"roadSegmentedButtonBarChanged","onButtonBarChanged"],[8,"roadSegmentedButtonbarchanged","onButtonBarChanged"]]]]],["p-579fce4c",[[1,"road-status-chip",{"size":[1]}]]],["p-fc261f58",[[6,"road-time-range-picker",{"start":[1025],"end":[1025],"disabled":[4],"helper":[1],"separator":[1],"required":[4],"label":[1],"sizes":[1],"error":[1],"getRange":[64]}]]],["p-3646f072",[[1,"road-toast",{"isOpen":[1028,"is-open"],"color":[1],"label":[1],"timeout":[2],"open":[64],"close":[64]},null,{"isOpen":["isOpenChanged"]}]]],["p-ae250ecf",[[2,"road-toggle",{"toggleId":[1,"toggle-id"],"name":[1],"checked":[1028],"disabled":[4],"label":[1],"hasLeftLabel":[4,"has-left-label"],"isSpaced":[4,"is-spaced"],"value":[1]},null,{"checked":["checkedChanged"]}]]],["p-e97c8d7f",[[2,"road-area-code",{"selectId":[1,"select-id"],"options":[16],"autofocus":[4],"disabled":[4],"name":[1],"required":[4],"size":[2],"sizes":[1],"label":[1],"error":[1],"value":[1025],"triggerRender":[1026,"trigger-render"],"selectedValue":[32]},null,{"value":["valueChanged"]}]]],["p-ef883f08",[[1,"road-aspect-ratio",{"ratio":[1]}]]],["p-14e42c8d",[[1,"road-asset",{"ariaLabel":[1537,"aria-label"],"ariaHidden":[513,"aria-hidden"],"name":[1],"src":[1],"asset":[8],"lazy":[4],"sanitize":[4],"assetSvgContent":[32],"isVisible":[32]},null,{"name":["loadAsset"],"src":["loadAsset"],"asset":["loadAsset"]}]]],["p-edf07985",[[6,"road-autocomplete",{"options":[16],"visible":[32]},[[0,"roadFocus","handleFocus"],[0,"roadfocus","handleFocus"],[4,"click","onClickOutside"]]]]],["p-8426998b",[[1,"road-button-carousel",{"outline":[4],"disabled":[516]},[[9,"scroll","onScroll"]]]]],["p-f2f26300",[[1,"road-button-floating",{"position":[513],"href":[1],"rel":[1],"target":[1]},[[9,"scroll","onScroll"]]]]],["p-70909891",[[4,"road-carousel-item"]]],["p-3bac817e",[[1,"road-flap",{"color":[1],"filled":[4],"size":[513]}]]],["p-b6e3db42",[[1,"road-global-navigation",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"],[0,"roadnavbaritemclick","onNavbarChanged"]],{"selectedTab":["selectedTabChanged"]}]]],["p-eddc9353",[[1,"road-global-navigation-v2",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"],[0,"roadnavbaritemclick","onNavbarChanged"],[8,"click","onButtonClick"]],{"selectedTab":["selectedTabChanged"]}]]],["p-abe3e334",[[1,"road-illustration",{"ariaLabel":[1537,"aria-label"],"ariaHidden":[513,"aria-hidden"],"name":[1],"src":[1],"illustration":[8],"size":[1],"rotate":[1],"lazy":[4],"sanitize":[4],"illustrationSvgContent":[32],"isVisible":[32]},null,{"name":["loadIllustration"],"src":["loadIllustration"],"illustration":["loadIllustration"]}]]],["p-df4c2ff0",[[1,"road-navbar",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"],[0,"roadnavbaritemclick","onNavbarChanged"]],{"selectedTab":["selectedTabChanged"]}]]],["p-b40d0b3d",[[1,"road-navbar-item",{"disabled":[4],"download":[1],"href":[1],"rel":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadNavbarChanged","onNavbarChanged"],[8,"roadnavbarchanged","onNavbarChanged"]],{"selected":["handleSelectedChange"]}]]],["p-466c0ff9",[[1,"road-navbar-item-v2",{"disabled":[4],"download":[1],"href":[1],"rel":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadNavbarChanged","onNavbarChanged"],[8,"roadnavbarchanged","onNavbarChanged"]],{"selected":["handleSelectedChange"]}]]],["p-977c467d",[[1,"road-navbar-v2",{"compact":[516],"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"],[0,"roadnavbaritemclick","onNavbarChanged"]],{"selectedTab":["selectedTabChanged"]}]]],["p-8630081f",[[1,"road-progress",{"value":[2],"numbersteps":[2],"label":[1],"showstep":[4],"animation":[4],"light":[4],"fullwidth":[4],"color":[1],"progresscalculationbase":[1]}]]],["p-e9480f62",[[1,"road-progress-indicator-horizontal",{"color":[513],"numberStep":[2,"number-step"],"stateFirstStep":[1,"state-first-step"],"stateSecondStep":[1,"state-second-step"],"stateThirdStep":[1,"state-third-step"],"urlStep1":[1,"url-step-1"],"urlStep2":[1,"url-step-2"],"urlStep3":[1,"url-step-3"]}]]],["p-0eba704f",[[1,"road-progress-indicator-vertical"]]],["p-9a91254d",[[4,"road-progress-indicator-vertical-item"]]],["p-99146e17",[[1,"road-progress-tracker"]]],["p-cc42a593",[[4,"road-progress-tracker-item"]]],["p-12e8e42a",[[2,"road-radio",{"radioId":[1,"radio-id"],"name":[1],"required":[4],"disabled":[4],"value":[8],"label":[1],"secondaryLabel":[1,"secondary-label"],"inverse":[4],"error":[4],"helper":[1],"inline":[4],"checked":[32]},[[8,"roadChange","onRoadChangedChanged"],[8,"roadchange","onRoadChangedChanged"]]]]],["p-596d37d0",[[6,"road-radio-card",{"name":[1],"disabled":[4],"selected":[4],"value":[8],"label":[1],"inline":[4],"isSelected":[32],"radioId":[32]},[[8,"road-radio-selected","handleRadioSelected"]]]]],["p-d4f30d5d",[[6,"road-radio-group",{"radioGroupId":[1,"radio-group-id"],"allowEmptySelection":[4,"allow-empty-selection"],"name":[1],"value":[1032],"label":[1],"asterisk":[4],"ariaLabel":[513,"aria-label"],"error":[1025],"helper":[1]},null,{"value":["valueChanged"],"error":["errorChanged"]}]]],["p-a25cdb1f",[[1,"road-segmented-button-bar",{"selectedTab":[1,"selected-tab"]},null,{"selectedTab":["selectedTabChanged"]}]]],["p-bfc2379c",[[1,"road-segmented-buttons",{"selectedTab":[32],"select":[64],"getTab":[64],"getSelected":[64]}]]],["p-fba1b425",[[2,"road-select",{"selectId":[1,"select-id"],"options":[16],"autofocus":[4],"disabled":[4],"name":[1],"required":[4],"helper":[1],"size":[2],"sizes":[1],"label":[1],"error":[1],"value":[1032]},null,{"value":["valueChanged"]}]]],["p-22de5cde",[[6,"road-select-filter",{"options":[16],"parameters":[8],"isActive":[4,"is-active"],"onlySelect":[4,"only-select"],"loading":[4],"isOpen":[32],"currentValue":[32],"activeIndex":[32],"wasFocusedBeforeLoading":[32]},[[0,"roadFocus","handleFocus"],[0,"roadfocus","handleFocus"],[0,"roadBlur","handleBlur"],[0,"roadblur","handleBlur"],[0,"roadChange","handleChange"],[0,"roadchange","handleChange"],[5,"mousedown","onClickOutside"],[8,"keydown","handleKeydown"]],{"loading":["loadingChanged"],"options":["onOptionsChange"]}]]],["p-9ecf3634",[[1,"road-skeleton"]]],["p-7563a0f9",[[1,"road-spinner",{"size":[513],"color":[513]}]]],["p-fb7caf90",[[2,"road-switch",{"switchId":[1,"switch-id"],"name":[1],"checked":[1028],"disabled":[4],"label":[1],"color":[1],"hasLeftLabel":[4,"has-left-label"],"isSpaced":[4,"is-spaced"],"value":[1],"on":[1],"off":[1]},null,{"checked":["checkedChanged"]}]]],["p-3d30fba4",[[1,"road-tab",{"active":[1028],"tab":[1],"setActive":[64]},[[8,"roadtabbarchanged","onTabBarChanged"]]]]],["p-41aa8071",[[1,"road-tab-bar",{"secondary":[4],"expand":[4],"center":[4],"selectedTab":[1537,"selected-tab"]},[[0,"roadTabButtonClick","onTabButtonClick"]],{"selectedTab":["selectedTabChanged"]}]]],["p-320b58c5",[[1,"road-tab-button",{"download":[1],"href":[1],"rel":[1],"layout":[1],"selected":[1028],"disabled":[1028],"tab":[1],"target":[1]},[[8,"roadTabBarChanged","onTabBarChanged"],[8,"roadTabbarchanged","onTabBarChanged"]]]]],["p-c6206416",[[6,"road-table"]]],["p-2b2749da",[[1,"road-tabs",{"selectedTab":[32],"select":[64],"getTab":[64],"getSelected":[64]}]]],["p-19ff95e3",[[1,"road-tag",{"color":[1],"contrast":[4]}]]],["p-ae53bc43",[[1,"road-text",{"color":[1]}]]],["p-93ffbb6e",[[2,"road-textarea",{"textareaId":[1,"textarea-id"],"autocapitalize":[1],"autofocus":[4],"disabled":[4],"inputmode":[1],"enterkeyhint":[1],"maxlength":[2],"minlength":[2],"name":[1],"placeholder":[1],"sizes":[1],"readonly":[4],"required":[4],"spellcheck":[4],"resize":[4],"cols":[2],"rows":[2],"wrap":[1],"value":[1025],"label":[1],"error":[1],"helper":[1]},null,{"value":["valueChanged"]}]]],["p-77578033",[[1,"road-toolbar-title"]]],["p-d42b2603",[[1,"road-toolbar-title-page"]]],["p-54ccd027",[[1,"road-toolbar-v2"]]],["p-368b36e3",[[1,"road-tooltip",{"tooltipId":[1,"tooltip-id"],"content":[1],"position":[1],"contentAlign":[1,"content-align"],"isOpen":[1028,"is-open"],"trigger":[1],"open":[64],"close":[64]}]]],["p-a4e45088",[[1,"road-avatar",{"size":[513]}]]],["p-4bbe3312",[[1,"road-card",{"elevation":[1],"button":[4],"value":[1],"selected":[516],"disabled":[516],"type":[1],"download":[1],"href":[1],"rel":[1],"target":[1]}]]],["p-7a51b3e1",[[1,"road-img",{"alt":[1],"src":[1],"loadSrc":[32],"loadError":[32]},null,{"src":["srcChanged"]}]]]]'),e)}));
+import{p as e,b as a}from"./p-d7aae05d.js";export{s as setNonce}from"./p-d7aae05d.js";import{g as o}from"./p-06bfef98.js";var l=()=>{const a=import.meta.url;const o={};if(a!==""){o.resourcesUrl=new URL(".",a).href}return e(o)};l().then((async e=>{await o();return a(JSON.parse('[["p-319a0ef7",[[2,"road-counter",{"inputId":[1,"input-id"],"min":[2],"max":[2],"step":[1],"value":[2],"size":[1],"dustbin":[4],"readonly":[4],"leftIconClasses":[32],"rightIconClasses":[32],"isDustbinVisible":[32]},null,{"value":["onValueChange"],"readonly":["onValueChange"]}],[1,"road-item",{"titleItem":[1,"title-item"],"text":[1],"button":[4],"detail":[4],"active":[4],"detailIcon":[1,"detail-icon"],"disabled":[4],"download":[1],"href":[1],"rel":[1],"lines":[1],"layout":[1],"target":[1],"type":[1],"multipleInputs":[32]}],[1,"road-list",{"lines":[1]}],[1,"road-toolbar",{"color":[1]}],[1,"road-drawer",{"isOpen":[1028,"is-open"],"removePadding":[1028,"remove-padding"],"position":[1],"drawerWidth":[2,"drawer-width"],"hasInverseHeader":[4,"has-inverse-header"],"hasBackIcon":[4,"has-back-icon"],"backText":[1,"back-text"],"drawerTitle":[1,"drawer-title"],"ariaLabel":[1,"aria-label"],"ariaLabelBack":[1,"aria-label-back"],"ariaLabelClose":[1,"aria-label-close"],"hasCloseIcon":[4,"has-close-icon"],"enabledFocusTrap":[4,"enabled-focus-trap"],"whitelistSelectors":[1040],"focusTrap":[32],"hasFooterContent":[32],"hasMounted":[32],"open":[64],"close":[64],"back":[64],"updateWhitelistSelectors":[64]},[[4,"keyup","onEscape"]],{"enabledFocusTrap":["handleFocusTrapProp"],"isOpen":["handleOpen"]}],[6,"road-input",{"inputId":[1,"input-id"],"autocapitalize":[1],"autocomplete":[1],"blockdecimal":[4],"autocorrect":[1],"autofocus":[4],"disabled":[4],"enterkeyhint":[1],"inputmode":[1],"max":[1],"maxlength":[2],"min":[1],"minlength":[2],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[4],"required":[4],"spellcheck":[4],"step":[1],"size":[2],"sizes":[1],"type":[1],"value":[1032],"label":[1],"error":[1],"success":[4],"helper":[1],"list":[1],"debounce":[2],"enforceMinMaxValue":[64],"focus":[64]},null,{"debounce":["debounceChanged"],"value":["valueChanged"]}],[1,"road-badge",{"color":[1],"bubble":[4],"size":[513]}],[1,"road-col"],[1,"road-grid"],[1,"road-row"],[1,"road-button",{"color":[1],"size":[513],"buttonType":[1,"button-type"],"inverse":[4],"iconOnly":[516,"icon-only"],"disabled":[516],"expand":[516],"download":[1],"href":[1],"rel":[1],"target":[1],"outline":[4]}],[1,"road-input-group",{"disabled":[4]},null,{"disabled":["handleDisabledChange"]}],[1,"road-label"],[1,"road-icon",{"color":[1],"ariaLabel":[1537,"aria-label"],"ariaHidden":[513,"aria-hidden"],"name":[1],"src":[1],"icon":[8],"size":[1],"rotate":[1],"lazy":[4],"sanitize":[4],"svgContent":[32],"isVisible":[32]},null,{"name":["loadIcon"],"src":["loadIcon"],"icon":["loadIcon"]}]]],["p-c23dbac2",[[1,"road-duration",{"isOpen":[1028,"is-open"],"header":[1],"min":[2],"max":[2],"step":[2],"open":[64],"close":[64]},[[0,"roadcardclick","handleClick"]]]]],["p-6cdb1bf4",[[1,"road-content-card",{"insetImage":[4,"inset-image"]}]]],["p-163df174",[[2,"road-plate-number",{"country":[1],"disabled":[4],"placeholder":[1],"readonly":[4],"value":[1032],"motorbike":[4]},null,{"value":["valueChanged"]}]]],["p-3b906900",[[1,"road-profil-dropdown",{"isOpen":[1028,"is-open"]},[[4,"click","handleDocumentClick"]]]]],["p-e8d82a2e",[[1,"road-rating",{"size":[513],"rate":[2],"showreviews":[4],"readonly":[4],"reviews":[2],"reviewsText":[1,"reviews-text"],"url":[1]}]]],["p-df4cf8bb",[[1,"road-accordion",{"isOpen":[1028,"is-open"],"isLight":[4,"is-light"],"isLightSeparator":[4,"is-light-separator"],"isSmall":[4,"is-small"]}]]],["p-23b0d708",[[1,"road-alert",{"color":[1],"layout":[1],"label":[1],"button":[1],"link":[1],"url":[1],"hasCloseIcon":[4,"has-close-icon"],"isOpen":[1028,"is-open"],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["p-e2ba76f7",[[1,"road-banner",{"isOpen":[1028,"is-open"],"label":[1],"link":[1],"url":[1],"close":[64]}]]],["p-2d68aa3a",[[1,"road-carousel",{"options":[8],"pager":[4],"pagertype":[1],"arrows":[4],"update":[64],"updateAutoHeight":[64],"slideTo":[64],"slideNext":[64],"slidePrev":[64],"getActiveIndex":[64],"getPreviousIndex":[64],"length":[64],"isEnd":[64],"isBeginning":[64],"startAutoplay":[64],"stopAutoplay":[64],"lockSwipeToNext":[64],"lockSwipeToPrev":[64],"lockSwipes":[64],"getSwiper":[64]},null,{"options":["optionsChanged"]}]]],["p-741d74fd",[[6,"road-checkbox",{"checkboxId":[1,"checkbox-id"],"name":[1],"required":[4],"checked":[1028],"indeterminate":[4],"disabled":[4],"value":[1],"label":[1],"secondaryLabel":[1,"secondary-label"],"inverse":[4],"error":[1],"helper":[1],"size":[513]},null,{"checked":["checkedChanged"]}]]],["p-f99639e8",[[1,"road-chip",{"color":[1],"outline":[4],"size":[1],"hasCloseIcon":[4,"has-close-icon"]}]]],["p-39b17e20",[[1,"road-collapse",{"isOpen":[1028,"is-open"],"showMore":[1,"show-more"],"showLess":[1,"show-less"],"centered":[4]}]]],["p-a1101905",[[1,"road-dialog",{"isOpen":[1028,"is-open"],"hasCloseIcon":[4,"has-close-icon"],"color":[1],"icon":[1],"label":[1],"description":[1],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["p-d344a749",[[1,"road-dropdown",{"isOpen":[1028,"is-open"],"isLight":[4,"is-light"],"isMedium":[4,"is-medium"],"position":[513],"direction":[513]},[[4,"click","handleDocumentClick"]]]]],["p-2301c9e2",[[1,"road-modal",{"maxWidth":[2,"max-width"],"isOpen":[1028,"is-open"],"hasInverseHeader":[4,"has-inverse-header"],"modalTitle":[1,"modal-title"],"hasCloseIcon":[4,"has-close-icon"],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["p-ad5538c1",[[2,"road-phone-number-input",{"disabled":[4],"countryData":[16],"language":[1],"codeLabel":[1,"code-label"],"phoneLabel":[1,"phone-label"],"phoneValue":[1,"phone-value"],"countryCode":[1,"country-code"],"errorMessage":[1,"error-message"],"required":[4],"selectedCountry":[32],"selectedCountryCode":[32],"phoneNumber":[32],"countryOptions":[32],"returnObject":[32]}]]],["p-d7a56b79",[[6,"road-range",{"rangeId":[1,"range-id"],"value":[1032],"min":[1],"max":[1],"step":[1],"showValue":[4,"show-value"],"showTick":[4,"show-tick"],"showLabels":[4,"show-labels"],"disabled":[4]},[[2,"focus","handleFocus"],[2,"blur","handleBlur"]],{"value":["valueChanged"]}]]],["p-41dbdb75",[[1,"road-segmented-button",{"size":[1],"selected":[1028],"tab":[1],"badge":[1]},[[8,"roadSegmentedButtonBarChanged","onButtonBarChanged"],[8,"roadSegmentedButtonbarchanged","onButtonBarChanged"]]]]],["p-579fce4c",[[1,"road-status-chip",{"size":[1]}]]],["p-fc261f58",[[6,"road-time-range-picker",{"start":[1025],"end":[1025],"disabled":[4],"helper":[1],"separator":[1],"required":[4],"label":[1],"sizes":[1],"error":[1],"getRange":[64]}]]],["p-3646f072",[[1,"road-toast",{"isOpen":[1028,"is-open"],"color":[1],"label":[1],"timeout":[2],"open":[64],"close":[64]},null,{"isOpen":["isOpenChanged"]}]]],["p-ae250ecf",[[2,"road-toggle",{"toggleId":[1,"toggle-id"],"name":[1],"checked":[1028],"disabled":[4],"label":[1],"hasLeftLabel":[4,"has-left-label"],"isSpaced":[4,"is-spaced"],"value":[1]},null,{"checked":["checkedChanged"]}]]],["p-e97c8d7f",[[2,"road-area-code",{"selectId":[1,"select-id"],"options":[16],"autofocus":[4],"disabled":[4],"name":[1],"required":[4],"size":[2],"sizes":[1],"label":[1],"error":[1],"value":[1025],"triggerRender":[1026,"trigger-render"],"selectedValue":[32]},null,{"value":["valueChanged"]}]]],["p-ef883f08",[[1,"road-aspect-ratio",{"ratio":[1]}]]],["p-14e42c8d",[[1,"road-asset",{"ariaLabel":[1537,"aria-label"],"ariaHidden":[513,"aria-hidden"],"name":[1],"src":[1],"asset":[8],"lazy":[4],"sanitize":[4],"assetSvgContent":[32],"isVisible":[32]},null,{"name":["loadAsset"],"src":["loadAsset"],"asset":["loadAsset"]}]]],["p-edf07985",[[6,"road-autocomplete",{"options":[16],"visible":[32]},[[0,"roadFocus","handleFocus"],[0,"roadfocus","handleFocus"],[4,"click","onClickOutside"]]]]],["p-8426998b",[[1,"road-button-carousel",{"outline":[4],"disabled":[516]},[[9,"scroll","onScroll"]]]]],["p-f2f26300",[[1,"road-button-floating",{"position":[513],"href":[1],"rel":[1],"target":[1]},[[9,"scroll","onScroll"]]]]],["p-70909891",[[4,"road-carousel-item"]]],["p-3bac817e",[[1,"road-flap",{"color":[1],"filled":[4],"size":[513]}]]],["p-b6e3db42",[[1,"road-global-navigation",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"],[0,"roadnavbaritemclick","onNavbarChanged"]],{"selectedTab":["selectedTabChanged"]}]]],["p-eddc9353",[[1,"road-global-navigation-v2",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"],[0,"roadnavbaritemclick","onNavbarChanged"],[8,"click","onButtonClick"]],{"selectedTab":["selectedTabChanged"]}]]],["p-abe3e334",[[1,"road-illustration",{"ariaLabel":[1537,"aria-label"],"ariaHidden":[513,"aria-hidden"],"name":[1],"src":[1],"illustration":[8],"size":[1],"rotate":[1],"lazy":[4],"sanitize":[4],"illustrationSvgContent":[32],"isVisible":[32]},null,{"name":["loadIllustration"],"src":["loadIllustration"],"illustration":["loadIllustration"]}]]],["p-df4c2ff0",[[1,"road-navbar",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"],[0,"roadnavbaritemclick","onNavbarChanged"]],{"selectedTab":["selectedTabChanged"]}]]],["p-b40d0b3d",[[1,"road-navbar-item",{"disabled":[4],"download":[1],"href":[1],"rel":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadNavbarChanged","onNavbarChanged"],[8,"roadnavbarchanged","onNavbarChanged"]],{"selected":["handleSelectedChange"]}]]],["p-466c0ff9",[[1,"road-navbar-item-v2",{"disabled":[4],"download":[1],"href":[1],"rel":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadNavbarChanged","onNavbarChanged"],[8,"roadnavbarchanged","onNavbarChanged"]],{"selected":["handleSelectedChange"]}]]],["p-977c467d",[[1,"road-navbar-v2",{"compact":[516],"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"],[0,"roadnavbaritemclick","onNavbarChanged"]],{"selectedTab":["selectedTabChanged"]}]]],["p-8630081f",[[1,"road-progress",{"value":[2],"numbersteps":[2],"label":[1],"showstep":[4],"animation":[4],"light":[4],"fullwidth":[4],"color":[1],"progresscalculationbase":[1]}]]],["p-e9480f62",[[1,"road-progress-indicator-horizontal",{"color":[513],"numberStep":[2,"number-step"],"stateFirstStep":[1,"state-first-step"],"stateSecondStep":[1,"state-second-step"],"stateThirdStep":[1,"state-third-step"],"urlStep1":[1,"url-step-1"],"urlStep2":[1,"url-step-2"],"urlStep3":[1,"url-step-3"]}]]],["p-0eba704f",[[1,"road-progress-indicator-vertical"]]],["p-9a91254d",[[4,"road-progress-indicator-vertical-item"]]],["p-99146e17",[[1,"road-progress-tracker"]]],["p-cc42a593",[[4,"road-progress-tracker-item"]]],["p-12e8e42a",[[2,"road-radio",{"radioId":[1,"radio-id"],"name":[1],"required":[4],"disabled":[4],"value":[8],"label":[1],"secondaryLabel":[1,"secondary-label"],"inverse":[4],"error":[4],"helper":[1],"inline":[4],"checked":[32]},[[8,"roadChange","onRoadChangedChanged"],[8,"roadchange","onRoadChangedChanged"]]]]],["p-596d37d0",[[6,"road-radio-card",{"name":[1],"disabled":[4],"selected":[4],"value":[8],"label":[1],"inline":[4],"isSelected":[32],"radioId":[32]},[[8,"road-radio-selected","handleRadioSelected"]]]]],["p-d4f30d5d",[[6,"road-radio-group",{"radioGroupId":[1,"radio-group-id"],"allowEmptySelection":[4,"allow-empty-selection"],"name":[1],"value":[1032],"label":[1],"asterisk":[4],"ariaLabel":[513,"aria-label"],"error":[1025],"helper":[1]},null,{"value":["valueChanged"],"error":["errorChanged"]}]]],["p-a25cdb1f",[[1,"road-segmented-button-bar",{"selectedTab":[1,"selected-tab"]},null,{"selectedTab":["selectedTabChanged"]}]]],["p-bfc2379c",[[1,"road-segmented-buttons",{"selectedTab":[32],"select":[64],"getTab":[64],"getSelected":[64]}]]],["p-fba1b425",[[2,"road-select",{"selectId":[1,"select-id"],"options":[16],"autofocus":[4],"disabled":[4],"name":[1],"required":[4],"helper":[1],"size":[2],"sizes":[1],"label":[1],"error":[1],"value":[1032]},null,{"value":["valueChanged"]}]]],["p-22de5cde",[[6,"road-select-filter",{"options":[16],"parameters":[8],"isActive":[4,"is-active"],"onlySelect":[4,"only-select"],"loading":[4],"isOpen":[32],"currentValue":[32],"activeIndex":[32],"wasFocusedBeforeLoading":[32]},[[0,"roadFocus","handleFocus"],[0,"roadfocus","handleFocus"],[0,"roadBlur","handleBlur"],[0,"roadblur","handleBlur"],[0,"roadChange","handleChange"],[0,"roadchange","handleChange"],[5,"mousedown","onClickOutside"],[8,"keydown","handleKeydown"]],{"loading":["loadingChanged"],"options":["onOptionsChange"]}]]],["p-9ecf3634",[[1,"road-skeleton"]]],["p-7563a0f9",[[1,"road-spinner",{"size":[513],"color":[513]}]]],["p-fb7caf90",[[2,"road-switch",{"switchId":[1,"switch-id"],"name":[1],"checked":[1028],"disabled":[4],"label":[1],"color":[1],"hasLeftLabel":[4,"has-left-label"],"isSpaced":[4,"is-spaced"],"value":[1],"on":[1],"off":[1]},null,{"checked":["checkedChanged"]}]]],["p-3d30fba4",[[1,"road-tab",{"active":[1028],"tab":[1],"setActive":[64]},[[8,"roadtabbarchanged","onTabBarChanged"]]]]],["p-41aa8071",[[1,"road-tab-bar",{"secondary":[4],"expand":[4],"center":[4],"selectedTab":[1537,"selected-tab"]},[[0,"roadTabButtonClick","onTabButtonClick"]],{"selectedTab":["selectedTabChanged"]}]]],["p-320b58c5",[[1,"road-tab-button",{"download":[1],"href":[1],"rel":[1],"layout":[1],"selected":[1028],"disabled":[1028],"tab":[1],"target":[1]},[[8,"roadTabBarChanged","onTabBarChanged"],[8,"roadTabbarchanged","onTabBarChanged"]]]]],["p-c6206416",[[6,"road-table"]]],["p-2b2749da",[[1,"road-tabs",{"selectedTab":[32],"select":[64],"getTab":[64],"getSelected":[64]}]]],["p-19ff95e3",[[1,"road-tag",{"color":[1],"contrast":[4]}]]],["p-ae53bc43",[[1,"road-text",{"color":[1]}]]],["p-93ffbb6e",[[2,"road-textarea",{"textareaId":[1,"textarea-id"],"autocapitalize":[1],"autofocus":[4],"disabled":[4],"inputmode":[1],"enterkeyhint":[1],"maxlength":[2],"minlength":[2],"name":[1],"placeholder":[1],"sizes":[1],"readonly":[4],"required":[4],"spellcheck":[4],"resize":[4],"cols":[2],"rows":[2],"wrap":[1],"value":[1025],"label":[1],"error":[1],"helper":[1]},null,{"value":["valueChanged"]}]]],["p-77578033",[[1,"road-toolbar-title"]]],["p-d42b2603",[[1,"road-toolbar-title-page"]]],["p-54ccd027",[[1,"road-toolbar-v2"]]],["p-368b36e3",[[1,"road-tooltip",{"tooltipId":[1,"tooltip-id"],"content":[1],"position":[1],"contentAlign":[1,"content-align"],"isOpen":[1028,"is-open"],"trigger":[1],"open":[64],"close":[64]}]]],["p-a4e45088",[[1,"road-avatar",{"size":[513]}]]],["p-3444d6fe",[[1,"road-card",{"elevation":[1],"button":[4],"value":[1],"selected":[516],"disabled":[516],"selectionMode":[513,"selection-mode"],"type":[1],"download":[1],"href":[1],"rel":[1],"target":[1]}]]],["p-7a51b3e1",[[1,"road-img",{"alt":[1],"src":[1],"loadSrc":[32],"loadError":[32]},null,{"src":["srcChanged"]}]]]]'),e)}));
 //# sourceMappingURL=roadtrip.esm.js.map

package/dist/roadtrip/roadtrip.esm.js.map

@@ -1 +1 @@
-{"version":3,"names":["patchBrowser","importMeta","url","opts","resourcesUrl","URL","href","promiseResolve","then","async","options","globalScripts","bootstrapLazy","JSON","parse"],"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.27.0 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, doc, H, promiseResolve } from \"@stencil/core\";\nvar patchBrowser = () => {\n  if (BUILD.isDev && !BUILD.isTesting) {\n    consoleDevInfo(\"Running in development mode.\");\n  }\n  if (BUILD.cloneNodeFix) {\n    patchCloneNodeFix(H.prototype);\n  }\n  const scriptElm = BUILD.scriptDataOpts ? Array.from(doc.querySelectorAll(\"script\")).find(\n    (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n  ) : null;\n  const importMeta = import.meta.url;\n  const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n  if (importMeta !== \"\") {\n    opts.resourcesUrl = new URL(\".\", importMeta).href;\n  }\n  return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n  const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n  HTMLElementPrototype.cloneNode = function(deep) {\n    if (this.nodeName === \"TEMPLATE\") {\n      return nativeCloneNodeFn.call(this, deep);\n    }\n    const clonedNode = nativeCloneNodeFn.call(this, false);\n    const srcChildNodes = this.childNodes;\n    if (deep) {\n      for (let i = 0; i < srcChildNodes.length; i++) {\n        if (srcChildNodes[i].nodeType !== 2) {\n          clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n        }\n      }\n    }\n    return clonedNode;\n  };\n};\nexport {\n  patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"mappings":"0HAOA,IAAIA,EAAe,KAUjB,MAAMC,cAAyBC,IAC/B,MAAMC,EAAqE,GAC3E,GAAIF,IAAe,GAAI,CACrBE,EAAKC,aAAe,IAAIC,IAAI,IAAKJ,GAAYK,IACjD,CACE,OAAOC,EAAeJ,EAAK,EClB7BH,IAAeQ,MAAKC,MAAOC,UACnBC,IACN,OAAOC,EAAcC,KAAAC,MAAA,2ncAAuCJ,EAAA","ignoreList":[]}
+{"version":3,"names":["patchBrowser","importMeta","url","opts","resourcesUrl","URL","href","promiseResolve","then","async","options","globalScripts","bootstrapLazy","JSON","parse"],"sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.27.0 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, doc, H, promiseResolve } from \"@stencil/core\";\nvar patchBrowser = () => {\n  if (BUILD.isDev && !BUILD.isTesting) {\n    consoleDevInfo(\"Running in development mode.\");\n  }\n  if (BUILD.cloneNodeFix) {\n    patchCloneNodeFix(H.prototype);\n  }\n  const scriptElm = BUILD.scriptDataOpts ? Array.from(doc.querySelectorAll(\"script\")).find(\n    (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n  ) : null;\n  const importMeta = import.meta.url;\n  const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n  if (importMeta !== \"\") {\n    opts.resourcesUrl = new URL(\".\", importMeta).href;\n  }\n  return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n  const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n  HTMLElementPrototype.cloneNode = function(deep) {\n    if (this.nodeName === \"TEMPLATE\") {\n      return nativeCloneNodeFn.call(this, deep);\n    }\n    const clonedNode = nativeCloneNodeFn.call(this, false);\n    const srcChildNodes = this.childNodes;\n    if (deep) {\n      for (let i = 0; i < srcChildNodes.length; i++) {\n        if (srcChildNodes[i].nodeType !== 2) {\n          clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n        }\n      }\n    }\n    return clonedNode;\n  };\n};\nexport {\n  patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"mappings":"0HAOA,IAAIA,EAAe,KAUjB,MAAMC,cAAyBC,IAC/B,MAAMC,EAAqE,GAC3E,GAAIF,IAAe,GAAI,CACrBE,EAAKC,aAAe,IAAIC,IAAI,IAAKJ,GAAYK,IACjD,CACE,OAAOC,EAAeJ,EAAK,EClB7BH,IAAeQ,MAAKC,MAAOC,UACnBC,IACN,OAAOC,EAAcC,KAAAC,MAAA,orcAAuCJ,EAAA","ignoreList":[]}

package/dist/types/components/card/card.d.ts

@@ -28,6 +28,12 @@ export declare class Card {
      * Only applies when in button mode (button=true and no href).
      */
     disabled: boolean;
+    /**
+     * Defines the selection mode.
+     * - `"single"`: only one card can be selected at a time (focus outline disabled).
+     * - `"multiple"`: multiple cards can be selected simultaneously.
+     */
+    selectionMode?: "single" | "multiple";
     /**
      * The type of the button. Only used when an `onclick` or `button` property is present.
      */

package/dist/types/components/drawer/drawer.d.ts

@@ -90,6 +90,11 @@ export declare class Drawer {
      * Footer Content state
      */
     hasFooterContent: boolean;
+    /**
+     * Used to ensure open transitions run when the drawer
+     * is initially mounted with `isOpen=true`.
+     */
+    hasMounted: boolean;
     /**
      * Open the drawer
      */

package/dist/types/components.d.ts

@@ -370,6 +370,14 @@ export namespace Components {
           * If `true`, the card has the `selected` state and the `selected` class is applied on the host. Toggled automatically when the card is clicked (when clickable).
          */
         "selected": boolean;
+        /**
+          * Defines the selection mode. - `"single"`: only one card can be selected at a time (focus outline disabled). - `"multiple"`: multiple cards can be selected simultaneously.
+         */
+        "selectionMode"?: "single" | "multiple";
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "selection-mode"?: "single" | "multiple";
         /**
           * Specifies where to display the linked URL. Only applies when an `href` is provided. Special keywords: `"_blank"`, `"_self"`, `"_parent"`, `"_top"`.
          */
@@ -4066,6 +4074,14 @@ declare namespace LocalJSX {
           * If `true`, the card has the `selected` state and the `selected` class is applied on the host. Toggled automatically when the card is clicked (when clickable).
          */
         "selected"?: boolean;
+        /**
+          * Defines the selection mode. - `"single"`: only one card can be selected at a time (focus outline disabled). - `"multiple"`: multiple cards can be selected simultaneously.
+         */
+        "selectionMode"?: "single" | "multiple";
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "selection-mode"?: "single" | "multiple";
         /**
           * Specifies where to display the linked URL. Only applies when an `href` is provided. Special keywords: `"_blank"`, `"_self"`, `"_parent"`, `"_top"`.
          */

package/hydrate/index.js

@@ -3940,7 +3940,7 @@ class ButtonBar {
     }; }
 }
 
-const cardCss = ":host{position:relative;box-sizing:border-box;display:block;margin-bottom:var(--margin-bottom, 1rem);background:var(--road-surface);border:1px solid var(--road-outline-weak);border-radius:var(--road-spacing-02);padding:var(--road-spacing-03)}:host(.card-elevation-none){box-shadow:none}:host(.card-elevation-lowest){box-shadow:var(--road-elevation-lowest)}:host(.card-elevation-average){box-shadow:var(--road-elevation-average)}:host(.is-button){border:1px solid var(--road-outline);padding:0}:host(.is-button:hover){border:1px solid var(--road-outline-variant);outline:2px solid var(--road-button-ghost-variant)}:host(.is-button:focus-visible),:host(.is-button:focus){border:1px solid var(--road-outline);outline-offset:1px;outline:2px solid var(--road-outline-variant)}:host(.is-button.is-disabled){cursor:not-allowed;pointer-events:none;border:1px solid var(--road-surface-disabled);background:var(--road-surface-disabled)}:host(.is-button.is-disabled) .card-native,:host(.is-button.selected.is-disabled) .card-native{background:none}:host(.is-button.selected){border:2px solid var(--road-primary);outline:none}:host(.is-button.selected:hover){border:2px solid var(--road-outline-variant);outline:2px solid var(--road-button-ghost-variant)}:host(.is-button.selected:focus-visible),:host(.is-button.selected:focus){border:2px solid var(--road-outline-variant);outline-offset:1px;outline:2px solid var(--road-outline-variant)}:host(.is-button.selected.is-disabled){cursor:not-allowed;pointer-events:none;outline:none;background:var(--road-surface-disabled);border:2px solid var(--road-surface-disabled)}.card-native{box-sizing:border-box;display:block;width:100%;height:100%;padding:var(--road-spacing-06);margin:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-align:center;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;letter-spacing:inherit;white-space:inherit;background:var(--road-surface);border:0;border-radius:0.25rem;outline:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}a,button{cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}::slotted(road-icon){text-align:center}";
+const cardCss = ":host{position:relative;box-sizing:border-box;display:block;margin-bottom:var(--margin-bottom, 1rem);background:var(--road-surface);border:1px solid var(--road-outline-weak);border-radius:var(--road-spacing-02);padding:var(--road-spacing-03)}:host(.card-elevation-none){box-shadow:none}:host(.card-elevation-lowest){box-shadow:var(--road-elevation-lowest)}:host(.card-elevation-average){box-shadow:var(--road-elevation-average)}:host(.is-button){border:1px solid var(--road-outline);padding:0}:host(.is-button:hover){border:1px solid var(--road-outline-variant);outline:2px solid var(--road-button-ghost-variant)}:host(.is-button:focus-visible),:host(.is-button:focus){border:1px solid var(--road-outline);outline-offset:1px;outline:2px solid var(--road-outline-variant)}:host(.is-button.is-disabled){cursor:not-allowed;pointer-events:none;border:1px solid var(--road-surface-disabled);background:var(--road-surface-disabled)}:host(.is-button.is-disabled) .card-native,:host(.is-button.selected.is-disabled) .card-native{background:none}:host(.is-button.selected){border:2px solid var(--road-primary);outline:none}:host(.is-button.selected:hover){border:2px solid var(--road-outline-variant);outline:2px solid var(--road-button-ghost-variant)}:host(.is-button.selected:hover){border:2px solid var(--road-outline-variant);outline:2px solid var(--road-button-ghost-variant)}:host(.is-button.selected.is-single:hover){border:2px solid var(--road-primary);outline:2px solid var(--road-button-ghost-variant)}:host(.is-button.selected:focus-visible),:host(.is-button.selected:focus){border:2px solid var(--road-outline-variant);outline-offset:1px;outline:2px solid var(--road-outline-variant)}:host(.is-button.selected.is-single:focus){border:2px solid var(--road-primary);outline:2px solid var(--road-outline-variant)}:host(.is-button.selected.is-disabled){cursor:not-allowed;pointer-events:none;outline:none;background:var(--road-surface-disabled);border:2px solid var(--road-surface-disabled)}.card-native{box-sizing:border-box;display:block;width:100%;height:100%;padding:var(--road-spacing-06);margin:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-align:center;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;letter-spacing:inherit;white-space:inherit;background:var(--road-surface);border:0;border-radius:0.25rem;outline:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}a,button{cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}::slotted(road-icon){text-align:center}";
 var RoadCardStyle0 = cardCss;
 
 /**
@@ -3971,6 +3971,12 @@ class Card {
          * Only applies when in button mode (button=true and no href).
          */
         this.disabled = false;
+        /**
+         * Defines the selection mode.
+         * - `"single"`: only one card can be selected at a time (focus outline disabled).
+         * - `"multiple"`: multiple cards can be selected simultaneously.
+         */
+        this.selectionMode = "multiple";
         /**
          * The type of the button. Only used when an `onclick` or `button` property is present.
          */
@@ -3986,6 +3992,9 @@ class Card {
             }
             // Toggle selected state on click for clickable cards
             this.selected = !this.selected;
+            if (this.selectionMode === "single") {
+                e.currentTarget.blur();
+            }
             if (this.value !== undefined) {
                 this.roadcardclick.emit({
                     value: this.value,
@@ -4034,7 +4043,8 @@ class Card {
         const selectedClass = this.selected ? "selected" : "";
         const isButtonClass = isButtonMode ? "is-button" : "";
         const disabledClass = isButtonMode && this.disabled ? "is-disabled" : "";
-        return (hAsync(Host, { key: '44026953c66e6ee3421d5bbc03c92e60710feb94', class: `${elevationClass} ${selectedClass} ${isButtonClass} ${disabledClass}` }, this.renderCard()));
+        const singleClass = isButtonMode && this.selectionMode === "single" ? "is-single" : "";
+        return (hAsync(Host, { key: 'fc2636b92be59ddf232b162574c3cdd3a7042a50', class: `${elevationClass} ${selectedClass} ${isButtonClass} ${disabledClass} ${singleClass}` }, this.renderCard()));
     }
     get el() { return getElement(this); }
     static get style() { return RoadCardStyle0; }
@@ -4047,6 +4057,7 @@ class Card {
             "value": [1],
             "selected": [516],
             "disabled": [516],
+            "selectionMode": [513, "selection-mode"],
             "type": [1],
             "download": [1],
             "href": [1],
@@ -4055,7 +4066,7 @@ class Card {
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
-        "$attrsToReflect$": [["selected", "selected"], ["disabled", "disabled"]]
+        "$attrsToReflect$": [["selected", "selected"], ["disabled", "disabled"], ["selectionMode", "selection-mode"]]
     }; }
 }
 
@@ -13021,7 +13032,7 @@ var createFocusTrap = function createFocusTrap(elements, userOptions) {
   return trap;
 };
 
-const drawerCss = ":host{--background:var(--road-surface);--color:var(--road-on-surface);--header-icon:var(--road-on-surface);--header-color:var(--road-on-surface);--header-background:var(--road-surface);--header-delimiter:0;--back-chevron-color:var(--road-icon);--max-height:auto;--z-index:10;position:fixed;top:0;left:0;z-index:var(--z-index);display:flex;justify-content:flex-start;width:100%;height:100%;overflow:hidden;font-family:var(--road-font, sans-serif);line-height:1.5;color:var(--color);visibility:hidden !important;opacity:0;transition:opacity 0.3s ease-out, visibility 0s linear 0.3s}.drawer-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:block;touch-action:none;cursor:pointer;background:var(--road-overlay)}.road-drawer-wrapper{width:100%}.road-drawer-wrapper .drawer-dialog{position:absolute;right:0;width:100%;pointer-events:none;transition:transform 0.3s ease-out;transform:translateX(-100%)}:host(.drawer-right){justify-content:flex-end}:host(.drawer-right) .road-drawer-wrapper .drawer-dialog{transform:translateX(100%)}:host(.drawer-left) .road-drawer-wrapper .drawer-dialog{left:0}:host(.drawer-bottom){align-items:flex-end}:host(.drawer-bottom) .road-drawer-wrapper .drawer-dialog{width:100%;max-height:var(--max-height);transform:translateY(100%)}:host(.drawer-bottom) .drawer-content{height:auto}.drawer-content{position:relative;display:flex;flex-direction:column;width:100%;height:100vh;height:100dvh;max-height:100vh;max-height:100dvh;pointer-events:auto;background-color:var(--background);background-clip:padding-box;box-shadow:var(--road-elevation-hight)}.drawer-header{display:flex;flex-shrink:0;align-items:center;justify-content:flex-end;color:var(--header-color);background:var(--header-background);border-color:var(--road-grey-300);border-style:solid;border-width:var(--header-delimiter)}.drawer-header road-icon{flex-shrink:0;color:var(--header-icon)}.drawer-footer{padding:var(--road-spacing-05);background-color:var(--road-surface)}.drawer-footer.remove-padding{padding:0}.drawer-header-inverse{--header-icon:var(--road-on-primary);--header-color:var(--road-on-primary);--header-background:var(--road-primary-variant);margin-bottom:2.5rem}.drawer-action,.drawer-close{display:flex;align-items:center;justify-content:center;padding:0.5rem;font-family:inherit;font-size:0.875rem;color:inherit;cursor:pointer;background:transparent;border:0;appearance:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.drawer-header:not(.drawer-header-inverse) .drawer-action road-icon{color:var(--back-chevron-color)}.drawer-action~.drawer-title,.drawer-close~.drawer-title{padding-left:0}.drawer-action-left,.drawer-close-left{margin-right:auto}.drawer-title{display:flex;flex-grow:1;align-items:center;justify-content:center;padding-left:3.5rem;margin:0;font-size:var(--road-body-medium)}.drawer-body{overflow-y:auto;padding:0 var(--road-spacing-05) var(--road-spacing-05)}.drawer-body.remove-padding{padding:0}:host(.drawer-right) .drawer-body,:host(.drawer-left) .drawer-body{height:calc(100vh - 3.5rem)}.drawer-inner{padding:0 1rem 2.5rem}@media (min-width: 768px){.drawer-inner{padding:0 2rem 2.5rem}.drawer-body{padding:0 var(--road-spacing-08) var(--road-spacing-05)}.drawer-body.remove-padding{padding:0}.drawer-footer{padding:var(--road-spacing-05) var(--road-spacing-08)}.drawer-footer.remove-padding{padding:0}}:host(.drawer-open){visibility:visible !important;opacity:1;transition:opacity 0.3s ease-out, visibility 0s linear 0s}:host(.drawer-open) .road-drawer-wrapper .drawer-dialog{transform:none}";
+const drawerCss = ":host{--background:var(--road-surface);--color:var(--road-on-surface);--header-icon:var(--road-on-surface);--header-color:var(--road-on-surface);--header-background:var(--road-surface);--header-delimiter:0;--back-chevron-color:var(--road-icon);--max-height:auto;--z-index:10;position:fixed;top:0;left:0;z-index:var(--z-index);display:flex;justify-content:flex-start;width:100%;height:100%;overflow:hidden;font-family:var(--road-font, sans-serif);line-height:1.5;color:var(--color);visibility:hidden !important;transition:visibility 0s linear 0.3s}.drawer-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:block;touch-action:none;cursor:pointer;background:var(--road-overlay);opacity:0}.road-drawer-wrapper{width:100%}.road-drawer-wrapper .drawer-dialog{position:absolute;right:0;width:100%;pointer-events:none;transition:transform 0.3s ease-out;opacity:0;transform:translateX(-100%)}:host(.drawer-right){justify-content:flex-end}:host(.drawer-right) .road-drawer-wrapper .drawer-dialog{transform:translateX(100%)}:host(.drawer-left) .road-drawer-wrapper .drawer-dialog{left:0}:host(.drawer-bottom){align-items:flex-end}:host(.drawer-bottom) .road-drawer-wrapper .drawer-dialog{width:100%;max-height:var(--max-height);transform:translateY(100%)}:host(.drawer-bottom) .drawer-content{height:auto}.drawer-content{position:relative;display:flex;flex-direction:column;width:100%;height:100vh;height:100dvh;max-height:100vh;max-height:100dvh;pointer-events:auto;background-color:var(--background);background-clip:padding-box;box-shadow:var(--road-elevation-hight)}.drawer-header{display:flex;flex-shrink:0;align-items:center;justify-content:flex-end;color:var(--header-color);background:var(--header-background);border-color:var(--road-grey-300);border-style:solid;border-width:var(--header-delimiter)}.drawer-header road-icon{flex-shrink:0;color:var(--header-icon)}.drawer-footer{padding:var(--road-spacing-05);background-color:var(--road-surface)}.drawer-footer.remove-padding{padding:0}.drawer-header-inverse{--header-icon:var(--road-on-primary);--header-color:var(--road-on-primary);--header-background:var(--road-primary-variant);margin-bottom:2.5rem}.drawer-action,.drawer-close{display:flex;align-items:center;justify-content:center;padding:0.5rem;font-family:inherit;font-size:0.875rem;color:inherit;cursor:pointer;background:transparent;border:0;appearance:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.drawer-header:not(.drawer-header-inverse) .drawer-action road-icon{color:var(--back-chevron-color)}.drawer-action~.drawer-title,.drawer-close~.drawer-title{padding-left:0}.drawer-action-left,.drawer-close-left{margin-right:auto}.drawer-title{display:flex;flex-grow:1;align-items:center;justify-content:center;padding-left:3.5rem;margin:0;font-size:var(--road-body-medium)}.drawer-body{overflow-y:auto;padding:0 var(--road-spacing-05) var(--road-spacing-05)}.drawer-body.remove-padding{padding:0}:host(.drawer-right) .drawer-body,:host(.drawer-left) .drawer-body{height:calc(100vh - 3.5rem)}.drawer-inner{padding:0 1rem 2.5rem}@media (min-width: 768px){.drawer-inner{padding:0 2rem 2.5rem}.drawer-body{padding:0 var(--road-spacing-08) var(--road-spacing-05)}.drawer-body.remove-padding{padding:0}.drawer-footer{padding:var(--road-spacing-05) var(--road-spacing-08)}.drawer-footer.remove-padding{padding:0}}:host(.drawer-open){visibility:visible !important;transition:visibility 0s linear 0s}:host(.drawer-open) .drawer-overlay,:host(.drawer-open) .drawer-dialog{opacity:1}:host(.drawer-open) .road-drawer-wrapper .drawer-dialog{transform:none}@media (prefers-reduced-motion: no-preference){:host(.drawer-open) .drawer-overlay,:host(.drawer-open) .drawer-dialog{animation:road-drawer-fade-in 0.3s ease-out both}.drawer-overlay,.drawer-dialog{animation:road-drawer-fade-out 0.3s ease-out both}@keyframes road-drawer-fade-in{from{opacity:0}to{opacity:1}}@keyframes road-drawer-fade-out{from{opacity:1}to{opacity:0}}}";
 var RoadDrawerStyle0 = drawerCss;
 
 /**
@@ -13079,6 +13090,11 @@ class Drawer {
          * Footer Content state
          */
         this.hasFooterContent = false;
+        /**
+         * Used to ensure open transitions run when the drawer
+         * is initially mounted with `isOpen=true`.
+         */
+        this.hasMounted = false;
         this.onFooterSlotChange = (event) => {
             const slot = event.target;
             this.hasFooterContent = slot.assignedElements().length > 0;
@@ -13175,18 +13191,19 @@ class Drawer {
         }, 100); // Timeout is used to ensure the drawer has been rendered when client wants to update the property at the same time
     }
     handleOpen(openValue) {
-        var _a;
+        var _a, _b;
+        const dialog = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.drawer-dialog');
         if (openValue === true) {
             this.onOpen.emit();
-            this.el.addEventListener("transitionend", () => {
+            dialog === null || dialog === void 0 ? void 0 : dialog.addEventListener("transitionend", () => {
                 if (this.enabledFocusTrap) {
                     this.getOrCreateFocusTrap().activate();
                 }
             }, { once: true });
         }
         else {
-            (_a = this.focusTrap) === null || _a === void 0 ? void 0 : _a.deactivate();
-            this.el.addEventListener("transitionend", () => {
+            (_b = this.focusTrap) === null || _b === void 0 ? void 0 : _b.deactivate();
+            dialog === null || dialog === void 0 ? void 0 : dialog.addEventListener("transitionend", () => {
                 this.onClose.emit();
                 this.el.shadowRoot &&
                     (this.el.shadowRoot.querySelector(".drawer-body").scrollTop = 0);
@@ -13205,9 +13222,14 @@ class Drawer {
         this.el.querySelectorAll('[data-dismiss="modal"]').forEach((item) => {
             item.addEventListener("click", () => this.close());
         });
-        if (this.isOpen) {
-            this.handleOpen(true);
-        }
+        // Wait for the first paint so the "closed" transform can be applied,
+        // then open on the next frame to allow CSS transitions to run.
+        requestAnimationFrame(() => {
+            this.hasMounted = true;
+            if (this.isOpen) {
+                this.handleOpen(true);
+            }
+        });
     }
     getOrCreateFocusTrap(elements) {
         var _a;
@@ -13237,7 +13259,8 @@ class Drawer {
     }
     render() {
         var _a, _b, _c;
-        const drawerIsOpenClass = this.isOpen ? "drawer-open" : "";
+        const isEffectivelyOpen = this.isOpen && this.hasMounted;
+        const drawerIsOpenClass = isEffectivelyOpen ? "drawer-open" : "";
         const removePaddingClass = this.removePadding ? "remove-padding" : "";
         const inverseHeaderClass = this.hasInverseHeader
             ? "drawer-header-inverse"
@@ -13249,7 +13272,7 @@ class Drawer {
         const backIconElement = this.hasBackIcon ? (hAsync("button", { type: "button", class: "drawer-action", "aria-label": ariaLabelBack, onClick: this.onClickBack }, hAsync("road-icon", { icon: navigationChevron, rotate: "180" }), this.backText)) : null;
         const closeIconElement = this.hasCloseIcon ? (hAsync("button", { type: "button", class: "drawer-close", onClick: this.onClick, "aria-label": ariaLabelClose }, hAsync("road-icon", { icon: navigationClose, "aria-hidden": "true" }))) : null;
         const drawerWidthValue = this.position === "bottom" ? "100%" : `${this.drawerWidth}px`;
-        return (hAsync(Host, { key: 'c7eb453776139d160c5304536e79ab0af0232290', class: `${drawerIsOpenClass}  drawer-${this.position}`, tabindex: "0", role: "dialog", "aria-label": ariaLabel }, hAsync("div", { key: 'af1efa519efd2b12f49475d5a84c90767beeacf0', class: "road-drawer-wrapper" }, hAsync("div", { key: 'c43ce7162e3616b51b9e668a459d8c729b1f414f', class: "drawer-overlay", onClick: this.onClick, tabindex: "-1" }), hAsync("div", { key: '5c69c051e7c1eb827d2df487f58f8c5237388a7f', class: "drawer-dialog", style: { maxWidth: drawerWidthValue }, role: "document" }, hAsync("div", { key: 'fa483418e0660b8c2fdb79838581650e5f0b1174', class: "drawer-content" }, hAsync("header", { key: 'cdc22b61772f7f425f4d5f41c2ceb3d6b2d8478b', class: `drawer-header ${inverseHeaderClass} ${drawerDelimiterClass}` }, backIconElement, this.drawerTitle ? (hAsync("h2", { class: "drawer-title" }, this.drawerTitle)) : (hAsync("div", { class: "drawer-title" }, hAsync("slot", { name: "title" }))), closeIconElement), hAsync("div", { key: '6d44de12a434ea729754187aca476c78e6e0e7a7', class: `drawer-body ${removePaddingClass}` }, hAsync("slot", { key: 'dfe2557f8ddffb9a8b6b9ed41661c726c650bd6b' })), hAsync("footer", { key: '7cd86ddeb089a5b06649a993a6315a317b543863', class: `drawer-footer ${removePaddingClass}`, hidden: !this.hasFooterContent }, hAsync("slot", { key: '58fa205ff641909acb5d1d12d660024e50ab4058', name: "footer", onSlotchange: this.onFooterSlotChange })))))));
+        return (hAsync(Host, { key: 'ecd747ab4372bed7cefb4647dfaf9404c7206b53', class: `${drawerIsOpenClass}  drawer-${this.position}`, tabindex: "0", role: "dialog", "aria-label": ariaLabel }, hAsync("div", { key: '1d5760b82a095696e30867669f607d5c3608c308', class: "road-drawer-wrapper" }, hAsync("div", { key: '4d519361b71dd228e7a35a1ee20f741911e0752f', class: "drawer-overlay", onClick: this.onClick, tabindex: "-1" }), hAsync("div", { key: '36dc3dac85b6784b66f5a12476be608d2b43c40c', class: "drawer-dialog", style: { maxWidth: drawerWidthValue }, role: "document" }, hAsync("div", { key: '74a7d03928a6919fa6cd95c6a66a61c9bf225e20', class: "drawer-content" }, hAsync("header", { key: 'f4c543d1ea08ee62ea3a9f93e34499a7f5c81fa5', class: `drawer-header ${inverseHeaderClass} ${drawerDelimiterClass}` }, backIconElement, this.drawerTitle ? (hAsync("h2", { class: "drawer-title" }, this.drawerTitle)) : (hAsync("div", { class: "drawer-title" }, hAsync("slot", { name: "title" }))), closeIconElement), hAsync("div", { key: '796030c5a5cf6661aa4c1f4c10cc039e0e550d4c', class: `drawer-body ${removePaddingClass}` }, hAsync("slot", { key: '8c0bdfa660ace789ea5a01ada7ce3cd9c5cc3d4a' })), hAsync("footer", { key: 'a52a747ea4c5de885fc440ac4f8247f5c9ab88b0', class: `drawer-footer ${removePaddingClass}`, hidden: !this.hasFooterContent }, hAsync("slot", { key: '0bef80d08a9e6078f025768eb88f93df86517fb9', name: "footer", onSlotchange: this.onFooterSlotChange })))))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -13277,6 +13300,7 @@ class Drawer {
             "whitelistSelectors": [1040],
             "focusTrap": [32],
             "hasFooterContent": [32],
+            "hasMounted": [32],
             "open": [64],
             "close": [64],
             "back": [64],

package/hydrate/index.mjs

@@ -3936,7 +3936,7 @@ class ButtonBar {
     }; }
 }
 
-const cardCss = ":host{position:relative;box-sizing:border-box;display:block;margin-bottom:var(--margin-bottom, 1rem);background:var(--road-surface);border:1px solid var(--road-outline-weak);border-radius:var(--road-spacing-02);padding:var(--road-spacing-03)}:host(.card-elevation-none){box-shadow:none}:host(.card-elevation-lowest){box-shadow:var(--road-elevation-lowest)}:host(.card-elevation-average){box-shadow:var(--road-elevation-average)}:host(.is-button){border:1px solid var(--road-outline);padding:0}:host(.is-button:hover){border:1px solid var(--road-outline-variant);outline:2px solid var(--road-button-ghost-variant)}:host(.is-button:focus-visible),:host(.is-button:focus){border:1px solid var(--road-outline);outline-offset:1px;outline:2px solid var(--road-outline-variant)}:host(.is-button.is-disabled){cursor:not-allowed;pointer-events:none;border:1px solid var(--road-surface-disabled);background:var(--road-surface-disabled)}:host(.is-button.is-disabled) .card-native,:host(.is-button.selected.is-disabled) .card-native{background:none}:host(.is-button.selected){border:2px solid var(--road-primary);outline:none}:host(.is-button.selected:hover){border:2px solid var(--road-outline-variant);outline:2px solid var(--road-button-ghost-variant)}:host(.is-button.selected:focus-visible),:host(.is-button.selected:focus){border:2px solid var(--road-outline-variant);outline-offset:1px;outline:2px solid var(--road-outline-variant)}:host(.is-button.selected.is-disabled){cursor:not-allowed;pointer-events:none;outline:none;background:var(--road-surface-disabled);border:2px solid var(--road-surface-disabled)}.card-native{box-sizing:border-box;display:block;width:100%;height:100%;padding:var(--road-spacing-06);margin:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-align:center;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;letter-spacing:inherit;white-space:inherit;background:var(--road-surface);border:0;border-radius:0.25rem;outline:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}a,button{cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}::slotted(road-icon){text-align:center}";
+const cardCss = ":host{position:relative;box-sizing:border-box;display:block;margin-bottom:var(--margin-bottom, 1rem);background:var(--road-surface);border:1px solid var(--road-outline-weak);border-radius:var(--road-spacing-02);padding:var(--road-spacing-03)}:host(.card-elevation-none){box-shadow:none}:host(.card-elevation-lowest){box-shadow:var(--road-elevation-lowest)}:host(.card-elevation-average){box-shadow:var(--road-elevation-average)}:host(.is-button){border:1px solid var(--road-outline);padding:0}:host(.is-button:hover){border:1px solid var(--road-outline-variant);outline:2px solid var(--road-button-ghost-variant)}:host(.is-button:focus-visible),:host(.is-button:focus){border:1px solid var(--road-outline);outline-offset:1px;outline:2px solid var(--road-outline-variant)}:host(.is-button.is-disabled){cursor:not-allowed;pointer-events:none;border:1px solid var(--road-surface-disabled);background:var(--road-surface-disabled)}:host(.is-button.is-disabled) .card-native,:host(.is-button.selected.is-disabled) .card-native{background:none}:host(.is-button.selected){border:2px solid var(--road-primary);outline:none}:host(.is-button.selected:hover){border:2px solid var(--road-outline-variant);outline:2px solid var(--road-button-ghost-variant)}:host(.is-button.selected:hover){border:2px solid var(--road-outline-variant);outline:2px solid var(--road-button-ghost-variant)}:host(.is-button.selected.is-single:hover){border:2px solid var(--road-primary);outline:2px solid var(--road-button-ghost-variant)}:host(.is-button.selected:focus-visible),:host(.is-button.selected:focus){border:2px solid var(--road-outline-variant);outline-offset:1px;outline:2px solid var(--road-outline-variant)}:host(.is-button.selected.is-single:focus){border:2px solid var(--road-primary);outline:2px solid var(--road-outline-variant)}:host(.is-button.selected.is-disabled){cursor:not-allowed;pointer-events:none;outline:none;background:var(--road-surface-disabled);border:2px solid var(--road-surface-disabled)}.card-native{box-sizing:border-box;display:block;width:100%;height:100%;padding:var(--road-spacing-06);margin:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-align:center;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;letter-spacing:inherit;white-space:inherit;background:var(--road-surface);border:0;border-radius:0.25rem;outline:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}a,button{cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}::slotted(road-icon){text-align:center}";
 var RoadCardStyle0 = cardCss;
 
 /**
@@ -3967,6 +3967,12 @@ class Card {
          * Only applies when in button mode (button=true and no href).
          */
         this.disabled = false;
+        /**
+         * Defines the selection mode.
+         * - `"single"`: only one card can be selected at a time (focus outline disabled).
+         * - `"multiple"`: multiple cards can be selected simultaneously.
+         */
+        this.selectionMode = "multiple";
         /**
          * The type of the button. Only used when an `onclick` or `button` property is present.
          */
@@ -3982,6 +3988,9 @@ class Card {
             }
             // Toggle selected state on click for clickable cards
             this.selected = !this.selected;
+            if (this.selectionMode === "single") {
+                e.currentTarget.blur();
+            }
             if (this.value !== undefined) {
                 this.roadcardclick.emit({
                     value: this.value,
@@ -4030,7 +4039,8 @@ class Card {
         const selectedClass = this.selected ? "selected" : "";
         const isButtonClass = isButtonMode ? "is-button" : "";
         const disabledClass = isButtonMode && this.disabled ? "is-disabled" : "";
-        return (hAsync(Host, { key: '44026953c66e6ee3421d5bbc03c92e60710feb94', class: `${elevationClass} ${selectedClass} ${isButtonClass} ${disabledClass}` }, this.renderCard()));
+        const singleClass = isButtonMode && this.selectionMode === "single" ? "is-single" : "";
+        return (hAsync(Host, { key: 'fc2636b92be59ddf232b162574c3cdd3a7042a50', class: `${elevationClass} ${selectedClass} ${isButtonClass} ${disabledClass} ${singleClass}` }, this.renderCard()));
     }
     get el() { return getElement(this); }
     static get style() { return RoadCardStyle0; }
@@ -4043,6 +4053,7 @@ class Card {
             "value": [1],
             "selected": [516],
             "disabled": [516],
+            "selectionMode": [513, "selection-mode"],
             "type": [1],
             "download": [1],
             "href": [1],
@@ -4051,7 +4062,7 @@ class Card {
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
-        "$attrsToReflect$": [["selected", "selected"], ["disabled", "disabled"]]
+        "$attrsToReflect$": [["selected", "selected"], ["disabled", "disabled"], ["selectionMode", "selection-mode"]]
     }; }
 }
 
@@ -13017,7 +13028,7 @@ var createFocusTrap = function createFocusTrap(elements, userOptions) {
   return trap;
 };
 
-const drawerCss = ":host{--background:var(--road-surface);--color:var(--road-on-surface);--header-icon:var(--road-on-surface);--header-color:var(--road-on-surface);--header-background:var(--road-surface);--header-delimiter:0;--back-chevron-color:var(--road-icon);--max-height:auto;--z-index:10;position:fixed;top:0;left:0;z-index:var(--z-index);display:flex;justify-content:flex-start;width:100%;height:100%;overflow:hidden;font-family:var(--road-font, sans-serif);line-height:1.5;color:var(--color);visibility:hidden !important;opacity:0;transition:opacity 0.3s ease-out, visibility 0s linear 0.3s}.drawer-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:block;touch-action:none;cursor:pointer;background:var(--road-overlay)}.road-drawer-wrapper{width:100%}.road-drawer-wrapper .drawer-dialog{position:absolute;right:0;width:100%;pointer-events:none;transition:transform 0.3s ease-out;transform:translateX(-100%)}:host(.drawer-right){justify-content:flex-end}:host(.drawer-right) .road-drawer-wrapper .drawer-dialog{transform:translateX(100%)}:host(.drawer-left) .road-drawer-wrapper .drawer-dialog{left:0}:host(.drawer-bottom){align-items:flex-end}:host(.drawer-bottom) .road-drawer-wrapper .drawer-dialog{width:100%;max-height:var(--max-height);transform:translateY(100%)}:host(.drawer-bottom) .drawer-content{height:auto}.drawer-content{position:relative;display:flex;flex-direction:column;width:100%;height:100vh;height:100dvh;max-height:100vh;max-height:100dvh;pointer-events:auto;background-color:var(--background);background-clip:padding-box;box-shadow:var(--road-elevation-hight)}.drawer-header{display:flex;flex-shrink:0;align-items:center;justify-content:flex-end;color:var(--header-color);background:var(--header-background);border-color:var(--road-grey-300);border-style:solid;border-width:var(--header-delimiter)}.drawer-header road-icon{flex-shrink:0;color:var(--header-icon)}.drawer-footer{padding:var(--road-spacing-05);background-color:var(--road-surface)}.drawer-footer.remove-padding{padding:0}.drawer-header-inverse{--header-icon:var(--road-on-primary);--header-color:var(--road-on-primary);--header-background:var(--road-primary-variant);margin-bottom:2.5rem}.drawer-action,.drawer-close{display:flex;align-items:center;justify-content:center;padding:0.5rem;font-family:inherit;font-size:0.875rem;color:inherit;cursor:pointer;background:transparent;border:0;appearance:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.drawer-header:not(.drawer-header-inverse) .drawer-action road-icon{color:var(--back-chevron-color)}.drawer-action~.drawer-title,.drawer-close~.drawer-title{padding-left:0}.drawer-action-left,.drawer-close-left{margin-right:auto}.drawer-title{display:flex;flex-grow:1;align-items:center;justify-content:center;padding-left:3.5rem;margin:0;font-size:var(--road-body-medium)}.drawer-body{overflow-y:auto;padding:0 var(--road-spacing-05) var(--road-spacing-05)}.drawer-body.remove-padding{padding:0}:host(.drawer-right) .drawer-body,:host(.drawer-left) .drawer-body{height:calc(100vh - 3.5rem)}.drawer-inner{padding:0 1rem 2.5rem}@media (min-width: 768px){.drawer-inner{padding:0 2rem 2.5rem}.drawer-body{padding:0 var(--road-spacing-08) var(--road-spacing-05)}.drawer-body.remove-padding{padding:0}.drawer-footer{padding:var(--road-spacing-05) var(--road-spacing-08)}.drawer-footer.remove-padding{padding:0}}:host(.drawer-open){visibility:visible !important;opacity:1;transition:opacity 0.3s ease-out, visibility 0s linear 0s}:host(.drawer-open) .road-drawer-wrapper .drawer-dialog{transform:none}";
+const drawerCss = ":host{--background:var(--road-surface);--color:var(--road-on-surface);--header-icon:var(--road-on-surface);--header-color:var(--road-on-surface);--header-background:var(--road-surface);--header-delimiter:0;--back-chevron-color:var(--road-icon);--max-height:auto;--z-index:10;position:fixed;top:0;left:0;z-index:var(--z-index);display:flex;justify-content:flex-start;width:100%;height:100%;overflow:hidden;font-family:var(--road-font, sans-serif);line-height:1.5;color:var(--color);visibility:hidden !important;transition:visibility 0s linear 0.3s}.drawer-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:block;touch-action:none;cursor:pointer;background:var(--road-overlay);opacity:0}.road-drawer-wrapper{width:100%}.road-drawer-wrapper .drawer-dialog{position:absolute;right:0;width:100%;pointer-events:none;transition:transform 0.3s ease-out;opacity:0;transform:translateX(-100%)}:host(.drawer-right){justify-content:flex-end}:host(.drawer-right) .road-drawer-wrapper .drawer-dialog{transform:translateX(100%)}:host(.drawer-left) .road-drawer-wrapper .drawer-dialog{left:0}:host(.drawer-bottom){align-items:flex-end}:host(.drawer-bottom) .road-drawer-wrapper .drawer-dialog{width:100%;max-height:var(--max-height);transform:translateY(100%)}:host(.drawer-bottom) .drawer-content{height:auto}.drawer-content{position:relative;display:flex;flex-direction:column;width:100%;height:100vh;height:100dvh;max-height:100vh;max-height:100dvh;pointer-events:auto;background-color:var(--background);background-clip:padding-box;box-shadow:var(--road-elevation-hight)}.drawer-header{display:flex;flex-shrink:0;align-items:center;justify-content:flex-end;color:var(--header-color);background:var(--header-background);border-color:var(--road-grey-300);border-style:solid;border-width:var(--header-delimiter)}.drawer-header road-icon{flex-shrink:0;color:var(--header-icon)}.drawer-footer{padding:var(--road-spacing-05);background-color:var(--road-surface)}.drawer-footer.remove-padding{padding:0}.drawer-header-inverse{--header-icon:var(--road-on-primary);--header-color:var(--road-on-primary);--header-background:var(--road-primary-variant);margin-bottom:2.5rem}.drawer-action,.drawer-close{display:flex;align-items:center;justify-content:center;padding:0.5rem;font-family:inherit;font-size:0.875rem;color:inherit;cursor:pointer;background:transparent;border:0;appearance:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.drawer-header:not(.drawer-header-inverse) .drawer-action road-icon{color:var(--back-chevron-color)}.drawer-action~.drawer-title,.drawer-close~.drawer-title{padding-left:0}.drawer-action-left,.drawer-close-left{margin-right:auto}.drawer-title{display:flex;flex-grow:1;align-items:center;justify-content:center;padding-left:3.5rem;margin:0;font-size:var(--road-body-medium)}.drawer-body{overflow-y:auto;padding:0 var(--road-spacing-05) var(--road-spacing-05)}.drawer-body.remove-padding{padding:0}:host(.drawer-right) .drawer-body,:host(.drawer-left) .drawer-body{height:calc(100vh - 3.5rem)}.drawer-inner{padding:0 1rem 2.5rem}@media (min-width: 768px){.drawer-inner{padding:0 2rem 2.5rem}.drawer-body{padding:0 var(--road-spacing-08) var(--road-spacing-05)}.drawer-body.remove-padding{padding:0}.drawer-footer{padding:var(--road-spacing-05) var(--road-spacing-08)}.drawer-footer.remove-padding{padding:0}}:host(.drawer-open){visibility:visible !important;transition:visibility 0s linear 0s}:host(.drawer-open) .drawer-overlay,:host(.drawer-open) .drawer-dialog{opacity:1}:host(.drawer-open) .road-drawer-wrapper .drawer-dialog{transform:none}@media (prefers-reduced-motion: no-preference){:host(.drawer-open) .drawer-overlay,:host(.drawer-open) .drawer-dialog{animation:road-drawer-fade-in 0.3s ease-out both}.drawer-overlay,.drawer-dialog{animation:road-drawer-fade-out 0.3s ease-out both}@keyframes road-drawer-fade-in{from{opacity:0}to{opacity:1}}@keyframes road-drawer-fade-out{from{opacity:1}to{opacity:0}}}";
 var RoadDrawerStyle0 = drawerCss;
 
 /**
@@ -13075,6 +13086,11 @@ class Drawer {
          * Footer Content state
          */
         this.hasFooterContent = false;
+        /**
+         * Used to ensure open transitions run when the drawer
+         * is initially mounted with `isOpen=true`.
+         */
+        this.hasMounted = false;
         this.onFooterSlotChange = (event) => {
             const slot = event.target;
             this.hasFooterContent = slot.assignedElements().length > 0;
@@ -13171,18 +13187,19 @@ class Drawer {
         }, 100); // Timeout is used to ensure the drawer has been rendered when client wants to update the property at the same time
     }
     handleOpen(openValue) {
-        var _a;
+        var _a, _b;
+        const dialog = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.drawer-dialog');
         if (openValue === true) {
             this.onOpen.emit();
-            this.el.addEventListener("transitionend", () => {
+            dialog === null || dialog === void 0 ? void 0 : dialog.addEventListener("transitionend", () => {
                 if (this.enabledFocusTrap) {
                     this.getOrCreateFocusTrap().activate();
                 }
             }, { once: true });
         }
         else {
-            (_a = this.focusTrap) === null || _a === void 0 ? void 0 : _a.deactivate();
-            this.el.addEventListener("transitionend", () => {
+            (_b = this.focusTrap) === null || _b === void 0 ? void 0 : _b.deactivate();
+            dialog === null || dialog === void 0 ? void 0 : dialog.addEventListener("transitionend", () => {
                 this.onClose.emit();
                 this.el.shadowRoot &&
                     (this.el.shadowRoot.querySelector(".drawer-body").scrollTop = 0);
@@ -13201,9 +13218,14 @@ class Drawer {
         this.el.querySelectorAll('[data-dismiss="modal"]').forEach((item) => {
             item.addEventListener("click", () => this.close());
         });
-        if (this.isOpen) {
-            this.handleOpen(true);
-        }
+        // Wait for the first paint so the "closed" transform can be applied,
+        // then open on the next frame to allow CSS transitions to run.
+        requestAnimationFrame(() => {
+            this.hasMounted = true;
+            if (this.isOpen) {
+                this.handleOpen(true);
+            }
+        });
     }
     getOrCreateFocusTrap(elements) {
         var _a;
@@ -13233,7 +13255,8 @@ class Drawer {
     }
     render() {
         var _a, _b, _c;
-        const drawerIsOpenClass = this.isOpen ? "drawer-open" : "";
+        const isEffectivelyOpen = this.isOpen && this.hasMounted;
+        const drawerIsOpenClass = isEffectivelyOpen ? "drawer-open" : "";
         const removePaddingClass = this.removePadding ? "remove-padding" : "";
         const inverseHeaderClass = this.hasInverseHeader
             ? "drawer-header-inverse"
@@ -13245,7 +13268,7 @@ class Drawer {
         const backIconElement = this.hasBackIcon ? (hAsync("button", { type: "button", class: "drawer-action", "aria-label": ariaLabelBack, onClick: this.onClickBack }, hAsync("road-icon", { icon: navigationChevron, rotate: "180" }), this.backText)) : null;
         const closeIconElement = this.hasCloseIcon ? (hAsync("button", { type: "button", class: "drawer-close", onClick: this.onClick, "aria-label": ariaLabelClose }, hAsync("road-icon", { icon: navigationClose, "aria-hidden": "true" }))) : null;
         const drawerWidthValue = this.position === "bottom" ? "100%" : `${this.drawerWidth}px`;
-        return (hAsync(Host, { key: 'c7eb453776139d160c5304536e79ab0af0232290', class: `${drawerIsOpenClass}  drawer-${this.position}`, tabindex: "0", role: "dialog", "aria-label": ariaLabel }, hAsync("div", { key: 'af1efa519efd2b12f49475d5a84c90767beeacf0', class: "road-drawer-wrapper" }, hAsync("div", { key: 'c43ce7162e3616b51b9e668a459d8c729b1f414f', class: "drawer-overlay", onClick: this.onClick, tabindex: "-1" }), hAsync("div", { key: '5c69c051e7c1eb827d2df487f58f8c5237388a7f', class: "drawer-dialog", style: { maxWidth: drawerWidthValue }, role: "document" }, hAsync("div", { key: 'fa483418e0660b8c2fdb79838581650e5f0b1174', class: "drawer-content" }, hAsync("header", { key: 'cdc22b61772f7f425f4d5f41c2ceb3d6b2d8478b', class: `drawer-header ${inverseHeaderClass} ${drawerDelimiterClass}` }, backIconElement, this.drawerTitle ? (hAsync("h2", { class: "drawer-title" }, this.drawerTitle)) : (hAsync("div", { class: "drawer-title" }, hAsync("slot", { name: "title" }))), closeIconElement), hAsync("div", { key: '6d44de12a434ea729754187aca476c78e6e0e7a7', class: `drawer-body ${removePaddingClass}` }, hAsync("slot", { key: 'dfe2557f8ddffb9a8b6b9ed41661c726c650bd6b' })), hAsync("footer", { key: '7cd86ddeb089a5b06649a993a6315a317b543863', class: `drawer-footer ${removePaddingClass}`, hidden: !this.hasFooterContent }, hAsync("slot", { key: '58fa205ff641909acb5d1d12d660024e50ab4058', name: "footer", onSlotchange: this.onFooterSlotChange })))))));
+        return (hAsync(Host, { key: 'ecd747ab4372bed7cefb4647dfaf9404c7206b53', class: `${drawerIsOpenClass}  drawer-${this.position}`, tabindex: "0", role: "dialog", "aria-label": ariaLabel }, hAsync("div", { key: '1d5760b82a095696e30867669f607d5c3608c308', class: "road-drawer-wrapper" }, hAsync("div", { key: '4d519361b71dd228e7a35a1ee20f741911e0752f', class: "drawer-overlay", onClick: this.onClick, tabindex: "-1" }), hAsync("div", { key: '36dc3dac85b6784b66f5a12476be608d2b43c40c', class: "drawer-dialog", style: { maxWidth: drawerWidthValue }, role: "document" }, hAsync("div", { key: '74a7d03928a6919fa6cd95c6a66a61c9bf225e20', class: "drawer-content" }, hAsync("header", { key: 'f4c543d1ea08ee62ea3a9f93e34499a7f5c81fa5', class: `drawer-header ${inverseHeaderClass} ${drawerDelimiterClass}` }, backIconElement, this.drawerTitle ? (hAsync("h2", { class: "drawer-title" }, this.drawerTitle)) : (hAsync("div", { class: "drawer-title" }, hAsync("slot", { name: "title" }))), closeIconElement), hAsync("div", { key: '796030c5a5cf6661aa4c1f4c10cc039e0e550d4c', class: `drawer-body ${removePaddingClass}` }, hAsync("slot", { key: '8c0bdfa660ace789ea5a01ada7ce3cd9c5cc3d4a' })), hAsync("footer", { key: 'a52a747ea4c5de885fc440ac4f8247f5c9ab88b0', class: `drawer-footer ${removePaddingClass}`, hidden: !this.hasFooterContent }, hAsync("slot", { key: '0bef80d08a9e6078f025768eb88f93df86517fb9', name: "footer", onSlotchange: this.onFooterSlotChange })))))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -13273,6 +13296,7 @@ class Drawer {
             "whitelistSelectors": [1040],
             "focusTrap": [32],
             "hasFooterContent": [32],
+            "hasMounted": [32],
             "open": [64],
             "close": [64],
             "back": [64],

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@roadtrip/components",
-  "version": "3.52.0",
+  "version": "3.53.0",
   "description": "Web Component library for Roadtrip Design System",
   "license": "Apache-2.0",
   "homepage": "https://gitlab.com/mobivia/driverservices/experience-platform/roadtrip/components",