@aglyn/plugins-ai 1.0.0-beta.292 → 1.0.0-beta.296

package/src/lib/model/ai-site-look.d.ts

@@ -14,7 +14,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import type { HostTheme, HostThemeSchemeColors } from '@aglyn/shared-data-types';
+import type { HostTheme, HostThemeFontCategory, HostThemeSchemeColors } from '@aglyn/shared-data-types';
 import { type AiSiteMotionStyle } from '../layout-language/ai-layout-motion';
 import type { AiTool } from '../runtime/ai-runtime';
 import { type AiSiteBase, type AiSiteButtons, type AiSiteChroma, type AiSiteCorners, type AiSiteDensity, type AiSiteGround, type AiSiteKind, type AiSiteRhythm } from './ai-site-kinds';
@@ -92,7 +92,33 @@ export interface AiSiteStyle {
      * pages move in its kind's mood.
      */
     motion?: AiSiteMotionStyle;
+    /**
+     * A site brought in's own page ground (AGL-4108), `#rrggbb`: the color its
+     * source's pages sit on, where it is light enough for the theme's text.
+     * Absent, the ground is drawn as `ground` says.
+     */
+    page?: string;
+    /**
+     * A site brought in's own type (AGL-4108): the families its source sets
+     * its body and its headings in, where the theme font catalog has them,
+     * loaded in place of the pairing's. The pairing still sets the weights and
+     * the scale they are drawn at. Absent on every other site, whose type is
+     * the pairing's alone.
+     */
+    sourceFonts?: {
+        body: AiSiteSourceFont;
+        heading: AiSiteSourceFont | null;
+    } | null;
+}
+/** A family a site brought in is set in (AGL-4108), with the weights the catalog says it has. */
+export interface AiSiteSourceFont {
+    family: string;
+    category: HostThemeFontCategory;
+    /** The upright weights the family offers. */
+    weights: number[];
 }
+/** The weights of `wanted` a family offers, each the nearest it has where it lacks one. */
+export declare function aiSiteFontWeightsIn(wanted: readonly number[], offered: readonly number[]): number[];
 /** What the model may choose, every field optional. */
 export type AiSiteLookAnswer = Partial<Pick<AiSiteStyle, 'base' | 'hue' | 'accent' | 'ground' | 'fonts' | 'corners' | 'buttons' | 'cards' | 'fields' | 'eyebrow' | 'header' | 'brand' | 'motion'>>;
 /**
@@ -188,3 +214,41 @@ export declare const AI_SITE_DISPLAY_BOOST: Readonly<Record<string, {
  * and dialog styles, its control heights — stays the base's.
  */
 export declare function aiSiteTheme(style: AiSiteStyle, base: HostTheme): HostTheme;
+/** A kind's first look as a built-in theme with a brand over it, and the style answers that say the same. */
+export interface AiSiteKindDefaultLook {
+    /** The `builtin` starter theme a site created in this style starts with. */
+    theme: {
+        kind: 'builtin';
+        base: string;
+        brand: {
+            light: Record<string, string>;
+            dark?: Record<string, string>;
+        };
+        fonts: string | null;
+    };
+    /** The same look as the AI start's style answers name it (`fp-starter-{kind}-ai`). */
+    answerStyle: {
+        base: string;
+        hue?: number;
+        ground: AiSiteGround;
+        fonts: string | null;
+        corners: AiSiteCorners;
+        buttons: AiSiteButtons;
+    };
+}
+/**
+ * A kind of site's FIRST look (AGL-4049), the one a site created in that
+ * style starts with and the one the platform's own starter listings carry:
+ * the kind's first base theme the deployment has (`starter`, or a built-in
+ * whose preset `known.presetIds` holds), its first font pairing the platform
+ * has, and a brand primary from the midpoint of its first hue range, colored
+ * as {@link aiSiteColors} colors one. A kind that suits any hue keeps the
+ * base's own colors. One derivation, so the style a person picks in Create
+ * site and the seeded `fp-starter-{kind}-base` listing look the same.
+ *
+ * Deterministic: no draw, the seed is the kind's id.
+ */
+export declare function aiSiteKindDefaultLook(kind: AiSiteKind, known: {
+    presetIds: ReadonlySet<string>;
+    pairingIds?: ReadonlySet<string>;
+}): AiSiteKindDefaultLook;

package/src/lib/model/ai-site-look.js

@@ -80,6 +80,15 @@ const DENSITIES = [
     'regular',
     'airy'
 ];
+/** The weights of `wanted` a family offers, each the nearest it has where it lacks one. */ export function aiSiteFontWeightsIn(wanted, offered) {
+    if (!offered.length) return [
+        ...new Set(wanted)
+    ].sort((a, b)=>a - b);
+    const nearest = (weight)=>offered.reduce((best, each)=>Math.abs(each - weight) < Math.abs(best - weight) ? each : best, offered[0]);
+    return [
+        ...new Set(wanted.map(nearest))
+    ].sort((a, b)=>a - b);
+}
 // ── The seed ─────────────────────────────────────────────────────────────
 /** A job's seed: FNV-1a over its id. */ export function aiSiteSeed(jobId) {
     let hash = 0x811c9dc5;
@@ -780,7 +789,9 @@ const START_L = {
         }
     };
     const ground = grounds[style.ground];
-    const background = aiOklchHex(ground.L, ground.C * groundChroma, ground.h);
+    // A site brought in keeps the ground its source's pages sit on (AGL-4108), where its text reads on it.
+    const own = style.page && /^#[0-9a-f]{6}$/i.test(style.page) && aiHexOklch(style.page).L >= 0.9 ? style.page.toLowerCase() : null;
+    const background = own != null ? own : aiOklchHex(ground.L, ground.C * groundChroma, ground.h);
     const paper = aiOklchHex(ground.paper[0], ground.paper[1] * groundChroma, ground.h);
     // The brand color: a button label reads on it, so it reads on the page too.
     let primaryMain;
@@ -1241,7 +1252,7 @@ function isRecord(value) {
  * site's own; whatever the base sets beyond them — its focus rings, its menu
  * and dialog styles, its control heights — stays the base's.
  */ export function aiSiteTheme(style, base) {
-    var _aiSiteFontPairing, _base_typography, _base_shape, _base_components;
+    var _aiSiteFontPairing, _base_typography, _base_shape, _base_components, _style_sourceFonts;
     var _theme_fonts;
     const pairing = (_aiSiteFontPairing = aiSiteFontPairing(style.fonts)) != null ? _aiSiteFontPairing : AI_SITE_FONT_PAIRINGS[0];
     const colors = aiSiteColors(style);
@@ -1273,37 +1284,54 @@ function isRecord(value) {
         components: merged((_base_components = base.components) != null ? _base_components : {}, componentsFor(style))
     });
     delete theme.darkScheme;
-    const sameFamily = pairing.heading.family === pairing.body.family;
+    // A site brought in is set in its source's own families (AGL-4108), at the
+    // weights the pairing draws with, as near as each family has them.
+    const headingWeights = [
+        pairing.heading.weight,
+        pairing.heading.sub
+    ];
+    const source = (_style_sourceFonts = style.sourceFonts) != null ? _style_sourceFonts : null;
+    const body = (source == null ? void 0 : source.body) ? {
+        family: source.body.family,
+        category: source.body.category,
+        weights: aiSiteFontWeightsIn(pairing.body.weights, source.body.weights)
+    } : {
+        family: pairing.body.family,
+        category: pairing.body.category,
+        weights: [
+            ...pairing.body.weights
+        ]
+    };
+    const heading = source ? source.heading ? {
+        family: source.heading.family,
+        category: source.heading.category,
+        weights: aiSiteFontWeightsIn(headingWeights, source.heading.weights)
+    } : _extends({}, body, {
+        weights: aiSiteFontWeightsIn(headingWeights, source.body.weights)
+    }) : {
+        family: pairing.heading.family,
+        category: pairing.heading.category,
+        weights: [
+            ...new Set(headingWeights)
+        ].sort((a, b)=>a - b)
+    };
+    const sameFamily = heading.family.toLowerCase() === body.family.toLowerCase();
     theme = writeThemeFonts(theme, {
-        body: {
-            family: pairing.body.family,
-            category: pairing.body.category,
-            weights: [
-                ...pairing.body.weights
-            ],
+        body: _extends({}, body, {
             source: 'google'
-        },
-        heading: sameFamily ? null : {
-            family: pairing.heading.family,
-            category: pairing.heading.category,
-            weights: [
-                ...new Set([
-                    pairing.heading.weight,
-                    pairing.heading.sub
-                ])
-            ].sort((a, b)=>a - b),
+        }),
+        heading: sameFamily ? null : _extends({}, heading, {
             source: 'google'
-        }
+        })
     });
-    // A pairing whose heading is the body family loads the heading weights too.
+    // A heading in the body's family loads the heading weights too.
     if (sameFamily && ((_theme_fonts = theme.fonts) == null ? void 0 : _theme_fonts[0])) {
         var _theme_fonts__weights;
         theme.fonts[0] = _extends({}, theme.fonts[0], {
             weights: [
                 ...new Set([
                     ...(_theme_fonts__weights = theme.fonts[0].weights) != null ? _theme_fonts__weights : [],
-                    pairing.heading.weight,
-                    pairing.heading.sub
+                    ...heading.weights
                 ])
             ].sort((a, b)=>a - b)
         });
@@ -1316,5 +1344,95 @@ function isRecord(value) {
     }
     return theme;
 }
+// ── A kind's first look (AGL-4049) ──────────────────────────────────────────
+/** The midpoint of a kind's first hue range, or `null` when it spans the whole wheel (any hue suits it). */ function firstHueOf(hues) {
+    var _ref;
+    const [from, to] = (_ref = hues == null ? void 0 : hues[0]) != null ? _ref : [
+        0,
+        360
+    ];
+    const span = from <= to ? to - from : 360 - from + to;
+    if (span >= 360) return null;
+    return Math.round(from + span / 2) % 360;
+}
+/**
+ * A kind of site's FIRST look (AGL-4049), the one a site created in that
+ * style starts with and the one the platform's own starter listings carry:
+ * the kind's first base theme the deployment has (`starter`, or a built-in
+ * whose preset `known.presetIds` holds), its first font pairing the platform
+ * has, and a brand primary from the midpoint of its first hue range, colored
+ * as {@link aiSiteColors} colors one. A kind that suits any hue keeps the
+ * base's own colors. One derivation, so the style a person picks in Create
+ * site and the seeded `fp-starter-{kind}-base` listing look the same.
+ *
+ * Deterministic: no draw, the seed is the kind's id.
+ */ export function aiSiteKindDefaultLook(kind, known) {
+    var _known_pairingIds, _family_bases_find, _family_fonts_find;
+    const family = kind.look;
+    const pairingIds = (_known_pairingIds = known.pairingIds) != null ? _known_pairingIds : new Set(AI_SITE_FONT_PAIRINGS.map((pairing)=>pairing.id));
+    const base = (_family_bases_find = family.bases.find((name)=>name === 'starter' || known.presetIds.has(`theme-presets.${name}`))) != null ? _family_bases_find : 'starter';
+    const fonts = (_family_fonts_find = family.fonts.find((id)=>pairingIds.has(id))) != null ? _family_fonts_find : null;
+    const hue = firstHueOf(family.hues);
+    const ground = family.grounds[0];
+    const corners = family.corners[0];
+    const colors = hue === null ? null : aiSiteColors({
+        v: 1,
+        kind: kind.id,
+        base,
+        seed: aiSiteSeed(kind.id),
+        hue,
+        accent: hue,
+        chroma: family.chroma,
+        ground,
+        fonts: fonts != null ? fonts : '',
+        corners,
+        buttons: family.buttons,
+        // Not read by the colors; named so the style is whole.
+        cards: 'flat',
+        fields: 'outlined',
+        eyebrow: 'caps',
+        header: 'line',
+        headerAlign: 'start',
+        rhythm: 'calm',
+        headingScale: family.headingScale,
+        density: family.density,
+        brand: null
+    });
+    const primary = (scheme)=>{
+        var _colors_scheme;
+        const value = colors == null ? void 0 : (_colors_scheme = colors[scheme]) == null ? void 0 : _colors_scheme.primary;
+        return value && typeof value === 'object' && typeof value.main === 'string' ? value.main : null;
+    };
+    const light = primary('light');
+    const dark = primary('dark');
+    const brand = light && dark ? {
+        light: {
+            primary: light
+        },
+        dark: {
+            primary: dark
+        }
+    } : {
+        light: {}
+    };
+    return {
+        theme: {
+            kind: 'builtin',
+            base,
+            brand,
+            fonts
+        },
+        answerStyle: _extends({
+            base
+        }, hue === null ? {} : {
+            hue
+        }, {
+            ground,
+            fonts,
+            corners,
+            buttons: family.buttons
+        })
+    };
+}
 
 //# sourceMappingURL=ai-site-look.js.map