Skip to content

Instantly share code, notes, and snippets.

Avatar

Matt McCray mattmccray

  • Elucidata unLTD
  • Dallas, TX
View GitHub Profile
@mattmccray
mattmccray / css.ts
Last active Nov 28, 2021
Simple and tiny CSS in JS
View css.ts
interface IConfiguration {
append: 'each' | 'batch'
debug: boolean
appendTo: Element
replaceRegExp: RegExp
}
let _namePrefix = 'css'
let _pendingStyles: string | null = null
let _config: IConfiguration = {
View use-controller.ts
import { useEffect, useMemo, useRef } from "preact/hooks"
type PropsChangeMode = 'notify' | 'recycle' | 'smart'
interface IControllerClass<T, P> {
new(props: P): T
dispose?: () => void
propsDidChange?: (props: P) => void
}
/**
View use-promise.ts
import { useEffect, useRef, useState } from "preact/hooks"; // Or 'react'
interface PromiseResult<T> {
isResolved: boolean
value?: T
error?: any
}
export function usePromise<T>(builder: (...params: any[]) => Promise<T>, params: any[] = []): PromiseResult<T> {
@mattmccray
mattmccray / StateManager.ts
Last active May 30, 2021
Simple state manager using react and immer.
View StateManager.ts
import React from 'react'
import { Patch, produceWithPatches } from 'immer'
export interface StateManager<T = {}> {
handle<P>(signal: Signal<P>, callback: (state: T, event: P) => void): () => void
getState(): T
onStateChanged: Signal<{ state: T, changes: Patch[] }>
}
@mattmccray
mattmccray / mutt.js
Last active Jan 15, 2021
MUTT - Micro Unit Testing Tool (for browsers)
View mutt.js
// MUTT - Micro Unit Testing Tool (for browsers)
let _testDepth = 0;
export function test(name, suite) {
const title = `🐶 ${name}`;
const ctx = {
count: 0,
failed: 0
};
@mattmccray
mattmccray / ObservableUndoController.ts
Last active Sep 6, 2020
Simple Observable Undo Controller
View ObservableUndoController.ts
import { observable, computed, runInAction } from 'mobx'
import uid from './uid'
type UndoFn = () => void
type Command = () => UndoFn | Promise<UndoFn>
interface UndoContext {
id: string
label: string
command: Command
@mattmccray
mattmccray / UndoManager.ts
Last active Sep 6, 2020
Super Simple Undo Manager
View UndoManager.ts
type UndoFn = () => void
type Command = () => UndoFn | Promise<UndoFn>
interface UndoContext {
command: Command
revert: UndoFn | Promise<UndoFn>
}
export class UndoManager {
undoStack: UndoContext[] = []
@mattmccray
mattmccray / Taxonomy.js
Created Aug 12, 2020
Tilt taxonomy class
View Taxonomy.js
import _ from 'lodash'
class TagSet {
constructor({ name, slug, sortBy = 'title' }) {
/** @type {string} */
this.name = name
/** @type {string} */
this.slug = slug
/** @type {string} */
this.sortBy = sortBy
@mattmccray
mattmccray / feed.xml.tilt.js
Last active Aug 12, 2020
Tilt feed component
View feed.xml.tilt.js
import { renderMarkdown, useCollection, useFiles, usePage, useSite, xml } from "../packages/tilt/index.js";
export default function Feed(props, children) {
const site = useSite()
const posts = useCollection('posts')
const buildDate = (new Date()).toUTCString()
return xml`<?xml version="1.0" encoding="UTF-8"?>
<rss
xmlns:dc="http://purl.org/dc/elements/1.1/"
View context.js
let _stack = [{}]
export function getContext(key) {
return _stack[0][key]
}
export function setContext(key, value) {
_stack[0][key] = value
}