@symbo.ls/uikit 2.10.253 → 2.10.267

package/Tooltip/node_modules/@symbo.ls/scratch/src/transforms/index.js

@@ -0,0 +1,103 @@
+'use strict'
+
+import { isString } from '@domql/utils'
+import { getActiveConfig } from '../factory'
+import {
+  getSpacingByKey,
+  getColor,
+  getMediaColor,
+  getTimingByKey,
+  getTimingFunction
+} from '../system'
+
+const isBorderStyle = str => [
+  'none',
+  'hidden',
+  'dotted',
+  'dashed',
+  'solid',
+  'double',
+  'groove',
+  'ridge',
+  'inset',
+  'outset',
+  'initial'
+].some(v => str.includes(v))
+
+export const transformBorder = border => {
+  const arr = border.split(', ')
+  return arr.map(v => {
+    v = v.trim()
+    if (v.slice(0, 2) === '--') return `var(${v})`
+    else if (isBorderStyle(v)) return v || 'solid'
+    else if (v.slice(-2) === 'px' || v.slice(-2) === 'em') return v // TODO: add map spacing
+    else if (getColor(v).length > 2) return getColor(v)
+    return getSpacingByKey(v, 'border').border
+  }).join(' ')
+}
+
+export const transformTextStroke = stroke => {
+  return stroke.split(', ').map(v => {
+    if (v.slice(0, 2) === '--') return `var(${v})`
+    if (v.includes('px')) return v
+    else if (getColor(v)) return getColor(v)
+    return v
+  }).join(' ')
+}
+
+export const transformShadow = shadows => shadows.split('|').map(shadow => {
+  return shadow.split(', ').map(v => {
+    v = v.trim()
+    if (v.slice(0, 2) === '--') return `var(${v})`
+    if (getColor(v).length > 2) return getColor(v)
+    if (v.includes('px') || v.slice(-2) === 'em') return v
+    const arr = v.split(' ')
+    if (!arr.length) return v
+    return arr.map(v => getSpacingByKey(v, 'shadow').shadow).join(' ')
+  }).join(' ')
+}).join(',')
+
+export const transformBackgroundImage = (backgroundImage, globalTheme) => {
+  const CONFIG = getActiveConfig()
+  return backgroundImage.split(', ').map(v => {
+    if (v.slice(0, 2) === '--') return `var(${v})`
+    if (v.includes('url') || v.includes('gradient')) return v
+    else if (CONFIG.GRADIENT[backgroundImage]) {
+      return {
+        backgroundImage: getMediaColor(backgroundImage, globalTheme || CONFIG.globalTheme)
+      }
+    } else if (v.includes('/') || v.includes('http')) return `url(${v})`
+    return v
+  }).join(' ')
+}
+
+export const transfromGap = gap => isString(gap) && (
+  gap.split(' ').map(v => getSpacingByKey(v, 'gap').gap).join(' ')
+)
+
+export const transformTransition = transition => {
+  const arr = transition.split(' ')
+
+  if (!arr.length) return transition
+
+  return arr.map(v => {
+    if (v.slice(0, 2) === '--') return `var(${v})`
+    if (v.length < 3 || v.includes('ms')) {
+      const mapWithSequence = getTimingByKey(v)
+      return mapWithSequence.timing || v
+    }
+    if (getTimingFunction(v)) return getTimingFunction(v)
+    return v
+  }).join(' ')
+}
+
+export const transformDuration = (duration, props, propertyName) => {
+  if (!isString(duration)) return
+  return duration.split(',').map(v => getTimingByKey(v).timing || v).join(',')
+}
+
+export const splitTransition = transition => {
+  const arr = transition.split(',')
+  if (!arr.length) return
+  return arr.map(transformTransition).join(',')
+}

package/Tooltip/node_modules/@symbo.ls/scratch/src/utils/color.js

@@ -0,0 +1,154 @@
+'use strict'
+
+import { document, window } from '@domql/globals'
+const ENV = process.env.NODE_ENV
+
+export const colorStringToRgbaArray = color => {
+  if (color === '') return
+  if (color.toLowerCase() === 'transparent') return [0, 0, 0, 0]
+
+  // convert #RGB and #RGBA to #RRGGBB and #RRGGBBAA
+  if (color[0] === '#') {
+    if (color.length < 7) {
+      color = '#' + color[1] + color[1] + color[2] + color[2] + color[3] + color[3] + (color.length > 4 ? color[4] + color[4] : '')
+    } return [parseInt(color.substr(1, 2), 16),
+      parseInt(color.substr(3, 2), 16),
+      parseInt(color.substr(5, 2), 16),
+      color.length > 7 ? parseInt(color.substr(7, 2), 16) / 255 : 1]
+  }
+
+  // convert named colors
+  if (color.indexOf('rgb') === -1) {
+    if (document && window) {
+      // intentionally use unknown tag to lower chances of css rule override with !important
+      const elem = document.body.appendChild(document.createElement('fictum'))
+      // this flag tested on chrome 59, ff 53, ie9, ie10, ie11, edge 14
+      const flag = 'rgb(1, 2, 3)'
+      elem.style.color = flag
+      // color set failed - some monstrous css rule is probably taking over the color of our object
+      if (elem.style.color !== flag) return
+      elem.style.color = color
+      if (elem.style.color === flag || elem.style.color === '') return // color parse failed
+      color = window.getComputedStyle(elem).color
+      document.body.removeChild(elem)
+    }
+  }
+
+  // convert 'rgb(R,G,B)' to 'rgb(R,G,B,A)' which looks awful but will pass the regxep below
+  if (color.indexOf('rgb') === 0) {
+    if (color.indexOf('rgba') === -1) color = `${color}, 1`
+    return color.match(/[\.\d]+/g).map(a => +a) // eslint-disable-line
+  }
+
+  // TODO: fix this
+  return []
+}
+
+export const mixTwoColors = (colorA, colorB, range = 0.5) => {
+  colorA = colorStringToRgbaArray(colorA)
+  colorB = colorStringToRgbaArray(colorB)
+  return mixTwoRgba(colorA, colorB, range)
+}
+
+export const hexToRgb = (hex, alpha = 1) => {
+  const [r, g, b] = hex.match(/\w\w/g).map(x => parseInt(x, 16))
+  return `rgb(${r},${g},${b})`
+}
+
+export const hexToRgbArray = (hex, alpha = 1) => {
+  const [r, g, b] = hex.match(/\w\w/g).map(x => parseInt(x, 16))
+  return [r, g, b]
+}
+
+export const rgbToHex = (r, g, b) => {
+  return '#' + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)
+}
+
+export const rgbArrayToHex = ([r, g, b]) => {
+  return ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)
+}
+
+export const hexToRgba = (hex, alpha = 1) => {
+  const [r, g, b] = hex.match(/\w\w/g).map(x => parseInt(x, 16))
+  return `rgba(${r},${g},${b},${alpha})`
+}
+
+export const mixTwoRgb = (colorA, colorB, range = 0.5) => {
+  const arr = []
+  for (let i = 0; i < 3; i++) {
+    arr[i] = ~~(
+      colorA[i] + (
+        (colorB[i] - colorA[i]) * range
+      )
+    )
+  }
+  return `rgb(${arr})`
+}
+
+export const changeLightness = (delta, hsl) => {
+  const [hue, saturation, lightness] = hsl
+
+  const newLightness = Math.max(
+    0,
+    Math.min(100, lightness + parseFloat(delta))
+  )
+
+  return [hue, saturation, newLightness]
+}
+
+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)) //eslint-disable-line
+  return [60 * (h < 0 ? h + 6 : h), f ? n / f : 0, (a + a - n) / 2]
+}
+
+export const hslToRgb = (h, s, l,
+  a = s * Math.min(l, 1 - l),
+  f = (n, k = (n + h / 30) % 12) => l - a * Math.max(
+    Math.min(k - 3, 9 - k, 1), -1
+  )
+) => [f(0), f(8), f(4)]
+
+export const getColorShade = (col, amt) => {
+  const num = parseInt(col, 16)
+
+  let r = (num >> 16) + amt
+
+  if (r > 255) r = 255
+  else if (r < 0) r = 0
+
+  let b = ((num >> 8) & 0x00FF) + amt
+
+  if (b > 255) b = 255
+  else if (b < 0) b = 0
+
+  let g = (num & 0x0000FF) + amt
+
+  if (g > 255) g = 255
+  else if (g < 0) g = 0
+
+  return (g | (b << 8) | (r << 16)).toString(16)
+}
+
+export const mixTwoRgba = (colorA, colorB, range = 0.5) => {
+  const arr = []
+  for (let i = 0; i < 4; i++) {
+    const round = (i === 3) ? x => x : Math.round
+    arr[i] = round(
+      (colorA[i] + (
+        (colorB[i] - colorA[i]) * range
+      ))
+    )
+  }
+  return `rgba(${arr})`
+}
+
+export const opacify = (color, opacity) => {
+  const arr = colorStringToRgbaArray(color)
+  if (!arr) {
+    if (ENV === 'test' || ENV === 'development') console.warn(color + 'color is not rgba')
+    return
+  }
+  arr[3] = opacity
+  return `rgba(${arr})`
+}

package/Tooltip/node_modules/@symbo.ls/scratch/src/utils/font.js

@@ -0,0 +1,47 @@
+'use strict'
+
+export const getDefaultOrFirstKey = (LIBRARY, key) => {
+  if (LIBRARY[key]) return LIBRARY[key].value
+  if (LIBRARY.default) return LIBRARY[LIBRARY.default].value
+  const hasValue = Object.keys(LIBRARY)[0]
+  return hasValue && LIBRARY[hasValue] && LIBRARY[hasValue].value
+}
+
+export const getFontFormat = url => url.split(/[#?]/)[0].split('.').pop().trim()
+
+export const setInCustomFontMedia = str => `@font-face { ${str} }`
+
+export const setCustomFont = (name, url, weight) => `
+  font-family: '${name}';
+  font-style: normal;
+  ${weight && `font-weight: ${weight};`}
+  src: url('${url}') format('${getFontFormat(url)}');`
+
+export const setCustomFontMedia = (name, url, weight) => `@font-face {
+  ${setCustomFont(name, url, weight)}
+}`
+// src: url('${url}') format('${getFontFormat(url)}');
+
+export const getFontFaceEach = (name, weights) => {
+  const keys = Object.keys(weights)
+  return keys.map(key => {
+    const { url, fontWeight } = weights[key]
+    return setCustomFont(name, url, fontWeight)
+  })
+}
+
+export const getFontFace = LIBRARY => {
+  const keys = Object.keys(LIBRARY)
+  return keys.map(key => getFontFaceEach(key, LIBRARY[key].value))
+}
+
+export const getFontFaceEachString = (name, weights) => {
+  const isArr = weights[0]
+  if (isArr) return getFontFaceEach(name, weights).map(setInCustomFontMedia)
+  return setCustomFontMedia(name, weights.url)
+}
+
+export const getFontFaceString = LIBRARY => {
+  const keys = Object.keys(LIBRARY)
+  return keys.map(key => getFontFaceEachString(key, LIBRARY[key].value))
+}

package/Tooltip/node_modules/@symbo.ls/scratch/src/utils/index.js

@@ -0,0 +1,8 @@
+'use strict'
+
+export * from './color.js'
+export * from './theme.js'
+export * from './font.js'
+export * from './sequence.js'
+export * from './var.js'
+export * from './sprite.js'

package/Tooltip/node_modules/@symbo.ls/scratch/src/utils/sequence.js

@@ -0,0 +1,217 @@
+'use strict'
+
+import { isString } from '@domql/utils'
+import { toDashCase } from '@symbo.ls/utils'
+import { getActiveConfig } from '../factory.js'
+
+export const numToLetterMap = {
+  '-6': 'U',
+  '-5': 'V',
+  '-4': 'W',
+  '-3': 'X',
+  '-2': 'Y',
+  '-1': 'Z',
+  0: 'A',
+  1: 'B',
+  2: 'C',
+  3: 'D',
+  4: 'E',
+  5: 'F',
+  6: 'G',
+  7: 'H',
+  8: 'I',
+  9: 'J',
+  10: 'K',
+  11: 'L',
+  12: 'M',
+  13: 'N',
+  14: 'O',
+  15: 'P',
+  16: 'Q',
+  17: 'R',
+  18: 'S',
+  19: 'T'
+}
+
+const setSequenceValue = (props, sequenceProps) => {
+  const { key, variable, value, scaling, index } = props
+  sequenceProps.sequence[key] = {
+    key,
+    decimal: ~~(value * 100) / 100,
+    val: ~~(value),
+    scaling,
+    index,
+    variable
+  }
+  sequenceProps.scales[key] = scaling
+  sequenceProps.vars[variable] = scaling + sequenceProps.unit
+}
+
+export const generateSubSequence = (props, sequenceProps) => {
+  const { key, base, value, ratio, variable, index } = props
+
+  const next = value * ratio
+  const diff = next - value
+  const smallscale = diff / 1.618
+
+  const valueRounded = ~~(value)
+  const nextRounded = ~~(next)
+  const diffRounded = nextRounded - valueRounded
+
+  let arr = []
+  const first = next - smallscale
+  const second = value + smallscale
+  const middle = (first + second) / 2
+  if (diffRounded > 16) arr = [first, middle, second]
+  else arr = [first, second]
+
+  arr.map((v, k) => {
+    const scaling = ~~(v / base * 1000) / 1000
+    const newVar = variable + (k + 1)
+
+    const props = {
+      key: key + (k + 1),
+      variable: newVar,
+      value: v,
+      scaling,
+      index: index + (k + 1) / 10
+    }
+
+    return setSequenceValue(props, sequenceProps)
+  })
+}
+
+const switchSequenceOnNegative = (key, base, ratio) => {
+  // const values = Object.values(SEQUENCE)
+  // const index = values.indexOf(ratio)
+  // const diffRatio = ratio / SPACING.ratio
+  // const total = values[values.length - 1] - values[0]
+  // const avg = total / 2
+  // const diff = avg - ratio
+  // const scale = total / ratio
+  // const finalDiff = avg + avg / diffRatio
+
+  // if (key < 0) return base * Math.pow(avg, key)
+  return base * Math.pow(ratio, key)
+}
+
+export const generateSequence = (sequenceProps) => {
+  const { type, base, ratio, range, subSequence } = sequenceProps
+  const n = Math.abs(range[0]) + Math.abs(range[1])
+  const prefix = '--' + (type && type.replace('.', '-')) + '-'
+
+  for (let i = 0; i <= n; i++) {
+    const key = range[1] - i
+    const letterKey = numToLetterMap[key]
+    const value = switchSequenceOnNegative(key, base, ratio)
+    const scaling = ~~(value / base * 100) / 100
+    const variable = prefix + letterKey
+
+    const props = {
+      key: letterKey,
+      variable,
+      value,
+      base,
+      scaling,
+      ratio,
+      index: key
+    }
+
+    setSequenceValue(props, sequenceProps)
+
+    if (subSequence) generateSubSequence(props, sequenceProps)
+  }
+  return sequenceProps
+}
+
+export const getSequenceValue = (value = 'A', sequenceProps) => {
+  const CONFIG = getActiveConfig()
+  const { UNIT } = CONFIG
+
+  const {
+    sequence,
+    unit = UNIT.default,
+    useVariable
+  } = sequenceProps
+
+  if (isString(value) && value.slice(0, 2) === '--') return `var(${value})`
+
+  const prefix = `--${toDashCase(sequenceProps.type.replace('.', '-'))}-`
+
+  const startsWithDashOrLetterRegex = /^-?[a-zA-Z]/i
+  const startsWithDashOrLetter = startsWithDashOrLetterRegex.test(value)
+
+  if (
+    value === 'none' ||
+    value === 'auto' ||
+    value === 'unset' ||
+    value === 'inherit' ||
+    value === 'fit-content' ||
+    value === 'min-content' ||
+    value === 'max-content' ||
+    value.includes('calc') ||
+    !startsWithDashOrLetter
+  ) return value
+
+  const letterVal = value.toUpperCase()
+  const isNegative = letterVal.slice(0, 1) === '-' ? '-' : ''
+  let absValue = isNegative ? letterVal.slice(1) : letterVal
+
+  let mediaName = ''
+  if (absValue.includes('-')) {
+    mediaName = '-' + absValue.split('-')[1].toLowerCase()
+    absValue = absValue.split('-')[0]
+  }
+
+  const varValue = v => `var(${prefix}${v}${mediaName})`
+  if (absValue.includes('+')) {
+    const args = absValue.split('+')
+    const [first, second] = args
+    const joint = `${varValue(first)} + ${varValue(second)}`
+    return isNegative ? `calc((${joint}) * -1)` : `calc(${joint})`
+  } else if (absValue.includes('-')) {
+    const args = absValue.split('-')
+    const [first, second] = args
+    const joint = `${varValue(first)} - ${varValue(second)}`
+    return isNegative ? `calc((${joint}) * -1)` : `calc(${joint})`
+  }
+
+  // if subsequence is not set but value is applied
+  if (!sequence[absValue] && absValue.length === 2) {
+    if (CONFIG.verbose) console.warn(absValue, '- value is not found because `subSequence` is set to false')
+    absValue = absValue.slice(0, 1)
+  }
+
+  if (useVariable || CONFIG.useVariable) {
+    const varValue = `var(${prefix}${absValue}${mediaName})`
+    return isNegative ? `calc(${varValue} * -1)` : varValue
+  }
+
+  const sequenceItem = sequence ? sequence[absValue] : null
+  if (!sequenceItem) return console.warn('can\'t find', sequence, absValue)
+
+  if (unit === 'ms' || unit === 's') {
+    return isNegative + sequenceItem.val + unit
+  }
+
+  return isNegative + sequenceItem.scaling + unit
+}
+
+export const getSequenceValuePropertyPair = (value, propertyName, sequenceProps) => {
+  if (typeof value !== 'string') {
+    console.warn(propertyName, value, 'is not a string')
+    return ({})
+  }
+  if (value === '-' || value === '') return ({})
+  return { [propertyName]: getSequenceValue(value, sequenceProps) }
+}
+
+export const findHeadingLetter = (h1Matches, index) => numToLetterMap[h1Matches - index]
+
+export const findHeadings = propertyNames => {
+  const { h1Matches, sequence } = propertyNames
+  return new Array(6).fill(null).map((_, i) => {
+    const findLetter = findHeadingLetter(h1Matches, i)
+    return sequence[findLetter]
+  })
+}

package/Tooltip/node_modules/@symbo.ls/scratch/src/utils/sprite.js

@@ -0,0 +1,51 @@
+'use strict'
+
+import { isString } from '@domql/utils'
+
+export const generateSprite = (icons) => {
+  let sprite =
+    '<svg aria-hidden="true" width="0" height="0" style="position:absolute">'
+
+  for (const key in icons) {
+    sprite += icons[key]
+  }
+
+  sprite += '</svg>'
+
+  return sprite
+}
+
+const parseRootAttributes = (htmlString) => {
+  if (!isString(htmlString)) {
+    return console.warn(`parseRootAttributes: ${htmlString} is not a string`)
+  }
+
+  const match = htmlString.match(/<svg\s+(.*?)>/)
+  if (!match || !match[1]) {
+    return {}
+  }
+
+  const attrString = match[1]
+  const attrs = attrString.match(/(\S+)=["']?((?:.(?!["']?\s+(?:\S+)=|\s*\/?[>"']))+.)["']?/gm)
+  return attrs.reduce((acc, attr) => {
+    const [key, value] = attr.split('=')
+    acc[key] = value.replace(/['"]/g, '')
+    return acc
+  }, {})
+}
+
+export const convertSvgToSymbol = (key, code) => {
+  const extractAttrs = parseRootAttributes(code)
+  const { width, height } = extractAttrs
+
+  const viewBox = extractAttrs.viewBox || `0 0 ${width || 24} ${height || 24}`
+  const xmlns = 'http://www.w3.org/2000/svg'
+
+  let symbol = code.replace('<svg',
+    `<symbol id="${key}" xmlns="${xmlns}" viewBox="${viewBox}"`
+  )
+  symbol = symbol.replace(/width="[^"]*/, '')
+  symbol = symbol.replace(/height="[^"]*/, '')
+  symbol = symbol.replace('</svg', '</symbol')
+  return symbol
+}

package/Tooltip/node_modules/@symbo.ls/scratch/src/utils/theme.js

@@ -0,0 +1,8 @@
+'use strict'
+
+export const returnSubThemeOrDefault = (orig, theme) => {
+  if (!orig) return
+  if (orig.themes && orig.themes[theme]) return orig.themes[theme]
+  if (orig[theme]) return [orig, orig[theme]]
+  return orig
+}

package/Tooltip/node_modules/@symbo.ls/scratch/src/utils/var.js

@@ -0,0 +1,48 @@
+'use strict'
+
+import { getActiveConfig } from '../factory.js'
+import { isObjectLike } from '@domql/utils'
+
+const ENV = process.env.NODE_ENV // eslint-disable-line
+
+export const setVariables = (result, key) => {
+  const CONFIG = getActiveConfig()
+  const { CSS_VARS } = CONFIG
+  if (isObjectLike(result.value)) {
+    // for (const key in result.value) {
+    // }
+  } else {
+    CSS_VARS[result.var] = result.value
+  }
+}
+
+export const applySequenceVars = (props, mediaName, options = {}) => {
+  const CONFIG = getActiveConfig()
+  const { UNIT, MEDIA, TIMING, CSS_VARS } = CONFIG
+
+  const unit = props.unit || UNIT.default
+  const { sequence, scales } = props
+
+  for (const key in sequence) {
+    const item = sequence[key]
+    const value = (props.type === TIMING.type ? sequence[key].val : scales[key]) + unit
+
+    if (mediaName) {
+      const query = MEDIA[mediaName]
+      if (!query) {
+        if (CONFIG.verbose) console.warn('Can\'t find query ', query)
+      }
+      let underMediaQuery = CSS_VARS[`@media ${query}`]
+      if (!underMediaQuery) underMediaQuery = CSS_VARS[`@media ${query}`] = {}
+      underMediaQuery[item.variable] = `var(${item.variable + '-' + mediaName})`
+      CSS_VARS[item.variable + '-' + mediaName] = value
+    } else {
+      if (options.useDefault === false) {
+        CSS_VARS[item.variable] = value
+      } else {
+        CSS_VARS[item.variable + '-default'] = value
+        CSS_VARS[item.variable] = `var(${item.variable + '-default'})`
+      }
+    }
+  }
+}

package/Tooltip/node_modules/@symbo.ls/utils/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 symbo.ls
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/Tooltip/node_modules/@symbo.ls/utils/package.json

@@ -0,0 +1,11 @@
+{
+  "name": "@symbo.ls/utils",
+  "version": "2.10.259",
+  "main": "src/index.js",
+  "author": "symbo.ls",
+  "license": "ISC",
+  "dependencies": {
+    "@domql/utils": "latest"
+  },
+  "gitHead": "c454826279438617c85a5f8d8e7b3a6938d94dea"
+}