loilo

// useElementBreakpoints is a Vue 3 composable that matches an element's width (or height) against a set of predefined breakpoints
// It needs @vueuse/core to be installed and uses an equivalent breakpoints input as well as an equivalent returned API

import { computed, Ref } from 'vue'
import { useElementSize, MaybeElementRef } from '@vueuse/core'

export type Breakpoints<K extends string = string> = Record<K, number>
export type ElementBreakpointsOptions = { dimension: 'width' | 'height' }

/**

loilo

import { readonly, ref, watch } from 'vue'
import { useMutationObserver } from '@vueuse/core'

export function useQuerySelector(selector, { root = document } = {}) {
  selector = ref(selector)
  root = ref(root)

  const result = ref(null)

  // Find first matching element inside a root element

loilo

function serializeConsoleLog(...args) {
  let result = []

  // Format if first argument is a string
  if (typeof args[0] === 'string') {
    let formattedMessage = args.shift().replace(/%[csdifoO]/g, (match) => {
      // Keep raw token if no substitution args left
      if (args.length === 0) return match

      switch (match) {

loilo

# Shorten a path in PowerShell by omitting segments from the beginning.
# Parameter defaults are designed to be used in a prompt.
# Requires at least PowerShell Core 7.

function shorten-path {
  <#
  .SYNOPSIS
  Shortens a path from the end.

  .DESCRIPTION

loilo

// Some utilities for detecting the caret position inside a contenteditable element

/**
 * Get the number of characters in an element
 *
 * @param {Element} element
 * @return {number}
 */
function getTextLength(element) {
  let range = element.ownerDocument.createRange()

loilo

Unwrap Component for Vue 2 and Vue 3

> [Here's a demo](https://sfc.vuejs.org/#eyJBcHAudnVlIjoiPHNjcmlwdCBzZXR1cD5cbmltcG9ydCBVbndyYXAgZnJvbSAnLi9VbndyYXAuanMnXG5pbXBvcnQgeyByZWYgfSBmcm9tICd2dWUnXG5cbmxldCBzaW5nbGVMaXN0ID0gcmVmKGZhbHNlKVxuPC9zY3JpcHQ+XG5cbjx0ZW1wbGF0ZT5cbiAgPGRpdj5cbiAgICA8bGFiZWw+XG4gICAgICA8aW5wdXQgdHlwZT1cImNoZWNrYm94XCIgdi1tb2RlbD1cInNpbmdsZUxpc3RcIiAvPlxuICAgICAgU2luZ2xlIGxpc3RcbiAgICA8L2xhYmVsPlxuXG4gICAgPFVud3JhcCA6aWY9XCIhc2luZ2xlTGlzdFwiPlxuICAgICAgPHVsPlxuICAgICAgICA8VW53cmFwIDppZj1cInNpbmdsZUxpc3RcIj5cbiAgICAgICAgICA8dWw+XG4gICAgICAgICAgICA8bGk+MTwvbGk+XG4gICAgICAgICAgICA8bGk+MjwvbGk+XG4gICAgICAgICAgICA8bGk+MzwvbGk+XG4gICAgICAgICAgPC91bD5cbiAgICAgICAgICA8dWw+XG4gICAgICAgICAgICA8bGk+NDwvbGk+XG4gICAgICAgICAgICA8bGk+NTwvbGk+XG4gICAgICAgICAgICA8bGk+NjwvbGk+XG4gICAgICAgICAgPC91bD5cbiAgICAgICAgPC9VbndyYXA+XG4gICAgICA8L3VsPlxuICAgIDwvVW53cmFwPlxuICA8L2Rpdj5cbjwvdGVtcGxhdGU+IiwiaW1wb3J0LW1hcC5qc29uIjoie1xuICBcImltcG9ydHNcIjoge1xuICAgIFwidnVlXCI6IFwiaHR0cHM6Ly9zZmMudnVlanMub3JnL3Z1ZS5ydW5

loilo

<?php

/**
 * Parse a filesize to its number of bytes
 *
 * @param string|int|float $input
 * @param int $base
 * @return int
 *
 * @see https://github.com/patrickkettner/filesize-parser, the original JavaScript implementation of this function

loilo

/**
 * Convert a bitmask to an array of its individual bits
 *
 * @param {number} bitmask The bitmask to dissect
 * @return {number[]}
 *
 * @example
 * assert.equal(bitmaskToArray(0b101), [0b100, 0b001])
 */
export function bitmaskToArray(bitmask) {

loilo

import { useEffect, useState } from 'react'

/**
 * React hook which provides the size of the terminal, based on https://usehooks.com/useWindowSize/
 * Great for usage with Ink (https://npmjs.com/package/ink)
 */
export function useTerminalSize() {
  const [terminalSize, setTerminalSize] = useState([
    process.stdout.columns,
    process.stdout.rows

loilo

Async Computed Values for Vue 3

This gist provides a useAsyncComputed function which allows to create asynchronous dependencies on reactive values (using Vue 3's Composition API).

Requires at least Vue 3.0 and TypeScript 4.0.

Usage

Basic Usage