vexip-ui
Version:
A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good
1 lines • 8.54 kB
Source Map (JSON)
{"version":3,"file":"space.cjs","sources":["../../../components/space/space.tsx"],"sourcesContent":["import { computed, defineComponent, renderSlot } from 'vue'\n\nimport { useNameHelper, useProps } from '@vexip-ui/config'\nimport { flatVNodes } from '@vexip-ui/hooks'\nimport { supportFlexGap } from '@vexip-ui/utils'\nimport { spaceProps } from './props'\n\nimport type { ClassType } from '@vexip-ui/config'\nimport type { SpaceAlign, SpaceJustify } from './symbol'\n\nconst justifyList = Object.freeze<SpaceJustify[]>([\n 'start',\n 'end',\n 'center',\n 'space-around',\n 'space-between',\n 'space-evenly',\n])\nconst alignList = Object.freeze<SpaceAlign[]>(['start', 'end', 'center', 'baseline', 'stretch'])\n\nconst useFlexGap = supportFlexGap()\n\nfunction parseFlexStyle(value: string) {\n return value === 'start' || value === 'end' ? `flex-${value}` : value\n}\n\nexport default defineComponent({\n name: 'Space',\n props: spaceProps,\n setup(_props, { slots }) {\n const props = useProps('space', _props, {\n vertical: false,\n inline: false,\n tag: 'div',\n align: {\n default: 'stretch',\n validator: value => alignList.includes(value),\n },\n justify: {\n default: 'start',\n validator: value => justifyList.includes(value),\n },\n noWrap: false,\n size: 'default',\n itemStyle: null,\n gapDisabled: !useFlexGap,\n })\n\n const nh = useNameHelper('space')\n const varMap: Record<string, any> = {\n h: `var(${nh.cv('h-gap')})`,\n hh: `calc(var(${nh.cv('h-gap')}) * 0.5)`,\n mhh: `calc(var(${nh.cv('h-gap')}) * -0.5)`,\n v: `var(${nh.cv('v-gap')})`,\n hv: `calc(var(${nh.cv('v-gap')}) * 0.5)`,\n mhv: `calc(var(${nh.cv('v-gap')}) * -0.5)`,\n }\n\n const className = computed(() => {\n const className: ClassType = {\n [nh.b()]: true,\n [nh.bs('vars')]: true,\n [nh.bm('inherit')]: props.inherit,\n [nh.bm('inline')]: props.inline,\n [nh.bm('vertical')]: props.vertical,\n [nh.bm('no-wrap')]: props.vertical || props.noWrap,\n [nh.bm('no-gap')]: props.gapDisabled,\n }\n\n if (typeof props.size === 'string' && props.size !== 'default') {\n className[nh.bm(props.size)] = true\n }\n\n return className\n })\n const style = computed(() => {\n const { justify, align, size } = props\n\n const style: Record<string, string> = {\n alignItems: parseFlexStyle(align),\n justifyContent: parseFlexStyle(justify),\n }\n\n if (typeof size !== 'string') {\n const normalizedSize = Array.isArray(size) ? size : [size, size]\n\n style[nh.cv('h-gap')] = `${normalizedSize[0]}px`\n style[nh.cv('v-gap')] = `${normalizedSize[1]}px`\n }\n\n if (props.gapDisabled && !props.vertical) {\n style.marginTop = varMap.mhv\n style.marginBottom = varMap.mhv\n }\n\n return style\n })\n\n return () => {\n const CustomTag = props.tag || ('div' as any)\n const children = renderSlot(slots, 'default').children\n\n if (!children?.length) {\n return <CustomTag class={className.value} style={style.value}></CustomTag>\n }\n\n const vnodes = flatVNodes(children)\n const lastIndex = vnodes.length - 1\n const justify = props.justify\n const justifySpace = justify.startsWith('space')\n const notBetween = justify !== 'space-between'\n\n return (\n <CustomTag class={className.value} style={style.value}>\n {vnodes.map((vnode, index) => (\n <div\n key={index}\n class={nh.be('item')}\n role={'none'}\n style={[\n props.itemStyle,\n !props.gapDisabled\n ? ''\n : props.vertical\n ? {\n marginBottom: index !== lastIndex ? varMap.v : undefined,\n }\n : {\n paddingTop: varMap.hv,\n paddingBottom: varMap.hv,\n marginRight: justifySpace\n ? notBetween || index !== lastIndex\n ? varMap.hh\n : undefined\n : index !== lastIndex\n ? varMap.h\n : undefined,\n marginLeft: justifySpace\n ? notBetween || index !== 0\n ? varMap.hh\n : undefined\n : undefined,\n },\n ]}\n >\n {vnode}\n </div>\n ))}\n </CustomTag>\n )\n }\n },\n})\n"],"names":["_isSlot","s","Object","prototype","toString","call","_isVNode","justifyList","freeze","alignList","useFlexGap","supportFlexGap","parseFlexStyle","value","defineComponent","name","props","spaceProps","setup","_props","slots","useProps","vertical","inline","tag","align","default","validator","includes","justify","noWrap","size","itemStyle","gapDisabled","nh","useNameHelper","varMap","h","cv","hh","mhh","v","hv","mhv","className","computed","b","bs","bm","inherit","style","alignItems","justifyContent","normalizedSize","Array","isArray","marginTop","marginBottom","_slot","CustomTag","children","renderSlot","length","_createVNode","vnodes","flatVNodes","lastIndex","justifySpace","startsWith","notBetween","map","vnode","index","be","undefined","paddingTop","paddingBottom","marginRight","marginLeft"],"mappings":"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"}