Skip to content

Instantly share code, notes, and snippets.

View forgo's full-sized avatar
🎯
Focusing

Elliott Richerson forgo

🎯
Focusing
View GitHub Profile
@forgo
forgo / generate-icons.ts
Created June 17, 2025 16:07
Generate React Icons from SVG Directory
// generate-icons.ts
/**
* generate-icons.ts
*
* Run with:
* deno run --allow-read --allow-write generate-icons.ts
*
* This version:
* - Uses @svgr/core@6.5.1?bundle so that Deno pulls in the full SVGR runtime
* - After SVGR transforms each SVG into TSX, runs Prettier (TypeScript parser)
@forgo
forgo / Downloader.jsx
Created February 3, 2020 20:24
React Downloader Component
import React from 'react'
const Method = {
GET: "GET",
HEAD: "HEAD",
POST: "POST"
}
const ReadyState = {
UNSENT: 0,
@forgo
forgo / FocusProxy.jsx
Created November 14, 2019 18:17
Focus Proxy Work That I Don't want to Lose
import React, {useRef, useState, useEffect} from 'react'
import {Key} from '../../../utils/keyboardUtils'
export const useTab = () => {
const [ reverse, setReverse ] = useState(null)
useEffect(() => {
const handleKeyDown = e => {
let key = e.which || e.keyCode
if (key === Key.TAB && e.shiftKey) {
setReverse(true)
@forgo
forgo / Interactive.jsx
Created January 24, 2019 02:29
Wrapper React component, allowing for more complex interaction-based styles "out-of-the props", so to speak.
import React from 'react'
export const Key = {
TAB: 9,
ENTER: 13,
SPACE: 32,
END: 35,
HOME: 36,
LEFT: 37,
UP: 38,
@forgo
forgo / mochaTestConfig.js
Created October 19, 2018 16:47
Mocha test config helper.
// other good ref:
// https://medium.com/@kayodeniyi/setting-up-tests-for-react-using-mocha-expect-and-enzyme-8f53af96fe7e
// example call:
// mocha --reporter spec mochaTestSetup.js "components/*.spec.js"
const jsdom = require('jsdom').jsdom
process.env.NODE_ENV = 'test'
// -------------------------------
@forgo
forgo / .babelrc
Created October 19, 2018 16:42
React default and test babel configurations using stage-2 preset
{
"presets": [
[ "env", { "modules": false } ],
"react",
"stage-2"
],
"env": {
"test": {
"presets": [
[ "env", { "targets": {"node": "current"} } ],
@forgo
forgo / jest.config.js
Last active October 19, 2018 16:24
allows imports in jest tests to not be confused by webpack imports of non-javascript files
// HOW TO:
// jest --config jest.config.js
// -- assetsTransformer.js --
// const path = require('path');
// module.exports = {
// process(src, filename, config, options) {
// return 'module.exports = ' + JSON.stringify(path.basename(filename)) + ';';
// },
// };
@forgo
forgo / JestHelpers.js
Last active October 19, 2018 02:33
convenience custom Jest matcher API for React components properties changing on events
// EXAMPLE USE CASE:
// ----------------
// Button.test.js
// import React from 'react'
// import Button from '../../src/common/input/Button'
// import renderer from 'react-test-renderer'
// import '../JestHelpers'
//
// describe('<Button/>', () => {
// test('background style changes on mouse over/out events', () => {
@forgo
forgo / FocusManager.jsx
Last active May 29, 2022 14:42
Handle composite focus and blur events in React.
import React from 'react'
import ReactDOM from 'react-dom'
import { Key } from '../utils/keyboardUtils'
export default class FocusManager extends React.Component {
constructor(props) {
super(props)
this._immediateID = null
this.state = {
@forgo
forgo / mapStructure.groovy
Created September 28, 2018 18:39
Debug Groovy Map Key Hierarchy
def mapStructure(Map map, int layer = 0) {
map.each { key, value ->
println "${('\t' * layer) + key}: ${layer.toString()}"
if(value.getClass() == LinkedHashMap.class) {
mapStructure((Map)value, layer+1)
}
}
}
// Example usage: