0.2.0 - Mid migration

This commit is contained in:
Daniel Mason 2022-04-25 14:47:15 +12:00
parent 139e6a915e
commit 7e38fdbd7d
42393 changed files with 5358157 additions and 62 deletions

View file

@ -0,0 +1,184 @@
// @flow
import {hasCSSTOMSupport} from 'jss'
export const px: string | Function = hasCSSTOMSupport && CSS ? CSS.px : 'px'
export const ms: string | Function = hasCSSTOMSupport && CSS ? CSS.ms : 'ms'
export const percent: string | Function = hasCSSTOMSupport && CSS ? CSS.percent : '%'
/**
* Generated jss-plugin-default-unit CSS property units
*
* @type object
*/
export default {
// Animation properties
'animation-delay': ms,
'animation-duration': ms,
// Background properties
'background-position': px,
'background-position-x': px,
'background-position-y': px,
'background-size': px,
// Border Properties
border: px,
'border-bottom': px,
'border-bottom-left-radius': px,
'border-bottom-right-radius': px,
'border-bottom-width': px,
'border-left': px,
'border-left-width': px,
'border-radius': px,
'border-right': px,
'border-right-width': px,
'border-top': px,
'border-top-left-radius': px,
'border-top-right-radius': px,
'border-top-width': px,
'border-width': px,
'border-block': px,
'border-block-end': px,
'border-block-end-width': px,
'border-block-start': px,
'border-block-start-width': px,
'border-block-width': px,
'border-inline': px,
'border-inline-end': px,
'border-inline-end-width': px,
'border-inline-start': px,
'border-inline-start-width': px,
'border-inline-width': px,
'border-start-start-radius': px,
'border-start-end-radius': px,
'border-end-start-radius': px,
'border-end-end-radius': px,
// Margin properties
margin: px,
'margin-bottom': px,
'margin-left': px,
'margin-right': px,
'margin-top': px,
'margin-block': px,
'margin-block-end': px,
'margin-block-start': px,
'margin-inline': px,
'margin-inline-end': px,
'margin-inline-start': px,
// Padding properties
padding: px,
'padding-bottom': px,
'padding-left': px,
'padding-right': px,
'padding-top': px,
'padding-block': px,
'padding-block-end': px,
'padding-block-start': px,
'padding-inline': px,
'padding-inline-end': px,
'padding-inline-start': px,
// Mask properties
'mask-position-x': px,
'mask-position-y': px,
'mask-size': px,
// Width and height properties
height: px,
width: px,
'min-height': px,
'max-height': px,
'min-width': px,
'max-width': px,
// Position properties
bottom: px,
left: px,
top: px,
right: px,
inset: px,
'inset-block': px,
'inset-block-end': px,
'inset-block-start': px,
'inset-inline': px,
'inset-inline-end': px,
'inset-inline-start': px,
// Shadow properties
'box-shadow': px,
'text-shadow': px,
// Column properties
'column-gap': px,
'column-rule': px,
'column-rule-width': px,
'column-width': px,
// Font and text properties
'font-size': px,
'font-size-delta': px,
'letter-spacing': px,
'text-decoration-thickness': px,
'text-indent': px,
'text-stroke': px,
'text-stroke-width': px,
'word-spacing': px,
// Motion properties
motion: px,
'motion-offset': px,
// Outline properties
outline: px,
'outline-offset': px,
'outline-width': px,
// Perspective properties
perspective: px,
'perspective-origin-x': percent,
'perspective-origin-y': percent,
// Transform properties
'transform-origin': percent,
'transform-origin-x': percent,
'transform-origin-y': percent,
'transform-origin-z': percent,
// Transition properties
'transition-delay': ms,
'transition-duration': ms,
// Alignment properties
'vertical-align': px,
'flex-basis': px,
// Some random properties
'shape-margin': px,
size: px,
gap: px,
// Grid properties
grid: px,
'grid-gap': px,
'row-gap': px,
'grid-row-gap': px,
'grid-column-gap': px,
'grid-template-rows': px,
'grid-template-columns': px,
'grid-auto-rows': px,
'grid-auto-columns': px,
// Not existing properties.
// Used to avoid issues with jss-plugin-expand integration.
'box-shadow-x': px,
'box-shadow-y': px,
'box-shadow-blur': px,
'box-shadow-spread': px,
'font-line-height': px,
'text-shadow-x': px,
'text-shadow-y': px,
'text-shadow-blur': px
}

View file

@ -0,0 +1,5 @@
import {Plugin} from 'jss'
export type Options = {[key: string]: string}
export default function jssPluginSyntaxDefaultUnit(options?: Options): Plugin

79
web/node_modules/jss-plugin-default-unit/src/index.js generated vendored Normal file
View file

@ -0,0 +1,79 @@
// @flow
import type {Plugin} from 'jss'
import defaultUnits, {px} from './defaultUnits'
export type Options = {[key: string]: string | ((val: number) => string)}
/**
* Clones the object and adds a camel cased property version.
*/
function addCamelCasedVersion(obj) {
const regExp = /(-[a-z])/g
const replace = str => str[1].toUpperCase()
const newObj = {}
for (const key in obj) {
newObj[key] = obj[key]
newObj[key.replace(regExp, replace)] = obj[key]
}
return newObj
}
const units = addCamelCasedVersion(defaultUnits)
/**
* Recursive deep style passing function
*/
function iterate(prop: string, value: any, options: Options) {
if (value == null) return value
if (Array.isArray(value)) {
for (let i = 0; i < value.length; i++) {
value[i] = iterate(prop, value[i], options)
}
} else if (typeof value === 'object') {
if (prop === 'fallbacks') {
for (const innerProp in value) {
value[innerProp] = iterate(innerProp, value[innerProp], options)
}
} else {
for (const innerProp in value) {
value[innerProp] = iterate(`${prop}-${innerProp}`, value[innerProp], options)
}
}
// eslint-disable-next-line no-restricted-globals
} else if (typeof value === 'number' && isNaN(value) === false) {
const unit = options[prop] || units[prop]
// Add the unit if available, except for the special case of 0px.
if (unit && !(value === 0 && unit === px)) {
return typeof unit === 'function' ? unit(value).toString() : `${value}${unit}`
}
return value.toString()
}
return value
}
/**
* Add unit to numeric values.
*/
export default function defaultUnit(options: Options = {}): Plugin {
const camelCasedOptions = addCamelCasedVersion(options)
function onProcessStyle(style, rule) {
if (rule.type !== 'style') return style
for (const prop in style) {
style[prop] = iterate(prop, style[prop], camelCasedOptions)
}
return style
}
function onChangeValue(value, prop) {
return iterate(prop, value, camelCasedOptions)
}
return {onProcessStyle, onChangeValue}
}