@operato/utils 8.0.0-beta.0 → 8.0.0-beta.1

package/src/os.ts

@@ -1,48 +0,0 @@
-/**
- * method to tell if platform of running browser is kind of touch device
- * @returns {boolean}
- */
-export function isTouchDevice() {
-  return window.matchMedia('(pointer:none), (pointer:coarse)').matches
-}
-
-/**
- * method to tell if platform of running browser is kind of mobile device
- * @returns {boolean}
- */
-export function isHandheldDevice() {
-  return window.matchMedia('(max-width: 460px)').matches
-}
-
-/**
- * method to tell if platform of running browser is kind of mobile device
- * @returns {boolean}
- */
-export function isMobileDevice() {
-  return window.matchMedia('(max-width: 767px)').matches
-}
-
-/**
- * method to tell if operating system of running browser is iOS
- * @returns {boolean}
- */
-export function isIOS() {
-  //@ts-ignore
-  return /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream
-}
-
-/**
- * method to tell if operating system of running browser is MacOS
- * @returns {boolean}
- */
-export function isMacOS() {
-  return navigator.userAgent.indexOf('Mac') !== -1
-}
-
-/**
- * method to tell if platform of running browser is Safari
- * @returns {boolean}
- */
-export function isSafari() {
-  return !navigator.userAgent.match(/chrome|chromium|crios/i) && navigator.userAgent.match(/safari/i)
-}

package/src/parse-jwt.ts

@@ -1,21 +0,0 @@
-var atob: any =
-  typeof atob !== 'undefined'
-    ? atob
-    : (base64: string) => {
-        return Buffer.from(base64, 'base64').toString()
-      }
-
-export function parseJwt(token: string): any {
-  var base64Url = token.split('.')[1]
-  var base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/')
-  var jsonPayload = decodeURIComponent(
-    atob(base64)
-      .split('')
-      .map(function (c: string) {
-        return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2)
-      })
-      .join('')
-  )
-
-  return JSON.parse(jsonPayload)
-}

package/src/password-pattern.ts

@@ -1,63 +0,0 @@
-/**
- * Generates a regular expression pattern for validating passwords based on specified criteria.
- *
- * @param {object} options - An object containing options for generating the pattern.
- * @param {boolean} options.lowerCase - Indicates whether the password should contain at least one lowercase character.
- * @param {boolean} options.upperCase - Indicates whether the password should contain at least one uppercase character.
- * @param {boolean} options.digit - Indicates whether the password should contain at least one digit.
- * @param {boolean} options.specialCharacter - Indicates whether the password should contain at least one special character.
- * @param {boolean} options.allowRepeat - Indicates whether repeated characters are allowed in the password.
- * @param {boolean} options.useTightPattern - Indicates whether to use a tight pattern for password length.
- * @param {boolean} options.useLoosePattern - Indicates whether to use a loose pattern for password length.
- * @param {number} options.tightCharacterLength - The minimum length of the password for the tight pattern.
- * @param {number} options.looseCharacterLength - The minimum length of the password for the loose pattern.
- * @returns {RegExp} - A regular expression pattern for validating passwords based on the specified criteria.
- */
-export function generatePasswordPatternRegExp({
-  lowerCase = true,
-  upperCase = true,
-  digit = true,
-  specialCharacter = true,
-  allowRepeat = false,
-  useTightPattern = true,
-  useLoosePattern = false,
-  tightCharacterLength = 8,
-  looseCharacterLength = 15
-}: {
-  lowerCase?: boolean
-  upperCase?: boolean
-  digit?: boolean
-  specialCharacter?: boolean
-  allowRepeat?: boolean
-  useTightPattern?: boolean
-  useLoosePattern?: boolean
-  tightCharacterLength?: Number
-  looseCharacterLength?: Number
-} = {}) {
-  var tightChecklist = useTightPattern
-    ? [
-        lowerCase ? '(?=.*[a-z])' : '', // has at least one lower case character
-        upperCase ? '(?=.*[A-Z])' : '', // has at least one upper case character
-        digit ? '(?=.*\\d)' : '', // has at least one digit
-        specialCharacter ? '(?=.*[!@#$%^&*()])' : '', // has at least one special character
-        !allowRepeat ? '(?!.*(.)\\1(?=\\1{1,}))' : '', // has not an repeated character more than twice
-        `.{${tightCharacterLength},}` // has a length of 8 and more
-      ]
-    : []
-
-  var looseChecklist = useLoosePattern
-    ? [
-        `.{${looseCharacterLength},}` // has a length of 15 and more
-      ]
-    : []
-
-  var checkList = [
-    '^', // from start
-    ...tightChecklist,
-    tightChecklist.length && looseChecklist.length ? '|' : '',
-    ...looseChecklist,
-    '$' //to the end"
-  ]
-
-  return new RegExp(checkList.join(''))
-}

package/src/reactive-controllers/index.ts

@@ -1 +0,0 @@
-export * from './tooltip-reactive-controller.js'

package/src/reactive-controllers/tooltip-reactive-controller.ts

@@ -1,88 +0,0 @@
-import { ReactiveController, ReactiveControllerHost } from 'lit'
-import { hasOverflow } from '../has-overflow'
-
-export class TooltipReactiveController implements ReactiveController {
-  private host: ReactiveControllerHost & HTMLElement
-  private attributeName: string
-  private content?: string | ((element: HTMLElement) => string)
-  private static tooltipContainer: HTMLElement | null = null
-
-  constructor(
-    host: ReactiveControllerHost & HTMLElement,
-    options?: {
-      content?: string | ((element: HTMLElement) => string)
-      attributeName?: string
-    }
-  ) {
-    const { attributeName, content } = options || {}
-
-    this.host = host
-    this.attributeName = attributeName || 'data-reactive-tooltip'
-    this.content = content
-
-    host.addController(this)
-
-    // Create a tooltip container element if it doesn't exist
-    if (!TooltipReactiveController.tooltipContainer) {
-      TooltipReactiveController.tooltipContainer = document.createElement('div')
-      TooltipReactiveController.tooltipContainer.className = 'ox-tooltip-container'
-      TooltipReactiveController.tooltipContainer.style.position = 'fixed'
-      TooltipReactiveController.tooltipContainer.style.pointerEvents = 'none'
-      TooltipReactiveController.tooltipContainer.style.zIndex = '1000'
-      // Set default styles using CSS variables
-      TooltipReactiveController.tooltipContainer.style.fontSize = 'var(--tooltip-font-size, 1.0em)'
-      TooltipReactiveController.tooltipContainer.style.color = 'var(--tooltip-color, #fff)'
-      TooltipReactiveController.tooltipContainer.style.backgroundColor =
-        'var(--tooltip-background-color, rgba(0, 0, 0, 0.7))'
-      TooltipReactiveController.tooltipContainer.style.padding = 'var(--tooltip-padding, 5px)'
-      TooltipReactiveController.tooltipContainer.style.borderRadius = 'var(--tooltip-border-radius, 3px)'
-      TooltipReactiveController.tooltipContainer.style.boxShadow =
-        'var(--tooltip-box-shadow, 0 2px 10px rgba(0, 0, 0, 0.2))'
-      TooltipReactiveController.tooltipContainer.style.maxWidth = 'var(--tooltip-max-width, 300px)'
-      TooltipReactiveController.tooltipContainer.style.wordWrap = 'break-word'
-      TooltipReactiveController.tooltipContainer.style.whiteSpace = 'pre-wrap'
-      TooltipReactiveController.tooltipContainer.style.overflow = 'hidden'
-      document.body.appendChild(TooltipReactiveController.tooltipContainer)
-    }
-  }
-
-  hostConnected() {
-    const target = this.host.shadowRoot ?? this.host
-    target.addEventListener('mouseover', this.handleMouseOver)
-    target.addEventListener('mouseout', this.handleMouseOut)
-  }
-
-  hostDisconnected() {
-    const target = this.host.shadowRoot ?? this.host
-    target.removeEventListener('mouseover', this.handleMouseOver)
-    target.removeEventListener('mouseout', this.handleMouseOut)
-  }
-
-  private handleMouseOver = (e: Event) => {
-    const element = e.target as HTMLElement
-    if (element.hasAttribute(this.attributeName) && hasOverflow(element)) {
-      const tooltipContent =
-        typeof this.content === 'function'
-          ? this.content.call(this, element)
-          : this.content || element.textContent?.trim() || ''
-
-      const rect = element.getBoundingClientRect()
-
-      // Calculate the fixed position
-      const fixedTop = rect.top + rect.height
-      const fixedLeft = rect.left
-
-      // Set tooltip container position and content
-      TooltipReactiveController.tooltipContainer!.style.top = `${fixedTop}px`
-      TooltipReactiveController.tooltipContainer!.style.left = `${fixedLeft}px`
-      TooltipReactiveController.tooltipContainer!.style.display = 'block'
-      TooltipReactiveController.tooltipContainer!.textContent = tooltipContent
-    }
-  }
-
-  private handleMouseOut = (e: Event) => {
-    if (TooltipReactiveController.tooltipContainer) {
-      TooltipReactiveController.tooltipContainer.style.display = 'none'
-    }
-  }
-}

package/src/sleep.ts

@@ -1,10 +0,0 @@
-/**
- * async method to implement sleep
- * @param {number} ms milli-seconds to sleep
- * @example
- * await sleep(1000) // pending for 1 second
- */
-
-export function sleep(ms: number) {
-  return new Promise(resolve => setTimeout(resolve, ms))
-}

package/src/stringify-bignum.ts

@@ -1,35 +0,0 @@
-/**
- * Converts a large number into a human-readable string representation with SI unit prefixes (K, M, B, T, P, E).
- *
- * This function takes a large number as input and converts it into a human-readable string representation using SI unit prefixes
- * (K for thousand, M for million, B for billion, T for trillion, P for quadrillion, E for quintillion, etc.).
- * It checks the magnitude of the input number and selects the appropriate SI unit,
- * then formats the number with two decimal places and appends the corresponding SI unit symbol to create the readable string.
- *
- * @param {number} n - The number to be converted.
- * @returns {string} - A human-readable string representation of the number with SI unit prefixes.
- */
-
-export function stringifyBigNumber(n: number) {
-  if (n < 1000) {
-    return n
-  }
-
-  var si = [
-    { v: 1e3, s: 'K' },
-    { v: 1e6, s: 'M' },
-    { v: 1e9, s: 'B' },
-    { v: 1e12, s: 'T' },
-    { v: 1e15, s: 'P' },
-    { v: 1e18, s: 'E' }
-  ]
-
-  var index
-  for (index = si.length - 1; index > 0; index--) {
-    if (n >= si[index].v) {
-      break
-    }
-  }
-
-  return (n / si[index].v).toFixed(2).replace(/\.0+$|(\.[0-9]*[1-9])0+$/, '$1') + si[index].s
-}

package/src/swipe-listener.ts

@@ -1,290 +0,0 @@
-/**
- * Starts monitoring swipes on the given element and
- * emits `swipe` event when a swipe gesture is performed.
- * @param {DOMElement} element Element on which to listen for swipe gestures.
- * @param {Object} options Optional: Options.
- * @return {Object}
- */
-export function SwipeListener(element: HTMLElement, options?: any) {
-  if (!element) return
-
-  // CustomEvent polyfill
-  if (typeof window !== 'undefined') {
-    ;(function () {
-      if (typeof window.CustomEvent === 'function') return false
-      function CustomEvent(event: string, params: any) {
-        params = params || { bubbles: false, cancelable: false, detail: undefined }
-        var evt = document.createEvent('CustomEvent')
-        evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail)
-        return evt
-      }
-      CustomEvent.prototype = window.Event.prototype
-      ;(window as any).CustomEvent = CustomEvent
-    })()
-  }
-
-  let defaultOpts = {
-    minHorizontal: 10, // Minimum number of pixels traveled to count as a horizontal swipe.
-    minVertical: 10, // Minimum number of pixels traveled to count as a vertical swipe.
-    deltaHorizontal: 3, // Delta for horizontal swipe
-    deltaVertical: 5, // Delta for vertical swipe
-    preventScroll: false, // Prevents scrolling when swiping.
-    lockAxis: true, // Select only one axis to be true instead of multiple.
-    touch: true, // Listen for touch events
-    mouse: true // Listen for mouse events
-  }
-
-  // Set options
-  if (!options) {
-    options = {}
-  }
-  options = {
-    ...defaultOpts,
-    ...options
-  }
-
-  // Store the touches
-  let touches: Array<{ x: number; y: number }> = []
-
-  // Not dragging by default.
-  let dragging = false
-
-  // When mouse-click is started, make dragging true.
-  const _mousedown = function (e: MouseEvent) {
-    dragging = true
-  }
-
-  // When mouse-click is released, make dragging false and signify end by imitating `touchend`.
-  const _mouseup = function (e: MouseEvent) {
-    dragging = false
-    _touchend(e as any)
-  }
-
-  // When mouse is moved while being clicked, imitate a `touchmove`.
-  const _mousemove = function (e: MouseEvent) {
-    if (dragging) {
-      ;(e as any).changedTouches = [
-        {
-          clientX: e.clientX,
-          clientY: e.clientY
-        }
-      ]
-      _touchmove(e as any)
-    }
-  }
-
-  if (options.mouse) {
-    element.addEventListener('mousedown', _mousedown)
-    element.addEventListener('mouseup', _mouseup)
-    element.addEventListener('mousemove', _mousemove)
-  }
-
-  // When the swipe is completed, calculate the direction.
-  const _touchend = function (e: TouchEvent) {
-    if (!touches.length) return
-
-    const touch = typeof TouchEvent === 'function' && e instanceof TouchEvent
-
-    let x = [],
-      y = []
-
-    let directions = {
-      top: false,
-      right: false,
-      bottom: false,
-      left: false
-    }
-
-    for (let i = 0; i < touches.length; i++) {
-      x.push(touches[i].x)
-      y.push(touches[i].y)
-    }
-
-    const xs = x[0],
-      xe = x[x.length - 1], // Start and end x-coords
-      ys = y[0],
-      ye = y[y.length - 1] // Start and end y-coords
-
-    const eventCoords = {
-      x: [xs, xe],
-      y: [ys, ye]
-    }
-
-    if (touches.length > 1) {
-      const swipeReleaseEventData = {
-        detail: {
-          touch,
-          target: e.target,
-          ...eventCoords
-        }
-      }
-
-      let swipeReleaseEvent = new CustomEvent('swiperelease', swipeReleaseEventData)
-      element.dispatchEvent(swipeReleaseEvent)
-    }
-
-    // Determine left or right
-    let diff = x[0] - x[x.length - 1]
-    let swipe = 'none'
-    if (diff > 0) {
-      swipe = 'left'
-    } else {
-      swipe = 'right'
-    }
-
-    let min = Math.min(...x),
-      max = Math.max(...x),
-      _diff
-
-    // If minimum horizontal distance was travelled
-    if (Math.abs(diff) >= options.minHorizontal) {
-      switch (swipe) {
-        case 'left':
-          _diff = Math.abs(min - x[x.length - 1])
-          if (_diff <= options.deltaHorizontal) {
-            directions.left = true
-          }
-          break
-        case 'right':
-          _diff = Math.abs(max - x[x.length - 1])
-          if (_diff <= options.deltaHorizontal) {
-            directions.right = true
-          }
-          break
-      }
-    }
-
-    // Determine top or bottom
-    diff = y[0] - y[y.length - 1]
-    swipe = 'none'
-    if (diff > 0) {
-      swipe = 'top'
-    } else {
-      swipe = 'bottom'
-    }
-
-    min = Math.min(...y)
-    max = Math.max(...y)
-
-    // If minimum vertical distance was travelled
-    if (Math.abs(diff) >= options.minVertical) {
-      switch (swipe) {
-        case 'top':
-          _diff = Math.abs(min - y[y.length - 1])
-          if (_diff <= options.deltaVertical) {
-            directions.top = true
-          }
-          break
-        case 'bottom':
-          _diff = Math.abs(max - y[y.length - 1])
-          if (_diff <= options.deltaVertical) {
-            directions.bottom = true
-          }
-          break
-      }
-    }
-
-    // Clear touches array.
-    touches = []
-
-    // If there is a swipe direction, emit an event.
-    if (directions.top || directions.right || directions.bottom || directions.left) {
-      /**
-       * If lockAxis is true, determine which axis to select.
-       * The axis with the most travel is selected.
-       * TODO: Factor in for the orientation of the device
-       * and use it as a weight to determine the travel along an axis.
-       */
-      if (options.lockAxis) {
-        if ((directions.left || directions.right) && Math.abs(xs - xe) > Math.abs(ys - ye)) {
-          directions.top = directions.bottom = false
-        } else if ((directions.top || directions.bottom) && Math.abs(xs - xe) < Math.abs(ys - ye)) {
-          directions.left = directions.right = false
-        }
-      }
-
-      const eventData = {
-        detail: {
-          directions,
-          touch,
-          target: e.target,
-          ...eventCoords
-        }
-      }
-
-      let event = new CustomEvent('swipe', eventData)
-      element.dispatchEvent(event)
-    } else {
-      let cancelEvent = new CustomEvent('swipecancel', {
-        detail: {
-          touch,
-          target: e.target,
-          ...eventCoords
-        }
-      })
-      element.dispatchEvent(cancelEvent)
-    }
-  }
-
-  // When a swipe is performed, store the coords.
-  const _touchmove = function (e: TouchEvent) {
-    let touch = e.changedTouches[0]
-    touches.push({
-      x: touch.clientX,
-      y: touch.clientY
-    })
-
-    // Emit a `swiping` event if there are more than one touch-points.
-    if (touches.length > 1) {
-      const xs = touches[0].x, // Start and end x-coords
-        xe = touches[touches.length - 1].x,
-        ys = touches[0].y, // Start and end y-coords
-        ye = touches[touches.length - 1].y,
-        eventData = {
-          detail: {
-            x: [xs, xe],
-            y: [ys, ye],
-            touch: typeof TouchEvent === 'function' && e instanceof TouchEvent,
-            target: e.target
-          }
-        }
-      let event = new CustomEvent('swiping', eventData)
-
-      const shouldPrevent =
-        options.preventScroll === true || (typeof options.preventScroll === 'function' && options.preventScroll(event))
-
-      if (shouldPrevent) {
-        e.preventDefault()
-      }
-
-      element.dispatchEvent(event)
-    }
-  }
-
-  // Test via a getter in the options object to see if the passive property is accessed
-  let passiveOptions: any = false
-  try {
-    const testOptions = Object.defineProperty({}, 'passive', {
-      get: function () {
-        passiveOptions = { passive: !options.preventScroll }
-      }
-    })
-    window.addEventListener('testPassive', null as any, testOptions)
-    window.removeEventListener('testPassive', null as any, testOptions)
-  } catch (e) {}
-
-  if (options.touch) {
-    element.addEventListener('touchmove', _touchmove, passiveOptions)
-    element.addEventListener('touchend', _touchend)
-  }
-
-  return {
-    off: function () {
-      element.removeEventListener('touchmove', _touchmove, passiveOptions)
-      element.removeEventListener('touchend', _touchend)
-      element.removeEventListener('mousedown', _mousedown)
-      element.removeEventListener('mouseup', _mouseup)
-      element.removeEventListener('mousemove', _mousemove)
-    }
-  }
-}

package/src/timecapsule/index.ts

@@ -1,2 +0,0 @@
-export * from './timecapsule.js'
-export * from './snapshot-taker.js'

package/src/timecapsule/snapshot-taker.ts

@@ -1,105 +0,0 @@
-import { TimeCapsule } from './timecapsule'
-import debounce from 'lodash-es/debounce'
-
-/**
- * A function that takes a SnapshotTaker as an argument and initiates snapshot creation
- * using a debouncer to delay the process.
- * @param {SnapshotTaker} taker - The SnapshotTaker instance to trigger snapshots for.
- */
-var debouncer = debounce(
-  taker => {
-    if (!taker.brake) {
-      taker.take()
-    }
-  },
-  1000,
-  { leading: true, trailing: false }
-)
-
-/**
- * Function to trigger snapshot creation for a SnapshotTaker instance.
- * Checks if the taker is in a brake state or not dirty before triggering the snapshot.
- * @param {SnapshotTaker} taker - The SnapshotTaker instance to create a snapshot for.
- */
-function take_snapshot(taker: SnapshotTaker) {
-  if (taker.brake || !taker.dirty) return
-  debouncer(taker)
-}
-
-/**
- * Type definition for holding state information.
- * @typedef {Object} StateHolder
- * @property {*} state - The state to be held.
- */
-export type StateHolder = {
-  state: any
-}
-
-/**
- * Class responsible for taking and managing snapshots of state.
- */
-export class SnapshotTaker {
-  private _brake: boolean = false
-
-  dirty: boolean = false
-
-  state_holder?: StateHolder
-  timecapsule?: TimeCapsule
-
-  /**
-   * Creates an instance of SnapshotTaker.
-   * @param {*} state_holder - The object that holds the state to be snapshot.
-   * @param {TimeCapsule} timecapsule - The TimeCapsule instance associated with this SnapshotTaker.
-   */
-  constructor(state_holder: any, timecapsule: TimeCapsule) {
-    this.state_holder = state_holder
-    this.timecapsule = timecapsule
-    this.timecapsule.snapshot_taker = this
-  }
-
-  /**
-   * Disposes of the SnapshotTaker and clears associated references.
-   */
-  dispose() {
-    delete this.state_holder
-    delete this.timecapsule
-  }
-
-  /**
-   * Marks the SnapshotTaker as dirty and initiates snapshot creation.
-   */
-  touch() {
-    this.dirty = true
-    take_snapshot(this)
-  }
-
-  /* 모든 조건에 관계없이 현재 상태를 snapshot으로 취한다. */
-  /**
-   * Takes a snapshot of the current state.
-   * @param {boolean} [force=false] - If true, the snapshot is taken even if not dirty.
-   */
-  take(force: boolean = false) {
-    if (this.dirty || force) {
-      this.timecapsule?.snapshot(this.state_holder?.state)
-      this.dirty = false
-    }
-  }
-
-  /**
-   * Gets the brake state of the SnapshotTaker.
-   * @returns {boolean} - true if the brake is active, false otherwise.
-   */
-  get brake() {
-    return this._brake
-  }
-
-  /* 마우스를 드래깅하는 동안, 보통 brake 를 ON 시킨다. */
-  /**
-   * Sets the brake state of the SnapshotTaker and initiates snapshot creation.
-   * @param {boolean} brake - The new brake state.
-   */
-  set brake(brake) {
-    this._brake = !!brake
-    take_snapshot(this)
-  }
-}