@unovis/ts 1.1.1-beta.7 → 1.1.1-beta.8

package/src/utils/misc.ts

@@ -1,54 +0,0 @@
-import { StringAccessor } from 'types/accessor'
-import { Rect } from 'types/misc'
-import { getString, isString } from 'utils/data'
-import toPx from 'to-px'
-
-export function guid (): string {
-  const s4 = (): string =>
-    Math.floor((1 + Math.random()) * 0x10000)
-      .toString(16)
-      .substring(1)
-
-  return `${s4() + s4()}-${s4()}-${s4()}-${s4()}-${s4()}${s4()}${s4()}`
-}
-
-export function stringToHtmlId (str: string): string {
-  return (str || '').replace(/\W/g, '_')
-}
-
-export function isStringCSSVariable (s: string): boolean {
-  return isString(s) ? (s.substring(0, 6) === 'var(--') : false
-}
-
-export function getCSSVariableValue (s: string, context: HTMLElement | SVGElement): string {
-  if (!isString(s)) return ''
-  const variableName = s.substr(4, s.length - 5)
-  return getComputedStyle(context).getPropertyValue(variableName)
-}
-
-export function getCSSVariableValueInPixels (s: string, context: HTMLElement | SVGElement): number {
-  const val = getCSSVariableValue(s, context)
-  return toPx(val)
-}
-
-export function rectIntersect (rect1: Rect, rect2: Rect, tolerancePx = 0): boolean {
-  const [left1, top1, right1, bottom1] = [
-    rect1.x + tolerancePx,
-    rect1.y + rect1.height - 2 * tolerancePx,
-    rect1.x + rect1.width - 2 * tolerancePx,
-    rect1.y + tolerancePx,
-  ]
-  const [left2, top2, right2, bottom2] = [
-    rect2.x + tolerancePx,
-    rect2.y + rect2.height - 2 * tolerancePx,
-    rect2.x + rect2.width - 2 * tolerancePx,
-    rect2.y + tolerancePx,
-  ]
-
-  return !(top1 < bottom2 || top2 < bottom1 || right1 < left2 || right2 < left1)
-}
-
-export function getHref<T> (d: T, identifier: StringAccessor<T>): string {
-  const id = getString(d, identifier)
-  return id ? `url(#${id})` : null
-}

package/src/utils/path.ts

@@ -1,196 +0,0 @@
-import { range, min, max } from 'd3-array'
-import { line, curveCardinal, curveCardinalClosed } from 'd3-shape'
-
-// Utils
-import { clamp } from 'utils/data'
-
-export type RoundedRectPathOptions = {
-  x: number;
-  y: number;
-  w: number;
-  h: number;
-  r: number;
-  tl: boolean;
-  tr: boolean;
-  bl: boolean;
-  br: boolean;
-}
-
-/*
- * Generate SVG path for rectangle with rounded corners
- *
- * @param {Object} props - Configuration object
- * @param {Number} props.x - Rect top left X coordinate
- * @param {Number} props.y - Rect top left Y coordinate
- * @param {Number} props.w - Rect width
- * @param {Number} props.h - Rect height
- * @param {Bool} [props.tl=false] - Round top left corner
- * @param {Bool} [props.tr=false] - Round top right corner
- * @param {Bool} [props.bl=false] - Round bottom left corner
- * @param {Bool} [props.br=false] - Round bottom right corner
- * @param {Number} [props.r=0] - Corner Radius
- * @return {String} Path string for the `d` attribute
- */
-export function roundedRectPath ({
-  x,
-  y,
-  w,
-  h,
-  tl = false,
-  tr = false,
-  bl = false,
-  br = false,
-  r = 0,
-}: RoundedRectPathOptions): string {
-  let path
-  path = `M${x + r},${y}h${w - 2 * r}`
-
-  let roundedR = tr ? r : 0
-  let angularR = tr ? 0 : r
-  path += `a${roundedR},${roundedR} 0 0 1 ${roundedR},${roundedR}`
-  path += `h${angularR}v${angularR}`
-  path += `v${h - 2 * r}`
-
-  roundedR = br ? r : 0
-  angularR = br ? 0 : r
-  path += `a${roundedR},${roundedR} 0 0 1 ${-roundedR},${roundedR}`
-  path += `v${angularR}h${-angularR}`
-  path += `h${2 * r - w}`
-
-  roundedR = bl ? r : 0
-  angularR = bl ? 0 : r
-  path += `a${roundedR},${roundedR} 0 0 1 ${-roundedR},${-roundedR}`
-  path += `h${-angularR}v${-angularR}`
-  path += `v${2 * r - h}`
-
-  roundedR = tl ? r : 0
-  angularR = tl ? 0 : r
-  path += `a${roundedR},${roundedR} 0 0 1 ${roundedR},${-roundedR}`
-  path += `v${-angularR}h${angularR}`
-
-  path += 'z'
-  return path
-}
-
-export function polygon (size: number, n = 6, endAngle = 2 * Math.PI, open = false): string {
-  const r = n === 4 ? Math.sqrt(0.5) * size : size / 3.6 * 2
-  const deltaAngle = n === 4 ? Math.PI / 4 : 0 // rotate to 45 grads if shape is a rectangle
-  const shiftedEndAngle = endAngle - deltaAngle
-
-  const completion = (shiftedEndAngle < 0 ? endAngle : shiftedEndAngle) / (2 * Math.PI)
-  const nSegments = Math.ceil(n * completion)
-
-  const centerAngle = 1 / n * Math.PI * 2 //          /\
-  const baseAngle = (Math.PI - centerAngle) / 2 //   /__\
-
-  const data = range(nSegments + (shiftedEndAngle >= 0 ? 1 : 0))
-    .map((d, i) => {
-      const isLastSegment = i === nSegments || (nSegments === 1 && shiftedEndAngle < 0)
-      let mult = isLastSegment ? ((completion * n) % 1 || 1) : 1 // Handle partial shape
-      if (shiftedEndAngle < 0) {
-        mult += 0.5
-      }
-      const angle = centerAngle * (i - 1 + mult)
-
-      let radius
-      if (isLastSegment) {
-        const thirdAngle = Math.PI - baseAngle - centerAngle * mult
-        radius = r * Math.sin(baseAngle) / Math.sin(thirdAngle) // Law of sines
-      } else {
-        radius = r
-      }
-
-      return {
-        x: Math.sin(angle + deltaAngle) * radius,
-        y: -Math.cos(angle + deltaAngle) * radius,
-      }
-    })
-
-  if (n === 4) {
-    const angle = centerAngle * (-1 + 0.5)
-    const thirdAngle = Math.PI * 0.5
-    const radius = r * Math.sin(baseAngle) / Math.sin(thirdAngle) // Law of sines
-    data.unshift({
-      x: Math.sin(angle + deltaAngle) * radius,
-      y: -Math.cos(angle + deltaAngle) * radius,
-    })
-  }
-
-  const path = line<any>()
-    /* eslint-disable-next-line dot-notation */
-    .x(d => d['x'])
-    /* eslint-disable-next-line dot-notation */
-    .y(d => d['y'])
-    .curve((open ? curveCardinal : curveCardinalClosed).tension(0.95))
-
-  return path(data)
-}
-
-export function circlePath (cx: number, cy: number, r: number): string {
-  return `
-    M ${cx} ${cy}
-    m ${-r}, 0
-    a ${r},${r} 0 1,1 ${r * 2},0
-    a ${r},${r} 0 1,1 ${-r * 2},0`
-}
-
-export type ScoreRectPathOptions = {
-  x: number;
-  y: number;
-  w: number;
-  h: number;
-  r: number;
-  score: number;
-}
-
-export function scoreRectPath ({ x, y, w, h, r = 0, score = 1 }: ScoreRectPathOptions): string {
-  let path
-  const side = 1 / 4
-  const halfSide = side / 2
-  let part = score
-
-  //    8 1
-  //    - -
-  // 7 |   | 2
-  // 6 |   | 3
-  //    - -
-  //    5 4
-
-  // 1
-  const hLength = min([w * 0.5 * (part / halfSide) + r, w * 0.5 - r])
-  path = `M${x + w * 0.5},${y}h${hLength}`
-
-  // 2, 3
-  part = score - 1 / 8
-  if (part > 0) {
-    path += `a${r},${r} 0 0 1 ${r},${r}`
-    const vLength = clamp(h * (part / side) - r, 0, h - 2 * r)
-    path += `v${vLength}`
-  }
-
-  // 4, 5
-  part = score - 3 / 8
-  if (part > 0) {
-    path += `a${r},${r} 0 0 1 ${-r},${r}`
-    const hLength = clamp(r - w * (part / side), 2 * r - w, 0)
-    path += `h${hLength}`
-  }
-
-  // 6, 7
-  part = score - 5 / 8
-  if (part > 0) {
-    path += `a${r},${r} 0 0 1 ${-r},${-r}`
-    const vLength = clamp(r - h * (part / side), 2 * r - h, 0)
-    path += `v${vLength}`
-  }
-
-  // 8
-  part = score - 7 / 8
-  if (part > 0) {
-    path += `a${r},${r} 0 0 1 ${r},${-r}`
-    const hLength = max([w * 0.5 * (part / halfSide) - r, 0])
-    path += `h${hLength}`
-  }
-
-  return path
-}

package/src/utils/scale.ts

@@ -1 +0,0 @@
-export const DefaultRange = [1, 40]

package/src/utils/style.ts

@@ -1,37 +0,0 @@
-import { injectGlobal } from '@emotion/css'
-
-import { kebabCaseToCamel } from 'utils/text'
-import type { KebabToCamelCase, RemovePrefix } from 'utils/type'
-
-export function getCssVarNames<
-  T extends Record<string, unknown>,
-  Prefix extends string = '--vis-',
-> (cssVarsObject: T, prefix?: Prefix): {
-  [Property in Extract<keyof T, string> as KebabToCamelCase<RemovePrefix<Property, Prefix>>]: Property
-} {
-  const defaultPrefix = '--vis-'
-  const entries = Object.entries(cssVarsObject)
-  return Object.fromEntries(
-    entries.map(([key]) => [kebabCaseToCamel(key.replace(prefix ?? defaultPrefix, '')), key])
-  ) as {
-    [Property in Extract<keyof T, string> as KebabToCamelCase<RemovePrefix<Property, Prefix>>]: Property
-  }
-}
-
-export function injectGlobalCssVariables<T extends Record<string, string | number | undefined>> (
-  cssVarsObject: T,
-  componentRootClassName: string
-): void {
-  injectGlobal({
-    ':root': cssVarsObject,
-    [`body.theme-dark .${componentRootClassName}`]: Object.keys(cssVarsObject)
-      .filter(key => key.includes('--vis-dark'))
-      .map(key => ({
-        [key.replace('--vis-dark', '--vis')]: `var(${key})`,
-      })),
-  })
-}
-
-export function cssvar<T extends string> (name: T): `var(${T})` {
-  return `var(${name})` as `var(${T})`
-}

package/src/utils/svg.ts

@@ -1,49 +0,0 @@
-import { TransformValues } from 'types/svg'
-
-export function getTransformValues (svgElement: SVGElement): TransformValues {
-  // Get the transform attribute value from the SVG element
-  const transformAttribute = svgElement.getAttribute('transform')
-
-  // Regular expressions to extract translate and scale values from the transform attribute
-  const translateRegex = /translate\(\s*(-?[\d.]+)\s*,?\s*(-?[\d.]+)?\s*\)/
-  const scaleRegex = /scale\(\s*(-?[\d.]+)\s*,?\s*(-?[\d.]+)?\s*\)/
-
-  // Initialize default values
-  const transformValues: TransformValues = {
-    translate: { x: 0, y: 0 },
-    scale: { x: 1, y: 1 },
-  }
-
-  if (transformAttribute) {
-    // Extract translate values
-    const translateMatches = transformAttribute.match(translateRegex)
-    if (translateMatches) {
-      transformValues.translate.x = parseFloat(translateMatches[1])
-      transformValues.translate.y = translateMatches[2] ? parseFloat(translateMatches[2]) : 0
-    }
-
-    // Extract scale values
-    const scaleMatches = transformAttribute.match(scaleRegex)
-    if (scaleMatches) {
-      transformValues.scale.x = parseFloat(scaleMatches[1])
-      transformValues.scale.y = scaleMatches[2] ? parseFloat(scaleMatches[2]) : transformValues.scale.x
-    }
-  }
-
-  return transformValues
-}
-
-export function transformValuesToString (transformValues: TransformValues): string {
-  const translateString = `translate(${transformValues.translate.x} ${transformValues.translate.y})`
-
-  // Only include scaleString when both scale values are not 1
-  const shouldIncludeScaleString = transformValues.scale.x !== 1 || transformValues.scale.y !== 1
-  const scaleString = shouldIncludeScaleString ? `scale(${transformValues.scale.x} ${transformValues.scale.y})` : ''
-
-  // Combine the translate and scale strings into a single transform attribute string
-  const transformString = scaleString
-    ? `${translateString} ${scaleString}`
-    : translateString
-
-  return transformString
-}