@symbo.ls/scratch 0.3.11 → 0.3.14

package/package.json

@@ -2,7 +2,7 @@
   "name": "@symbo.ls/scratch",
   "description": "Φ / CSS framework and methodology.",
   "author": "Symbols",
-  "version": "0.3.11",
+  "version": "0.3.14",
   "files": [
     "src"
   ],
@@ -19,8 +19,8 @@
     "bump": "npx np"
   },
   "devDependencies": {
-    "@babel/core": "^7.10.4",
-    "@babel/preset-env": "^7.10.4",
+    "@babel/core": "^7.0.0-0",
+    "@babel/preset-env": "^7.18.9",
     "babel-eslint": "^10.0.3",
     "babel-jest": "^27.0.2",
     "babel-preset-env": "^1.7.0",

package/src/methods/set.js

@@ -14,16 +14,14 @@ import {
   getDefaultOrFirstKey,
   getFontFaceEach,
   hslToRgb,
-  getColorShade,
-  pSBC,
-  changeLightness
+  getColorShade
 } from '../utils'
 
 const ENV = process.env.NODE_ENV
 
 export const getColor = value => {
   if (!isString(value)) {
-    if (ENV === 'test' || ENV === 'development') console.warn(value, '- type for color is not valid')
+    if ((ENV === 'test' || ENV === 'development') && CONFIG.verbose) console.warn(value, '- type for color is not valid')
     return
   }
 
@@ -32,7 +30,7 @@ export const getColor = value => {
   const val = COLOR[name] || GRADIENT[name]
 
   if (!val) {
-    if (ENV === 'test' || ENV === 'development') console.warn('Can\'t find color', name)
+    if ((ENV === 'test' || ENV === 'development') && CONFIG.verbose) console.warn('Can\'t find color', name)
     return value
   }
 
@@ -49,7 +47,7 @@ export const getColor = value => {
         } else {
           const [r, g, b] = [...rgb.split(', ').map(v => parseFloat(v))]
           const hsl = rgbToHSL(r, g, b)
-          const [h, s, l] = hsl
+          const [h, s, l] = hsl // eslint-disable-line
           const newRgb = hslToRgb(h, s, parseFloat(tone) / 100 * 255)
           rgb = newRgb
         }
@@ -117,7 +115,7 @@ export const getTheme = value => {
   } else if (isObject(value)) return setThemeValue(value)
   else if (isString(value) && THEME[value]) return getThemeValue(THEME[value])
 
-  if (ENV === 'test' || ENV === 'development') console.warn('Can\'t find theme', value)
+  if ((ENV === 'test' || ENV === 'development') && CONFIG.verbose) console.warn('Can\'t find theme', value)
 }
 
 const setPrefersScheme = (theme, key, variant, themeValue) => {
@@ -254,7 +252,7 @@ export const setEach = (factoryName, props) => {
 }
 
 export const set = recivedConfig => {
-  const { version, ...config } = recivedConfig
+  const { version, verbose, ...config } = recivedConfig
   const keys = Object.keys(config)
   keys.map(key => setEach(key, config[key]))
 
@@ -263,6 +261,8 @@ export const set = recivedConfig => {
   applySpacingSequence()
   applyDocument()
 
+  CONFIG.verbose = verbose
+
   console.log(CONFIG)
   return CONFIG
 }

package/src/utils/index.js

@@ -160,7 +160,7 @@ export const changeLightness = (delta, hsl) => {
 
 export const rgbToHSL = (r, g, b) => {
   const a = Math.max(r, g, b); const n = a - Math.min(r, g, b); const f = (1 - Math.abs(a + a - n - 1))
-  const h = n && ((a == r) ? (g - b) / n : ((a == g) ? 2 + (b - r) / n : 4 + (r - g) / n))
+  const h = n && ((a == r) ? (g - b) / n : ((a == g) ? 2 + (b - r) / n : 4 + (r - g) / n)) //eslint-disable-line
   return [60 * (h < 0 ? h + 6 : h), f ? n / f : 0, (a + a - n) / 2]
 }
 
@@ -282,7 +282,7 @@ const setSequenceValue = ({ key, variable, value, scaling, state, index }) => {
   state.scales[variable] = scaling
 }
 
-export const generateSubSequence = ({ key, base, value, ratio, variable, state }) => {
+export const generateSubSequence = ({ key, base, value, ratio, variable, state, index }) => {
   const next = value * ratio
   const smallscale = (next - value) / ratio
 
@@ -303,7 +303,7 @@ export const generateSubSequence = ({ key, base, value, ratio, variable, state }
     const scaling = Math.round(v / base * 1000) / 1000
     const newVar = variable + (k + 1)
 
-    return setSequenceValue({ key: key + (k + 1), variable: newVar, value: v, scaling, state })
+    return setSequenceValue({ key: key + (k + 1), variable: newVar, value: v, scaling, state, index: index + (k + 1) / 10 })
   })
 }
 
@@ -319,7 +319,7 @@ export const generateSequence = ({ type, base, ratio, range, subSequence, ...sta
 
     setSequenceValue({ key: letterKey, variable, value, scaling, state, index: key })
 
-    if (subSequence) generateSubSequence({ key: letterKey, base, value, ratio, variable, state })
+    if (subSequence) generateSubSequence({ key: letterKey, base, value, ratio, variable, state, index: key })
   }
   return state
 }
@@ -328,7 +328,7 @@ export const fallBack = ({ type, prop, val = 'A', prefix = '--font-size-', unit
   if (typeof val !== 'string') console.warn(prop, val, 'is not a string')
 
   if (val === '-' || val === '') return ({ })
-  if (val === 'auto' || val === 'fit-content' || val === 'min-content' || val === 'max-content') return ({ [prop]: val })
+  if (val === 'none' || val === 'auto' || val === 'fit-content' || val === 'min-content' || val === 'max-content') return ({ [prop]: val })
 
   // const startsWithLetterRegex = /^[a-zA-Z]/i
   const startsWithLetterRegex = /^-?[a-zA-Z]/i