vexip-ui/lib/components/grid/grid.cjs.map

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

{"version":3,"file":"grid.cjs","sources":["../../../components/grid/grid.ts"],"sourcesContent":["import { computed, defineComponent, h, provide, reactive, toRef } from 'vue'\n\nimport { useNameHelper, useProps } from '@vexip-ui/config'\nimport { gridProps } from './props'\nimport { GRID_STATE } from './symbol'\n\nimport type { CSSProperties } from 'vue'\nimport type { GridAlign, GridJustify, LayoutProp } from './symbol'\n\nconst numberRE = /^\\d+$/\n\nconst justifyList = Object.freeze<GridJustify[]>([\n  'start',\n  'end',\n  'center',\n  'space-around',\n  'space-between',\n  'space-evenly',\n])\nconst alignList = Object.freeze<GridAlign[]>(['top', 'middle', 'bottom', 'stretch'])\n\nexport default defineComponent({\n  name: 'Grid',\n  props: gridProps,\n  setup(_props, { slots }) {\n    const props = useProps('grid', _props, {\n      tag: 'div',\n      gap: 0,\n      rows: 'none',\n      columns: 24,\n      autoRows: 'auto',\n      autoColumns: 'auto',\n      dense: false,\n      justify: {\n        default: 'start',\n        validator: value => justifyList.includes(value),\n      },\n      align: {\n        default: 'stretch',\n        validator: value => alignList.includes(value),\n      },\n      cellFlex: false,\n    })\n\n    const nh = useNameHelper('grid')\n\n    const className = computed(() => {\n      return {\n        [nh.b()]: true,\n        [nh.bm(props.justify)]: true,\n        [nh.bm('inherit')]: props.inherit,\n        [nh.bm(props.align)]: props.align !== 'stretch',\n        [nh.bm('dense')]: props.dense,\n      }\n    })\n    const style = computed(() => {\n      const style: CSSProperties = {}\n\n      if (props.gap) {\n        style.gap = Array.isArray(props.gap)\n          ? `${props.gap[0]}px ${props.gap[1]}px`\n          : `${props.gap}px`\n      }\n\n      style.gridTemplateColumns = parseSizeLayout(props.columns)\n\n      if (props.rows !== 'none') {\n        style.gridTemplateRows = parseSizeLayout(props.rows)\n      }\n\n      if (props.autoRows !== 'auto') {\n        style.gridAutoRows = parseAutoLayout(props.autoRows)\n      }\n\n      if (props.autoColumns !== 'auto') {\n        style.gridAutoColumns = parseAutoLayout(props.autoColumns)\n      }\n\n      return style\n    })\n    const cellFlex = computed(() => {\n      if (props.cellFlex === true) {\n        return {\n          justify: 'start',\n          align: 'top',\n        } as const\n      } else if (props.cellFlex) {\n        return {\n          justify: 'start',\n          align: 'top',\n          ...props.cellFlex,\n        } as const\n      }\n\n      return false\n    })\n\n    provide(GRID_STATE, reactive({ cellFlex, columns: toRef(props, 'columns') }))\n\n    function parseSizeLayout(value: LayoutProp) {\n      if (typeof value === 'number') {\n        return `repeat(${value}, 1fr)`\n      }\n\n      if (typeof value === 'string') {\n        return numberRE.test(value.trim()) ? `repeat(${value}, 1fr)` : value\n      }\n\n      if (Array.isArray(value)) {\n        return value\n          .map(item => {\n            if (typeof item === 'number') {\n              return `${item}fr`\n            }\n\n            if (typeof item === 'string') {\n              return numberRE.test(item.trim()) ? `${item}fr` : item\n            }\n\n            return item\n          })\n          .join(' ')\n      }\n\n      return value\n    }\n\n    function parseAutoLayout(value: LayoutProp) {\n      if (typeof value === 'number') {\n        return `${value}fr`\n      }\n\n      if (typeof value === 'string') {\n        return numberRE.test(value.trim()) ? `repeat(${value}, 1fr)` : value\n      }\n\n      if (Array.isArray(value)) {\n        return value\n          .map(item => {\n            if (typeof item === 'number') {\n              return `${item}fr`\n            }\n\n            if (typeof item === 'string') {\n              return numberRE.test(item.trim()) ? `${item}fr` : item\n            }\n\n            return item\n          })\n          .join(' ')\n      }\n\n      return value\n    }\n\n    return () =>\n      h(\n        props.tag || 'div',\n        {\n          class: className.value,\n          style: style.value,\n        },\n        {\n          default: () => slots.default?.(),\n        },\n      )\n  },\n})\n"],"names":["numberRE","justifyList","alignList","Grid","defineComponent","gridProps","_props","slots","props","useProps","value","nh","useNameHelper","className","computed","style","parseSizeLayout","parseAutoLayout","cellFlex","provide","GRID_STATE","reactive","toRef","item","h","_a"],"mappings":"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"}