Skip to content

Instantly share code, notes, and snippets.

Avatar

Renoir Boulanger renoirb

View GitHub Profile
@renoirb
renoirb / components.ts
Created Nov 5, 2021
Lit.Dev with @lit-labs/context
View components.ts
import { LitElement, html, TemplateResult } from 'lit'
import { property } from 'lit/decorators/property.js'
import { state } from 'lit/decorators/state.js'
import { assert } from '@esm-bundle/chai'
import { ContextProvider, createContext } from '../context.js'
import { ContextConsumer } from '../lib/controllers/context-consumer.js'
@renoirb
renoirb / svg-loader.ts
Created Sep 27, 2021
Vite Lit.dev SVG loader
View svg-loader.ts
import { html } from 'lit'
import { unsafeSVG } from 'lit/directives/unsafe-svg.js'
import { dirname } from 'path'
import { readFile } from 'fs/promises'
import { Plugin } from 'vite'
import { URL } from 'url' // in Browser, the URL in native accessible on window
export const svgLoader = (): Plugin => {
const svgRegex = /\.svg(\?(raw|url|component))?$/
@renoirb
renoirb / 0README.md
Created Aug 16, 2021
Jenkinsfile when using RushJS.io and releasing only on CI
View 0README.md

Example of a Jenkinsfile when publish on Nexus and use with RushJS.io

@renoirb
renoirb / 0README.md
Last active Aug 25, 2021
Context API WebComponent state communication protocol prototype w/ Lit.dev
View 0README.md
@renoirb
renoirb / 0README.md
Last active Jul 15, 2021
DOM Coercion helpers
View 0README.md

DOM Cœrcion utils

Utilities to drill down and manipulate back to the DOM

@renoirb
renoirb / 0README.md
Created Jul 15, 2021
Stateful purgatory
View 0README.md

Stateful purgatory

Keep track of strings or numbers, and tell me whenever they are no longer needed.

Make something we want to keep track of to be self-purging. i.e. keep track of keys, by telling you've used them, if after a time isn't used, fill a list

Based on debounce-with-map.

@renoirb
renoirb / 0README_Input_Checkbox_Event.md
Last active Jun 10, 2021
Input and button clicking event without framework
View 0README_Input_Checkbox_Event.md

Input type checkbox activated by button

This is common pattern, a "prettier" button showing a checkbox when checked

@renoirb
renoirb / 0POOR_MAN_REACTIVITY.md
Last active Jun 5, 2021
Poor man's "reactivity" state mutation management
View 0POOR_MAN_REACTIVITY.md

Poor man's "reactivity" state manager

Instead of using RxJS we could have a state manager that knows how to handle all state transitions.

@renoirb
renoirb / .gitignore
Last active Apr 30, 2021
WeakMap and Class private fields transpiled for different runtimes
View .gitignore
node_modules/
dist/
package-lock.json