https://cdn.ui.porsche.com/porsche-design-system/components/porsch…esign-system.flyout.4d1fcf1fed23e7e403d6.js

1"use strict";(self.webpackChunkPorscheDesignSystem_4_5_0=self.webpackChunkPorscheDesignSystem_4_5_0||[]).push([["flyout"],{3612(t,e,o){var r=o(6410);o.d(e,["p",0,t=>{if(t)return Object.fromEntries(Object.entries((0,r.e)(t)).map(([t,e])=>[t,"boolean"==typeof e?`${e}`:e]))},"s",0,(...t)=>t.filter(Boolean).join(" ")||null])},3933(t,e,o){o.d(e,["b",0,"--p-blur-frosted"])},2975(t,e,o){o.d(e,["c",0,"--p-color-canvas"])},1042(t,e,o){o.d(e,["c",0,"--p-color-frosted"])},4682(t,e,o){o.d(e,["c",0,"--p-color-frosted-strong"])},1039(t,e,o){o.d(e,["c",0,"--p-color-primary"])},6295(t,e,o){o.d(e,["c",0,"--p-color-surface"])},6685(t,e,o){const r=t=>{const e=t.trim(),o=Number.parseFloat(e);return Number.isNaN(o)?0:e.endsWith("ms")?o:1e3*o},i="overlay: auto",s="transition-behavior: allow-discrete";o.d(e,["c",0,t=>{const{getElement:e,isShown:o,show:n,hide:a}=t;let d;const l=()=>{d&&(clearTimeout(d),d=void 0)};return{requestShow:()=>{l(),o()||n()},requestHide:()=>{if(o())if("undefined"!=typeof CSS&&CSS.supports(i)&&CSS.supports(s))a();else{l();const t=e(),i=(t?(t=>{const{transitionDuration:e,transitionDelay:o}=getComputedStyle(t),i=e.split(","),s=o.split(",");return i.reduce((t,e,o)=>{const i=r(e)+r(s[o]??"0s");return i>t?i:t},0)})(t):0)+50;d=setTimeout(()=>{l(),o()&&a()},i)}},cancel:l}},"o",0,t=>({[`@supports (${i}) and (${s})`]:t})])},8223(t,e,o){var r=o(6410),i=o(3728),s=o(4247),n=o(6685),a=o(3827),d=o(1039),l=o(7362),c=o(4265),h=o(3933),p=o(1864),u=o(2640),b=o(1042),g=o(1736),f=o(8044),m=o(6295),k=o(2975),v=o(7202),$=o(845);const y=t=>{const e=t.target;return"scroller"===e.className||"DIALOG"===e.tagName},x="--_p-dialog-a",w=(0,s.r)(g.r),C=(0,s.r)(l.s),S=`calc(${w} + ${(0,s.r)(l.s)})`,D=(0,s.r)(c.s);o.d(e,["B",0,["blur","shading"],"D",0,({inert:t,dialogRef:e,scrollerRef:o,containerClass:s,ariaAttributes:n,onCancel:a,onClick:d,onMouseDown:l,onTransitionEnd:c,onDismiss:h,dismissable:p=!1,header:u,footer:b,subFooter:g},f)=>(0,r.u)("dialog",{inert:t,tabIndex:-1,ref:e,onCancel:a,onMouseDown:l,onClick:d,onTransitionEnd:c,...n??{}},(0,r.u)("div",{class:"scroller",ref:o},(0,r.u)("div",{class:s},p&&(0,r.u)(i.F,{label:`Dismiss ${s}`,onClick:h}),u,f,b,g))),"a",0,()=>({color:(0,s.r)(d.c),background:(0,s.r)(x)}),"b",0,(t,e)=>{const o=t?"moderate":"short",r=t?"in":"out";return{...t?{opacity:1,transform:"translate3d(0,0,0)"}:{opacity:0,transform:"^"===e?"translate3d(0,25vh,0)":`translate3d(${">"===e?"-":""}100%,0,0)`,"&:dir(rtl)":{transform:"^"===e?"translate3d(0,25vh,0)":`translate3d(${">"===e?"":"-"}100%,0,0)`}},transition:`${(0,s.c)("opacity",o,r)}, ${(0,s.c)("transform",o,r)}`}},"c",0,t=>{const e="rgba(255,255,255,.01)";return{position:"absolute",isolation:"isolate",display:"grid",..."fullscreen"===t?{inset:0}:{insetBlock:0,["start"===t?"insetInlineStart":"insetInlineEnd"]:0},overflow:"hidden auto",overscrollBehaviorY:"none",background:e,transform:"translate3d(0,0,0)"}},"d",0,()=>({position:"relative",display:"grid",gridTemplate:`auto/${(0,s.r)(a.s)} minmax(0,1fr) ${(0,s.r)(a.s)}`,gap:`${(0,s.r)(l.s)} calc(${(0,s.r)(c.s)} - ${(0,s.r)(a.s)})`,paddingTop:C,paddingBottom:S,alignContent:"flex-start",transform:"translate3d(0,0,0)"}),"e",0,(t,e="blur")=>{const o="blur"===e,r=t?"long":"moderate",i=t?"in":"out",a=(0,s.r)(s.i,t?"0s":s.m[r]),d=`visibility 0s linear ${a}, width 0s linear ${a}, height 0s linear ${a}, ${(0,s.c)("background-color",r,i)}, ${(0,s.c)("-webkit-backdrop-filter",r,i)}, ${(0,s.c)("backdrop-filter",r,i)}`;return{all:"unset",position:"fixed",inset:0,maxWidth:"100dvw",maxHeight:"100dvh",overflow:"hidden",display:"block",userSelect:"text",outline:0,...t?{width:"100dvw",height:"100dvh",visibility:"inherit",pointerEvents:"auto",background:(0,s.r)(p.c),...o&&{WebkitBackdropFilter:(0,s.r)(h.b),backdropFilter:(0,s.r)(h.b)}}:{width:"0px",height:"0px",visibility:"hidden",pointerEvents:"none",background:"transparent"},transition:d,...(0,n.o)({transition:`${d}, ${(0,s.c)("overlay",r,i)} allow-discrete`}),overlay:"none","&:modal":{overlay:"auto"},"&::backdrop":{display:"none"}}},"f",0,()=>({gridColumn:"1/-1",zIndex:3,paddingInline:D,backgroundColor:(0,s.r)(x)}),"g",0,t=>({...(0,i.g)(t),gridArea:"1/3",zIndex:5,position:"sticky",top:(0,s.r)(a.s),marginTop:`calc(-1 * ${C} + ${(0,s.r)(a.s)})`,marginInlineEnd:(0,s.r)(a.s),placeSelf:"flex-start flex-end"}),"h",0,()=>{const t=`calc(${S} - ${w})`,e=`12 * ${(0,s.r)(v.s)}`;return{gridColumn:"1/-1",zIndex:2,position:"sticky",bottom:"-.1px",marginBlock:`calc(-1 * ${t})`,padding:`${t} ${D}`,background:`linear-gradient(0deg,${(0,s.r)(x)} 0%,${(0,s.r)(x)} 20%,transparent 80%)`,"&[data-stuck]::after":{content:'""',zIndex:-1,position:"absolute",inset:`calc(${t} - ${e}) calc(${D} - ${e})`,background:(0,s.r)(b.c),borderRadius:(0,s.r)(u.r),WebkitBackdropFilter:(0,s.r)(h.b),backdropFilter:(0,s.r)(h.b)}}},"i",0,w,"j",0,()=>{const t=C,e=(0,s.r)($.s);return{gridColumn:"1/-1",zIndex:1,position:"sticky",top:0,marginBlock:`calc(-1 * ${t}) calc(-1 * ${e})`,padding:`${t} ${D} ${e}`,background:`linear-gradient(180deg,${(0,s.r)(x)} 0%,${(0,s.r)(x)} 80%,transparent 100%)`}},"k",0,()=>({gridColumn:"2/3",zIndex:0}),"l",0,()=>({display:"block","&:first-of-type":{gridRowStart:1}}),"m",0,t=>

1({"--pds-internal-grid-outer-column":`calc(${(0,s.r)(c.s)} - ${f.g})`,"--pds-internal-grid-margin":`calc(${(0,s.r)(c.s)} * -1)`,"--pds-internal-grid-width-min":"auto","--pds-internal-grid-width-max":"none",[x]:"surface"===t?(0,s.r)(m.c):(0,s.r)(k.c)}),"n",0,D,"o",0,S,"p",0,C,"q",0,(t,e,o,r)=>{"background-color"===t.propertyName&&(e?o.emit(t):r.emit(t))},"r",0,(t,e,o,r=!1)=>{o||r||!y(t)||e()},"s",0,(t,e,o=!1)=>{t.preventDefault(),o||e()},"t",0,y,"u",0,(t,e)=>{e.scrollTo(0,0),t.inert=!0,t.showModal(),t.inert=!1,t.focus()}])},3728(t,e,o){var r=o(6410),i=o(4247),s=o(451),n=o(2112),a=o(6809),d=o(3933),l=o(7957),c=o(5849),h=o(7057),p=o(1042),u=o(4682),b=o(1039),g=o(2975),f=o(6295);const m=(0,n.g)('<path d="m18 6.706-5.294 5.294 5.294 5.294-.706.706-5.294-5.294-5.294 5.294-.706-.706 5.294-5.294-5.294-5.294.706-.706 5.294 5.294 5.294-5.294z"/>');o.d(e,["F",0,({label:t,onClick:e,ariaDescription:o,refCallback:i})=>(0,r.u)("button",{class:"dismiss",type:"button",onClick:e,ref:i,...o?{"aria-description":o}:{}},(0,r.u)("span",null,t)),"g",0,t=>{const{textColor:e,backgroundColor:o,backgroundColorHover:r}=(t=>({canvas:{textColor:(0,i.r)(b.c),backgroundColor:(0,i.r)(g.c),backgroundColorHover:(0,i.r)(f.c)},surface:{textColor:(0,i.r)(b.c),backgroundColor:(0,i.r)(f.c),backgroundColorHover:(0,i.r)(g.c)},frosted:{textColor:(0,i.r)(b.c),backgroundColor:(0,i.r)(u.c),backgroundColorHover:(0,i.r)(p.c)}}[t]))(t);return{all:"unset",boxSizing:"border-box",display:"grid",placeItems:"center",padding:"6px",borderRadius:(0,i.r)(h.r),font:`${(0,i.r)(l.f)} ${(0,i.r)(c.t)} / ${(0,i.r)(a.l)} ${(0,i.r)(a.f)}`,backgroundColor:o,color:e,cursor:"pointer",..."frosted"===t&&{WebkitBackdropFilter:(0,i.r)(d.b),backdropFilter:(0,i.r)(d.b)},transition:`${(0,i.c)("background-color")}, ${(0,i.c)("color")}`,...(0,i.f)({forcedColorAdjust:"none",background:"Canvas",boxShadow:"inset 0 0 0 2px ButtonBorder",color:"ButtonText"}),"&:focus-visible":(0,i.b)(),...(0,s.h)({"&:hover":{backgroundColor:r,...(0,i.f)({background:"Canvas"})}}),"&::before":{content:'""',width:(0,i.r)(a.l),height:(0,i.r)(a.l),WebkitMask:`${m} center/contain no-repeat`,mask:`${m} center/contain no-repeat`,background:"currentColor"},"& span":(0,i.d)()}}])},7957(t,e,o){o.d(e,["f",0,"--p-font-weight-normal"])},2112(t,e,o){o.d(e,["g",0,t=>`url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">${t}</svg>')`])},1714(t,e,o){var r=o(6410);o.d(e,["g",0,(t,e)=>(0,r.d)(t,`:scope>[slot="${e}"]`)])},4177(t,e,o){var r=o(6410);o.d(e,["g",0,(t,e)=>(0,r.d)(t,`[slot="${e}"]`)?.textContent])},8044(t,e,o){o.d(e,["g",0,"clamp(16px, 1.25vw + 12px, 36px)"])},7050(t,e,o){o.d(e,["h",0,(t,e)=>null===t||null===e||"object"!=typeof t||"object"!=typeof e?t!==e:Array.isArray(t)&&Array.isArray(e)?!(t.length===e.length&&t.every((t,o)=>t===e[o])):!(Object.keys(t).length===Object.keys(e).length&&Object.entries(t).every(([t,o])=>o===e[t]))])},2732(t,e,o){var r=o(1714);o.d(e,["h",0,(t,e)=>!!(0,r.g)(t,e)])},4247(t,e,o){const r="--p-duration-md",i="--p-duration-sm",s="--p-duration-xl",n="--p-ease-in-out",a=(t,e)=>`var(${t}${void 0===e?"":`,${e}`})`,d=t=>({"@media(forced-colors:active)":t}),l={short:a(i),moderate:a(r),long:a("--p-duration-lg"),veryLong:a(s)},c={base:a(n),in:a("--p-ease-in"),out:a("--p-ease-out"),linear:"linear"},h="--p-transition-duration",p="--p-animation-duration",u=t=>`${t} !important`,b=t=>Object.entries(t).reduce((t,[e,o])=>(null===o||(t[e]="object"==typeof o?b(o):u(o)),t),{});o.d(e,["a",0,b,"b",0,(t=2)=>({outline:`2px solid ${a("--p-color-focus")}`,outlineOffset:`${t}px`,...d({outlineColor:"Highlight"})}),"c",0,(t,e="short",o="base",r)=>`${t} ${a(h,l[e])} ${c[o]}`,"d",0,(t=!0,e)=>t?{position:"absolute",width:"1px",height:"1px",padding:0,margin:"-1px",overflow:"hidden",clip:"rect(0,0,0,0)",whiteSpace:"nowrap"}:{position:"static",width:"auto",height:"auto",padding:0,margin:0,overflow:"visible",clip:"auto",whiteSpace:"normal",...e},"e",0,u,"f",0,d,"g",0,t=>({opacity:.4,...d({opacity:1,color:"GrayText",...t})}),"h",0,{"&([hidden])":{display:"none"}},"i",0,h,"j",0,s,"k",0,p,"l",0,i,"m",0,l,"n",0,r,"o",0,n,"p",0,(t,e="short",o="base")=>`${t} ${a(p,l[e])} ${c[o]}`,"r",0,a])},451(t,e,o){o.d(e,["h",0,t=>({"@media(hover:hover)":t})])},6809(t,e,o){o.d(e,["f",0,"--p-font-porsche-next","l",0,"--p-leading-normal"])},7693(t,e,o){const r=new Map,i=new Map,s={getIntersectionObserverStickyArea:t=>new IntersectionObserver(t=>{for(const{target:e,isIntersecting:o}of t)e.toggleAttribute("data-stuck",!o)},{root:t,threshold:1})};o.d(e,["o",0,(t,e)=>{let o=r.get(t);o||(o=s.getIntersectionObserverStickyArea(t),r.set(t,o)),i.has(e)||(o.observe(e),i.set(e,o))}])},7213(t,e,o){o.r(e);var r=o(6410),i=o(3612),s=o(4177),n=o(2732),a=o(8223),d=o(7693),l=o(7050),c=o(1864),h=o(6685),p=o(4247);o(1714),o(3728);const u=(t,e,o,i,s,n,d,l,c)=>{const h="start"===i,u="fixed"===l;

1return(0,r.i)({"@global":{":host":{display:"contents",...(0,p.a)({"--ref-p-flyout-pt":a.p,"--ref-p-flyout-pb":a.o,"--ref-p-flyout-px":a.n,...(0,a.m)(e),...p.h})},slot:{...(0,a.l)(),"&:not([name])":(0,a.k)(),...s&&{"&[name=header]":{...(0,a.j)(),...h?{borderStartEndRadius:a.i}:{borderStartStartRadius:a.i}}},...n&&{"&[name=footer]":(0,a.h)()},...d&&{"&[name=sub-footer]":(0,a.f)()}},dialog:(0,a.e)(t,o)},scroller:{...(0,a.c)(h?"start":"end"),...(0,a.b)(t,h?">":"<"),"&:focus-visible":{outline:"none"}},flyout:{...(0,a.d)(),...(0,a.a)(),...(0,r.k)(c,t=>t?{width:"100dvw",minWidth:"auto",maxWidth:"none",borderRadius:0,clipPath:"none","&:dir(rtl)":{clipPath:"none"}}:{width:(0,p.r)("--p-flyout-width","auto"),minWidth:"320px",maxWidth:"100vw",clipPath:h?`inset(0 round 0 ${a.i} ${a.i} 0)`:`inset(0 round ${a.i} 0 0 ${a.i})`,"&:dir(rtl)":{clipPath:h?`inset(0 round ${a.i} 0 0 ${a.i})`:`inset(0 round 0 ${a.i} ${a.i} 0)`},...h?{borderStartEndRadius:a.i,borderEndEndRadius:a.i,...(0,p.f)({borderInlineEnd:"2px solid CanvasText"})}:{borderStartStartRadius:a.i,borderEndStartRadius:a.i,...(0,p.f)({borderInlineStart:"2px solid CanvasText"})}}),...u&&{gridTemplateRows:s?"auto 1fr auto":"1fr"}},dismiss:(0,a.g)(e)})},b=new Map,g=new Map,f=(t,e)=>{g.get(t).replaceSync(`:host{--p-flyout-sticky-top:${e}px}`)},m=t=>new ResizeObserver(e=>{for(const o of e)f(t,Math.floor(o.target.getBoundingClientRect().height))}),k={open:r.A.boolean,background:r.A.oneOf(["canvas","surface"]),position:r.A.oneOf(["start","end"]),disableBackdropClick:r.A.boolean,backdrop:r.A.oneOf(a.B),fullscreen:r.A.breakpoint("boolean"),footerBehavior:r.A.oneOf(["sticky","fixed"]),aria:r.A.aria(["aria-label"])};o.d(e,["p_flyout",0,class{constructor(t){(0,r.r)(this,t),this.dismiss=(0,r.x)(this,"dismiss",3),this.motionVisibleEnd=(0,r.x)(this,"motionVisibleEnd",3),this.motionHiddenEnd=(0,r.x)(this,"motionHiddenEnd",3),this.open=!1,this.position="end",this.disableBackdropClick=!1,this.background="canvas",this.backdrop="blur",this.footerBehavior="sticky",this.fullscreen=!1,this.isPointerDownInside=!1,this.topLayer=(0,h.c)({getElement:()=>this.dialog,isShown:()=>!!this.dialog?.open,show:()=>(0,a.u)(this.dialog,this.scroller),hide:()=>this.dialog?.close()}),this.dismissDialog=()=>{this.dismiss.emit()},this.updateSlotObserver=()=>{var t,e,o;this.hasHeader&&(0,d.o)(this.scroller,this.header),this.hasFooter&&(0,d.o)(this.scroller,this.footer),t=this.host,e=this.hasHeader,o=this.header,(0,r.E)()&&(e&&!b.has(t)?(b.set(t,m(t)),b.get(t).observe(o)):!e&&b.has(t)&&(f(t,0),b.get(t).disconnect(),b.delete(t)))}}componentShouldUpdate(t,e){return(0,l.h)(t,e)}connectedCallback(){(0,r.z)(this.host,()=>{(0,r.f)(this.host)},void 0,{subtree:!1,childList:!0,attributes:!1})}componentWillRender(){(0,c.s)(this.open)}componentDidRender(){this.open?this.topLayer.requestShow():this.topLayer.requestHide()}componentDidLoad(){var t;t=this.host,(0,r.E)()&&(g.set(t,new CSSStyleSheet),t.shadowRoot.adoptedStyleSheets.push(g.get(t)),f(t,0)),this.updateSlotObserver()}componentDidUpdate(){this.updateSlotObserver()}disconnectedCallback(){(0,c.s)(!1),this.topLayer.cancel(),(0,r.B)(this.host)}render(){return(0,r.v)(this,k),this.hasHeader=(0,n.h)(this.host,"header"),this.hasFooter=(0,n.h)(this.host,"footer"),this.hasSubFooter=(0,n.h)(this.host,"sub-footer"),(0,r.q)(this.host,u,this.open,this.background,this.backdrop,this.position,this.hasHeader,this.hasFooter,this.hasSubFooter,this.footerBehavior,this.fullscreen),(0,r.u)(a.D,{key:"01b0bf12189232d5446343e6f4310676fb0cef64",inert:!this.open,dialogRef:t=>this.dialog=t,scrollerRef:t=>this.scroller=t,dismissable:!0,onCancel:t=>(0,a.s)(t,this.dismissDialog),onMouseDown:t=>this.isPointerDownInside=!(0,a.t)(t),onClick:t=>(0,a.r)(t,this.dismissDialog,this.disableBackdropClick,this.isPointerDownInside),onTransitionEnd:t=>(0,a.q)(t,this.open,this.motionVisibleEnd,this.motionHiddenEnd),onDismiss:this.dismissDialog,containerClass:"flyout",header:this.hasHeader?(0,r.u)("slot",{name:"header",ref:t=>this.header=t}):void 0,footer:this.hasFooter?(0,r.u)("slot",{name:"footer",ref:t=>this.footer=t}):void 0,subFooter:this.hasSubFooter?(0,r.u)("slot",{name:"sub-footer"}):void 0,ariaAttributes:(0,i.p)({"aria-modal":!0,"aria-label":this.hasHeader?(0,s.g)(this.host,"header"):"Flyout",...(0,i.p)(this.aria)})},(0,r.u)("slot",{key:"72e44e560876464a1ec6e1de0c87624fb47f0d51"}))}get host(){return(0,r.w)(this)}}])},2640(t,e,o){o.d(e,["r",0,"--p-radius-2xl"])},1736(t,e,o){o.d(e,["r",0,"--p-radius-3xl"])},7057(t,e,o){o.d(e,["r",0,"--p-radius-full"])},1864(t,e,o){o.d(e,["c",0,"--p-color-backdrop","s",0,t=>{document.body.style.overflow=t?"hidden":""}])},4265(t,e,o){o.d(e,["s",0,"--p-spacing-fluid-lg"])},7362(t,e,o){o.d(e,["s",0,"--p-spacing-fluid-md"])},3827(t,e,o){o.d(e,["s",0,"--p-spacing-fluid-sm"])},7202(t,e,o){o.d(e,["s",0,"--p-spacing-static-2xs"])},845(t,e,o){o.d(e,["s",0,"--p-spacing-static-md"])},5849(t,e,o){o.d(e,["t",0,"--p-typescale-sm"])}}]);