{"version":3,"file":"655-5fc96866adafb05d4894.digested.js","mappings":"gJAEA,MAAMA,EAAkBC,SAASC,cAAc,YAC/CF,EAAgBG,UAAuB,oiFA4FvC,MAAMC,UAAyC,KAC3CC,gBAAkBL,EAEjBM,WAAWC,eAAeC,IAAI,yCAC/BF,WAAWC,eAAeE,OAAO,uCAAwCL,GAE7E,W","sources":["webpack://jumpstart-app/./app/javascript/supporters-app/media-theme-fourthwall-audio-message.ts"],"sourcesContent":["import 'media-chrome';\nimport { MediaThemeElement } from 'media-chrome/dist/media-theme-element.js';\nconst templateElement = document.createElement('template');\ntemplateElement.innerHTML = /* html */ `\n  <style>\n    :host {\n      --media-control-padding: none;\n      --media-control-background: none;\n      --media-control-hover-background: none;\n\n      --media-time-range-buffered-color: rgba(var(--color-on-background-rgb, 0, 0, 0), 0.1);\n\n      --media-range-track-background: rgba(var(--color-on-background-rgb, 0, 0, 0), 0.1);\n      --media-range-track-height: 2px;\n      --media-range-thumb-height: 14px;\n      --media-range-thumb-width: 14px;\n      --media-range-thumb-background: var(--color-on-background, #000000);\n      --media-range-bar-color: var(--color-on-background, #000000);\n\n      --media-icon-color: var(--color-on-background, #000000);\n\n      --media-text-color: var(--color-on-background, #000000);\n\n      --media-font-size: 14px;\n      --media-font-family: var(--font-family-base, sans-serif);\n\n      height: 20px;\n    }\n\n    *[role=button]:hover {\n      --media-icon-color: var(--color-primary, #000000);\n    }\n\n    media-controller {\n      background: none;\n    }\n\n    media-play-button {\n      position: absolute;\n      top: 50%;\n      left: 0px;\n\n      transform: translateY(-50%);\n    }\n\n    media-time-range {\n      position: absolute;\n      top: 50%;\n      right: 70px;\n      left: 90px;\n\n      transform: translateY(-50%);\n\n      width: auto;\n    }\n\n    media-time-display {\n      position: absolute;\n      top: 50%;\n      left: 36px;\n\n      transform: translateY(-50%);\n    }\n\n    media-duration-display {\n      position: absolute;\n\n      top: 50%;\n      right: 0px;\n      transform: translateY(-50%);\n    }\n\n  </style>\n\n  <media-controller audio defaultduration=\"{{defaultduration}}\">\n    <slot name=\"media\" slot=\"media\"></slot>\n\n    <media-play-button>\n      <div slot=\"play\" style=\"display:flex;\">\n        <svg width=\"16\" height=\"16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M13.988 7.553a.5.5 0 0 1 0 .894L1.224 14.83a.5.5 0 0 1-.724-.447V1.618a.5.5 0 0 1 .724-.447l12.764 6.382Z\" fill=\"var(--media-icon-color)\" stroke=\"var(--media-icon-color)\"/></svg>\n      </div>\n      <span slot=\"pause\" style=\"display:flex;\">\n        <svg height=\"16\" width=\"!6\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M4 0h8v32H4V0ZM20 0h8v32h-8V0Z\" fill=\"var(--media-icon-color)\"/></svg>\n      </span>\n    </media-play-button>\n\n    <media-time-display notoggle></media-time-display>\n\n    <media-time-range>\n      <span slot=\"preview\"></span>\n    </media-time-range>\n\n    <media-duration-display></media-duration-display>\n  </media-controller>\n`;\nclass MediaThemeFourthwallAudioMessage extends MediaThemeElement {\n    static template = templateElement;\n}\nif (!globalThis.customElements.get('media-theme-fourthwall-audio-message')) {\n    globalThis.customElements.define('media-theme-fourthwall-audio-message', MediaThemeFourthwallAudioMessage);\n}\nexport default MediaThemeFourthwallAudioMessage;\n"],"names":["templateElement","document","createElement","innerHTML","MediaThemeFourthwallAudioMessage","static","globalThis","customElements","get","define"],"sourceRoot":""}