Skip to content

Instantly share code, notes, and snippets.

View dliebner's full-sized avatar
💭
mErGiNg

Daniel Liebner dliebner

💭
mErGiNg
View GitHub Profile
@dliebner
dliebner / ExtendedLitElement.js
Last active December 5, 2023 04:48
LitElement.ready( requireEntireDomTreeReady = false )
class ExtendedLitElement extends LitElement {
static getDuckTypedDescendants(parent, qualifyingPropertyName, stopTraversalOnMatch = true) {
const descendants = [];
/**
* Use a depth-first search (DFS) algorithm to traverse the DOM tree
* @param {Node} node
*/
@dliebner
dliebner / SignalWatcher.ts
Created November 10, 2023 16:56
preact signal reactivity mixin for Lit elements
/** Credit to @justinfagnani for the original implementation */
import type {ReactiveElement} from 'lit';
import {signal, effect} from '@preact/signals-core';
type ReactiveElementConstructor = new (...args: any[]) => ReactiveElement;
export function SignalWatcher<T extends ReactiveElementConstructor>(
Base: T
): T {
/** Example usage */
SlAlertWrapper.create({
duration: 10000,
renderTemplate: function() {
/** @param {MouseEvent} e */
const _handleLinkClick = e => {
e.preventDefault();
/**
* Notifies ancestor of drilled property update via event
*/
class DrilledPropertyUpdateEventController {
static customEventName = 'lit-drilled-property-update';
/** @type {HTMLElement} */
host;
@dliebner
dliebner / BottomIntersectionObserverController.js
Last active August 1, 2023 11:36
An infinite scroller controller of sorts
class BottomIntersectionObserverController {
/** @type {HTMLElement} */
host;
/** @type {string} */
_bottomThreshold;
/** @type {CallableFunction} */
bottomThresholdReachedCallback;
@dliebner
dliebner / GlobalSignalProvider.js
Created December 5, 2022 08:58
GlobalSignalProvider for managing preact signals in Lit
class GSP_WrappedSignal {
constructor(initialValue) {
this.subscribers = new WeakMap();
this.preactSignal = preactSignals.signal(initialValue);
}
}