1import{d as o,n as l}from"./_plugin-vue2_normalizer-6lMNJLjR.js";import{I as n,V as r,P as a}from"./InputWithButton-B7v1Y_Ok.js";import{r as p,b as u,e as m}from"./index-DoWUulTV.js";import"./main-DRib14Pr.js";import"./index-Dx0EVo3O.js";import"./index-DJ7qRx3W.js";const h=o({__name:"FeatureShowcase",setup(s){function t(){window.alert("hello")}return{__sfc:!0,handleSubmit:t,ProgressRing:a,VideoController:r,InputWithButton:n,email:m,minLength:u,required:p}}});var _=function(){var t=this,e=t._self._c,i=t._self._setupProxy;return e("div",{staticClass:"container"},[e("div",{staticClass:"max-w-lg"},[e("div",{staticClass:"bg-black p-4 text-white"},[e("h1",{staticClass:"mt-5 text-3xl font-bold text-white"},[t._v(t._s("<InputWithButton />"))]),e("p",[t._v(" A simple input with a button on the right. The button is always visible, even when the input is focused. ")]),e("div",{staticClass:"p-4 bg-gradient-to-t from-blue-500 to-purple-500"},[e(i.InputWithButton,{attrs:{onSubmit:i.handleSubmit,buttonLabel:"Sign up",inputPlaceholder:"Enter your email",validateEmail:""}})],1),e("div",{staticClass:"p-4 bg-gradient-to-t"},[e(i.InputWithButton,{attrs:{onSubmit:i.handleSubmit,buttonLabel:"Sign up",inputPlaceholder:"Enter your email",rules:{email:i.email,minLength:i.minLength(5),required:i.required}}})],1)]),e("br"),e("br"),e("h1",{staticClass:"text-3xl font-bold"},[t._v(t._s("<VideoController />"))]),e("h3",{staticClass:"mt-10"},[t._v("Play while hovering")]),t._m(0),e(i.ProgressRing,{attrs:{progress:100}}),e(i.VideoController,{staticClass:"rounded-xl",attrs:{src:"https://samplelib.com/lib/preview/mp4/sample-5s.mp4",poster:"https://picsum.photos/512/288","play-on-hover":""}}),e("h3",{staticClass:"mt-80"},[t._v("Auto play on visible")]),t._m(1),e(i.VideoController,{attrs:{src:"https://samplelib.com/lib/preview/mp4/sample-5s.mp4",poster:"https://picsum.photos/512/288","play-on-visible":""}})],1)])},c=[function(){var s=this,t=s._self._c;return s._self._setupProxy,t("p",[s._v(" The video will play while the user is hovering over it, showing a play button by default. On mobile devices, the video will play/pause when the user taps on it. "),t("strong",[s._v("Loops by default. ")])])},function(){var s=this,t=s._self._c;return s._self._setupProxy,t("p",[s._v(" The video will play when it's visible in the viewport. It will pause when it's not visible. "),t("strong",[s._v("Doesn't loop by default. ")])])}],v=l(h,_,c,!1,null,null);const C=v.exports;export{C as default};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.