UNPKG

vuetify-swatches

Version:
13 lines (11 loc) 4.97 kB
/** * vuetify-swatches * * @description Color Swatch component for Vuetify3. * @author Logue <logue@hotmail.co.jp> * @copyright 2022-2026 By Masashi Yoshikawa All rights reserved. * @license MIT * @version 2.0.1 * @see {@link https://github.com/logue/vuetify-swatches} */ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),c=require("vuetify/components"),b=require("vuetify/util/colors");function y(l){return l&&typeof l=="object"&&"default"in l?l:{default:l}}var u=y(b);function B(...l){let r=0;for(let a=0;a<l.length;a++)l[a].length>r&&(r=l[a].length);const o=l.length,t=Array(r);for(let a=0;a<r;++a){const n=Array(o);for(let i=0;i<o;++i)n[i]=l[i][a];t[a]=n}return t}var m=e.defineComponent({__name:"SwatchButton",props:{color:{default:void 0},isSelected:{type:Boolean,default:!1},size:{default:"2rem"},icon:{default:"mdi-checkbox-marked-circle"},iconSize:{default:"1rem"},variant:{default:void 0},disabled:{type:Boolean,default:!1},rounded:{type:[String,Number,Boolean],default:void 0},border:{type:[String,Number,Boolean],default:!1},elevation:{default:void 0},tooltip:{type:Boolean,default:!1},tooltipLocation:{default:void 0}},emits:["click"],setup(l,{emit:r}){const o=l,t=r;return(a,n)=>o.color?(e.openBlock(),e.createBlock(e.unref(c.VTooltip),{key:0,disabled:!o.tooltip,location:o.tooltipLocation,text:o.color},{activator:e.withCtx(({props:i})=>[e.createVNode(e.unref(c.VBtn),e.mergeProps(i,{border:o.border,class:[o.color===e.unref(u.default).shades.transparent?"bg-transparent":"","p-0"],color:o.color,disabled:o.disabled,elevation:o.elevation,height:o.size,variant:o.variant,width:o.size,"min-width":"auto",onClick:n[0]||(n[0]=p=>t("click"))}),{default:e.withCtx(()=>[o.isSelected?(e.openBlock(),e.createBlock(e.unref(c.VIcon),{key:0,size:o.iconSize,color:o.color!==e.unref(u.default).shades.transparent?o.color:void 0,icon:o.icon},null,8,["size","color","icon"])):e.createCommentVNode("",!0)]),_:1},16,["border","class","color","disabled","elevation","height","variant","width"])]),_:1},8,["disabled","location","text"])):(e.openBlock(),e.createBlock(e.unref(c.VBtn),{key:1,height:o.size,width:o.size,class:"p-0",disabled:"","min-width":"auto",variant:"text"},null,8,["height","width"]))}}),v=e.defineComponent({__name:"VSwatches",props:{modelValue:{type:String,default:u.default.shades.white},swatches:{type:Array,default:()=>[]},size:{type:String,default:"2rem"},icon:{type:String,default:"mdi-checkbox-marked-circle"},iconSize:{type:String,default:"1rem"},inline:{type:Boolean,default:!1},variant:{type:String,default:void 0},disabled:{type:Boolean,default:!1},rounded:{type:[String,Number,Boolean],default:void 0},border:{type:[String,Number,Boolean],default:!1},elevation:{type:[String,Number],default:void 0},transpose:{type:Boolean,default:!1},tooltip:{type:Boolean,default:!1},tooltipLocation:{type:String,default:void 0}},emits:{"update:modelValue":l=>!0},setup(l,{emit:r}){const o=r,t=l,a=e.computed(()=>{const i=Array.isArray(t.swatches)?t.swatches:Object.values(t.swatches);return t.inline?[i.flat(1/0)]:t.transpose?B(...i):i}),n=e.ref(u.default.shades.white);return e.watch(()=>n.value,i=>o("update:modelValue",i)),e.watch(()=>t.modelValue,i=>{i&&(n.value=i)},{immediate:!0}),(i,p)=>(e.openBlock(),e.createBlock(e.unref(c.VItemGroup),{modelValue:n.value,"onUpdate:modelValue":p[0]||(p[0]=d=>n.value=d),class:e.normalizeClass([{"d-inline":t.inline},"v-swatches"]),mandatory:""},{default:e.withCtx(()=>[t.inline?(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:0},e.renderList(a.value[0],d=>(e.openBlock(),e.createBlock(e.unref(c.VItem),{key:d,value:d},{default:e.withCtx(({isSelected:f,toggle:s})=>[e.createVNode(m,{border:t.border,color:d,disabled:t.disabled,elevation:t.elevation,"icon-size":t.iconSize,icon:t.icon,"is-selected":f,rounded:t.rounded,size:t.size,"tooltip-location":t.tooltipLocation,tooltip:t.tooltip,variant:t.variant,onClick:s},null,8,["border","color","disabled","elevation","icon-size","icon","is-selected","rounded","size","tooltip-location","tooltip","variant","onClick"])]),_:2},1032,["value"]))),128)):(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:1},e.renderList(a.value,(d,f)=>(e.openBlock(),e.createElementBlock("div",{key:f},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(d,s=>(e.openBlock(),e.createBlock(e.unref(c.VItem),{key:s,value:s},{default:e.withCtx(({isSelected:h,toggle:k})=>[e.createVNode(m,{border:t.border,color:s,disabled:t.disabled,elevation:t.elevation,"icon-size":t.iconSize,icon:t.icon,"is-selected":h,rounded:t.rounded,size:t.size,"tooltip-location":t.tooltipLocation,tooltip:t.tooltip,variant:t.variant,onClick:k},null,8,["border","color","disabled","elevation","icon-size","icon","is-selected","rounded","size","tooltip-location","tooltip","variant","onClick"])]),_:2},1032,["value"]))),128))]))),128))]),_:1},8,["modelValue","class"]))}});const w=l=>l.component("VSwatches",v);exports.default=v;exports.install=w;