Standardize settings file naming and relocate documentation files Fix code quality violations from rsx:check Reorganize user_management directory into logical subdirectories Move Quill Bundle to core and align with Tom Select pattern Simplify Site Settings page to focus on core site information Complete Phase 5: Multi-tenant authentication with login flow and site selection Add route query parameter rule and synchronize filename validation logic Fix critical bug in UpdateNpmCommand causing missing JavaScript stubs Implement filename convention rule and resolve VS Code auto-rename conflict Implement js-sanitizer RPC server to eliminate 900+ Node.js process spawns Implement RPC server architecture for JavaScript parsing WIP: Add RPC server infrastructure for JS parsing (partial implementation) Update jqhtml terminology from destroy to stop, fix datagrid DOM preservation Add JQHTML-CLASS-01 rule and fix redundant class names Improve code quality rules and resolve violations Remove legacy fatal error format in favor of unified 'fatal' error type Filter internal keys from window.rsxapp output Update button styling and comprehensive form/modal documentation Add conditional fly-in animation for modals Fix non-deterministic bundle compilation 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
1140 lines
23 KiB
JavaScript
1140 lines
23 KiB
JavaScript
let unpack = require('caniuse-lite/dist/unpacker/feature')
|
|
|
|
function browsersSort(a, b) {
|
|
a = a.split(' ')
|
|
b = b.split(' ')
|
|
if (a[0] > b[0]) {
|
|
return 1
|
|
} else if (a[0] < b[0]) {
|
|
return -1
|
|
} else {
|
|
return Math.sign(parseFloat(a[1]) - parseFloat(b[1]))
|
|
}
|
|
}
|
|
|
|
// Convert Can I Use data
|
|
function f(data, opts, callback) {
|
|
data = unpack(data)
|
|
|
|
if (!callback) {
|
|
;[callback, opts] = [opts, {}]
|
|
}
|
|
|
|
let match = opts.match || /\sx($|\s)/
|
|
let need = []
|
|
|
|
for (let browser in data.stats) {
|
|
let versions = data.stats[browser]
|
|
for (let version in versions) {
|
|
let support = versions[version]
|
|
if (support.match(match)) {
|
|
need.push(browser + ' ' + version)
|
|
}
|
|
}
|
|
}
|
|
|
|
callback(need.sort(browsersSort))
|
|
}
|
|
|
|
// Add data for all properties
|
|
let result = {}
|
|
|
|
function prefix(names, data) {
|
|
for (let name of names) {
|
|
result[name] = Object.assign({}, data)
|
|
}
|
|
}
|
|
|
|
function add(names, data) {
|
|
for (let name of names) {
|
|
result[name].browsers = result[name].browsers
|
|
.concat(data.browsers)
|
|
.sort(browsersSort)
|
|
}
|
|
}
|
|
|
|
module.exports = result
|
|
|
|
// Border Radius
|
|
let prefixBorderRadius = require('caniuse-lite/data/features/border-radius')
|
|
|
|
f(prefixBorderRadius, browsers =>
|
|
prefix(
|
|
[
|
|
'border-radius',
|
|
'border-top-left-radius',
|
|
'border-top-right-radius',
|
|
'border-bottom-right-radius',
|
|
'border-bottom-left-radius'
|
|
],
|
|
{
|
|
browsers,
|
|
feature: 'border-radius',
|
|
mistakes: ['-khtml-', '-ms-', '-o-']
|
|
}
|
|
)
|
|
)
|
|
|
|
// Box Shadow
|
|
let prefixBoxshadow = require('caniuse-lite/data/features/css-boxshadow')
|
|
|
|
f(prefixBoxshadow, browsers =>
|
|
prefix(['box-shadow'], {
|
|
browsers,
|
|
feature: 'css-boxshadow',
|
|
mistakes: ['-khtml-']
|
|
})
|
|
)
|
|
|
|
// Animation
|
|
let prefixAnimation = require('caniuse-lite/data/features/css-animation')
|
|
|
|
f(prefixAnimation, browsers =>
|
|
prefix(
|
|
[
|
|
'animation',
|
|
'animation-name',
|
|
'animation-duration',
|
|
'animation-delay',
|
|
'animation-direction',
|
|
'animation-fill-mode',
|
|
'animation-iteration-count',
|
|
'animation-play-state',
|
|
'animation-timing-function',
|
|
'@keyframes'
|
|
],
|
|
{
|
|
browsers,
|
|
feature: 'css-animation',
|
|
mistakes: ['-khtml-', '-ms-']
|
|
}
|
|
)
|
|
)
|
|
|
|
// Transition
|
|
let prefixTransition = require('caniuse-lite/data/features/css-transitions')
|
|
|
|
f(prefixTransition, browsers =>
|
|
prefix(
|
|
[
|
|
'transition',
|
|
'transition-property',
|
|
'transition-duration',
|
|
'transition-delay',
|
|
'transition-timing-function'
|
|
],
|
|
{
|
|
browsers,
|
|
feature: 'css-transitions',
|
|
mistakes: ['-khtml-', '-ms-']
|
|
}
|
|
)
|
|
)
|
|
|
|
// Transform 2D
|
|
let prefixTransform2d = require('caniuse-lite/data/features/transforms2d')
|
|
|
|
f(prefixTransform2d, browsers =>
|
|
prefix(['transform', 'transform-origin'], {
|
|
browsers,
|
|
feature: 'transforms2d'
|
|
})
|
|
)
|
|
|
|
// Transform 3D
|
|
let prefixTransforms3d = require('caniuse-lite/data/features/transforms3d')
|
|
|
|
f(prefixTransforms3d, browsers => {
|
|
prefix(['perspective', 'perspective-origin'], {
|
|
browsers,
|
|
feature: 'transforms3d'
|
|
})
|
|
return prefix(['transform-style'], {
|
|
browsers,
|
|
feature: 'transforms3d',
|
|
mistakes: ['-ms-', '-o-']
|
|
})
|
|
})
|
|
|
|
f(prefixTransforms3d, { match: /y\sx|y\s#2/ }, browsers =>
|
|
prefix(['backface-visibility'], {
|
|
browsers,
|
|
feature: 'transforms3d',
|
|
mistakes: ['-ms-', '-o-']
|
|
})
|
|
)
|
|
|
|
// Gradients
|
|
let prefixGradients = require('caniuse-lite/data/features/css-gradients')
|
|
|
|
f(prefixGradients, { match: /y\sx/ }, browsers =>
|
|
prefix(
|
|
[
|
|
'linear-gradient',
|
|
'repeating-linear-gradient',
|
|
'radial-gradient',
|
|
'repeating-radial-gradient'
|
|
],
|
|
{
|
|
browsers,
|
|
feature: 'css-gradients',
|
|
mistakes: ['-ms-'],
|
|
props: [
|
|
'background',
|
|
'background-image',
|
|
'border-image',
|
|
'mask',
|
|
'list-style',
|
|
'list-style-image',
|
|
'content',
|
|
'mask-image'
|
|
]
|
|
}
|
|
)
|
|
)
|
|
|
|
f(prefixGradients, { match: /a\sx/ }, browsers => {
|
|
browsers = browsers.map(i => {
|
|
if (/firefox|op/.test(i)) {
|
|
return i
|
|
} else {
|
|
return `${i} old`
|
|
}
|
|
})
|
|
return add(
|
|
[
|
|
'linear-gradient',
|
|
'repeating-linear-gradient',
|
|
'radial-gradient',
|
|
'repeating-radial-gradient'
|
|
],
|
|
{
|
|
browsers,
|
|
feature: 'css-gradients'
|
|
}
|
|
)
|
|
})
|
|
|
|
// Box sizing
|
|
let prefixBoxsizing = require('caniuse-lite/data/features/css3-boxsizing')
|
|
|
|
f(prefixBoxsizing, browsers =>
|
|
prefix(['box-sizing'], {
|
|
browsers,
|
|
feature: 'css3-boxsizing'
|
|
})
|
|
)
|
|
|
|
// Filter Effects
|
|
let prefixFilters = require('caniuse-lite/data/features/css-filters')
|
|
|
|
f(prefixFilters, browsers =>
|
|
prefix(['filter'], {
|
|
browsers,
|
|
feature: 'css-filters'
|
|
})
|
|
)
|
|
|
|
// filter() function
|
|
let prefixFilterFunction = require('caniuse-lite/data/features/css-filter-function')
|
|
|
|
f(prefixFilterFunction, browsers =>
|
|
prefix(['filter-function'], {
|
|
browsers,
|
|
feature: 'css-filter-function',
|
|
props: [
|
|
'background',
|
|
'background-image',
|
|
'border-image',
|
|
'mask',
|
|
'list-style',
|
|
'list-style-image',
|
|
'content',
|
|
'mask-image'
|
|
]
|
|
})
|
|
)
|
|
|
|
// Backdrop-filter
|
|
let prefixBackdropFilter = require('caniuse-lite/data/features/css-backdrop-filter')
|
|
|
|
f(prefixBackdropFilter, { match: /y\sx|y\s#2/ }, browsers =>
|
|
prefix(['backdrop-filter'], {
|
|
browsers,
|
|
feature: 'css-backdrop-filter'
|
|
})
|
|
)
|
|
|
|
// element() function
|
|
let prefixElementFunction = require('caniuse-lite/data/features/css-element-function')
|
|
|
|
f(prefixElementFunction, browsers =>
|
|
prefix(['element'], {
|
|
browsers,
|
|
feature: 'css-element-function',
|
|
props: [
|
|
'background',
|
|
'background-image',
|
|
'border-image',
|
|
'mask',
|
|
'list-style',
|
|
'list-style-image',
|
|
'content',
|
|
'mask-image'
|
|
]
|
|
})
|
|
)
|
|
|
|
// Multicolumns
|
|
let prefixMulticolumns = require('caniuse-lite/data/features/multicolumn')
|
|
|
|
f(prefixMulticolumns, browsers => {
|
|
prefix(
|
|
[
|
|
'columns',
|
|
'column-width',
|
|
'column-gap',
|
|
'column-rule',
|
|
'column-rule-color',
|
|
'column-rule-width',
|
|
'column-count',
|
|
'column-rule-style',
|
|
'column-span',
|
|
'column-fill'
|
|
],
|
|
{
|
|
browsers,
|
|
feature: 'multicolumn'
|
|
}
|
|
)
|
|
|
|
let noff = browsers.filter(i => !/firefox/.test(i))
|
|
prefix(['break-before', 'break-after', 'break-inside'], {
|
|
browsers: noff,
|
|
feature: 'multicolumn'
|
|
})
|
|
})
|
|
|
|
// User select
|
|
let prefixUserSelect = require('caniuse-lite/data/features/user-select-none')
|
|
|
|
f(prefixUserSelect, browsers =>
|
|
prefix(['user-select'], {
|
|
browsers,
|
|
feature: 'user-select-none',
|
|
mistakes: ['-khtml-']
|
|
})
|
|
)
|
|
|
|
// Flexible Box Layout
|
|
let prefixFlexbox = require('caniuse-lite/data/features/flexbox')
|
|
|
|
f(prefixFlexbox, { match: /a\sx/ }, browsers => {
|
|
browsers = browsers.map(i => {
|
|
if (/ie|firefox/.test(i)) {
|
|
return i
|
|
} else {
|
|
return `${i} 2009`
|
|
}
|
|
})
|
|
prefix(['display-flex', 'inline-flex'], {
|
|
browsers,
|
|
feature: 'flexbox',
|
|
props: ['display']
|
|
})
|
|
prefix(['flex', 'flex-grow', 'flex-shrink', 'flex-basis'], {
|
|
browsers,
|
|
feature: 'flexbox'
|
|
})
|
|
prefix(
|
|
[
|
|
'flex-direction',
|
|
'flex-wrap',
|
|
'flex-flow',
|
|
'justify-content',
|
|
'order',
|
|
'align-items',
|
|
'align-self',
|
|
'align-content'
|
|
],
|
|
{
|
|
browsers,
|
|
feature: 'flexbox'
|
|
}
|
|
)
|
|
})
|
|
|
|
f(prefixFlexbox, { match: /y\sx/ }, browsers => {
|
|
add(['display-flex', 'inline-flex'], {
|
|
browsers,
|
|
feature: 'flexbox'
|
|
})
|
|
add(['flex', 'flex-grow', 'flex-shrink', 'flex-basis'], {
|
|
browsers,
|
|
feature: 'flexbox'
|
|
})
|
|
add(
|
|
[
|
|
'flex-direction',
|
|
'flex-wrap',
|
|
'flex-flow',
|
|
'justify-content',
|
|
'order',
|
|
'align-items',
|
|
'align-self',
|
|
'align-content'
|
|
],
|
|
{
|
|
browsers,
|
|
feature: 'flexbox'
|
|
}
|
|
)
|
|
})
|
|
|
|
// calc() unit
|
|
let prefixCalc = require('caniuse-lite/data/features/calc')
|
|
|
|
f(prefixCalc, browsers =>
|
|
prefix(['calc'], {
|
|
browsers,
|
|
feature: 'calc',
|
|
props: ['*']
|
|
})
|
|
)
|
|
|
|
// Background options
|
|
let prefixBackgroundOptions = require('caniuse-lite/data/features/background-img-opts')
|
|
|
|
f(prefixBackgroundOptions, browsers =>
|
|
prefix(['background-origin', 'background-size'], {
|
|
browsers,
|
|
feature: 'background-img-opts'
|
|
})
|
|
)
|
|
|
|
// background-clip: text
|
|
let prefixBackgroundClipText = require('caniuse-lite/data/features/background-clip-text')
|
|
|
|
f(prefixBackgroundClipText, browsers =>
|
|
prefix(['background-clip'], {
|
|
browsers,
|
|
feature: 'background-clip-text'
|
|
})
|
|
)
|
|
|
|
// Font feature settings
|
|
let prefixFontFeature = require('caniuse-lite/data/features/font-feature')
|
|
|
|
f(prefixFontFeature, browsers =>
|
|
prefix(
|
|
[
|
|
'font-feature-settings',
|
|
'font-variant-ligatures',
|
|
'font-language-override'
|
|
],
|
|
{
|
|
browsers,
|
|
feature: 'font-feature'
|
|
}
|
|
)
|
|
)
|
|
|
|
// CSS font-kerning property
|
|
let prefixFontKerning = require('caniuse-lite/data/features/font-kerning')
|
|
|
|
f(prefixFontKerning, browsers =>
|
|
prefix(['font-kerning'], {
|
|
browsers,
|
|
feature: 'font-kerning'
|
|
})
|
|
)
|
|
|
|
// Border image
|
|
let prefixBorderImage = require('caniuse-lite/data/features/border-image')
|
|
|
|
f(prefixBorderImage, browsers =>
|
|
prefix(['border-image'], {
|
|
browsers,
|
|
feature: 'border-image'
|
|
})
|
|
)
|
|
|
|
// Selection selector
|
|
let prefixSelection = require('caniuse-lite/data/features/css-selection')
|
|
|
|
f(prefixSelection, browsers =>
|
|
prefix(['::selection'], {
|
|
browsers,
|
|
feature: 'css-selection',
|
|
selector: true
|
|
})
|
|
)
|
|
|
|
// Placeholder selector
|
|
let prefixPlaceholder = require('caniuse-lite/data/features/css-placeholder')
|
|
|
|
f(prefixPlaceholder, browsers => {
|
|
prefix(['::placeholder'], {
|
|
browsers: browsers.concat(['ie 10 old', 'ie 11 old', 'firefox 18 old']),
|
|
feature: 'css-placeholder',
|
|
selector: true
|
|
})
|
|
})
|
|
|
|
// Placeholder-shown selector
|
|
let prefixPlaceholderShown = require('caniuse-lite/data/features/css-placeholder-shown')
|
|
|
|
f(prefixPlaceholderShown, browsers => {
|
|
prefix([':placeholder-shown'], {
|
|
browsers,
|
|
feature: 'css-placeholder-shown',
|
|
selector: true
|
|
})
|
|
})
|
|
|
|
// Hyphenation
|
|
let prefixHyphens = require('caniuse-lite/data/features/css-hyphens')
|
|
|
|
f(prefixHyphens, browsers =>
|
|
prefix(['hyphens'], {
|
|
browsers,
|
|
feature: 'css-hyphens'
|
|
})
|
|
)
|
|
|
|
// Fullscreen selector
|
|
let prefixFullscreen = require('caniuse-lite/data/features/fullscreen')
|
|
|
|
f(prefixFullscreen, browsers =>
|
|
prefix([':fullscreen'], {
|
|
browsers,
|
|
feature: 'fullscreen',
|
|
selector: true
|
|
})
|
|
)
|
|
|
|
// ::backdrop pseudo-element
|
|
// https://caniuse.com/mdn-css_selectors_backdrop
|
|
let prefixBackdrop = require('caniuse-lite/data/features/mdn-css-backdrop-pseudo-element')
|
|
|
|
f(prefixBackdrop, browsers =>
|
|
prefix(['::backdrop'], {
|
|
browsers,
|
|
feature: 'backdrop',
|
|
selector: true
|
|
})
|
|
)
|
|
|
|
// File selector button
|
|
let prefixFileSelectorButton = require('caniuse-lite/data/features/css-file-selector-button')
|
|
|
|
f(prefixFileSelectorButton, browsers =>
|
|
prefix(['::file-selector-button'], {
|
|
browsers,
|
|
feature: 'file-selector-button',
|
|
selector: true
|
|
})
|
|
)
|
|
|
|
// :autofill
|
|
let prefixAutofill = require('caniuse-lite/data/features/css-autofill')
|
|
|
|
f(prefixAutofill, browsers =>
|
|
prefix([':autofill'], {
|
|
browsers,
|
|
feature: 'css-autofill',
|
|
selector: true
|
|
})
|
|
)
|
|
|
|
// Tab size
|
|
let prefixTabsize = require('caniuse-lite/data/features/css3-tabsize')
|
|
|
|
f(prefixTabsize, browsers =>
|
|
prefix(['tab-size'], {
|
|
browsers,
|
|
feature: 'css3-tabsize'
|
|
})
|
|
)
|
|
|
|
// Intrinsic & extrinsic sizing
|
|
let prefixIntrinsic = require('caniuse-lite/data/features/intrinsic-width')
|
|
|
|
let sizeProps = [
|
|
'width',
|
|
'min-width',
|
|
'max-width',
|
|
'height',
|
|
'min-height',
|
|
'max-height',
|
|
'inline-size',
|
|
'min-inline-size',
|
|
'max-inline-size',
|
|
'block-size',
|
|
'min-block-size',
|
|
'max-block-size',
|
|
'grid',
|
|
'grid-template',
|
|
'grid-template-rows',
|
|
'grid-template-columns',
|
|
'grid-auto-columns',
|
|
'grid-auto-rows'
|
|
]
|
|
|
|
f(prefixIntrinsic, browsers =>
|
|
prefix(['max-content', 'min-content'], {
|
|
browsers,
|
|
feature: 'intrinsic-width',
|
|
props: sizeProps
|
|
})
|
|
)
|
|
|
|
f(prefixIntrinsic, { match: /x|\s#4/ }, browsers =>
|
|
prefix(['fill', 'fill-available'], {
|
|
browsers,
|
|
feature: 'intrinsic-width',
|
|
props: sizeProps
|
|
})
|
|
)
|
|
|
|
f(prefixIntrinsic, { match: /x|\s#5/ }, browsers => {
|
|
let ffFix = browsers.filter(i => {
|
|
let [name, version] = i.split(' ')
|
|
if (name === 'firefox' || name === 'and_ff') {
|
|
return parseInt(version) < 94
|
|
} else {
|
|
return true
|
|
}
|
|
})
|
|
return prefix(['fit-content'], {
|
|
browsers: ffFix,
|
|
feature: 'intrinsic-width',
|
|
props: sizeProps
|
|
})
|
|
})
|
|
|
|
// Stretch value
|
|
|
|
let prefixStretch = require('caniuse-lite/data/features/css-width-stretch')
|
|
|
|
f(prefixStretch, browsers => {
|
|
f(prefixIntrinsic, { match: /x|\s#2/ }, firefox => {
|
|
browsers = browsers.concat(firefox)
|
|
})
|
|
return prefix(['stretch'], {
|
|
browsers,
|
|
feature: 'css-width-stretch',
|
|
props: sizeProps
|
|
})
|
|
})
|
|
|
|
// Zoom cursors
|
|
let prefixCursorsNew = require('caniuse-lite/data/features/css3-cursors-newer')
|
|
|
|
f(prefixCursorsNew, browsers =>
|
|
prefix(['zoom-in', 'zoom-out'], {
|
|
browsers,
|
|
feature: 'css3-cursors-newer',
|
|
props: ['cursor']
|
|
})
|
|
)
|
|
|
|
// Grab cursors
|
|
let prefixCursorsGrab = require('caniuse-lite/data/features/css3-cursors-grab')
|
|
|
|
f(prefixCursorsGrab, browsers =>
|
|
prefix(['grab', 'grabbing'], {
|
|
browsers,
|
|
feature: 'css3-cursors-grab',
|
|
props: ['cursor']
|
|
})
|
|
)
|
|
|
|
// Sticky position
|
|
let prefixSticky = require('caniuse-lite/data/features/css-sticky')
|
|
|
|
f(prefixSticky, browsers =>
|
|
prefix(['sticky'], {
|
|
browsers,
|
|
feature: 'css-sticky',
|
|
props: ['position']
|
|
})
|
|
)
|
|
|
|
// Pointer Events
|
|
let prefixPointer = require('caniuse-lite/data/features/pointer')
|
|
|
|
f(prefixPointer, browsers =>
|
|
prefix(['touch-action'], {
|
|
browsers,
|
|
feature: 'pointer'
|
|
})
|
|
)
|
|
|
|
// Text decoration
|
|
let prefixDecoration = require('caniuse-lite/data/features/text-decoration')
|
|
|
|
f(prefixDecoration, { match: /x.*#[235]/ }, browsers =>
|
|
prefix(['text-decoration-skip', 'text-decoration-skip-ink'], {
|
|
browsers,
|
|
feature: 'text-decoration'
|
|
})
|
|
)
|
|
|
|
let prefixDecorationShorthand = require('caniuse-lite/data/features/mdn-text-decoration-shorthand')
|
|
|
|
f(prefixDecorationShorthand, browsers =>
|
|
prefix(['text-decoration'], {
|
|
browsers,
|
|
feature: 'text-decoration'
|
|
})
|
|
)
|
|
|
|
let prefixDecorationColor = require('caniuse-lite/data/features/mdn-text-decoration-color')
|
|
|
|
f(prefixDecorationColor, browsers =>
|
|
prefix(['text-decoration-color'], {
|
|
browsers,
|
|
feature: 'text-decoration'
|
|
})
|
|
)
|
|
|
|
let prefixDecorationLine = require('caniuse-lite/data/features/mdn-text-decoration-line')
|
|
|
|
f(prefixDecorationLine, browsers =>
|
|
prefix(['text-decoration-line'], {
|
|
browsers,
|
|
feature: 'text-decoration'
|
|
})
|
|
)
|
|
|
|
let prefixDecorationStyle = require('caniuse-lite/data/features/mdn-text-decoration-style')
|
|
|
|
f(prefixDecorationStyle, browsers =>
|
|
prefix(['text-decoration-style'], {
|
|
browsers,
|
|
feature: 'text-decoration'
|
|
})
|
|
)
|
|
|
|
// Text Size Adjust
|
|
let prefixTextSizeAdjust = require('caniuse-lite/data/features/text-size-adjust')
|
|
|
|
f(prefixTextSizeAdjust, browsers =>
|
|
prefix(['text-size-adjust'], {
|
|
browsers,
|
|
feature: 'text-size-adjust'
|
|
})
|
|
)
|
|
|
|
// CSS Masks
|
|
let prefixCssMasks = require('caniuse-lite/data/features/css-masks')
|
|
|
|
f(prefixCssMasks, browsers => {
|
|
prefix(
|
|
[
|
|
'mask-clip',
|
|
'mask-composite',
|
|
'mask-image',
|
|
'mask-origin',
|
|
'mask-repeat',
|
|
'mask-border-repeat',
|
|
'mask-border-source'
|
|
],
|
|
{
|
|
browsers,
|
|
feature: 'css-masks'
|
|
}
|
|
)
|
|
prefix(
|
|
[
|
|
'mask',
|
|
'mask-position',
|
|
'mask-size',
|
|
'mask-border',
|
|
'mask-border-outset',
|
|
'mask-border-width',
|
|
'mask-border-slice'
|
|
],
|
|
{
|
|
browsers,
|
|
feature: 'css-masks'
|
|
}
|
|
)
|
|
})
|
|
|
|
// CSS clip-path property
|
|
let prefixClipPath = require('caniuse-lite/data/features/css-clip-path')
|
|
|
|
f(prefixClipPath, browsers =>
|
|
prefix(['clip-path'], {
|
|
browsers,
|
|
feature: 'css-clip-path'
|
|
})
|
|
)
|
|
|
|
// Fragmented Borders and Backgrounds
|
|
let prefixBoxdecoration = require('caniuse-lite/data/features/css-boxdecorationbreak')
|
|
|
|
f(prefixBoxdecoration, browsers =>
|
|
prefix(['box-decoration-break'], {
|
|
browsers,
|
|
feature: 'css-boxdecorationbreak'
|
|
})
|
|
)
|
|
|
|
// CSS3 object-fit/object-position
|
|
let prefixObjectFit = require('caniuse-lite/data/features/object-fit')
|
|
|
|
f(prefixObjectFit, browsers =>
|
|
prefix(['object-fit', 'object-position'], {
|
|
browsers,
|
|
feature: 'object-fit'
|
|
})
|
|
)
|
|
|
|
// CSS Shapes
|
|
let prefixShapes = require('caniuse-lite/data/features/css-shapes')
|
|
|
|
f(prefixShapes, browsers =>
|
|
prefix(['shape-margin', 'shape-outside', 'shape-image-threshold'], {
|
|
browsers,
|
|
feature: 'css-shapes'
|
|
})
|
|
)
|
|
|
|
// CSS3 text-overflow
|
|
let prefixTextOverflow = require('caniuse-lite/data/features/text-overflow')
|
|
|
|
f(prefixTextOverflow, browsers =>
|
|
prefix(['text-overflow'], {
|
|
browsers,
|
|
feature: 'text-overflow'
|
|
})
|
|
)
|
|
|
|
// Viewport at-rule
|
|
let prefixDeviceadaptation = require('caniuse-lite/data/features/css-deviceadaptation')
|
|
|
|
f(prefixDeviceadaptation, browsers =>
|
|
prefix(['@viewport'], {
|
|
browsers,
|
|
feature: 'css-deviceadaptation'
|
|
})
|
|
)
|
|
|
|
// Resolution Media Queries
|
|
let prefixResolut = require('caniuse-lite/data/features/css-media-resolution')
|
|
|
|
f(prefixResolut, { match: /( x($| )|a #2)/ }, browsers =>
|
|
prefix(['@resolution'], {
|
|
browsers,
|
|
feature: 'css-media-resolution'
|
|
})
|
|
)
|
|
|
|
// CSS text-align-last
|
|
let prefixTextAlignLast = require('caniuse-lite/data/features/css-text-align-last')
|
|
|
|
f(prefixTextAlignLast, browsers =>
|
|
prefix(['text-align-last'], {
|
|
browsers,
|
|
feature: 'css-text-align-last'
|
|
})
|
|
)
|
|
|
|
// Crisp Edges Image Rendering Algorithm
|
|
let prefixCrispedges = require('caniuse-lite/data/features/css-crisp-edges')
|
|
|
|
f(prefixCrispedges, { match: /y x|a x #1/ }, browsers =>
|
|
prefix(['pixelated'], {
|
|
browsers,
|
|
feature: 'css-crisp-edges',
|
|
props: ['image-rendering']
|
|
})
|
|
)
|
|
|
|
f(prefixCrispedges, { match: /a x #2/ }, browsers =>
|
|
prefix(['image-rendering'], {
|
|
browsers,
|
|
feature: 'css-crisp-edges'
|
|
})
|
|
)
|
|
|
|
// Logical Properties
|
|
let prefixLogicalProps = require('caniuse-lite/data/features/css-logical-props')
|
|
|
|
f(prefixLogicalProps, browsers =>
|
|
prefix(
|
|
[
|
|
'border-inline-start',
|
|
'border-inline-end',
|
|
'margin-inline-start',
|
|
'margin-inline-end',
|
|
'padding-inline-start',
|
|
'padding-inline-end'
|
|
],
|
|
{
|
|
browsers,
|
|
feature: 'css-logical-props'
|
|
}
|
|
)
|
|
)
|
|
|
|
f(prefixLogicalProps, { match: /x\s#2/ }, browsers =>
|
|
prefix(
|
|
[
|
|
'border-block-start',
|
|
'border-block-end',
|
|
'margin-block-start',
|
|
'margin-block-end',
|
|
'padding-block-start',
|
|
'padding-block-end'
|
|
],
|
|
{
|
|
browsers,
|
|
feature: 'css-logical-props'
|
|
}
|
|
)
|
|
)
|
|
|
|
// CSS appearance
|
|
let prefixAppearance = require('caniuse-lite/data/features/css-appearance')
|
|
|
|
f(prefixAppearance, { match: /#2|x/ }, browsers =>
|
|
prefix(['appearance'], {
|
|
browsers,
|
|
feature: 'css-appearance'
|
|
})
|
|
)
|
|
|
|
// CSS Scroll snap points
|
|
let prefixSnappoints = require('caniuse-lite/data/features/css-snappoints')
|
|
|
|
f(prefixSnappoints, browsers =>
|
|
prefix(
|
|
[
|
|
'scroll-snap-type',
|
|
'scroll-snap-coordinate',
|
|
'scroll-snap-destination',
|
|
'scroll-snap-points-x',
|
|
'scroll-snap-points-y'
|
|
],
|
|
{
|
|
browsers,
|
|
feature: 'css-snappoints'
|
|
}
|
|
)
|
|
)
|
|
|
|
// CSS Regions
|
|
let prefixRegions = require('caniuse-lite/data/features/css-regions')
|
|
|
|
f(prefixRegions, browsers =>
|
|
prefix(['flow-into', 'flow-from', 'region-fragment'], {
|
|
browsers,
|
|
feature: 'css-regions'
|
|
})
|
|
)
|
|
|
|
// CSS image-set
|
|
let prefixImageSet = require('caniuse-lite/data/features/css-image-set')
|
|
|
|
f(prefixImageSet, browsers =>
|
|
prefix(['image-set'], {
|
|
browsers,
|
|
feature: 'css-image-set',
|
|
props: [
|
|
'background',
|
|
'background-image',
|
|
'border-image',
|
|
'cursor',
|
|
'mask',
|
|
'mask-image',
|
|
'list-style',
|
|
'list-style-image',
|
|
'content'
|
|
]
|
|
})
|
|
)
|
|
|
|
// Writing Mode
|
|
let prefixWritingMode = require('caniuse-lite/data/features/css-writing-mode')
|
|
|
|
f(prefixWritingMode, { match: /a|x/ }, browsers =>
|
|
prefix(['writing-mode'], {
|
|
browsers,
|
|
feature: 'css-writing-mode'
|
|
})
|
|
)
|
|
|
|
// Cross-Fade Function
|
|
let prefixCrossFade = require('caniuse-lite/data/features/css-cross-fade')
|
|
|
|
f(prefixCrossFade, browsers =>
|
|
prefix(['cross-fade'], {
|
|
browsers,
|
|
feature: 'css-cross-fade',
|
|
props: [
|
|
'background',
|
|
'background-image',
|
|
'border-image',
|
|
'mask',
|
|
'list-style',
|
|
'list-style-image',
|
|
'content',
|
|
'mask-image'
|
|
]
|
|
})
|
|
)
|
|
|
|
// Read Only selector
|
|
let prefixReadOnly = require('caniuse-lite/data/features/css-read-only-write')
|
|
|
|
f(prefixReadOnly, browsers =>
|
|
prefix([':read-only', ':read-write'], {
|
|
browsers,
|
|
feature: 'css-read-only-write',
|
|
selector: true
|
|
})
|
|
)
|
|
|
|
// Text Emphasize
|
|
let prefixTextEmphasis = require('caniuse-lite/data/features/text-emphasis')
|
|
|
|
f(prefixTextEmphasis, browsers =>
|
|
prefix(
|
|
[
|
|
'text-emphasis',
|
|
'text-emphasis-position',
|
|
'text-emphasis-style',
|
|
'text-emphasis-color'
|
|
],
|
|
{
|
|
browsers,
|
|
feature: 'text-emphasis'
|
|
}
|
|
)
|
|
)
|
|
|
|
// CSS Grid Layout
|
|
let prefixGrid = require('caniuse-lite/data/features/css-grid')
|
|
|
|
f(prefixGrid, browsers => {
|
|
prefix(['display-grid', 'inline-grid'], {
|
|
browsers,
|
|
feature: 'css-grid',
|
|
props: ['display']
|
|
})
|
|
prefix(
|
|
[
|
|
'grid-template-columns',
|
|
'grid-template-rows',
|
|
'grid-row-start',
|
|
'grid-column-start',
|
|
'grid-row-end',
|
|
'grid-column-end',
|
|
'grid-row',
|
|
'grid-column',
|
|
'grid-area',
|
|
'grid-template',
|
|
'grid-template-areas',
|
|
'place-self'
|
|
],
|
|
{
|
|
browsers,
|
|
feature: 'css-grid'
|
|
}
|
|
)
|
|
})
|
|
|
|
f(prefixGrid, { match: /a x/ }, browsers =>
|
|
prefix(['grid-column-align', 'grid-row-align'], {
|
|
browsers,
|
|
feature: 'css-grid'
|
|
})
|
|
)
|
|
|
|
// CSS text-spacing
|
|
let prefixTextSpacing = require('caniuse-lite/data/features/css-text-spacing')
|
|
|
|
f(prefixTextSpacing, browsers =>
|
|
prefix(['text-spacing'], {
|
|
browsers,
|
|
feature: 'css-text-spacing'
|
|
})
|
|
)
|
|
|
|
// :any-link selector
|
|
let prefixAnyLink = require('caniuse-lite/data/features/css-any-link')
|
|
|
|
f(prefixAnyLink, browsers =>
|
|
prefix([':any-link'], {
|
|
browsers,
|
|
feature: 'css-any-link',
|
|
selector: true
|
|
})
|
|
)
|
|
|
|
// unicode-bidi
|
|
|
|
let bidiIsolate = require('caniuse-lite/data/features/mdn-css-unicode-bidi-isolate')
|
|
|
|
f(bidiIsolate, browsers =>
|
|
prefix(['isolate'], {
|
|
browsers,
|
|
feature: 'css-unicode-bidi',
|
|
props: ['unicode-bidi']
|
|
})
|
|
)
|
|
|
|
let bidiPlaintext = require('caniuse-lite/data/features/mdn-css-unicode-bidi-plaintext')
|
|
|
|
f(bidiPlaintext, browsers =>
|
|
prefix(['plaintext'], {
|
|
browsers,
|
|
feature: 'css-unicode-bidi',
|
|
props: ['unicode-bidi']
|
|
})
|
|
)
|
|
|
|
let bidiOverride = require('caniuse-lite/data/features/mdn-css-unicode-bidi-isolate-override')
|
|
|
|
f(bidiOverride, { match: /y x/ }, browsers =>
|
|
prefix(['isolate-override'], {
|
|
browsers,
|
|
feature: 'css-unicode-bidi',
|
|
props: ['unicode-bidi']
|
|
})
|
|
)
|
|
|
|
// overscroll-behavior selector
|
|
let prefixOverscroll = require('caniuse-lite/data/features/css-overscroll-behavior')
|
|
|
|
f(prefixOverscroll, { match: /a #1/ }, browsers =>
|
|
prefix(['overscroll-behavior'], {
|
|
browsers,
|
|
feature: 'css-overscroll-behavior'
|
|
})
|
|
)
|
|
|
|
// text-orientation
|
|
let prefixTextOrientation = require('caniuse-lite/data/features/css-text-orientation')
|
|
|
|
f(prefixTextOrientation, browsers =>
|
|
prefix(['text-orientation'], {
|
|
browsers,
|
|
feature: 'css-text-orientation'
|
|
})
|
|
)
|
|
|
|
// print-color-adjust
|
|
let prefixPrintAdjust = require('caniuse-lite/data/features/css-print-color-adjust')
|
|
|
|
f(prefixPrintAdjust, browsers =>
|
|
prefix(['print-color-adjust', 'color-adjust'], {
|
|
browsers,
|
|
feature: 'css-print-color-adjust'
|
|
})
|
|
)
|