Skip to content

Instantly share code, notes, and snippets.

View souporserious's full-sized avatar

Travis Arnold souporserious

View GitHub Profile
@ggoodman
ggoodman / develop.js
Created November 22, 2020 02:37
Bare-bones nodemon + esbuild hybrid for hot-reloading a process
//@ts-check
'use strict';
const ChildProcess = require('child_process');
const Events = require('events');
const Path = require('path');
const { watch } = require('chokidar');
const { startService } = require('esbuild');
const Pino = require('pino');
@millsp
millsp / path.ts
Last active July 10, 2022 06:45
Dotted paths with ts-toolbelt
import {
A,
F,
B,
O,
I,
} from 'ts-toolbelt';
type OnlyUserKeys<O> =
O extends L.List
@steveruizok
steveruizok / distributeEvenly.ts
Last active November 23, 2020 19:01
A function to distribute boxes evenly along either the x or y axis.
function distributeEvenly<
T extends { x: number; y: number; height: number; width: number }
>(axis: "x" | "y", boxes: T[]) {
const mboxes = [...boxes]
const extent = axis === "x" ? "width" : "height"
mboxes.sort((a, b) => a[axis] - b[axis])
// Overall boxes span
const last = mboxes[mboxes.length - 1]
const dist = last[axis] + last[extent] - mboxes[0][axis]
@lelandrichardson
lelandrichardson / Recoil.kt
Created August 28, 2020 14:52
Recoil vs Compose
var text by mutableStateOf("")
val charCount: Int get() = text.length
val todoList = mutableStateListOf<Item>(emptyList())
val filteredTodoList get() = when (todoListFilter) {
Filter.Completed -> todoList.filter { it.isComplete }
Filter.Uncompleted -> todoList.filter { !it.isComplete }
Filter.All -> todoList
}
@Composable fun Example() {
import SwiftUI
import PlaygroundSupport
struct AppleTV: View {
var body: some View {
ZStack {
// Image(uiImage: #imageLiteral(resourceName: "IMG_6281.JPG"))
// .resizable()
// .aspectRatio(contentMode: .fill)
Color.gray
@jthoms1
jthoms1 / styles.d.ts
Created July 21, 2020 03:01
Much better way of using tokens in Styled Components
import { ThemeType } from 'some/path/to/my/tokens';
import 'styled-components';
declare module 'styled-components' {
export interface DefaultTheme extends ThemeType {}
}
@kamranayub
kamranayub / next.config.js
Last active September 20, 2023 20:45
React Production Profiling Support for Next.js
//
// See: https://kentcdodds.com/blog/profile-a-react-app-for-performance#build-and-measure-the-production-app
// See: https://nextjs.org/docs/api-reference/next.config.js/custom-webpack-config
const TerserPlugin = require('next/dist/compiled/terser-webpack-plugin');
module.exports = {
webpack: (config, options) => {
//
// Use profiler-enabled React builds
import React from 'react';
export type Breakpoints = {
[key: string]: number;
};
export type MediaQueries<BP extends Breakpoints, T> = {
[key in keyof BP]: T;
};
@chaance
chaance / emotion.d.ts
Last active May 5, 2020 15:59
Overriding the default theme types in Emotion 11
// this goes in you root types directory, filename is the [name-of-your-module].d.ts
import '@emotion/react';
import { MyCustomTheme } from './theme';
declare module '@emotion/react' {
export interface Theme extends MyCustomTheme {}
}
const focusableSelectors = [
'a[href]:not([tabindex^="-"]):not([inert])',
'area[href]:not([tabindex^="-"]):not([inert])',
'input:not([disabled]):not([inert])',
'select:not([disabled]):not([inert])',
'textarea:not([disabled]):not([inert])',
'button:not([disabled]):not([inert])',
'iframe:not([tabindex^="-"]):not([inert])',
'audio:not([tabindex^="-"]):not([inert])',
'video:not([tabindex^="-"]):not([inert])',