everdimension

/**
 * Usage:
 * <Input customValidity="your validation message" /> // add constraint
 * or
 * <Input customValidity="" /> // remove constraint
 * or
 * <Input defaultCustomValidity="you message" /> // initial validationMessage
 */
export function Input({
  defaultCustomValidity,

everdimension

import { useId } from 'react';

function Example() {
  const id = useId();

  return (
    <div style={{ position: 'relative' }}>
      <button
        // @ts-ignore TODO: Update to [email protected] (currently tested on ^18.2.0)
        popovertarget={id}

everdimension

# Editor files #
################
.vim
.vscode
.idea

# Compiled source #
###################
*.com
*.class

everdimension

Python setup flow

This should setup python environment on Ubuntu 20 (Ubuntu 20.04.6 LTS)

Install pip

Instructions: https://pip.pypa.io/en/stable/installation/#get-pip-py

1. Download get-pip.py file:

   wget https://bootstrap.pypa.io/get-pip.py

2. Install distutils:

everdimension

Reverse Domain Notation

The Reverse-DNS convention implies that the value should start with a reversed DNS domain name controlled by the author of the applicatoin.
The domain name should be followed by a subdomain or a product name. Example: com.example.MyProductName.

References:

• https://developer.apple.com/library/archive/documentation/FileManagement/Conceptual/understanding_utis/understand_utis_conc/understand_utis_conc.html#//apple_ref/doc/uid/TP40001319-CH202-CHDHIJDE
• https://specifications.freedesktop.org/desktop-entry-spec/latest/ar01s02.html

everdimension

/**
 * As of writing, Promise.any is Stage 4 (Finished)
 * This code is just a fun reminder of how Promise.any can be implemented using Promise.all
 * Proposal: https://github.com/tc39/proposal-promise-any
 */

class AggregateErrorFallback extends Error {
  errors: Array<Error>;
  constructor(message: string, errors: Array<Error>) {
    super(message);

everdimension

function JsSpinner() {
  const ref = useRef<HTMLDivElement | null>(null);
  useEffect(() => {
    let deg = 0;
    let id = 0;
    function rotate() {
      id = requestAnimationFrame(() => {
        ref.current.style.transform = `rotate(${(deg += 2) % 360}deg)`;
        rotate();
      });

everdimension

// just a reminder of a nice API for a <Script /> component,
// reference: https://nextjs.org/docs/basic-features/script#executing-code-after-mounting-onready

import { useRef } from 'react'
import Script from 'next/script'

export function Home() {
  const mapRef = useRef()
  return (
    <>

everdimension

import { useEffect, useMemo } from 'react';
import debounce from 'lodash/debounce';

export function useDebouncedCallback(
  callback: (...args: any) => any,
  delay: number,
) {
  const debouncedCallback = useMemo(
    () => debounce(callback, delay),
    [callback, delay],

everdimension

import { useCallback, useState } from 'react';
import { useQuery } from 'react-query';
import type {
  QueryKey,
  QueryFunction,
  UseQueryOptions,
  UseQueryResult,
} from 'react-query';

/**