Skip to content

Instantly share code, notes, and snippets.

View crutchcorn's full-sized avatar
📒
Writing like whoa

Corbin Crutchley crutchcorn

📒
Writing like whoa
View GitHub Profile
@crutchcorn
crutchcorn / regex-ignored-indexes.js
Created November 28, 2023 08:36
A method to generate ignored indexes and do partial replacement in a regex
View regex-ignored-indexes.js
// Given an input
const input = "header 123 {#custom-id}"
// Provide a tranformation of said input that keeps the same length
// IE: "Capitalizing" a title in a markdown file
const transformedInput = input.toUpperCase();
// However, we don't want to transform this regex
// IE: A custom ID
const ignored = ["{#custom-id}"]
// From this, our output should be:
@crutchcorn
crutchcorn / inference.ts
Last active September 10, 2023 22:53
known working examples of TS generics inferencing
View inference.ts
function identity<T>(arg: T): T {
return arg;
}
const val = identity(1 as const);
// ^ 1
// ---------------------- Works with classes too ---------------------------------------------
class IdentityWithMeta<T> {
View loosen.ts
/**
* ["a", "b", "c"] => ["a" | "b" | "c", "a" | "b" | "c", "a" | "b" | "c"]
*
* Assumes keys are unique
*/
export type LoosenTuple<
Arr extends readonly any[],
OriginalArr extends readonly any[] = Arr,
> = Arr extends readonly [unknown, ...infer Tail]
? readonly [OriginalArr[number], ...LoosenTuple<Tail, OriginalArr>]
View package.json
{
"name": "@mitosis.template/templating-base",
"version": "0.0.1",
"description": "",
"repository": {
"type": "git",
"url": "git+https://github.com/crutchcorn/mitosis-template.git"
},
"bugs": {
"url": "https://github.com/crutchcorn/mitosis-template/issues"
@crutchcorn
crutchcorn / app.component.html
Created June 4, 2023 16:07
Weird framework idea
View app.component.html
<button data-on-click="updateCount()">Count</button>
<p>Count: {{count.value}}</p>
<p>Double: {{double.value}}</p>
<p data-if="count.value % 2 === 0">{{count.value}} is even</p>
<p data-if="count.value % 2 !== 0">{{count.value}} is odd</p>
<Child/>
@crutchcorn
crutchcorn / setTimeoutGrossPolyfill.js
Created May 29, 2023 10:04
Eww, a JS-only setTimeout polyfill??
View setTimeoutGrossPolyfill.js
globalThis.setTimeout = (cb, num) => {
const start = Date.now();
function loop() {
return new Promise((resolve) => {
queueMicrotask(() => {
const now = Date.now();
const diff = now - start;
if (diff < num) {
loop()
@crutchcorn
crutchcorn / after.js
Created March 26, 2023 07:04
Used in a Twitter thread
View after.js
// ...
let theme = document.documentElement.className;
toggleButtonIcon(theme);
themeToggleBtn.addEventListener('click', () => {
theme = theme === 'light' ? 'dark' : 'light';
toggleButtonIcon(theme);
});
View minimal-angular-from-scratch.js
class Zone {
constructor() {
this.tasks = [];
}
// Add a new task to the zone
add(task) {
this.tasks.push(task);
}
View tabs-border-roundness.css
ul.tabs__tab-list:has(> .tabs__tab:first-child:not([aria-selected="true"]))
~ .tabs__tab-panel {
border-radius: var(--code-block-corner-radius_inner);
}
ul.tabs__tab-list:has(> .tabs__tab:first-child[aria-selected="true"])
~ .tabs__tab-panel {
border-radius: 0 var(--code-block-corner-radius_inner)
var(--code-block-corner-radius_inner);
}
@crutchcorn
crutchcorn / react-add-children-to-component
Created November 16, 2022 04:46
A TypeScipt type to add children to older React components that don't have children declared
View react-add-children-to-component
import { ComponentType, PropsWithChildren } from "react";
import { Text } from "react-native";
import { Wrapper } from "aws-amplify-react-native";
// 🪄 This is the magic
type AddChildrenToComponent<T> = T extends ComponentType<infer P>
? ComponentType<PropsWithChildren<P>>
: never;
const WrapperWithChildren = Wrapper as AddChildrenToComponent<typeof Wrapper>;