SirPepe

Grundgesetz für Web Components
------------------------------

§ 1 Web Components sind HTML-Elemente und müssen sich wie HTML-Elemente verhalten. Sie sind kein 1:1-Ersatz für andere Komponenten-Konzepte, sondern universelle, einfach zu benutzende Erweiterungen des HTML-Vokabulars. Ihre Attribute und APIs müssen so konzipiert sein, das sie HTML-Autoren nicht überraschen. Das stellt sicher, dass Web Components universelle Plugins sind, die in jedem Browser und Framework gut funktionieren. Insbesonders zu beachten ist:

  § 1.1 Web Components müssen einen nützlichen Use Case anbieten, der allein mit HTML-Mitteln umgesetzt werden kann. JavaScript-APIs können den Funktionionsumfang einer Web Component beliebig erweitern, dürfen aber nicht zur Pflicht werden (vgl. <video>). Das stellt sicher, dass jeder Mensch, der ein bisschen HTML kann, Web Components nutzen kann.

  § 1.2 Web Components müssen Fail-Safe sein. Sie dürfen keine JavaScript-Exceptions werfen sondern müssen wie native HTML-Elemente mit jeder Art von 

SirPepe

import { prop, attr, bool, string, formDisabled, listen } from "@sirpepe/ornament";
export * from "@sirpepe/ornament";

const CONFIG_KEY = Symbol();

const INTERNALS_MAP = new WeakMap();

const defaultConfig = {
  getElementInternals(element) {
    let internals = INTERNALS_MAP.get(element);

SirPepe

// Set up the easing function
import BezierEasing from "bezier-easing";
const ease = BezierEasing(0.25, 0.1, 0.25, 1);

function value(from, to, step, steps) {
  return from + (to - from) * ease(step / steps);
}

// Interpolate positions of text elements
function interpolateTextPositions(fromFrame, toFrame, steps, step) {

SirPepe

import {
  subscribe,
  reactive,
  define as baseDefine,
  connected,
  debounce,
} from "@sirpepe/ornament";
import { html, htmlFor, svg, render } from "uhtml/keyed";
import { adoptStyles } from "./styles.js";