暫無描述

prefixes.js 23KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125
  1. let unpack = require('caniuse-lite/dist/unpacker/feature')
  2. function browsersSort(a, b) {
  3. a = a.split(' ')
  4. b = b.split(' ')
  5. if (a[0] > b[0]) {
  6. return 1
  7. } else if (a[0] < b[0]) {
  8. return -1
  9. } else {
  10. return Math.sign(parseFloat(a[1]) - parseFloat(b[1]))
  11. }
  12. }
  13. // Convert Can I Use data
  14. function f(data, opts, callback) {
  15. data = unpack(data)
  16. if (!callback) {
  17. ;[callback, opts] = [opts, {}]
  18. }
  19. let match = opts.match || /\sx($|\s)/
  20. let need = []
  21. for (let browser in data.stats) {
  22. let versions = data.stats[browser]
  23. for (let version in versions) {
  24. let support = versions[version]
  25. if (support.match(match)) {
  26. need.push(browser + ' ' + version)
  27. }
  28. }
  29. }
  30. callback(need.sort(browsersSort))
  31. }
  32. // Add data for all properties
  33. let result = {}
  34. function prefix(names, data) {
  35. for (let name of names) {
  36. result[name] = Object.assign({}, data)
  37. }
  38. }
  39. function add(names, data) {
  40. for (let name of names) {
  41. result[name].browsers = result[name].browsers
  42. .concat(data.browsers)
  43. .sort(browsersSort)
  44. }
  45. }
  46. module.exports = result
  47. // Border Radius
  48. let prefixBorderRadius = require('caniuse-lite/data/features/border-radius')
  49. f(prefixBorderRadius, browsers =>
  50. prefix(
  51. [
  52. 'border-radius',
  53. 'border-top-left-radius',
  54. 'border-top-right-radius',
  55. 'border-bottom-right-radius',
  56. 'border-bottom-left-radius'
  57. ],
  58. {
  59. mistakes: ['-khtml-', '-ms-', '-o-'],
  60. feature: 'border-radius',
  61. browsers
  62. }
  63. )
  64. )
  65. // Box Shadow
  66. let prefixBoxshadow = require('caniuse-lite/data/features/css-boxshadow')
  67. f(prefixBoxshadow, browsers =>
  68. prefix(['box-shadow'], {
  69. mistakes: ['-khtml-'],
  70. feature: 'css-boxshadow',
  71. browsers
  72. })
  73. )
  74. // Animation
  75. let prefixAnimation = require('caniuse-lite/data/features/css-animation')
  76. f(prefixAnimation, browsers =>
  77. prefix(
  78. [
  79. 'animation',
  80. 'animation-name',
  81. 'animation-duration',
  82. 'animation-delay',
  83. 'animation-direction',
  84. 'animation-fill-mode',
  85. 'animation-iteration-count',
  86. 'animation-play-state',
  87. 'animation-timing-function',
  88. '@keyframes'
  89. ],
  90. {
  91. mistakes: ['-khtml-', '-ms-'],
  92. feature: 'css-animation',
  93. browsers
  94. }
  95. )
  96. )
  97. // Transition
  98. let prefixTransition = require('caniuse-lite/data/features/css-transitions')
  99. f(prefixTransition, browsers =>
  100. prefix(
  101. [
  102. 'transition',
  103. 'transition-property',
  104. 'transition-duration',
  105. 'transition-delay',
  106. 'transition-timing-function'
  107. ],
  108. {
  109. mistakes: ['-khtml-', '-ms-'],
  110. browsers,
  111. feature: 'css-transitions'
  112. }
  113. )
  114. )
  115. // Transform 2D
  116. let prefixTransform2d = require('caniuse-lite/data/features/transforms2d')
  117. f(prefixTransform2d, browsers =>
  118. prefix(['transform', 'transform-origin'], {
  119. feature: 'transforms2d',
  120. browsers
  121. })
  122. )
  123. // Transform 3D
  124. let prefixTransforms3d = require('caniuse-lite/data/features/transforms3d')
  125. f(prefixTransforms3d, browsers => {
  126. prefix(['perspective', 'perspective-origin'], {
  127. feature: 'transforms3d',
  128. browsers
  129. })
  130. return prefix(['transform-style'], {
  131. mistakes: ['-ms-', '-o-'],
  132. browsers,
  133. feature: 'transforms3d'
  134. })
  135. })
  136. f(prefixTransforms3d, { match: /y\sx|y\s#2/ }, browsers =>
  137. prefix(['backface-visibility'], {
  138. mistakes: ['-ms-', '-o-'],
  139. feature: 'transforms3d',
  140. browsers
  141. })
  142. )
  143. // Gradients
  144. let prefixGradients = require('caniuse-lite/data/features/css-gradients')
  145. f(prefixGradients, { match: /y\sx/ }, browsers =>
  146. prefix(
  147. [
  148. 'linear-gradient',
  149. 'repeating-linear-gradient',
  150. 'radial-gradient',
  151. 'repeating-radial-gradient'
  152. ],
  153. {
  154. props: [
  155. 'background',
  156. 'background-image',
  157. 'border-image',
  158. 'mask',
  159. 'list-style',
  160. 'list-style-image',
  161. 'content',
  162. 'mask-image'
  163. ],
  164. mistakes: ['-ms-'],
  165. feature: 'css-gradients',
  166. browsers
  167. }
  168. )
  169. )
  170. f(prefixGradients, { match: /a\sx/ }, browsers => {
  171. browsers = browsers.map(i => {
  172. if (/firefox|op/.test(i)) {
  173. return i
  174. } else {
  175. return `${i} old`
  176. }
  177. })
  178. return add(
  179. [
  180. 'linear-gradient',
  181. 'repeating-linear-gradient',
  182. 'radial-gradient',
  183. 'repeating-radial-gradient'
  184. ],
  185. {
  186. feature: 'css-gradients',
  187. browsers
  188. }
  189. )
  190. })
  191. // Box sizing
  192. let prefixBoxsizing = require('caniuse-lite/data/features/css3-boxsizing')
  193. f(prefixBoxsizing, browsers =>
  194. prefix(['box-sizing'], {
  195. feature: 'css3-boxsizing',
  196. browsers
  197. })
  198. )
  199. // Filter Effects
  200. let prefixFilters = require('caniuse-lite/data/features/css-filters')
  201. f(prefixFilters, browsers =>
  202. prefix(['filter'], {
  203. feature: 'css-filters',
  204. browsers
  205. })
  206. )
  207. // filter() function
  208. let prefixFilterFunction = require('caniuse-lite/data/features/css-filter-function')
  209. f(prefixFilterFunction, browsers =>
  210. prefix(['filter-function'], {
  211. props: [
  212. 'background',
  213. 'background-image',
  214. 'border-image',
  215. 'mask',
  216. 'list-style',
  217. 'list-style-image',
  218. 'content',
  219. 'mask-image'
  220. ],
  221. feature: 'css-filter-function',
  222. browsers
  223. })
  224. )
  225. // Backdrop-filter
  226. let prefixBackdrop = require('caniuse-lite/data/features/css-backdrop-filter')
  227. f(prefixBackdrop, { match: /y\sx|y\s#2/ }, browsers =>
  228. prefix(['backdrop-filter'], {
  229. feature: 'css-backdrop-filter',
  230. browsers
  231. })
  232. )
  233. // element() function
  234. let prefixElementFunction = require('caniuse-lite/data/features/css-element-function')
  235. f(prefixElementFunction, browsers =>
  236. prefix(['element'], {
  237. props: [
  238. 'background',
  239. 'background-image',
  240. 'border-image',
  241. 'mask',
  242. 'list-style',
  243. 'list-style-image',
  244. 'content',
  245. 'mask-image'
  246. ],
  247. feature: 'css-element-function',
  248. browsers
  249. })
  250. )
  251. // Multicolumns
  252. let prefixMulticolumns = require('caniuse-lite/data/features/multicolumn')
  253. f(prefixMulticolumns, browsers => {
  254. prefix(
  255. [
  256. 'columns',
  257. 'column-width',
  258. 'column-gap',
  259. 'column-rule',
  260. 'column-rule-color',
  261. 'column-rule-width',
  262. 'column-count',
  263. 'column-rule-style',
  264. 'column-span',
  265. 'column-fill'
  266. ],
  267. {
  268. feature: 'multicolumn',
  269. browsers
  270. }
  271. )
  272. let noff = browsers.filter(i => !/firefox/.test(i))
  273. prefix(['break-before', 'break-after', 'break-inside'], {
  274. feature: 'multicolumn',
  275. browsers: noff
  276. })
  277. })
  278. // User select
  279. let prefixUserSelect = require('caniuse-lite/data/features/user-select-none')
  280. f(prefixUserSelect, browsers =>
  281. prefix(['user-select'], {
  282. mistakes: ['-khtml-'],
  283. feature: 'user-select-none',
  284. browsers
  285. })
  286. )
  287. // Flexible Box Layout
  288. let prefixFlexbox = require('caniuse-lite/data/features/flexbox')
  289. f(prefixFlexbox, { match: /a\sx/ }, browsers => {
  290. browsers = browsers.map(i => {
  291. if (/ie|firefox/.test(i)) {
  292. return i
  293. } else {
  294. return `${i} 2009`
  295. }
  296. })
  297. prefix(['display-flex', 'inline-flex'], {
  298. props: ['display'],
  299. feature: 'flexbox',
  300. browsers
  301. })
  302. prefix(['flex', 'flex-grow', 'flex-shrink', 'flex-basis'], {
  303. feature: 'flexbox',
  304. browsers
  305. })
  306. prefix(
  307. [
  308. 'flex-direction',
  309. 'flex-wrap',
  310. 'flex-flow',
  311. 'justify-content',
  312. 'order',
  313. 'align-items',
  314. 'align-self',
  315. 'align-content'
  316. ],
  317. {
  318. feature: 'flexbox',
  319. browsers
  320. }
  321. )
  322. })
  323. f(prefixFlexbox, { match: /y\sx/ }, browsers => {
  324. add(['display-flex', 'inline-flex'], {
  325. feature: 'flexbox',
  326. browsers
  327. })
  328. add(['flex', 'flex-grow', 'flex-shrink', 'flex-basis'], {
  329. feature: 'flexbox',
  330. browsers
  331. })
  332. add(
  333. [
  334. 'flex-direction',
  335. 'flex-wrap',
  336. 'flex-flow',
  337. 'justify-content',
  338. 'order',
  339. 'align-items',
  340. 'align-self',
  341. 'align-content'
  342. ],
  343. {
  344. feature: 'flexbox',
  345. browsers
  346. }
  347. )
  348. })
  349. // calc() unit
  350. let prefixCalc = require('caniuse-lite/data/features/calc')
  351. f(prefixCalc, browsers =>
  352. prefix(['calc'], {
  353. props: ['*'],
  354. feature: 'calc',
  355. browsers
  356. })
  357. )
  358. // Background options
  359. let prefixBackgroundOptions = require('caniuse-lite/data/features/background-img-opts')
  360. f(prefixBackgroundOptions, browsers =>
  361. prefix(['background-origin', 'background-size'], {
  362. feature: 'background-img-opts',
  363. browsers
  364. })
  365. )
  366. // background-clip: text
  367. let prefixBackgroundClipText = require('caniuse-lite/data/features/background-clip-text')
  368. f(prefixBackgroundClipText, browsers =>
  369. prefix(['background-clip'], {
  370. feature: 'background-clip-text',
  371. browsers
  372. })
  373. )
  374. // Font feature settings
  375. let prefixFontFeature = require('caniuse-lite/data/features/font-feature')
  376. f(prefixFontFeature, browsers =>
  377. prefix(
  378. [
  379. 'font-feature-settings',
  380. 'font-variant-ligatures',
  381. 'font-language-override'
  382. ],
  383. {
  384. feature: 'font-feature',
  385. browsers
  386. }
  387. )
  388. )
  389. // CSS font-kerning property
  390. let prefixFontKerning = require('caniuse-lite/data/features/font-kerning')
  391. f(prefixFontKerning, browsers =>
  392. prefix(['font-kerning'], {
  393. feature: 'font-kerning',
  394. browsers
  395. })
  396. )
  397. // Border image
  398. let prefixBorderImage = require('caniuse-lite/data/features/border-image')
  399. f(prefixBorderImage, browsers =>
  400. prefix(['border-image'], {
  401. feature: 'border-image',
  402. browsers
  403. })
  404. )
  405. // Selection selector
  406. let prefixSelection = require('caniuse-lite/data/features/css-selection')
  407. f(prefixSelection, browsers =>
  408. prefix(['::selection'], {
  409. selector: true,
  410. feature: 'css-selection',
  411. browsers
  412. })
  413. )
  414. // Placeholder selector
  415. let prefixPlaceholder = require('caniuse-lite/data/features/css-placeholder')
  416. f(prefixPlaceholder, browsers => {
  417. prefix(['::placeholder'], {
  418. selector: true,
  419. feature: 'css-placeholder',
  420. browsers: browsers.concat(['ie 10 old', 'ie 11 old', 'firefox 18 old'])
  421. })
  422. })
  423. // Placeholder-shown selector
  424. let prefixPlaceholderShown = require('caniuse-lite/data/features/css-placeholder-shown')
  425. f(prefixPlaceholderShown, browsers => {
  426. prefix([':placeholder-shown'], {
  427. selector: true,
  428. feature: 'css-placeholder-shown',
  429. browsers
  430. })
  431. })
  432. // Hyphenation
  433. let prefixHyphens = require('caniuse-lite/data/features/css-hyphens')
  434. f(prefixHyphens, browsers =>
  435. prefix(['hyphens'], {
  436. feature: 'css-hyphens',
  437. browsers
  438. })
  439. )
  440. // Fullscreen selector
  441. let prefixFullscreen = require('caniuse-lite/data/features/fullscreen')
  442. f(prefixFullscreen, browsers =>
  443. prefix([':fullscreen'], {
  444. selector: true,
  445. feature: 'fullscreen',
  446. browsers
  447. })
  448. )
  449. f(prefixFullscreen, { match: /x(\s#2|$)/ }, browsers =>
  450. prefix(['::backdrop'], {
  451. selector: true,
  452. feature: 'fullscreen',
  453. browsers
  454. })
  455. )
  456. // File selector button
  457. let prefixFileSelectorButton = require('caniuse-lite/data/features/css-file-selector-button')
  458. f(prefixFileSelectorButton, browsers =>
  459. prefix(['::file-selector-button'], {
  460. selector: true,
  461. feature: 'file-selector-button',
  462. browsers
  463. })
  464. )
  465. // :autofill
  466. let prefixAutofill = require('caniuse-lite/data/features/css-autofill')
  467. f(prefixAutofill, browsers =>
  468. prefix([':autofill'], {
  469. selector: true,
  470. feature: 'css-autofill',
  471. browsers
  472. })
  473. )
  474. // Tab size
  475. let prefixTabsize = require('caniuse-lite/data/features/css3-tabsize')
  476. f(prefixTabsize, browsers =>
  477. prefix(['tab-size'], {
  478. feature: 'css3-tabsize',
  479. browsers
  480. })
  481. )
  482. // Intrinsic & extrinsic sizing
  483. let prefixIntrinsic = require('caniuse-lite/data/features/intrinsic-width')
  484. let sizeProps = [
  485. 'width',
  486. 'min-width',
  487. 'max-width',
  488. 'height',
  489. 'min-height',
  490. 'max-height',
  491. 'inline-size',
  492. 'min-inline-size',
  493. 'max-inline-size',
  494. 'block-size',
  495. 'min-block-size',
  496. 'max-block-size',
  497. 'grid',
  498. 'grid-template',
  499. 'grid-template-rows',
  500. 'grid-template-columns',
  501. 'grid-auto-columns',
  502. 'grid-auto-rows'
  503. ]
  504. f(prefixIntrinsic, browsers =>
  505. prefix(['max-content', 'min-content'], {
  506. props: sizeProps,
  507. feature: 'intrinsic-width',
  508. browsers
  509. })
  510. )
  511. f(prefixIntrinsic, { match: /x|\s#4/ }, browsers =>
  512. prefix(['fill', 'fill-available'], {
  513. props: sizeProps,
  514. feature: 'intrinsic-width',
  515. browsers
  516. })
  517. )
  518. f(prefixIntrinsic, { match: /x|\s#5/ }, browsers =>
  519. prefix(['fit-content'], {
  520. props: sizeProps,
  521. feature: 'intrinsic-width',
  522. browsers
  523. })
  524. )
  525. // Stretch value
  526. let prefixStretch = require('caniuse-lite/data/features/css-width-stretch')
  527. f(prefixStretch, browsers =>
  528. prefix(['stretch'], {
  529. props: sizeProps,
  530. feature: 'css-width-stretch',
  531. browsers
  532. })
  533. )
  534. // Zoom cursors
  535. let prefixCursorsNewer = require('caniuse-lite/data/features/css3-cursors-newer')
  536. f(prefixCursorsNewer, browsers =>
  537. prefix(['zoom-in', 'zoom-out'], {
  538. props: ['cursor'],
  539. feature: 'css3-cursors-newer',
  540. browsers
  541. })
  542. )
  543. // Grab cursors
  544. let prefixCursorsGrab = require('caniuse-lite/data/features/css3-cursors-grab')
  545. f(prefixCursorsGrab, browsers =>
  546. prefix(['grab', 'grabbing'], {
  547. props: ['cursor'],
  548. feature: 'css3-cursors-grab',
  549. browsers
  550. })
  551. )
  552. // Sticky position
  553. let prefixSticky = require('caniuse-lite/data/features/css-sticky')
  554. f(prefixSticky, browsers =>
  555. prefix(['sticky'], {
  556. props: ['position'],
  557. feature: 'css-sticky',
  558. browsers
  559. })
  560. )
  561. // Pointer Events
  562. let prefixPointer = require('caniuse-lite/data/features/pointer')
  563. f(prefixPointer, browsers =>
  564. prefix(['touch-action'], {
  565. feature: 'pointer',
  566. browsers
  567. })
  568. )
  569. // Text decoration
  570. let prefixDecoration = require('caniuse-lite/data/features/text-decoration')
  571. f(prefixDecoration, { match: /x.*#[235]/ }, browsers =>
  572. prefix(['text-decoration-skip', 'text-decoration-skip-ink'], {
  573. feature: 'text-decoration',
  574. browsers
  575. })
  576. )
  577. let prefixDecorationShorthand = require('caniuse-lite/data/features/mdn-text-decoration-shorthand')
  578. f(prefixDecorationShorthand, browsers =>
  579. prefix(['text-decoration'], {
  580. feature: 'text-decoration',
  581. browsers
  582. })
  583. )
  584. let prefixDecorationColor = require('caniuse-lite/data/features/mdn-text-decoration-color')
  585. f(prefixDecorationColor, browsers =>
  586. prefix(['text-decoration-color'], {
  587. feature: 'text-decoration',
  588. browsers
  589. })
  590. )
  591. let prefixDecorationLine = require('caniuse-lite/data/features/mdn-text-decoration-line')
  592. f(prefixDecorationLine, browsers =>
  593. prefix(['text-decoration-line'], {
  594. feature: 'text-decoration',
  595. browsers
  596. })
  597. )
  598. let prefixDecorationStyle = require('caniuse-lite/data/features/mdn-text-decoration-style')
  599. f(prefixDecorationStyle, browsers =>
  600. prefix(['text-decoration-style'], {
  601. feature: 'text-decoration',
  602. browsers
  603. })
  604. )
  605. // Text Size Adjust
  606. let prefixTextSizeAdjust = require('caniuse-lite/data/features/text-size-adjust')
  607. f(prefixTextSizeAdjust, browsers =>
  608. prefix(['text-size-adjust'], {
  609. feature: 'text-size-adjust',
  610. browsers
  611. })
  612. )
  613. // CSS Masks
  614. let prefixCssMasks = require('caniuse-lite/data/features/css-masks')
  615. f(prefixCssMasks, browsers => {
  616. prefix(
  617. [
  618. 'mask-clip',
  619. 'mask-composite',
  620. 'mask-image',
  621. 'mask-origin',
  622. 'mask-repeat',
  623. 'mask-border-repeat',
  624. 'mask-border-source'
  625. ],
  626. {
  627. feature: 'css-masks',
  628. browsers
  629. }
  630. )
  631. prefix(
  632. [
  633. 'mask',
  634. 'mask-position',
  635. 'mask-size',
  636. 'mask-border',
  637. 'mask-border-outset',
  638. 'mask-border-width',
  639. 'mask-border-slice'
  640. ],
  641. {
  642. feature: 'css-masks',
  643. browsers
  644. }
  645. )
  646. })
  647. // CSS clip-path property
  648. let prefixClipPath = require('caniuse-lite/data/features/css-clip-path')
  649. f(prefixClipPath, browsers =>
  650. prefix(['clip-path'], {
  651. feature: 'css-clip-path',
  652. browsers
  653. })
  654. )
  655. // Fragmented Borders and Backgrounds
  656. let prefixBoxdecoration = require('caniuse-lite/data/features/css-boxdecorationbreak')
  657. f(prefixBoxdecoration, browsers =>
  658. prefix(['box-decoration-break'], {
  659. feature: 'css-boxdecorationbreak',
  660. browsers
  661. })
  662. )
  663. // CSS3 object-fit/object-position
  664. let prefixObjectFit = require('caniuse-lite/data/features/object-fit')
  665. f(prefixObjectFit, browsers =>
  666. prefix(['object-fit', 'object-position'], {
  667. feature: 'object-fit',
  668. browsers
  669. })
  670. )
  671. // CSS Shapes
  672. let prefixShapes = require('caniuse-lite/data/features/css-shapes')
  673. f(prefixShapes, browsers =>
  674. prefix(['shape-margin', 'shape-outside', 'shape-image-threshold'], {
  675. feature: 'css-shapes',
  676. browsers
  677. })
  678. )
  679. // CSS3 text-overflow
  680. let prefixTextOverflow = require('caniuse-lite/data/features/text-overflow')
  681. f(prefixTextOverflow, browsers =>
  682. prefix(['text-overflow'], {
  683. feature: 'text-overflow',
  684. browsers
  685. })
  686. )
  687. // Viewport at-rule
  688. let prefixDeviceadaptation = require('caniuse-lite/data/features/css-deviceadaptation')
  689. f(prefixDeviceadaptation, browsers =>
  690. prefix(['@viewport'], {
  691. feature: 'css-deviceadaptation',
  692. browsers
  693. })
  694. )
  695. // Resolution Media Queries
  696. let prefixResolut = require('caniuse-lite/data/features/css-media-resolution')
  697. f(prefixResolut, { match: /( x($| )|a #2)/ }, browsers =>
  698. prefix(['@resolution'], {
  699. feature: 'css-media-resolution',
  700. browsers
  701. })
  702. )
  703. // CSS text-align-last
  704. let prefixTextAlignLast = require('caniuse-lite/data/features/css-text-align-last')
  705. f(prefixTextAlignLast, browsers =>
  706. prefix(['text-align-last'], {
  707. feature: 'css-text-align-last',
  708. browsers
  709. })
  710. )
  711. // Crisp Edges Image Rendering Algorithm
  712. let prefixCrispedges = require('caniuse-lite/data/features/css-crisp-edges')
  713. f(prefixCrispedges, { match: /y x|a x #1/ }, browsers =>
  714. prefix(['pixelated'], {
  715. props: ['image-rendering'],
  716. feature: 'css-crisp-edges',
  717. browsers
  718. })
  719. )
  720. f(prefixCrispedges, { match: /a x #2/ }, browsers =>
  721. prefix(['image-rendering'], {
  722. feature: 'css-crisp-edges',
  723. browsers
  724. })
  725. )
  726. // Logical Properties
  727. let prefixLogicalProps = require('caniuse-lite/data/features/css-logical-props')
  728. f(prefixLogicalProps, browsers =>
  729. prefix(
  730. [
  731. 'border-inline-start',
  732. 'border-inline-end',
  733. 'margin-inline-start',
  734. 'margin-inline-end',
  735. 'padding-inline-start',
  736. 'padding-inline-end'
  737. ],
  738. {
  739. feature: 'css-logical-props',
  740. browsers
  741. }
  742. )
  743. )
  744. f(prefixLogicalProps, { match: /x\s#2/ }, browsers =>
  745. prefix(
  746. [
  747. 'border-block-start',
  748. 'border-block-end',
  749. 'margin-block-start',
  750. 'margin-block-end',
  751. 'padding-block-start',
  752. 'padding-block-end'
  753. ],
  754. {
  755. feature: 'css-logical-props',
  756. browsers
  757. }
  758. )
  759. )
  760. // CSS appearance
  761. let prefixAppearance = require('caniuse-lite/data/features/css-appearance')
  762. f(prefixAppearance, { match: /#2|x/ }, browsers =>
  763. prefix(['appearance'], {
  764. feature: 'css-appearance',
  765. browsers
  766. })
  767. )
  768. // CSS Scroll snap points
  769. let prefixSnappoints = require('caniuse-lite/data/features/css-snappoints')
  770. f(prefixSnappoints, browsers =>
  771. prefix(
  772. [
  773. 'scroll-snap-type',
  774. 'scroll-snap-coordinate',
  775. 'scroll-snap-destination',
  776. 'scroll-snap-points-x',
  777. 'scroll-snap-points-y'
  778. ],
  779. {
  780. feature: 'css-snappoints',
  781. browsers
  782. }
  783. )
  784. )
  785. // CSS Regions
  786. let prefixRegions = require('caniuse-lite/data/features/css-regions')
  787. f(prefixRegions, browsers =>
  788. prefix(['flow-into', 'flow-from', 'region-fragment'], {
  789. feature: 'css-regions',
  790. browsers
  791. })
  792. )
  793. // CSS image-set
  794. let prefixImageSet = require('caniuse-lite/data/features/css-image-set')
  795. f(prefixImageSet, browsers =>
  796. prefix(['image-set'], {
  797. props: [
  798. 'background',
  799. 'background-image',
  800. 'border-image',
  801. 'cursor',
  802. 'mask',
  803. 'mask-image',
  804. 'list-style',
  805. 'list-style-image',
  806. 'content'
  807. ],
  808. feature: 'css-image-set',
  809. browsers
  810. })
  811. )
  812. // Writing Mode
  813. let prefixWritingMode = require('caniuse-lite/data/features/css-writing-mode')
  814. f(prefixWritingMode, { match: /a|x/ }, browsers =>
  815. prefix(['writing-mode'], {
  816. feature: 'css-writing-mode',
  817. browsers
  818. })
  819. )
  820. // Cross-Fade Function
  821. let prefixCrossFade = require('caniuse-lite/data/features/css-cross-fade')
  822. f(prefixCrossFade, browsers =>
  823. prefix(['cross-fade'], {
  824. props: [
  825. 'background',
  826. 'background-image',
  827. 'border-image',
  828. 'mask',
  829. 'list-style',
  830. 'list-style-image',
  831. 'content',
  832. 'mask-image'
  833. ],
  834. feature: 'css-cross-fade',
  835. browsers
  836. })
  837. )
  838. // Read Only selector
  839. let prefixReadOnly = require('caniuse-lite/data/features/css-read-only-write')
  840. f(prefixReadOnly, browsers =>
  841. prefix([':read-only', ':read-write'], {
  842. selector: true,
  843. feature: 'css-read-only-write',
  844. browsers
  845. })
  846. )
  847. // Text Emphasize
  848. let prefixTextEmphasis = require('caniuse-lite/data/features/text-emphasis')
  849. f(prefixTextEmphasis, browsers =>
  850. prefix(
  851. [
  852. 'text-emphasis',
  853. 'text-emphasis-position',
  854. 'text-emphasis-style',
  855. 'text-emphasis-color'
  856. ],
  857. {
  858. feature: 'text-emphasis',
  859. browsers
  860. }
  861. )
  862. )
  863. // CSS Grid Layout
  864. let prefixGrid = require('caniuse-lite/data/features/css-grid')
  865. f(prefixGrid, browsers => {
  866. prefix(['display-grid', 'inline-grid'], {
  867. props: ['display'],
  868. feature: 'css-grid',
  869. browsers
  870. })
  871. prefix(
  872. [
  873. 'grid-template-columns',
  874. 'grid-template-rows',
  875. 'grid-row-start',
  876. 'grid-column-start',
  877. 'grid-row-end',
  878. 'grid-column-end',
  879. 'grid-row',
  880. 'grid-column',
  881. 'grid-area',
  882. 'grid-template',
  883. 'grid-template-areas',
  884. 'place-self'
  885. ],
  886. {
  887. feature: 'css-grid',
  888. browsers
  889. }
  890. )
  891. })
  892. f(prefixGrid, { match: /a x/ }, browsers =>
  893. prefix(['grid-column-align', 'grid-row-align'], {
  894. feature: 'css-grid',
  895. browsers
  896. })
  897. )
  898. // CSS text-spacing
  899. let prefixTextSpacing = require('caniuse-lite/data/features/css-text-spacing')
  900. f(prefixTextSpacing, browsers =>
  901. prefix(['text-spacing'], {
  902. feature: 'css-text-spacing',
  903. browsers
  904. })
  905. )
  906. // :any-link selector
  907. let prefixAnyLink = require('caniuse-lite/data/features/css-any-link')
  908. f(prefixAnyLink, browsers =>
  909. prefix([':any-link'], {
  910. selector: true,
  911. feature: 'css-any-link',
  912. browsers
  913. })
  914. )
  915. // unicode-bidi
  916. let bidiIsolate = require('caniuse-lite/data/features/mdn-css-unicode-bidi-isolate')
  917. f(bidiIsolate, browsers =>
  918. prefix(['isolate'], {
  919. props: ['unicode-bidi'],
  920. feature: 'css-unicode-bidi',
  921. browsers
  922. })
  923. )
  924. let bidiPlaintext = require('caniuse-lite/data/features/mdn-css-unicode-bidi-plaintext')
  925. f(bidiPlaintext, browsers =>
  926. prefix(['plaintext'], {
  927. props: ['unicode-bidi'],
  928. feature: 'css-unicode-bidi',
  929. browsers
  930. })
  931. )
  932. let bidiOverride = require('caniuse-lite/data/features/mdn-css-unicode-bidi-isolate-override')
  933. f(bidiOverride, { match: /y x/ }, browsers =>
  934. prefix(['isolate-override'], {
  935. props: ['unicode-bidi'],
  936. feature: 'css-unicode-bidi',
  937. browsers
  938. })
  939. )
  940. // overscroll-behavior selector
  941. let prefixOverscroll = require('caniuse-lite/data/features/css-overscroll-behavior')
  942. f(prefixOverscroll, { match: /a #1/ }, browsers =>
  943. prefix(['overscroll-behavior'], {
  944. feature: 'css-overscroll-behavior',
  945. browsers
  946. })
  947. )
  948. // text-orientation
  949. let prefixTextOrientation = require('caniuse-lite/data/features/css-text-orientation')
  950. f(prefixTextOrientation, browsers =>
  951. prefix(['text-orientation'], {
  952. feature: 'css-text-orientation',
  953. browsers
  954. })
  955. )
  956. // print-color-adjust
  957. let prefixPrintAdjust = require('caniuse-lite/data/features/css-print-color-adjust')
  958. f(prefixPrintAdjust, browsers =>
  959. prefix(['print-color-adjust', 'color-adjust'], {
  960. feature: 'css-print-color-adjust',
  961. browsers
  962. })
  963. )