let vendor = require('./vendor') let Declaration = require('./declaration') let Resolution = require('./resolution') let Transition = require('./transition') let Processor = require('./processor') let Supports = require('./supports') let Browsers = require('./browsers') let Selector = require('./selector') let AtRule = require('./at-rule') let Value = require('./value') let utils = require('./utils') let hackFullscreen = require('./hacks/fullscreen') let hackPlaceholder = require('./hacks/placeholder') let hackPlaceholderShown = require('./hacks/placeholder-shown') let hackFileSelectorButton = require('./hacks/file-selector-button') let hackFlex = require('./hacks/flex') let hackOrder = require('./hacks/order') let hackFilter = require('./hacks/filter') let hackGridEnd = require('./hacks/grid-end') let hackAnimation = require('./hacks/animation') let hackFlexFlow = require('./hacks/flex-flow') let hackFlexGrow = require('./hacks/flex-grow') let hackFlexWrap = require('./hacks/flex-wrap') let hackGridArea = require('./hacks/grid-area') let hackPlaceSelf = require('./hacks/place-self') let hackGridStart = require('./hacks/grid-start') let hackAlignSelf = require('./hacks/align-self') let hackAppearance = require('./hacks/appearance') let hackFlexBasis = require('./hacks/flex-basis') let hackMaskBorder = require('./hacks/mask-border') let hackMaskComposite = require('./hacks/mask-composite') let hackAlignItems = require('./hacks/align-items') let hackUserSelect = require('./hacks/user-select') let hackFlexShrink = require('./hacks/flex-shrink') let hackBreakProps = require('./hacks/break-props') let hackColorAdjust = require('./hacks/color-adjust') let hackWritingMode = require('./hacks/writing-mode') let hackBorderImage = require('./hacks/border-image') let hackAlignContent = require('./hacks/align-content') let hackBorderRadius = require('./hacks/border-radius') let hackBlockLogical = require('./hacks/block-logical') let hackGridTemplate = require('./hacks/grid-template') let hackInlineLogical = require('./hacks/inline-logical') let hackGridRowAlign = require('./hacks/grid-row-align') let hackTransformDecl = require('./hacks/transform-decl') let hackFlexDirection = require('./hacks/flex-direction') let hackImageRendering = require('./hacks/image-rendering') let hackBackdropFilter = require('./hacks/backdrop-filter') let hackBackgroundClip = require('./hacks/background-clip') let hackTextDecoration = require('./hacks/text-decoration') let hackJustifyContent = require('./hacks/justify-content') let hackBackgroundSize = require('./hacks/background-size') let hackGridRowColumn = require('./hacks/grid-row-column') let hackGridRowsColumns = require('./hacks/grid-rows-columns') let hackGridColumnAlign = require('./hacks/grid-column-align') let hackOverscrollBehavior = require('./hacks/overscroll-behavior') let hackGridTemplateAreas = require('./hacks/grid-template-areas') let hackTextEmphasisPosition = require('./hacks/text-emphasis-position') let hackTextDecorationSkipInk = require('./hacks/text-decoration-skip-ink') let hackGradient = require('./hacks/gradient') let hackIntrinsic = require('./hacks/intrinsic') let hackPixelated = require('./hacks/pixelated') let hackImageSet = require('./hacks/image-set') let hackCrossFade = require('./hacks/cross-fade') let hackDisplayFlex = require('./hacks/display-flex') let hackDisplayGrid = require('./hacks/display-grid') let hackFilterValue = require('./hacks/filter-value') let hackAutofill = require('./hacks/autofill') Selector.hack(hackAutofill) Selector.hack(hackFullscreen) Selector.hack(hackPlaceholder) Selector.hack(hackPlaceholderShown) Selector.hack(hackFileSelectorButton) Declaration.hack(hackFlex) Declaration.hack(hackOrder) Declaration.hack(hackFilter) Declaration.hack(hackGridEnd) Declaration.hack(hackAnimation) Declaration.hack(hackFlexFlow) Declaration.hack(hackFlexGrow) Declaration.hack(hackFlexWrap) Declaration.hack(hackGridArea) Declaration.hack(hackPlaceSelf) Declaration.hack(hackGridStart) Declaration.hack(hackAlignSelf) Declaration.hack(hackAppearance) Declaration.hack(hackFlexBasis) Declaration.hack(hackMaskBorder) Declaration.hack(hackMaskComposite) Declaration.hack(hackAlignItems) Declaration.hack(hackUserSelect) Declaration.hack(hackFlexShrink) Declaration.hack(hackBreakProps) Declaration.hack(hackColorAdjust) Declaration.hack(hackWritingMode) Declaration.hack(hackBorderImage) Declaration.hack(hackAlignContent) Declaration.hack(hackBorderRadius) Declaration.hack(hackBlockLogical) Declaration.hack(hackGridTemplate) Declaration.hack(hackInlineLogical) Declaration.hack(hackGridRowAlign) Declaration.hack(hackTransformDecl) Declaration.hack(hackFlexDirection) Declaration.hack(hackImageRendering) Declaration.hack(hackBackdropFilter) Declaration.hack(hackBackgroundClip) Declaration.hack(hackTextDecoration) Declaration.hack(hackJustifyContent) Declaration.hack(hackBackgroundSize) Declaration.hack(hackGridRowColumn) Declaration.hack(hackGridRowsColumns) Declaration.hack(hackGridColumnAlign) Declaration.hack(hackOverscrollBehavior) Declaration.hack(hackGridTemplateAreas) Declaration.hack(hackTextEmphasisPosition) Declaration.hack(hackTextDecorationSkipInk) Value.hack(hackGradient) Value.hack(hackIntrinsic) Value.hack(hackPixelated) Value.hack(hackImageSet) Value.hack(hackCrossFade) Value.hack(hackDisplayFlex) Value.hack(hackDisplayGrid) Value.hack(hackFilterValue) let declsCache = new Map() class Prefixes { constructor(data, browsers, options = {}) { this.data = data this.browsers = browsers this.options = options ;[this.add, this.remove] = this.preprocess(this.select(this.data)) this.transition = new Transition(this) this.processor = new Processor(this) } /** * Return clone instance to remove all prefixes */ cleaner() { if (this.cleanerCache) { return this.cleanerCache } if (this.browsers.selected.length) { let empty = new Browsers(this.browsers.data, []) this.cleanerCache = new Prefixes(this.data, empty, this.options) } else { return this } return this.cleanerCache } /** * Select prefixes from data, which is necessary for selected browsers */ select(list) { let selected = { add: {}, remove: {} } for (let name in list) { let data = list[name] let add = data.browsers.map(i => { let params = i.split(' ') return { browser: `${params[0]} ${params[1]}`, note: params[2] } }) let notes = add .filter(i => i.note) .map(i => `${this.browsers.prefix(i.browser)} ${i.note}`) notes = utils.uniq(notes) add = add .filter(i => this.browsers.isSelected(i.browser)) .map(i => { let prefix = this.browsers.prefix(i.browser) if (i.note) { return `${prefix} ${i.note}` } else { return prefix } }) add = this.sort(utils.uniq(add)) if (this.options.flexbox === 'no-2009') { add = add.filter(i => !i.includes('2009')) } let all = data.browsers.map(i => this.browsers.prefix(i)) if (data.mistakes) { all = all.concat(data.mistakes) } all = all.concat(notes) all = utils.uniq(all) if (add.length) { selected.add[name] = add if (add.length < all.length) { selected.remove[name] = all.filter(i => !add.includes(i)) } } else { selected.remove[name] = all } } return selected } /** * Sort vendor prefixes */ sort(prefixes) { return prefixes.sort((a, b) => { let aLength = utils.removeNote(a).length let bLength = utils.removeNote(b).length if (aLength === bLength) { return b.length - a.length } else { return bLength - aLength } }) } /** * Cache prefixes data to fast CSS processing */ preprocess(selected) { let add = { 'selectors': [], '@supports': new Supports(Prefixes, this) } for (let name in selected.add) { let prefixes = selected.add[name] if (name === '@keyframes' || name === '@viewport') { add[name] = new AtRule(name, prefixes, this) } else if (name === '@resolution') { add[name] = new Resolution(name, prefixes, this) } else if (this.data[name].selector) { add.selectors.push(Selector.load(name, prefixes, this)) } else { let props = this.data[name].props if (props) { let value = Value.load(name, prefixes, this) for (let prop of props) { if (!add[prop]) { add[prop] = { values: [] } } add[prop].values.push(value) } } else { let values = (add[name] && add[name].values) || [] add[name] = Declaration.load(name, prefixes, this) add[name].values = values } } } let remove = { selectors: [] } for (let name in selected.remove) { let prefixes = selected.remove[name] if (this.data[name].selector) { let selector = Selector.load(name, prefixes) for (let prefix of prefixes) { remove.selectors.push(selector.old(prefix)) } } else if (name === '@keyframes' || name === '@viewport') { for (let prefix of prefixes) { let prefixed = `@${prefix}${name.slice(1)}` remove[prefixed] = { remove: true } } } else if (name === '@resolution') { remove[name] = new Resolution(name, prefixes, this) } else { let props = this.data[name].props if (props) { let value = Value.load(name, [], this) for (let prefix of prefixes) { let old = value.old(prefix) if (old) { for (let prop of props) { if (!remove[prop]) { remove[prop] = {} } if (!remove[prop].values) { remove[prop].values = [] } remove[prop].values.push(old) } } } } else { for (let p of prefixes) { let olds = this.decl(name).old(name, p) if (name === 'align-self') { let a = add[name] && add[name].prefixes if (a) { if (p === '-webkit- 2009' && a.includes('-webkit-')) { continue } else if (p === '-webkit-' && a.includes('-webkit- 2009')) { continue } } } for (let prefixed of olds) { if (!remove[prefixed]) { remove[prefixed] = {} } remove[prefixed].remove = true } } } } } return [add, remove] } /** * Declaration loader with caching */ decl(prop) { if (!declsCache.has(prop)) { declsCache.set(prop, Declaration.load(prop)) } return declsCache.get(prop) } /** * Return unprefixed version of property */ unprefixed(prop) { let value = this.normalize(vendor.unprefixed(prop)) if (value === 'flex-direction') { value = 'flex-flow' } return value } /** * Normalize prefix for remover */ normalize(prop) { return this.decl(prop).normalize(prop) } /** * Return prefixed version of property */ prefixed(prop, prefix) { prop = vendor.unprefixed(prop) return this.decl(prop).prefixed(prop, prefix) } /** * Return values, which must be prefixed in selected property */ values(type, prop) { let data = this[type] let global = data['*'] && data['*'].values let values = data[prop] && data[prop].values if (global && values) { return utils.uniq(global.concat(values)) } else { return global || values || [] } } /** * Group declaration by unprefixed property to check them */ group(decl) { let rule = decl.parent let index = rule.index(decl) let { length } = rule.nodes let unprefixed = this.unprefixed(decl.prop) let checker = (step, callback) => { index += step while (index >= 0 && index < length) { let other = rule.nodes[index] if (other.type === 'decl') { if (step === -1 && other.prop === unprefixed) { if (!Browsers.withPrefix(other.value)) { break } } if (this.unprefixed(other.prop) !== unprefixed) { break } else if (callback(other) === true) { return true } if (step === +1 && other.prop === unprefixed) { if (!Browsers.withPrefix(other.value)) { break } } } index += step } return false } return { up(callback) { return checker(-1, callback) }, down(callback) { return checker(+1, callback) } } } } module.exports = Prefixes