eyy

// `.mt-10` for `margin-top: 10`, etc.
// like in bootstrap

a = { m: margin, p: padding }
b = { '': '', t: '-top', r: '-right', b: '-bottom', l: '-left' }
for x, xx in a
  for y, yy in b
    for n in 0 5 10 15 20
      .{x}{y}-{n}
        {xx}{yy}: n px

eyy

let r = 'αβσδεφγ῾ικλμνοπρστυξυζηω'.split('').reduce((o,curr,i) => {o['abcdefghiklmnoprstuxyzēō'[i]] = curr;return o}, {})
function gr(s) { return s.replace('th','θ').replace('ch','χ').replace(/./gui, a=>r[a]||a).replace(/σ /g, 'ς ') }

// replace selected
s=window.getSelection()
t=s.toString()
p=s.focusNode.parentNode;p.innerHTML=p.innerHTML.replace(t, gr(t))

eyy

export function createSetter<T extends Record<string, any>>(setState : Dispatch<SetStateAction<T>>) {
  return <K extends keyof T>(key : K, value : SetStateAction<T[K]>) => setState((prev : T) => ({
    ...prev,
    [key]: tryCall(value, prev[key])
  }));
}