1 line
8.7 KiB
Plaintext
1 line
8.7 KiB
Plaintext
|
{"version":3,"file":"VCol.mjs","names":["makeComponentProps","breakpoints","makeTagProps","capitalize","computed","h","genericComponent","propsFactory","breakpointProps","reduce","props","val","type","Boolean","String","Number","default","offsetProps","offsetKey","orderProps","orderKey","propMap","col","Object","keys","offset","order","breakpointClass","prop","className","undefined","breakpoint","replace","toLowerCase","ALIGN_SELF_VALUES","makeVColProps","cols","alignSelf","validator","str","includes","VCol","name","setup","_ref","slots","classes","classList","forEach","value","push","hasColClasses","some","startsWith","tag","class","style"],"sources":["../../../src/components/VGrid/VCol.ts"],"sourcesContent":["// Styles\nimport './VGrid.sass'\n\n// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { breakpoints } from '@/composables/display'\nimport { makeTagProps } from '@/composables/tag'\n\n// Utilities\nimport { capitalize, computed, h } from 'vue'\nimport { genericComponent, propsFactory } from '@/util'\n\n// Types\nimport type { Prop, PropType } from 'vue'\nimport type { Breakpoint } from '@/composables/display'\n\ntype BreakpointOffset = `offset${Capitalize<Breakpoint>}`\ntype BreakpointOrder = `order${Capitalize<Breakpoint>}`\n\nconst breakpointProps = (() => {\n return breakpoints.reduce((props, val) => {\n props[val] = {\n type: [Boolean, String, Number],\n default: false,\n }\n return props\n }, {} as Record<Breakpoint, Prop<boolean | string | number, false>>)\n})()\n\nconst offsetProps = (() => {\n return breakpoints.reduce((props, val) => {\n const offsetKey = ('offset' + capitalize(val)) as BreakpointOffset\n props[offsetKey] = {\n type: [String, Number],\n default: null,\n }\n return props\n }, {} as Record<BreakpointOffset, Prop<string | number, null>>)\n})()\n\nconst orderProps = (() => {\n return breakpoints.reduce((props, val) => {\n const orderKey = ('order' + capitalize(val)) as BreakpointOrder\n props[orderKey] = {\n type: [String, Number],\n default: null,\n }\n return props\n }, {} as Record<BreakpointOrder, Prop<string | number, null>>)\n})()\n\nconst propMap = {\n col: Object.keys(breakpointProps),\n offset: Object.keys(offsetProps),\n order: Object.keys(orderProps),\n}\n\nfunction breakpointClass (type: keyof typeof propMap, prop: string, val: boolean | string | number) {\n let className: string = type\n if (val == null || val === false) {\n return undefined\n }\n if (prop) {\n const breakpoint = prop.replace(type, '')\n className += `-${breakpoint}`\n }\n if (type === 'col') {\n className = 'v-' + className\n }\n // Handling the boolean style prop when accepting [Boolean, String, Number]\n // means Vue will not convert <v-col sm></v-col> to sm: true for us.\n // Since the default is false, an empty string indicates the prop's presence.\n if (type === 'col' && (val === '' || val === true)) {\n // .v-col-md\n return className.toLowerCase()\n }\n // .order-md-6\n className += `-${val}`\n return className.toLowerCase()\n}\n\nconst ALIGN_SELF_VALUES = ['auto', 'start', 'end', 'center', 'baseline', 'stretch'] as const\n\nexport const makeVColProps = propsFactory({\n cols: {\n type: [Boolean, String, Number],\n default: false,\n },\n ...breakpointProps,\n offset: {\n type: [String, Number],\n default: null,\n },\n ...offsetProps,\n order: {\n type: [String, Number],\n default: null,\n },\n ...orderProps,\n alignSelf: {\n type: String as PropType<typeof ALIGN_SELF_VALUES[number]>,\n default: null,\n validator: (str: any) => ALIGN_SELF_VALUES.includes(str),\n },\n\n ...makeComponentProps(),\n ...makeTagProps(),\n}, 'VCol')\n\nexport const VCol = genericComponent()({\n name: 'VCol',\n\n props: makeVColProps(),\n\n setup (props, { slots }) {\n const classes = computed(() => {\n const classList: any[] = []\n\n // Loop through `col`, `offset`, `order` breakpoint props\n let type: keyof typeof propMap\n fo
|