SephReed

type UnionToIntersection<U> = (
  U extends any ? (k: U) => void : never
) extends (k: infer I) => void
  ? I
  : never

type SubpropertyMerge<T> = (
  T extends object ? (
    T extends string | number | ((...args: any) => any) | symbol | boolean ? T
    : { [K in keyof T]: SubpropertyMerge<T[K]> }

SephReed

const eg = smoosh([
  { foo: {a: 1}},
  { foo: {b: 2}}
]);

eg.foo.a
eg.foo.b

// take an array of objects, do your best to smoosh them together
function smoosh(objs) {

SephReed

export function rangeLimit(num: number, min: number, max: number) {
	return Math.max(min, Math.min(num, max));
}
export function rangeWrap(num: number, circumference: number) {
	return ((num % 1) + 1) % 1;
}

const ratioR = 4;
const ratioG = 4;
const ratioB = 3;

SephReed

// Typings
export type ReportRequest<OUTLINE> = {[key in keyof OUTLINE]?: true};

export type Reporter<OUTLINE> = 
  (request: ReportRequest<OUTLINE>) => Required<Pick<OUTLINE, keyof typeof request>>;



// Example model
interface IModel {

SephReed

Here's a vanilly implementation.  Just use object keys to check that all of the props have matching values.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

    function findPropsMatch(list, target) {
      const props = Object.keys(target);
      return list.find((checkMe) => 
        !props.find((prop) => checkMe[prop] !== target[prop])

SephReed

return div("user-div", {
  // shortcut for adding/removing classnames based off state
  ddxClass: () => state.userSelected ? "--selected" : "",

  // shortcut for general purpose SDx manipulation
  ddx: (userDiv) => userDiv.tabIndex = state.userTabIndex
})

SephReed

const someDiv = div("parent-element", [
  div("some-child-element"),
  // passing a function creates a replacer
  () => div("example-rerender", state.userName),  // <--- Replacer
]);

SephReed

const replacer = new RerenderReplacer(() => {
  const uiElement = document.createElement("div");
  uiElement.innerHTML = state.userName;
  return uiElement;
});
document.body.appendChild(replacer.static());

SephReed

interface ILayered extends Array<number | ILayered> { }
function flatten(flattenMe: ILayered) {
	const flat: number[] = [];
	const permeate = (layered: ILayered) => {
		layered.forEach((item) => {
			if(Array.isArray(item)) {
				permeate(item);
			} else {
				flat.push(item);
			}