sandgraham

// Algorithm adapted from an amazing StackOverflow answer:
// https://stackoverflow.com/questions/38923376/return-a-new-string-that-sorts-between-two-given-strings/38927158#38927158

const A = 97;
const B = 98;
const Z = 122;
const START = A - 1;
const END = Z + 1;

function findLexicalMiddleString(prev: string, next: string) {

sandgraham

// Hash any string into an integer value
// Then we'll use the int and convert to hex.
function hashCode(str) {
    var hash = 0;
    for (var i = 0; i < str.length; i++) {
        hash = str.charCodeAt(i) + ((hash << 5) - hash);
    }
    return hash;
}

sandgraham

Themes

A theme is the static configuration of a theme-able system. This requires a way to express the configuration and a theme-able system that is responsible for using the configuration to apply the expected styling.

I would argue that a good theme system has two key properties:

Interface

The interface consists of high level semantic variables that can be reused. This is where you assign values to variables such as primary, accent, etc. This is a convenient abstraction over specific assignments of values to style properties. It makes it easy to quickly customize a system with a different set of tokens.

sandgraham

const iso2FlagEmoji = iso => String.fromCodePoint(...[...iso.toUpperCase()].map(char => char.charCodeAt(0) + 127397));

iso2FlagEmoji("US"); // "🇺🇸"