https://streali.com/assets/show_item-BoFXX_5f.js

1import{W as g,r as b,j as e,T as s,g as f,B as a,t as j,I as y}from"./app-RaW7HD1k.js";import{L as w}from"./label-RPcMI4Dy.js";import{S as v}from"./settings_content-BJ8v1Nac.js";import{I as N}from"./input-DuO3h-G-.js";import{M as S}from"./meta-C_hzUrJF.js";import"./use_interval-EJzp5mQD.js";import"./index-JUqXjQRv.js";import"./index-C3ei4VHf.js";function E(d){var o,c;const{hasTwitchProvider:i,label:t}=d,r=g({settings:t.settings});function m(l){l.preventDefault(),r.put(`/account/purchases/labels/${t.id}`)}const h=t.theme.allowedSettings.some(l=>r.data.settings[l]!==t.settings[l]),n=b.useRef(null),u=(c=(o=n.current)==null?void 0:o.querySelector("div"))==null?void 0:c.clientHeight;return e.jsxs(e.Fragment,{children:[e.jsx(S,{title:`Label: ${t.name}`}),e.jsxs("div",{className:"pt-40 pb-20 px-10 flex gap-10 flex-col lg:!flex-row list",children:[e.jsx("section",{ref:n,className:"w-full lg:w-1/3 h-[40vh] lg:!h-[60vh] bg-grey-900 rounded-[20px] relative p-5 border border-grey-400 ring-1 ring-black flex justify-center items-center",style:{backgroundColor:"#0A0A0D"},children:e.jsx(w,{theme:t.theme.slug,currentSettings:r.data.settings})}),e.jsxs("section",{className:"w-full lg:w-1/5 lg:!h-[60vh] bg-grey-600 rounded-[20px] relative p-5 overflow-y-auto border border-grey-400 ring-1 ring-black",children:[e.jsx("h3",{children:e.jsx(s,{type:"h1",children:"Settings"})}),e.jsx(v,{availableSettings:t.theme.allowedSettings,shouldDisplayDemo:!1,currentSettings:r.data.settings,onSettingChange:(l,x)=>{r.setData(p=>({settings:{...p.settings,[l]:x}}))}})]}),e.jsx("section",{className:"flex-1",children:e.jsxs("div",{className:"w-full 2xl:w-3/5",children:[e.jsx(f,{href:"/account/purchases/labels",className:"mb-3 block",children:e.jsx(a,{color:"secondary",iconLeft:"arrow-left-s-line",children:"Back to my purchases"})}),e.jsx("h1",{className:"mb-2",children:e.jsx(s,{type:"h1",className:"text-4xl",children:t.name})}),!i&&e.jsxs("div",{className:"mt-5",children:[e.jsx("div",{className:"w-full flex justify-between items-center mb-3",children:e.jsx("h4",{children:e.jsx(s,{type:"h1",children:"Setup your provider"})})}),e.jsx("p",{className:"mb-5",children:e.jsx(s,{type:"content",children:"You need to connect a stream provider to start using your theme."})}),e.jsx(a,{link:"/account/providers",iconLeft:"twitch-fill",children:"Setup Twitch account"})]}),i&&e.jsxs(e.Fragment,{children:[h&&e.jsx("form",{method:"post",onSubmit:m,children:e.jsx(a,{color:"secondary",className:"w-full h-14 font-semibold text-lg my-3",type:"submit",loading:r.processing,children:"Update"})}),e.jsxs("div",{className:"relative my-5",children:[e.jsx(N,{disabled:!0,label:"Embed link",defaultValue:"/embeds/labels/{secret}"}),e.jsx("button",{className:"w-8 h-8 rounded flex items-center justify-center absolute bottom-1 right-1 bg-grey-900 border border-grey-400 hover:bg-primary-500 hover:border-primary-500 transition-colors duration-200",onClick:()=>{navigator.clipboard.writeText(t.embedLink),j("success","Ready to use","You can now paste the link on your streaming software.")},children:e.jsx(y,{name:"clipboard-line"})})]}),e.jsxs("div",{className:"mb-5",children:[e.jsx(s,{children:"Recommended size on OBS"}),e.jsxs("div",{className:"flex gap-3 mt-2",children:[e.jsx(s,{className:"bg-black flex flex-1 px-2 py-1 rounded",children:"Width: 400px"}),e.jsxs(s,{className:"bg-black flex flex-1 px-2 py-1 rounded",children:["Height: ",u,"px"]})]})]}),e.jsxs("div",{children:[e.jsx("h5",{className:"mb-1",children:e.jsx(s,{type:"h3",children:"How to install it?"})}),e.jsx("p",{children:'Copy the link above and paste it on a "Browser Source" module of your streaming software.'}),e.jsx("iframe",{width:"560",height:"315",className:"w-full aspect-video h-auto mt-5",src:"https://www.youtube.com/embed/d-itE34NWwU",title:"YouTube video player",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share",allowFullScreen:!0})]})]})]})})]})]})}export{E as default};