View app.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<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/> |
View setTimeoutGrossPolyfill.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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() |
View after.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// ... | |
let theme = document.documentElement.className; | |
toggleButtonIcon(theme); | |
themeToggleBtn.addEventListener('click', () => { | |
theme = theme === 'light' ? 'dark' : 'light'; | |
toggleButtonIcon(theme); | |
}); |
View minimal-angular-from-scratch.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
class Zone { | |
constructor() { | |
this.tasks = []; | |
} | |
// Add a new task to the zone | |
add(task) { | |
this.tasks.push(task); | |
} |
View tabs-border-roundness.css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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); | |
} |
View react-add-children-to-component
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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>; |
View fill-route.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// OK | |
const firstRoute = ":test"; // Or ":test/" or "/:test" or "other/:test", etc | |
fillRoute(firstRoute, { | |
test: "hello", | |
}); | |
// Type error - not enough params | |
const secondRoute = ":test/:other"; | |
fillRoute(secondRoute, { | |
test: "hello", |
View 1-window-hook.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const useWindowSize = () => { | |
// This doesn't handle resizes or SSR, only used for demos | |
const [height, setHeight] = useState(window.innerHeight); | |
const [width, setWidth] = useState(window.innerWidth); | |
return {height, width}; | |
} |
View toggle-theme-after.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
let theme = document.documentElement.className; | |
toggleButton(theme); | |
themeToggleBtn.addEventListener('click', () => { | |
theme = currentTheme === 'light' ? 'dark' : 'light'; | |
toggleButton(theme); | |
localStorage.setItem(COLOR_MODE_STORAGE_KEY, theme) | |
}) |
NewerOlder