peerreynders

## 01before.html
<!doctype html>
<html lang="eng">
  <head>
    <meta charset="utf-8"/>
    <title>useCallback alternative BEFORE</title>
  </head>
  <body>
    <script type="module">
     import {
       html, render, useState, useCallback

## index.html
<!doctype html>
<html lang="eng">
  <!--
       "A progressive disclosure component"
       https://hankchizljaw.com/wrote/a-progressive-disclosure-component/

       with wickedElements

       https://github.com/WebReflection/wicked-elements

## firstResolvedByArrayOrderWins.js
function log(value) {
  console.log(value);
}

function executor(resolve, _reject) {
  const resolveValue = () => resolve('3 Resolved now');
  self.setTimeout(resolveValue, 1000);
}

const pending = new Promise(executor);

## filterMap.html
<!DOCTYPE html>
<html lang="en-us">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Filter Map</title>
  </head>
  <body>
    <script>

## DisclosureToggle.svelte
<!-- file: src/DisclosureToggle.svelte -->
<svelte:options tag={ null }/>
<script>
 import { onMount } from 'svelte';

 // prop names ("buttonLabel") aren't converted to
 // attribute names ("button-label")
 export let label = 'Toggle content';

 let trigger;

## demo.exs
# Cobbled together ("untested") demonstration code - no production value
# The intention is to flood all CPU cores with "work"
#
# Created for: https://elixirforum.com/t/finding-vampire-numbers/25098/10
#
defmodule Primes do
  require Integer

  @primes :primes
  @init_last 3

## another_handler.ex
# file: lib/em_demo/some_handler.ex
#
defmodule EmDemo.AnotherHandler do
  use GenServer

  @impl true
  def init([to_pid, token] = arg) do
    IO.puts("#{__MODULE__}: init(#{inspect(arg)})")
    {:ok, {to_pid, token}}
  end

## colorpicker_karma-test.mjs
/* file: components/wcia-color-picker/test/karma-test.mjs
   original: https://github.com/bengfarrell/webcomponentsinaction/blob/master/chapter12and13/components/colorpicker/test/karma-test.js
 */
import _dontCare from '../src/wcia-color-picker.mjs'

const makePicker = (function() {
  const pickerSize = 500
  const thumbCenterOffset = 5/2 + 3 // width/2 + left border
  const markup =`
<wcia-color-picker

## index.html
<!DOCTYPE html>
<html>
  <head lang="en">
    <!--
         file: index.html
         Web Components in Action MEAP v6
         original: https://github.com/bengfarrell/webcomponentsinaction/blob/master/chapter10/10.2-cssvariables/shadow.html

         #1
         Defining a default value in case the custom property is not defined

## biz-card.mjs
// file: components/biz-card/biz-card.mjs
import { patchContentMap } from '../../helpers/templateLoader.mjs'

/*
  #1:
  See patchContentMap call below which creates
  static get _contentMap
  static set _templateUri

  #2:
	<!doctype html>
	<html lang="eng">
	<head>
	<meta charset="utf-8"/>
	<title>useCallback alternative BEFORE</title>
	</head>
	<body>
	<script type="module">
	import {
	html, render, useState, useCallback
	<!doctype html>
	<html lang="eng">
	<!--
	"A progressive disclosure component"
	https://hankchizljaw.com/wrote/a-progressive-disclosure-component/

	with wickedElements

	https://github.com/WebReflection/wicked-elements
	function log(value) {
	console.log(value);
	}

	function executor(resolve, _reject) {
	const resolveValue = () => resolve('3 Resolved now');
	self.setTimeout(resolveValue, 1000);
	}

	const pending = new Promise(executor);
	<!DOCTYPE html>
	<html lang="en-us">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>Filter Map</title>
	</head>
	<body>
	<script>
	<!-- file: src/DisclosureToggle.svelte -->
	<svelte:options tag={ null }/>
	<script>
	import { onMount } from 'svelte';

	// prop names ("buttonLabel") aren't converted to
	// attribute names ("button-label")
	export let label = 'Toggle content';

	let trigger;
	# Cobbled together ("untested") demonstration code - no production value
	# The intention is to flood all CPU cores with "work"
	#
	# Created for: https://elixirforum.com/t/finding-vampire-numbers/25098/10
	#
	defmodule Primes do
	require Integer

	@primes :primes
	@init_last 3
	# file: lib/em_demo/some_handler.ex
	#
	defmodule EmDemo.AnotherHandler do
	use GenServer

	@impl true
	def init([to_pid, token] = arg) do
	IO.puts("#{__MODULE__}: init(#{inspect(arg)})")
	{:ok, {to_pid, token}}
	end
	/* file: components/wcia-color-picker/test/karma-test.mjs
	original: https://github.com/bengfarrell/webcomponentsinaction/blob/master/chapter12and13/components/colorpicker/test/karma-test.js
	*/
	import _dontCare from '../src/wcia-color-picker.mjs'

	const makePicker = (function() {
	const pickerSize = 500
	const thumbCenterOffset = 5/2 + 3 // width/2 + left border
	const markup =`
	<wcia-color-picker
	<!DOCTYPE html>
	<html>
	<head lang="en">
	<!--
	file: index.html
	Web Components in Action MEAP v6
	original: https://github.com/bengfarrell/webcomponentsinaction/blob/master/chapter10/10.2-cssvariables/shadow.html

	#1
	Defining a default value in case the custom property is not defined
	// file: components/biz-card/biz-card.mjs
	import { patchContentMap } from '../../helpers/templateLoader.mjs'

	/*
	#1:
	See patchContentMap call below which creates
	static get _contentMap
	static set _templateUri

	#2: