OwlCyberSecurity - MANAGER

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

{"file":"presto-playlist-item2.js","mappings":";;AACO,MAAM,SAAS,GAAG,OACvB,WAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B,EAAC,KAAK,EAAC,mBAAmB;IAC1G,YAAM,CAAC,EAAC,sCAAsC,GAAQ,CAClD,CACP,CAAC;AAEK,MAAM,QAAQ,GAAG,OACtB,WAAK,OAAO,EAAC,KAAK,EAAC,KAAK,EAAC,4BAA4B,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,kBAAkB;IACvH,YAAM,CAAC,EAAC,qBAAqB,GAAQ,CACjC,CACP;;ACXD,MAAM,qBAAqB,GAAG,0pCAA0pC,CAAC;AACzrC,iCAAe,qBAAqB;;MCOvB,kBAAkB;;;;;;;sBAEH,KAAK;uBAGJ,KAAK;;;;;IAWhC,MAAM;QACJ,QACE,4DACE,KAAK,EAAE;gBACL,gBAAgB,EAAE,IAAI;gBACtB,2BAA2B,EAAE,IAAI,CAAC,MAAM;gBACxC,4BAA4B,EAAE,IAAI,CAAC,OAAO;aAC3C,EACD,OAAO,EAAE;gBACP,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC;aACnE,IAED,4DAAK,KAAK,EAAC,sBAAsB,IAC/B,4DAAK,KAAK,EAAC,qBAAqB,IAAE,IAAI,CAAC,OAAO,GAAG,EAAC,SAAS,OAAG,GAAG,EAAC,QAAQ,OAAG,CAAO,EACpF,6DAAM,IAAI,EAAC,YAAY,GAAG,CACtB,EACN,4DAAK,KAAK,EAAC,gBAAgB,IACzB,6DAAM,IAAI,EAAC,eAAe,GAAG,CACzB,CACF,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/core/features/presto-playlist-item/icons.tsx","src/components/core/features/presto-playlist-item/presto-playlist-item.scss?tag=presto-playlist-item&encapsulation=shadow","src/components/core/features/presto-playlist-item/presto-playlist-item.tsx"],"sourcesContent":["import { h } from '@stencil/core';\nexport const PauseIcon = () => (\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\" class=\"presto-icon-pause\">\n <path d=\"M5 16v-12h3v12h-3zM12 4h3v12h-3v-12z\"></path>\n </svg>\n);\n\nexport const PlayIcon = () => (\n <svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" class=\"presto-icon-play\">\n <path d=\"M5 4l10 6-10 6v-12z\"></path>\n </svg>\n);\n",":host {\n display: block;\n cursor: pointer;\n}\n\n::slotted(*) {\n font-size: 14px;\n}\n\n.playlist {\n &__item {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 6px;\n transition: background-color 0.25s ease;\n color: var(--presto-playlist-text-color, var(--plyr-audio-control-color, #4a5464));\n user-select: none;\n border-radius: 8px;\n\n &:hover {\n background-color: rgba(0, 0, 0, 0.05);\n }\n\n &.playlist__item-is--active {\n background-color: var(--presto-playlist-highlight-color, var(--plyr-color-main, #2e4cd9));\n padding: 6px;\n color: var(--playlist-highlight-text-color, #fff);\n border-radius: 8px;\n .playlist__title-wrap > div {\n background-color: var(--playlist-highlight-text-color, #fff);\n }\n svg {\n fill: var(--presto-playlist-highlight-color, var(--plyr-color-main, #2e4cd9));\n }\n }\n\n svg {\n fill: currentColor;\n }\n\n .presto-icon-play path {\n transform: translateX(1px);\n }\n }\n\n &__title-wrap {\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 14px;\n }\n\n &__play-icon {\n display: flex;\n padding: 2px;\n border-radius: 50%;\n background: rgba(180, 184, 199, 0.25);\n }\n\n &__time {\n opacity: 0.8;\n font-size: 12px;\n padding: 0 4px;\n }\n}\n","import { Component, h, Prop, Event, EventEmitter } from '@stencil/core';\nimport { PauseIcon, PlayIcon } from './icons';\n\n@Component({\n tag: 'presto-playlist-item',\n styleUrl: 'presto-playlist-item.scss',\n shadow: true,\n})\nexport class PrestoPlaylistItem {\n /** Active status */\n @Prop() active: boolean = false;\n\n /** Playing status */\n @Prop() playing: boolean = false;\n\n /** Emit play event */\n @Event() triggerPlay: EventEmitter<void>;\n\n /** Emit pause event */\n @Event() triggerPause: EventEmitter<void>;\n\n /**\n * Rendering the component\n */\n render() {\n return (\n <div\n class={{\n 'playlist__item': true,\n 'playlist__item-is--active': this.active,\n 'playlist__item-is--playing': this.playing,\n }}\n onClick={() => {\n this.playing ? this.triggerPause.emit() : this.triggerPlay.emit();\n }}\n >\n <div class=\"playlist__title-wrap\">\n <div class=\"playlist__play-icon\">{this.playing ? <PauseIcon /> : <PlayIcon />}</div>\n <slot name=\"item-title\" />\n </div>\n <div class=\"playlist__time\">\n <slot name=\"item-duration\" />\n </div>\n </div>\n );\n }\n}\n"],"version":3}