1
import './_grid.sass'
2
import './VGrid.sass'
3

4
import Grid from './grid'
5

6
import mergeData from '../../util/mergeData'
7

8
/* @vue/component */
9
export default Grid('container').extend({
10
  name: 'v-container',
11
  functional: true,
12
  props: {
13
    id: String,
14
    tag: {
15
      type: String,
16
      default: 'div',
17
    },
18
    fluid: {
19
      type: Boolean,
20
      default: false,
21
    },
22
  },
23 1
  render (h, { props, data, children }) {
24
    let classes
25 1
    const { attrs } = data
26 1
    if (attrs) {
27
      // reset attrs to extract utility clases like pa-3
28 1
      data.attrs = {}
29 1
      classes = Object.keys(attrs).filter(key => {
30
        // TODO: Remove once resolved
31
        // https://github.com/vuejs/vue/issues/7841
32 1
        if (key === 'slot') return false
33

34 0
        const value = attrs[key]
35

36
        // add back data attributes like data-test="foo" but do not
37
        // add them as classes
38 1
        if (key.startsWith('data-')) {
39 0
          data.attrs![key] = value
40 0
          return false
41
        }
42

43 1
        return value || typeof value === 'string'
44
      })
45
    }
46

47 1
    if (props.id) {
48 1
      data.domProps = data.domProps || {}
49 0
      data.domProps.id = props.id
50
    }
51

52 1
    return h(
53
      props.tag,
54
      mergeData(data, {
55
        staticClass: 'container',
56
        class: Array<any>({
57
          'container--fluid': props.fluid,
58 1
        }).concat(classes || []),
59
      }),
60
      children
61
    )
62
  },
63
})

Read our documentation on viewing source code .

Loading