OwlCyberSecurity - MANAGER

Edit File: presto-playlist-ui2.js.map

{"file":"presto-playlist-ui2.js","mappings":";;AAAA,MAAM,mBAAmB,GAAG,uzFAAuzF,CAAC;AACp1F,+BAAe,mBAAmB;;MCMrB,gBAAgB;;;;;;IAC3B,MAAM;QACJ,QACE,4DAAK,KAAK,EAAC,gBAAgB,EAAC,IAAI,EAAC,MAAM,IACrC,4DAAK,KAAK,EAAC,UAAU,IACnB,4DAAK,KAAK,EAAC,mBAAmB,IAC5B,6DAAM,IAAI,EAAC,SAAS,GAAG,CACnB,EACN,4DAAK,KAAK,EAAC,gBAAgB,IACzB,4DAAK,KAAK,EAAC,mBAAmB,IAC5B,4DAAK,KAAK,EAAC,yBAAyB,IAClC,6DAAM,IAAI,EAAC,OAAO,GAAQ,CACtB,EACN,4DAAK,KAAK,EAAC,yBAAyB,IAClC,6DAAM,IAAI,EAAC,OAAO,GAAQ,CACtB,CACF,EAEN,4DAAK,KAAK,EAAC,uBAAuB,IAChC,4DAAK,KAAK,EAAC,gBAAgB,IACzB,6DAAM,IAAI,EAAC,MAAM,GAAG,CAChB,CACF,CACF,CACF,CACF,EACN;KACH;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/core/features/presto-playlist/ui/presto-playlist-ui.scss?tag=presto-playlist-ui&encapsulation=shadow","src/components/core/features/presto-playlist/ui/presto-playlist-ui.tsx"],"sourcesContent":[":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.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 &__base {\n user-select: none;\n }\n\n &__preview {\n position: relative;\n flex: 1;\n }\n\n &__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 &--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\n .playlist__list {\n gap: var(--presto-playlist-gap, 10px);\n display: flex;\n flex-direction: column;\n }\n\n &::-webkit-scrollbar {\n width: 6px;\n }\n /* Track */\n &::-webkit-scrollbar-track {\n background: #ddd;\n border-radius: 5px;\n }\n /* Handle */\n &::-webkit-scrollbar-thumb {\n background: #888;\n border-radius: 5px;\n }\n /* Handle on hover */\n &::-webkit-scrollbar-thumb:hover {\n background: #aaa;\n border-radius: 5px;\n }\n }\n }\n\n &__heading {\n display: flex;\n justify-content: space-between;\n padding: 25px 30px 16px;\n }\n\n &__heading-title {\n font-size: 16px;\n font-weight: 500;\n color: var(--presto-playlist-text-color);\n }\n\n &__heading-count {\n color: var(--presto-playlist-text-color, var(--plyr-audio-control-color, #b1b1b1));\n font-size: 12px;\n }\n}\n\n/** Container query! */\n@container (max-width: 782px) {\n .playlist {\n flex-direction: column;\n &__info {\n max-width: none;\n min-height: none;\n width: 100%;\n\n &--inner {\n flex: 1;\n height: fit-content;\n max-height: 200px;\n min-height: min-content;\n }\n }\n\n &__preview {\n min-height: 200px;\n }\n }\n ::slotted([provider='audio']) {\n padding: 30px; // padding to match the playlist component.\n min-height: 200px; // min-height to allow for the overlay text.\n padding-bottom: 0; // remove bottom padding because we are stacking the playlist.\n flex: 1; // stretch the audio player to fill the space.\n }\n}\n\n/** Older browsers fallback */\n@media (max-width: 782px) {\n .playlist {\n flex-direction: column;\n &__info {\n max-width: none;\n min-height: none;\n width: 100%;\n\n &--inner {\n flex: 1;\n height: fit-content;\n max-height: 200px;\n min-height: min-content;\n }\n }\n }\n}\n","import { Component, h } from '@stencil/core';\n\n@Component({\n tag: 'presto-playlist-ui',\n styleUrl: 'presto-playlist-ui.scss',\n shadow: true,\n})\nexport class PrestoPlayListUI {\n render() {\n return (\n <div class=\"playlist__base\" part=\"base\">\n <div class=\"playlist\">\n <div class=\"playlist__preview\">\n <slot name=\"preview\" />\n </div>\n <div class=\"playlist__info\">\n <div class=\"playlist__heading\">\n <div class=\"playlist__heading-title\">\n <slot name=\"title\"></slot>\n </div>\n <div class=\"playlist__heading-count\">\n <slot name=\"count\"></slot>\n </div>\n </div>\n\n <div class=\"playlist__info--inner\">\n <div class=\"playlist__list\">\n <slot name=\"list\" />\n </div>\n </div>\n </div>\n </div>\n </div>\n );\n }\n}\n"],"version":3}