elbe-ui 1.0.8 → 2.0.0

package/dist/ui/components/layout/ctx_app_base.d.ts

@@ -1,19 +0,0 @@
-import { ElbeChild, int } from "../../util/types";
-import { HeaderLogos } from "./header";
-export interface _AppBaseState {
-    menuOpen: boolean;
-    icons: HeaderLogos;
-    globalActions: ElbeChild[];
-    router: {
-        go: (path: string, replace?: int | "all") => void;
-        goBack: (steps?: number) => void;
-        history: string[];
-        location: string;
-    };
-}
-export interface _AppBaseControl extends _AppBaseState {
-    setMenuOpen: (open: boolean) => void;
-}
-export declare const AppBaseContext: import("react").Context<_AppBaseControl | null>;
-export declare function useAppBase(): _AppBaseControl;
-export declare function maybeAppBase(): _AppBaseControl | null;

package/dist/ui/components/layout/ctx_app_base.js

@@ -1,12 +0,0 @@
-import { createContext, useContext } from "react";
-export const AppBaseContext = createContext(null);
-export function useAppBase() {
-    const ctx = useContext(AppBaseContext);
-    if (ctx)
-        return ctx;
-    throw new Error("useAppBase must be used within an AppBase. try using maybeAppBase()");
-}
-export function maybeAppBase() {
-    var _a;
-    return (_a = useContext(AppBaseContext)) !== null && _a !== void 0 ? _a : null;
-}

package/dist/ui/theme/color_theme.d.ts

@@ -1,2 +0,0 @@
-import { ColorThemeSeed, PartialColorThemeSeed } from "./seed";
-export declare function colorThemePreset(merge?: Partial<PartialColorThemeSeed>): ColorThemeSeed;

package/dist/ui/theme/color_theme.js

@@ -1,92 +0,0 @@
-import { colors, LayerColor, } from "./colors";
-import { lColor } from "./seed";
-export function colorThemePreset(merge
-//highVis: boolean = false
-) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
-    const seed = merge !== null && merge !== void 0 ? merge : {};
-    return {
-        base: (_a = seed.base) !== null && _a !== void 0 ? _a : LayerColor.fromBack(colors.white),
-        accent: (_b = seed.accent) !== null && _b !== void 0 ? _b : LayerColor.fromBack(colors.blueAccent),
-        info: (_c = seed.info) !== null && _c !== void 0 ? _c : LayerColor.fromBack(colors.blue),
-        success: (_d = seed.success) !== null && _d !== void 0 ? _d : LayerColor.fromBack(colors.green),
-        warning: (_e = seed.warning) !== null && _e !== void 0 ? _e : LayerColor.fromBack(colors.yellow),
-        error: (_f = seed.error) !== null && _f !== void 0 ? _f : LayerColor.fromBack(colors.red),
-        contrast: {
-            highvis: (_h = (_g = seed.contrast) === null || _g === void 0 ? void 0 : _g.highvis) !== null && _h !== void 0 ? _h : (({ seed }) => (Object.assign(Object.assign({}, seed), { accent: LayerColor.fromBack(colors.black) }))),
-            normal: (_k = (_j = seed.contrast) === null || _j === void 0 ? void 0 : _j.normal) !== null && _k !== void 0 ? _k : (({ seed }) => seed),
-        },
-        mode: {
-            light: (_m = (_l = seed.mode) === null || _l === void 0 ? void 0 : _l.light) !== null && _m !== void 0 ? _m : (({ base }) => base),
-            dark: (_p = (_o = seed.mode) === null || _o === void 0 ? void 0 : _o.dark) !== null && _p !== void 0 ? _p : (({ base }) => base.mirrorBrightness()),
-        },
-        scheme: {
-            primary: (_r = (_q = seed.scheme) === null || _q === void 0 ? void 0 : _q.primary) !== null && _r !== void 0 ? _r : _makePrimary,
-            secondary: (p) => {
-                var _a, _b, _c, _d;
-                const highVis = p.path.includes("highvis");
-                return (highVis
-                    ? (_b = (_a = seed.scheme) === null || _a === void 0 ? void 0 : _a.primary) !== null && _b !== void 0 ? _b : _makePrimary
-                    : (_d = (_c = seed.scheme) === null || _c === void 0 ? void 0 : _c.secondary) !== null && _d !== void 0 ? _d : _makeSecondary)(p);
-            },
-            inverse: (_t = (_s = seed.scheme) === null || _s === void 0 ? void 0 : _s.inverse) !== null && _t !== void 0 ? _t : _makeInverse,
-        },
-        style: {
-            accent: _styleSel,
-            info: _styleSel,
-            success: _styleSel,
-            warning: _styleSel,
-            error: _styleSel,
-        },
-        variant: {
-            major: (_v = (_u = seed.variant) === null || _u === void 0 ? void 0 : _u.major) !== null && _v !== void 0 ? _v : _makeMajor,
-            minor: (p) => {
-                var _a, _b;
-                if ((_a = seed.variant) === null || _a === void 0 ? void 0 : _a.minor)
-                    return (_b = seed.variant) === null || _b === void 0 ? void 0 : _b.minor(p);
-                const highVis = p.path.includes("highvis");
-                return highVis ? _makeMajor(p) : _makeMinor(p);
-            },
-            flat: (_x = (_w = seed.variant) === null || _w === void 0 ? void 0 : _w.flat) !== null && _x !== void 0 ? _x : _makeFlat,
-        },
-    };
-}
-const _styleSel = ({ base, style }) => {
-    const bL = base.luminance;
-    if (bL === 1)
-        return style;
-    //if (bL === 0) return s.mirrorBrightness();
-    if (style.luminance == 0)
-        return style.mirrorBrightness();
-    return style.inter(LayerColor.fromBack(bL > 0.5 ? colors.black : colors.white), 0.1);
-};
-const _makePrimary = (p) => p.base;
-const _makeSecondary = ({ base, seed }) => new LayerColor(base.back
-    .inter(lColor(seed.accent).back, base.back.luminance < 0.3 ? 0.2 : 0.1)
-    .desaturated(0.5), base.front, base.border);
-const _makeInverse = ({ base }) => base.mirrorBrightness();
-const _makeMajor = ({ style, path }) => {
-    return LayerColor.fromBack(style.back, { border: style.back });
-};
-const _makeMinor = ({ base, style }) => {
-    const b = base.back;
-    const backIn = b.mirrorBrightness();
-    const major = style.back;
-    const minor = style.back.inter(b, 0.8);
-    const minorFront = minor.hasWCAGContrast(major) ? major : null;
-    return new LayerColor(style.back.withAlpha(0.25), minorFront !== null && minorFront !== void 0 ? minorFront : major.inter(backIn, 0.6), minorFront !== null && minorFront !== void 0 ? minorFront : major.inter(backIn, 0.3));
-};
-const _makeFlat = ({ path, style, base }) => {
-    const highVis = path.includes("highvis");
-    const front = !style
-        ? base.front
-        : base.back.hasWCAGContrast(style === null || style === void 0 ? void 0 : style.back)
-            ? style === null || style === void 0 ? void 0 : style.back
-            : style === null || style === void 0 ? void 0 : style.back.inter(base.front, 0.6);
-    const isDark = base.back.luminance < 0.3;
-    const border = !highVis && !style
-        ? base.front.inter(base.back, isDark ? 0.75 : 0.9)
-        : base.front;
-    return new LayerColor(base.back, //.withAlpha(0),
-    front, highVis ? border : null, border);
-};

package/dist/ui/theme/colors.d.ts

@@ -1,133 +0,0 @@
-import { ColorThemeSeed, PartialColorThemeSeed, ThemeColors } from "./seed";
-export type ElbeColorContrasts = "normal" | "highvis";
-export type ElbeColorModes = "light" | "dark";
-export type ElbeColorSchemes = "primary" | "secondary" | "inverse";
-export type ElbeAlertKinds = "success" | "warning" | "error" | "info";
-export type ElbeColorKinds = ElbeAlertKinds | "plain" | "accent";
-export type ElbeColorManners = "major" | "minor" | "flat" | "plain";
-export declare const cContrasts: ElbeColorContrasts[];
-export declare const cModes: ElbeColorModes[];
-export declare const cSchemes: ElbeColorSchemes[];
-export declare const cKinds: ElbeColorKinds[];
-export declare const cManners: ElbeColorManners[];
-export declare const cStates: string[];
-export declare const cLayers: string[];
-type _SeedSelInput = {
-    path: string[];
-    seed: ColorThemeSeed;
-    base: LayerColor;
-};
-export type SeedSelector = (p: _SeedSelInput) => LayerColor;
-export type SeedModifier = (p: _SeedSelInput) => ColorThemeSeed;
-export type SeedFlatSelector = (p: _SeedSelInput & {
-    style?: LayerColor;
-}) => LayerColor;
-export type SeedStyleSelector = (p: _SeedSelInput & {
-    style: LayerColor;
-}) => LayerColor;
-export declare class RGBAColor {
-    r: number;
-    g: number;
-    b: number;
-    a: number;
-    constructor(r: number, g: number, b: number, a: number);
-    asCss(): string;
-    get isDark(): boolean;
-    get luminance(): number;
-    get hex(): string;
-    static fromHex(hex: string | null): RGBAColor;
-    desaturated(f?: number): RGBAColor;
-    withAlpha(a: number): RGBAColor;
-    inter(other: RGBAColor, factor: number): RGBAColor;
-    mirrorBrightness(factor?: number): RGBAColor;
-    get values(): [number, number, number, number];
-    hasWCAGContrast(color: RGBAColor): boolean;
-    contrastRatio(color: RGBAColor): number;
-}
-export declare const colors: {
-    transparent: RGBAColor;
-    white: RGBAColor;
-    black: RGBAColor;
-    blueAccent: RGBAColor;
-    blue: RGBAColor;
-    green: RGBAColor;
-    yellow: RGBAColor;
-    red: RGBAColor;
-};
-export declare class LayerColor extends RGBAColor {
-    back: RGBAColor;
-    border?: (RGBAColor | null) | undefined;
-    borderContext?: (RGBAColor | null) | undefined;
-    front: RGBAColor;
-    constructor(back: RGBAColor, front: RGBAColor | null, border?: (RGBAColor | null) | undefined, borderContext?: (RGBAColor | null) | undefined);
-    asCss(): string;
-    inter(other: LayerColor, factor: number): LayerColor;
-    mirrorBrightness(factor?: number): LayerColor;
-    desaturated(): LayerColor;
-    static fromHex(back: string, front?: string | null, border?: string | null): LayerColor;
-    withBorder(border: RGBAColor): LayerColor;
-    static fromBack(back: RGBAColor, c?: {
-        front?: RGBAColor;
-        border?: RGBAColor;
-    }): LayerColor;
-    contextCss(): string;
-}
-export declare class StateColor extends LayerColor {
-    neutral: LayerColor;
-    hover: LayerColor;
-    active: LayerColor;
-    disabled: LayerColor;
-    constructor(neutral: LayerColor, hover: LayerColor, active: LayerColor, disabled: LayerColor);
-    asCss(): string;
-    static generate(p: string[], _: ColorThemeSeed, context: LayerColor, style: LayerColor, fromFront?: boolean): StateColor;
-}
-export declare class MannerColor extends StateColor {
-    major: StateColor | null;
-    minor: StateColor | null;
-    flat: StateColor;
-    constructor(major: StateColor | null, minor: StateColor | null, flat: StateColor);
-    asCss(fallback?: MannerColor): string;
-    raisedCss(): string;
-    static generate(path: string[], seed: ColorThemeSeed, base: LayerColor, style?: LayerColor): MannerColor;
-}
-export declare class KindColor extends MannerColor {
-    plain: MannerColor;
-    accent: MannerColor;
-    info: MannerColor;
-    success: MannerColor;
-    warning: MannerColor;
-    error: MannerColor;
-    constructor(plain: MannerColor, accent: MannerColor, info: MannerColor, success: MannerColor, warning: MannerColor, error: MannerColor);
-    asCss(): string;
-    static generate(path: string[], seed: ColorThemeSeed, base: LayerColor): KindColor;
-}
-export declare class SchemeColor extends KindColor {
-    primary: KindColor;
-    secondary: KindColor;
-    inverse: KindColor;
-    constructor(primary: KindColor, secondary: KindColor, inverse: KindColor);
-    asCss(): string;
-    static generate(path: string[], seed: ColorThemeSeed, base: LayerColor): SchemeColor;
-}
-export declare class ModeColor extends SchemeColor {
-    light: SchemeColor;
-    dark: SchemeColor;
-    constructor(light: SchemeColor, dark: SchemeColor);
-    asCss(): string;
-    static generate(path: string[], seed: ColorThemeSeed): ModeColor;
-}
-export declare class ContrastColor extends ModeColor {
-    normal: ModeColor;
-    highvis: ModeColor;
-    constructor(normal: ModeColor, highvis: ModeColor);
-    asCss(): string;
-    static generate(path: string[], seed: ColorThemeSeed): ContrastColor;
-}
-export declare class ColorTheme {
-    colors: ThemeColors;
-    color: ContrastColor;
-    constructor(colors: ThemeColors, color: ContrastColor);
-    asCss(): string;
-    static generate(seed?: Partial<PartialColorThemeSeed>): ColorTheme;
-}
-export {};

package/dist/ui/theme/colors.js

@@ -1,309 +0,0 @@
-import { hslToRgb, rgbToHsl } from "colors-convert";
-import { clamp } from "../util/util";
-import { colorThemePreset } from "./color_theme";
-import { lColor, } from "./seed";
-export const cContrasts = ["normal", "highvis"];
-export const cModes = ["light", "dark"];
-export const cSchemes = ["primary", "secondary", "inverse"];
-export const cKinds = [
-    "plain",
-    "accent",
-    "info",
-    "success",
-    "warning",
-    "error",
-];
-export const cManners = ["major", "minor", "flat", "plain"];
-export const cStates = ["neutral", "hover", "active", "disabled"];
-export const cLayers = ["back", "front", "border"];
-export class RGBAColor {
-    constructor(r, g, b, a) {
-        this.r = r;
-        this.g = g;
-        this.b = b;
-        this.a = a;
-    }
-    asCss() {
-        return `rgba(${this.r}, ${this.g}, ${this.b}, ${this.a})`;
-    }
-    get isDark() {
-        return this.luminance < 0.5;
-    }
-    get luminance() {
-        const [r, g, b] = [this.r, this.g, this.b].map((v) => {
-            v /= 255;
-            return v <= 0.03928 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4);
-        });
-        return r * 0.2126 + g * 0.7152 + b * 0.0722;
-    }
-    get hex() {
-        const c = [this.r, this.g, this.b].map((v) => Math.round(v).toString(16).padStart(2, "0"));
-        const a = Math.round(this.a * 255)
-            .toString(16)
-            .padStart(2, "0");
-        return `#${c.join("")}${a}`;
-    }
-    static fromHex(hex) {
-        if (!hex)
-            return new RGBAColor(0, 0, 0, 0);
-        const c = hex.replace("#", "").padEnd(6, "0").padEnd(8, "f").toLowerCase();
-        return new RGBAColor(parseInt(c.substring(0, 2), 16), parseInt(c.substring(2, 4), 16), parseInt(c.substring(4, 6), 16), parseInt(c.substring(6, 8), 16) / 255);
-    }
-    desaturated(f = 1) {
-        const avg = (this.r + this.g + this.b) / 3;
-        return new RGBAColor(this.r + (avg - this.r) * f, this.g + (avg - this.g) * f, this.b + (avg - this.b) * f, this.a);
-    }
-    withAlpha(a) {
-        return new RGBAColor(this.r, this.g, this.b, a);
-    }
-    inter(other, factor) {
-        return new RGBAColor(this.r + (other.r - this.r) * factor, this.g + (other.g - this.g) * factor, this.b + (other.b - this.b) * factor, this.a + (other.a - this.a) * factor);
-    }
-    mirrorBrightness(factor = 1) {
-        const hsl = rgbToHsl({ r: this.r, g: this.g, b: this.b });
-        const newL = (50 - hsl.l) * (factor * 2 - 1) + 50;
-        const rgb = hslToRgb(Object.assign(Object.assign({}, hsl), { l: clamp(newL, 0, 100), s: clamp(hsl.s, 0, 100) }));
-        return new RGBAColor(rgb.r, rgb.g, rgb.b, this.a);
-    }
-    get values() {
-        return [this.r, this.g, this.b, this.a];
-    }
-    hasWCAGContrast(color) {
-        return this.contrastRatio(color) >= 3;
-    }
-    contrastRatio(color) {
-        const l1 = this.luminance;
-        const l2 = color.luminance;
-        return (Math.max(l1, l2) + 0.05) / (Math.min(l1, l2) + 0.05);
-    }
-}
-export const colors = {
-    transparent: new RGBAColor(0, 0, 0, 0),
-    white: new RGBAColor(255, 255, 255, 1),
-    black: new RGBAColor(0, 0, 0, 1),
-    blueAccent: new RGBAColor(60, 119, 246, 1),
-    blue: new RGBAColor(32, 89, 153, 1),
-    green: new RGBAColor(35, 144, 78, 1),
-    yellow: new RGBAColor(240, 221, 21, 1),
-    red: new RGBAColor(243, 67, 67, 1),
-};
-export class LayerColor extends RGBAColor {
-    constructor(back, front, border, borderContext) {
-        super(back.r, back.g, back.b, back.a);
-        this.back = back;
-        this.border = border;
-        this.borderContext = borderContext;
-        this.front = front !== null && front !== void 0 ? front : (back.isDark ? colors.white : colors.black);
-    }
-    asCss() {
-        var _a, _b;
-        return (`background-color: ${this.back.asCss()};\n` +
-            `color: ${this.front.asCss()};\n` +
-            `border-color: ${(_b = (_a = this.border) === null || _a === void 0 ? void 0 : _a.asCss()) !== null && _b !== void 0 ? _b : "transparent"};\n` +
-            //`border-color: ${this.border?.asCss() ?? "transparent"};\n` +
-            this.contextCss());
-    }
-    inter(other, factor) {
-        var _a, _b, _c, _d;
-        return new LayerColor(this.back.inter(other.back, factor), this.front.inter(other.front, factor), (_a = this.border) === null || _a === void 0 ? void 0 : _a.inter((_b = other.border) !== null && _b !== void 0 ? _b : colors.transparent, factor), (_c = this.borderContext) === null || _c === void 0 ? void 0 : _c.inter((_d = other.borderContext) !== null && _d !== void 0 ? _d : colors.transparent, factor));
-    }
-    mirrorBrightness(factor) {
-        var _a, _b;
-        return new LayerColor(this.back.mirrorBrightness(factor), this.front.mirrorBrightness(factor), (_a = this.border) === null || _a === void 0 ? void 0 : _a.mirrorBrightness(factor), (_b = this.borderContext) === null || _b === void 0 ? void 0 : _b.mirrorBrightness(factor));
-    }
-    desaturated() {
-        var _a, _b;
-        return new LayerColor(this.back.desaturated(), this.front.desaturated(), (_a = this.border) === null || _a === void 0 ? void 0 : _a.desaturated(), (_b = this.borderContext) === null || _b === void 0 ? void 0 : _b.desaturated());
-    }
-    static fromHex(back, front, border) {
-        if (front === undefined && border === undefined) {
-            return LayerColor.fromBack(RGBAColor.fromHex(back));
-        }
-        return new LayerColor(RGBAColor.fromHex(back), RGBAColor.fromHex(front !== null && front !== void 0 ? front : null), RGBAColor.fromHex(border !== null && border !== void 0 ? border : null));
-    }
-    withBorder(border) {
-        return new LayerColor(this.back, this.front, border);
-    }
-    static fromBack(back, c) {
-        var _a, _b;
-        const front = back.isDark ? colors.white : colors.black;
-        return new LayerColor(back, (_a = c === null || c === void 0 ? void 0 : c.front) !== null && _a !== void 0 ? _a : front, (_b = c === null || c === void 0 ? void 0 : c.border) !== null && _b !== void 0 ? _b : front);
-    }
-    contextCss() {
-        var _a, _b, _c;
-        return (`--c-context-back: ${this.back.asCss()};\n` +
-            `--c-context-front: ${this.front.asCss()};` +
-            `--c-context-border: ${(_c = (_b = ((_a = this.borderContext) !== null && _a !== void 0 ? _a : this.border)) === null || _b === void 0 ? void 0 : _b.asCss()) !== null && _c !== void 0 ? _c : "transparent"};`);
-    }
-}
-export class StateColor extends LayerColor {
-    constructor(neutral, hover, active, disabled) {
-        super(neutral.back, neutral.front, neutral.border);
-        this.neutral = neutral;
-        this.hover = hover;
-        this.active = active;
-        this.disabled = disabled;
-    }
-    asCss() {
-        const els = [
-            ".action",
-            ":is(button)",
-            ":is(a)",
-            ":is(input)",
-            ":is(select)",
-        ];
-        const disS = "&.disabled, & :disabled, &:disabled";
-        const hoverS = els.map((e) => `&${e}:hover:not(${disS})`).join(", ");
-        const activeS = els.map((e) => `&${e}:active:not(${disS})`).join(", ");
-        return (`${this.neutral.asCss()} \n` +
-            `${hoverS} { ${this.hover.asCss()} }\n` +
-            `${activeS} { ${this.active.asCss()} }\n` +
-            `${disS} { ${this.disabled.asCss()} }`);
-    }
-    static generate(p, _, context, style, fromFront) {
-        function _make(factor) {
-            const front = style.front;
-            return new LayerColor((fromFront
-                ? context.back.inter(front, factor)
-                : style.back.inter(context.back.mirrorBrightness(), factor)).withAlpha(Math.max(style.back.a, 0.2)), front, style.border, style.borderContext);
-        }
-        return new StateColor(style, _make(0.075), _make(0.25), style.desaturated());
-    }
-}
-export class MannerColor extends StateColor {
-    constructor(major, minor, flat) {
-        const m = major !== null && major !== void 0 ? major : flat;
-        super(m.neutral, m.hover, m.active, m.disabled);
-        this.major = major;
-        this.minor = minor;
-        this.flat = flat;
-    }
-    asCss(fallback) {
-        var _a, _b;
-        const maj = (_a = this.major) !== null && _a !== void 0 ? _a : fallback === null || fallback === void 0 ? void 0 : fallback.major;
-        const min = (_b = this.minor) !== null && _b !== void 0 ? _b : fallback === null || fallback === void 0 ? void 0 : fallback.minor;
-        return (`${this.flat.asCss()}\n` +
-            (maj ? `&.major { ${maj.asCss()} } \n` : "") +
-            (min ? `&.minor { ${min.asCss()} } \n` : "") +
-            `&.flat { ${this.flat.asCss()} }\n`);
-    }
-    raisedCss() {
-        const maj = this.major;
-        const min = this.minor;
-        return ((maj ? ` .major { ${maj.asCss()} } \n` : "") +
-            (min ? ` .minor { ${min.asCss()} } \n` : ""));
-    }
-    static generate(path, seed, base, style) {
-        return new MannerColor(style
-            ? StateColor.generate([...path, "major"], seed, base, seed.variant.major({ path, seed, base, style }))
-            : null, style
-            ? StateColor.generate([...path, "minor"], seed, base, seed.variant.minor({ path, seed, base, style }))
-            : null, StateColor.generate([...path, "flat"], seed, base, seed.variant.flat({ path, seed, base, style }), true));
-        /*
-        if (!style) {
-          return new MannerColor(null, null, StateColor.generate(s, c, c, true));
-        }
-        return new MannerColor(
-          StateColor.generate(s, c, s.variant.major(s, c, style)),
-          StateColor.generate(s, c, s.variant.minor(s, c, style)),
-          StateColor.generate(s, c, s.variant.flat(s, c, style), true)
-        );
-        */
-    }
-}
-export class KindColor extends MannerColor {
-    constructor(plain, accent, info, success, warning, error) {
-        super(plain.major, plain.minor, plain.flat);
-        this.plain = plain;
-        this.accent = accent;
-        this.info = info;
-        this.success = success;
-        this.warning = warning;
-        this.error = error;
-    }
-    asCss() {
-        return (`${this.plain.asCss()}\n` +
-            `${this.accent.raisedCss()}\n` +
-            `.plain {${this.plain.asCss()}}\n` +
-            `.accent { ${this.accent.asCss()} }\n` +
-            `.info { ${this.info.asCss()} }\n` +
-            `.success { ${this.success.asCss()} }\n` +
-            `.warning { ${this.warning.asCss()} }\n` +
-            `.error { ${this.error.asCss()} }`);
-    }
-    static generate(path, seed, base) {
-        return new KindColor(MannerColor.generate([...path, "plain"], seed, base), MannerColor.generate([...path, "accent"], seed, base, seed.style.accent({ path, seed, base, style: lColor(seed.accent) })), MannerColor.generate([...path, "info"], seed, base, seed.style.info({ path, seed, base, style: lColor(seed.info) })), MannerColor.generate([...path, "success"], seed, base, seed.style.success({ path, seed, base, style: lColor(seed.success) })), MannerColor.generate([...path, "warning"], seed, base, seed.style.warning({ path, seed, base, style: lColor(seed.warning) })), MannerColor.generate([...path, "error"], seed, base, seed.style.error({ path, seed, base, style: lColor(seed.error) })));
-    }
-}
-export class SchemeColor extends KindColor {
-    constructor(primary, secondary, inverse) {
-        super(primary.plain, primary.accent, primary.info, primary.success, primary.warning, primary.error);
-        this.primary = primary;
-        this.secondary = secondary;
-        this.inverse = inverse;
-    }
-    asCss() {
-        return (`${this.primary.asCss()}\n` +
-            `.primary { ${this.primary.asCss()}} \n` +
-            `.secondary { ${this.secondary.asCss()} }\n` +
-            `.inverse { ${this.inverse.asCss()} }`);
-    }
-    static generate(path, seed, base) {
-        const m = seed.scheme;
-        return new SchemeColor(KindColor.generate([...path, "primary"], seed, m.primary({ path, seed, base })), KindColor.generate([...path, "secondary"], seed, m.secondary({ path, seed, base })), KindColor.generate([...path, "inverse"], seed, m.inverse({ path, seed, base })));
-    }
-}
-export class ModeColor extends SchemeColor {
-    constructor(light, dark) {
-        super(light.primary, light.secondary, light.inverse);
-        this.light = light;
-        this.dark = dark;
-    }
-    asCss() {
-        return `&{ ${this.light.asCss()}}` + `&.dark { ${this.dark.asCss()}}`;
-    }
-    static generate(path, seed) {
-        return new ModeColor(SchemeColor.generate(path, seed, lColor(seed.base)), SchemeColor.generate([...path, "dark"], seed, seed.mode.dark({ path, seed, base: lColor(seed.base) })));
-    }
-}
-export class ContrastColor extends ModeColor {
-    constructor(normal, highvis) {
-        super(normal.light, normal.dark);
-        this.normal = normal;
-        this.highvis = highvis;
-    }
-    asCss() {
-        return (`& { ${this.normal.asCss()}}` + `&.highvis { ${this.highvis.asCss()}}`);
-    }
-    static generate(path, seed) {
-        const p = { path, base: lColor(seed.base), seed };
-        return new ContrastColor(ModeColor.generate(path, seed.contrast.normal(p)), ModeColor.generate([...path, "highvis"], seed.contrast.highvis(p)));
-    }
-}
-export class ColorTheme {
-    constructor(colors, color) {
-        this.colors = colors;
-        this.color = color;
-    }
-    asCss() {
-        return `
-  --c-accent: ${this.colors.accent.back.asCss()};
-  --c-info: ${this.colors.info.back.asCss()};
-  --c-success: ${this.colors.success.back.asCss()};
-  --c-warning: ${this.colors.warning.back.asCss()};
-  --c-error: ${this.colors.error.back.asCss()};
-  ${this.color.asCss()}`;
-    }
-    static generate(seed) {
-        const s = colorThemePreset(seed);
-        return new ColorTheme({
-            base: lColor(s.base),
-            accent: lColor(s.accent),
-            info: lColor(s.info),
-            success: lColor(s.success),
-            warning: lColor(s.warning),
-            error: lColor(s.error),
-        }, ContrastColor.generate([], s));
-    }
-}
-//Bun.write("./example.css", ColorTheme.generate().asCss());

package/dist/ui/theme/geometry_theme.d.ts

@@ -1,16 +0,0 @@
-export interface GeometryThemeSeed {
-    size: number;
-    radius: number;
-    padding: number;
-    borderWidth: number;
-}
-export declare class GeometryTheme {
-    readonly size: number;
-    readonly radius: number;
-    readonly padding: number;
-    readonly borderWidth: number;
-    constructor(size: number, radius: number, padding: number, borderWidth: number);
-    asCss(): string;
-    static generate(seed?: Partial<GeometryTheme>): GeometryTheme;
-}
-export declare function geometryThemePreset(merge?: Partial<GeometryThemeSeed>): GeometryThemeSeed;

package/dist/ui/theme/geometry_theme.js

@@ -1,28 +0,0 @@
-export class GeometryTheme {
-    constructor(size, radius, padding, borderWidth) {
-        this.size = size;
-        this.radius = radius;
-        this.padding = padding;
-        this.borderWidth = borderWidth;
-    }
-    asCss() {
-        return (`--g-size: ${this.size}px;` +
-            `--g-radius: ${this.radius}rem;` +
-            `--g-padding: ${this.padding}rem;` +
-            `--g-border-width: ${this.borderWidth}rem;`);
-    }
-    static generate(seed) {
-        const s = geometryThemePreset(seed);
-        return new GeometryTheme(s.size, s.radius, s.padding, s.borderWidth);
-    }
-}
-export function geometryThemePreset(merge) {
-    var _a, _b, _c, _d;
-    const seed = merge !== null && merge !== void 0 ? merge : {};
-    return {
-        size: (_a = seed.size) !== null && _a !== void 0 ? _a : 16,
-        radius: (_b = seed.radius) !== null && _b !== void 0 ? _b : 0.75,
-        padding: (_c = seed.padding) !== null && _c !== void 0 ? _c : 1,
-        borderWidth: (_d = seed.borderWidth) !== null && _d !== void 0 ? _d : 0.125,
-    };
-}

package/dist/ui/theme/seed.d.ts

@@ -1,53 +0,0 @@
-import { LayerColor, SeedFlatSelector, SeedModifier, SeedSelector, SeedStyleSelector } from "../..";
-export type HexColor = `#${string}`;
-export type ColorSeedColors = _Colors<LayerColor | HexColor>;
-export type ThemeColors = _Colors<LayerColor>;
-type _Colors<T> = {
-    base: T;
-    accent: T;
-    info: T;
-    success: T;
-    warning: T;
-    error: T;
-};
-type _ContrastSeed = {
-    highvis: SeedModifier;
-    normal: SeedModifier;
-};
-type _ModeSeed = {
-    light: SeedSelector;
-    dark: SeedSelector;
-};
-type _SchemeSeed = {
-    primary: SeedSelector;
-    secondary: SeedSelector;
-    inverse: SeedSelector;
-};
-type _StyleSeed = {
-    accent: SeedStyleSelector;
-    info: SeedStyleSelector;
-    success: SeedStyleSelector;
-    warning: SeedStyleSelector;
-    error: SeedStyleSelector;
-};
-type _VariantSeed = {
-    major: SeedStyleSelector;
-    minor: SeedStyleSelector;
-    flat: SeedFlatSelector;
-};
-export type ColorThemeSeed = ColorSeedColors & {
-    contrast: _ContrastSeed;
-    mode: _ModeSeed;
-    scheme: _SchemeSeed;
-    style: _StyleSeed;
-    variant: _VariantSeed;
-};
-export type PartialColorThemeSeed = Partial<ColorSeedColors> & {
-    contrast?: Partial<_ContrastSeed>;
-    mode?: Partial<_ModeSeed>;
-    scheme?: Partial<_SchemeSeed>;
-    style?: Partial<_StyleSeed>;
-    variant?: Partial<_VariantSeed>;
-};
-export declare function lColor(color: LayerColor | HexColor): LayerColor;
-export {};

package/dist/ui/theme/seed.js

@@ -1,4 +0,0 @@
-import { LayerColor, } from "../..";
-export function lColor(color) {
-    return typeof color === "string" ? LayerColor.fromHex(color) : color;
-}