Offirmo

// Iterating on the UMD template from here:
// https://github.com/umdjs/umd/blob/master/templates/returnExportsGlobal.js
// But experimentally improving it so that it works for webpack 2



// UMD template from https://gist.github.com/Offirmo/ec5c7ec9c44377c202f9f8abcacf1061#file-umd-js
(function (root, factory) {
  	var LIB_NAME = 'Foo'
	if (typeof define === 'function' && define.amd) {

Offirmo

function hookNavigationEvent(onNavigate) {
  
    // always provide a full location object to the final callback
    function uniformizedOnNavigate(locationOrUrl) {
        try {
            const location = (typeof locationOrUrl === 'string')
                ? new URL(
                    locationOrUrl[0] === '/' // relative
                    ? document.location.origin + locationOrUrl
                    : locationOrUrl

Offirmo

/*
https://csswizardry.com/2013/01/mindbemding-getting-your-head-round-bem-syntax/
http://bradfrost.com/blog/post/atomic-web-design/#atoms
zqsmm.qiniucdn.com/data/20110511083224/index.html
*/

.block {}
.block__element {}
.block--modifier {}

Offirmo

// https://github.com/Microsoft/TypeScript/wiki/What's-new-in-TypeScript

type MyRecord = Record<string, number>
type MyRecord = { [key: string]: number }

// TODO improved enums!
const OPERATORS = [ '*', '/', '+', '-' ] as const
type Operator = typeof OPERATORS[number]

type Color = "primary" | "secondary" | (string & {});

Offirmo

// https://react.dev/learn/typescript

import React from 'react'
// really? or import * as React from 'react' ?? https://github.com/facebook/react/pull/18102 ALSO https://www.typescriptlang.org/tsconfig/#allowSyntheticDefaultImports
// or not even need to import React? https://parceljs.org/recipes/react/#jsx
import React, { Component } from 'react'

// (from .d.ts)
type ReactNode =
        | ReactElement

Offirmo

// https://storybook.js.org/basics/guide-react/#write-your-stories
// https://storybook.js.org/basics/writing-stories/

// "Component Story Format"
// https://storybook.js.org/docs/react/api/csf

import { Story, Meta } from '@storybook/react'

import HelloWorld, { HelloWorldProps } from '.'

Offirmo

import EventEmitter from 'emittery'

const EMITTER_EVT = 'change'

const emitter = new EventEmitter<{ [EMITTER_EVT]: string }>()

emitter.emit(EMITTER_EVT, `[in-mem]`)
const unbind = emitter.on(EMITTER_EVT, (src: string) => { ... })

Offirmo

<!-- https://devdocs.io/html/element/a -->
<a href="https://github.com/Offirmo/offirmo-monorepo/issues" target="_blank" rel="noopener,external">report here</a>

Offirmo

import { 
	State,
	set_age,
} from './state.ts'


const state: State = { ... }

// currying
const curried1_set_age = change_age.bind(null, state) // hard to read

Offirmo

AwesomeKaleGleaner


function grid(seedCount) {
    const s = Math.sqrt(seedCount)
    const res = [ Math.floor(s) , Math.ceil(s) ]
    if (res[0] * res[1] < seedCount )
        res[0]++
        
    return res