vue-awesome-radio/dist/radio-card.umd.cjs

A tailwind based radio card component for Vue3

(function(l,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(l=typeof globalThis<"u"?globalThis:l||self,e(l["vue3-radio-card"]={},l.Vue))})(this,function(l,e){"use strict";const d=t=>(e.pushScopeId("data-v-a1e32f41"),t=t(),e.popScopeId(),t),c={class:"p-4 flex items-center justify-center bg-gray-100 min-h-screen"},i={class:"w-full max-w-screen-md mx-auto"},m={class:"space-y-6"},p={key:0,class:"flex items-center justify-between py-4 border-b border-gray-300"},f={class:"text-2xl text-gray-700 mr-4"},g={class:"grid sm:grid-cols-4 gap-6"},h=["onClick","for"],u={class:"font-semibold text-gray-500 leading-tight uppercase mb-3"},_=["name","id","value","checked"],b=d(()=>e.createElementVNode("span",{"aria-hidden":"true",class:"hidden absolute inset-0 border-2 border-green-500 bg-green-200 bg-opacity-10 rounded-lg"},[e.createElementVNode("span",{class:"absolute top-4 right-4 h-6 w-6 inline-flex items-center justify-center rounded-full bg-green-200"},[e.createElementVNode("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",fill:"currentColor",class:"h-5 w-5 text-green-600"},[e.createElementVNode("path",{"fill-rule":"evenodd",d:"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z","clip-rule":"evenodd"})])])],-1)),y=((t,a)=>{const r=t.__vccOpts||t;for(const[n,s]of a)r[n]=s;return r})(e.defineComponent({__name:"RadioCard",props:e.mergeModels({options:Array,title:String},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(t){const a=e.useModel(t,"modelValue");function r(n){a.value=n}return(n,s)=>(e.openBlock(),e.createElementBlock("div",null,[e.createElementVNode("body",c,[e.createElementVNode("form",i,[e.createElementVNode("fieldset",m,[t.title?(e.openBlock(),e.createElementBlock("div",p,[e.createElementVNode("legend",f,e.toDisplayString(t.title),1)])):e.createCommentVNode("",!0),e.createElementVNode("div",g,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.options,o=>(e.openBlock(),e.createElementBlock("label",{onClick:k=>r(o.value),for:o.value,class:"relative flex flex-col bg-white p-5 rounded-lg shadow-md cursor-pointer"},[e.createElementVNode("span",u,e.toDisplayString(o.label),1),e.renderSlot(n.$slots,"item",e.normalizeProps(e.guardReactiveProps(o)),void 0,!0),e.createElementVNode("input",{type:"radio",name:o.value,id:o.value,value:o.value,class:"absolute h-0 w-0 appearance-none",checked:o.value===a.value},null,8,_),b],8,h))),256))])])])])]))}}),[["__scopeId","data-v-a1e32f41"]]);l.RadioCard=y,Object.defineProperty(l,Symbol.toStringTag,{value:"Module"})});