import{proxyCustomElement,HTMLElement,h}from"@stencil/core/internal/client";const prestoPlaylistUiCss=":host {\n  display: block;\n  background: transparent !important;\n}\n\n.playlist__base {\n  container-type: inline-size;\n}\n\n::slotted([provider=audio]) {\n  flex: 1;\n  box-sizing: border-box;\n  flex: 0 0 100%;\n  min-height: 300px;\n}\n\n.playlist {\n  display: flex;\n  justify-content: stretch;\n  align-items: stretch;\n  border-radius: var(--presto-playlist-border-radius, 8px);\n  overflow: hidden;\n  border-width: var(--presto-playlist-border-width, 1px);\n  border-style: solid;\n  border-color: var(--presto-playlist-border-color, #ddd);\n  background: var(--presto-playlist-background-color, #fff);\n  position: relative;\n}\n.playlist__base {\n  user-select: none;\n}\n.playlist__preview {\n  position: relative;\n  flex: 1;\n}\n.playlist__info {\n  border-radius: 8px;\n  overflow-y: scroll;\n  min-width: 300px;\n  max-width: 350px;\n  width: 30%;\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n}\n.playlist__info--inner {\n  flex: 1 1 1px;\n  overflow: auto;\n  margin: 30px;\n  margin-top: 0;\n  margin-right: 15px;\n  padding-right: 15px;\n  height: fit-content;\n  min-height: 175px;\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n}\n.playlist__info--inner .playlist__list {\n  gap: var(--presto-playlist-gap, 10px);\n  display: flex;\n  flex-direction: column;\n}\n.playlist__info--inner::-webkit-scrollbar {\n  width: 6px;\n}\n.playlist__info--inner::-webkit-scrollbar-track {\n  background: #ddd;\n  border-radius: 5px;\n}\n.playlist__info--inner::-webkit-scrollbar-thumb {\n  background: #888;\n  border-radius: 5px;\n}\n.playlist__info--inner::-webkit-scrollbar-thumb:hover {\n  background: #aaa;\n  border-radius: 5px;\n}\n.playlist__heading {\n  display: flex;\n  justify-content: space-between;\n  padding: 25px 30px 16px;\n}\n.playlist__heading-title {\n  font-size: 16px;\n  font-weight: 500;\n  color: var(--presto-playlist-text-color);\n}\n.playlist__heading-count {\n  color: var(--presto-playlist-text-color, var(--plyr-audio-control-color, #b1b1b1));\n  font-size: 12px;\n}\n\n/** Container query! */\n@container (max-width: 782px) {\n  .playlist {\n    flex-direction: column;\n  }\n  .playlist__info {\n    max-width: none;\n    min-height: none;\n    width: 100%;\n  }\n  .playlist__info--inner {\n    flex: 1;\n    height: fit-content;\n    max-height: var(--presto-playlist-max-height-stacked, 200px);\n    min-height: var(--presto-playlist-min-height-stacked, 0);\n  }\n  .playlist__preview {\n    min-height: 200px;\n  }\n  ::slotted([provider=audio]) {\n    padding: 30px;\n    min-height: 200px;\n    padding-bottom: 0;\n    flex: 1;\n  }\n}\n/** Older browsers fallback */\n@media (max-width: 782px) {\n  .playlist {\n    flex-direction: column;\n  }\n  .playlist__info {\n    max-width: none;\n    min-height: none;\n    width: 100%;\n  }\n  .playlist__info--inner {\n    flex: 1;\n    height: fit-content;\n    max-height: var(--presto-playlist-max-height-stacked, 200px);\n    min-height: var(--presto-playlist-min-height-stacked, 0);\n  }\n}",PrestoPlayListUI=proxyCustomElement(class extends HTMLElement{constructor(){super(),this.__registerHost(),this.__attachShadow()}render(){return h("div",{key:"e491b728a12bbe88b47ab93e76eaea8237dd3cea",class:"playlist__base",part:"base"},h("div",{key:"672c71c6e0b425ea093c4395cb86f106cc4f2785",class:"playlist"},h("div",{key:"f785f31695ada6ffa3cc62413d8f739605ceb9e7",class:"playlist__preview"},h("slot",{key:"636b6374490405d59b2c6d1f226942e1d75056dc",name:"preview"})),h("div",{key:"f3b0fac78923018568c53b7d8dd753a012f86332",class:"playlist__info"},h("div",{key:"d343092dda7a695530dee464a9f72fcd0f4a2738",class:"playlist__heading"},h("div",{key:"70cd1f9a9d8f0b4ad972e9886dbced212492b52f",class:"playlist__heading-title"},h("slot",{key:"949df1a54f703e886e8204407b3b651088bfcc01",name:"title"})),h("div",{key:"c1969328b820129132fdb0045864440c568d24fe",class:"playlist__heading-count"},h("slot",{key:"47a163b788d1619ad130bd6ef62855681699d914",name:"count"}))),h("div",{key:"e368d3e86d468053bdb754f326c6b2386f12e568",class:"playlist__info--inner"},h("div",{key:"42976f9e474ec11c7dce1664449f380791a4995a",class:"playlist__list"},h("slot",{key:"f3265b3ed5c8e08ed1e796cbce1b17fb165ce545",name:"list"}))))))}static get style(){return prestoPlaylistUiCss}},[257,"presto-playlist-ui"]);function defineCustomElement(){"undefined"!=typeof customElements&&["presto-playlist-ui"].forEach(n=>{"presto-playlist-ui"===n&&(customElements.get(n)||customElements.define(n,PrestoPlayListUI))})}export{PrestoPlayListUI as P,defineCustomElement as d};