| [2058e5c] | 1 | let Declaration = require('../declaration')
|
|---|
| 2 | let {
|
|---|
| 3 | getGridGap,
|
|---|
| 4 | inheritGridGap,
|
|---|
| 5 | parseGridAreas,
|
|---|
| 6 | prefixTrackProp,
|
|---|
| 7 | prefixTrackValue,
|
|---|
| 8 | warnGridGap,
|
|---|
| 9 | warnMissedAreas
|
|---|
| 10 | } = require('./grid-utils')
|
|---|
| 11 |
|
|---|
| 12 | function getGridRows(tpl) {
|
|---|
| 13 | return tpl
|
|---|
| 14 | .trim()
|
|---|
| 15 | .slice(1, -1)
|
|---|
| 16 | .split(/["']\s*["']?/g)
|
|---|
| 17 | }
|
|---|
| 18 |
|
|---|
| 19 | class GridTemplateAreas extends Declaration {
|
|---|
| 20 | /**
|
|---|
| 21 | * Translate grid-template-areas to separate -ms- prefixed properties
|
|---|
| 22 | */
|
|---|
| 23 | insert(decl, prefix, prefixes, result) {
|
|---|
| 24 | if (prefix !== '-ms-') return super.insert(decl, prefix, prefixes)
|
|---|
| 25 |
|
|---|
| 26 | let hasColumns = false
|
|---|
| 27 | let hasRows = false
|
|---|
| 28 | let parent = decl.parent
|
|---|
| 29 | let gap = getGridGap(decl)
|
|---|
| 30 | gap = inheritGridGap(decl, gap) || gap
|
|---|
| 31 |
|
|---|
| 32 | // remove already prefixed rows
|
|---|
| 33 | // to prevent doubling prefixes
|
|---|
| 34 | parent.walkDecls(/-ms-grid-rows/, i => i.remove())
|
|---|
| 35 |
|
|---|
| 36 | // add empty tracks to rows
|
|---|
| 37 | parent.walkDecls(/grid-template-(rows|columns)/, trackDecl => {
|
|---|
| 38 | if (trackDecl.prop === 'grid-template-rows') {
|
|---|
| 39 | hasRows = true
|
|---|
| 40 | let { prop, value } = trackDecl
|
|---|
| 41 | trackDecl.cloneBefore({
|
|---|
| 42 | prop: prefixTrackProp({ prefix, prop }),
|
|---|
| 43 | value: prefixTrackValue({ gap: gap.row, value })
|
|---|
| 44 | })
|
|---|
| 45 | } else {
|
|---|
| 46 | hasColumns = true
|
|---|
| 47 | }
|
|---|
| 48 | })
|
|---|
| 49 |
|
|---|
| 50 | let gridRows = getGridRows(decl.value)
|
|---|
| 51 |
|
|---|
| 52 | if (hasColumns && !hasRows && gap.row && gridRows.length > 1) {
|
|---|
| 53 | decl.cloneBefore({
|
|---|
| 54 | prop: '-ms-grid-rows',
|
|---|
| 55 | raws: {},
|
|---|
| 56 | value: prefixTrackValue({
|
|---|
| 57 | gap: gap.row,
|
|---|
| 58 | value: `repeat(${gridRows.length}, auto)`
|
|---|
| 59 | })
|
|---|
| 60 | })
|
|---|
| 61 | }
|
|---|
| 62 |
|
|---|
| 63 | // warnings
|
|---|
| 64 | warnGridGap({
|
|---|
| 65 | decl,
|
|---|
| 66 | gap,
|
|---|
| 67 | hasColumns,
|
|---|
| 68 | result
|
|---|
| 69 | })
|
|---|
| 70 |
|
|---|
| 71 | let areas = parseGridAreas({
|
|---|
| 72 | gap,
|
|---|
| 73 | rows: gridRows
|
|---|
| 74 | })
|
|---|
| 75 |
|
|---|
| 76 | warnMissedAreas(areas, decl, result)
|
|---|
| 77 |
|
|---|
| 78 | return decl
|
|---|
| 79 | }
|
|---|
| 80 | }
|
|---|
| 81 |
|
|---|
| 82 | GridTemplateAreas.names = ['grid-template-areas']
|
|---|
| 83 |
|
|---|
| 84 | module.exports = GridTemplateAreas
|
|---|