vue-amazing-ui/lib/grid/row/Row.vue2.cjs

An Amazing Vue3 UI Components Library, Using TypeScript.

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("vue"),f=require("../../utils/index.cjs"),c=r.defineComponent({__name:"Row",props:{width:{default:"auto"},gutter:{default:0},wrap:{type:Boolean,default:!1},align:{default:"top"},justify:{default:"start"}},setup(n){const e=n,a={top:"flex-start",middle:"center",bottom:"flex-end",stretch:"stretch"},i=r.ref(window.innerWidth),u=r.computed(()=>typeof e.gutter=="number"?e.gutter:Array.isArray(e.gutter)?typeof e.gutter[0]=="object"?o(e.gutter[0]):e.gutter[0]:typeof e.gutter=="object"?o(e.gutter):0),l=r.computed(()=>Array.isArray(e.gutter)?typeof e.gutter[1]=="object"?o(e.gutter[1]):e.gutter[1]:0),d=r.computed(()=>typeof e.width=="number"?`${e.width}px`:e.width);f.useEventListener(window,"resize",s);function s(){i.value=window.innerWidth}function o(t){return i.value>=1600&&t.xxl!==void 0?t.xxl:i.value>=1200&&t.xl!==void 0?t.xl:i.value>=992&&t.lg!==void 0?t.lg:i.value>=768&&t.md!==void 0?t.md:i.value>=576&&t.sm!==void 0?t.sm:i.value<576&&t.xs!==void 0?t.xs:0}return(t,p)=>(r.openBlock(),r.createElementBlock("div",{class:r.normalizeClass(["grid-row-wrap",{"gutter-row":n.gutter}]),style:r.normalizeStyle(`--xGap: ${u.value/2}px; --justify: ${n.justify}; --align: ${a[n.align]}; width: ${d.value}; margin-left: -${u.value/2}px; margin-right: -${u.value/2}px; row-gap: ${l.value}px;`)},[r.renderSlot(t.$slots,"default",{},void 0,!0)],6))}});exports.default=c;