@salty-css/core 0.1.0-alpha.2 → 0.1.0-alpha.21

package/bin/package-json.d.ts

@@ -0,0 +1,21 @@
+import { PathLike } from 'fs';
+export declare const defaultPackageJsonPath: string;
+export interface PackageJson {
+    name?: string;
+    version?: string;
+    scripts?: Record<string, string>;
+    dependencies?: Record<string, string>;
+    devDependencies?: Record<string, string>;
+    [key: string]: unknown;
+}
+export declare const readPackageJson: (filePath?: PathLike) => Promise<PackageJson>;
+export declare const updatePackageJson: (content: string | object, filePath?: PathLike) => Promise<void>;
+export declare const readThisPackageJson: () => Promise<PackageJson>;
+export declare const corePackages: {
+    core: (version: string) => string;
+    eslintConfigCore: (version: string) => string;
+};
+export declare const addPrepareScript: (pkg: PackageJson) => {
+    changed: boolean;
+    pkg: PackageJson;
+};

package/bin/saltyrc.d.ts

@@ -0,0 +1,31 @@
+import { RCFile } from '../types/cli-types';
+import { FrameworkAdapter } from './frameworks';
+export declare const SALTYRC_FILENAME = ".saltyrc.json";
+export declare const SALTYRC_SCHEMA = "./node_modules/@salty-css/core/.saltyrc.schema.json";
+export declare const SALTYRC_INFO = "This file is used to define projects and their configurations for Salty CSS cli. Do not delete, modify or add this file to .gitignore.";
+export interface ProjectEntry {
+    dir: string;
+    framework: string;
+    [key: string]: unknown;
+}
+export declare const saltyrcPath: (rootDir?: string) => string;
+export declare const readRc: (rootDir?: string) => Promise<RCFile>;
+export declare const readRawRc: (rootDir?: string) => Promise<string | undefined>;
+export declare const getDefaultProject: (rootDir?: string) => Promise<string | undefined>;
+/**
+ * Pure transform: returns the new saltyrc content for an upsert. Does not touch the filesystem.
+ * - If `existingRaw` is undefined, returns a fresh file with the project as the only entry.
+ * - If the project entry already exists, returns the same content (no-op).
+ * - Otherwise appends the new entry and returns updated content.
+ */
+export declare const upsertProjectInRc: (existingRaw: string | undefined, relativeProjectPath: string, framework: FrameworkAdapter) => {
+    content: string;
+    changed: boolean;
+    created: boolean;
+};
+/**
+ * Writes the saltyrc file, creating or updating the project entry for the given dir.
+ * Returns true when a write occurred.
+ */
+export declare const writeProjectToRc: (cwd: string, relativeProjectPath: string, framework: FrameworkAdapter) => Promise<boolean>;
+export declare const getProjectFramework: (rc: RCFile, relativeProjectPath: string) => string | undefined;

package/bin/templates.d.ts

@@ -0,0 +1,14 @@
+declare const templateLoaders: {
+    readonly 'salty.config.ts': () => Promise<any>;
+    readonly 'saltygen/index.css': () => Promise<any>;
+    readonly 'react/styled-file.ts': () => Promise<any>;
+    readonly 'react/vanilla-file.ts': () => Promise<any>;
+    readonly 'astro/styled-file.ts': () => Promise<any>;
+    readonly 'astro/component.astro': () => Promise<any>;
+};
+export type TemplateKey = keyof typeof templateLoaders;
+export declare const readTemplate: <T extends object>(key: TemplateKey, options?: T) => Promise<{
+    fileName: "salty.config.ts" | "saltygen/index.css" | "react/styled-file.ts" | "react/vanilla-file.ts" | "astro/styled-file.ts" | "astro/component.astro";
+    content: string;
+}>;
+export {};

package/{class-name-generator-B2Pb2obX.cjs → class-name-generator-DVuPkyrS.cjs}

@@ -2,7 +2,7 @@
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-const parseStyles = require("./parse-styles-CA3TP5n1.cjs");
+const parseStyles = require("./parse-styles-CX1WjafO.cjs");
 const dashCase = require("./dash-case-DIwKaYgE.cjs");
 const toHash = require("./to-hash-C05Y906F.cjs");
 class StylesGenerator {

package/{class-name-generator-YeSQe_Ik.js → class-name-generator-DkByUzHU.js}

@@ -1,7 +1,7 @@
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-import { p as parseAndJoinStyles } from "./parse-styles-BTIoYnBr.js";
+import { p as parseAndJoinStyles } from "./parse-styles-DIqJjXF3.js";
 import { d as dashCase } from "./dash-case-DblXvymC.js";
 import { t as toHash } from "./to-hash-DAN2LcHK.js";
 class StylesGenerator {

package/compiler/salty-compiler.cjs

@@ -10,13 +10,13 @@ const promises = require("fs/promises");
 const fs = require("fs");
 const child_process = require("child_process");
 const compiler_helpers = require("./helpers.cjs");
-const defineTemplates = require("../define-templates-Deq1aCbN.cjs");
 const dashCase = require("../dash-case-DIwKaYgE.cjs");
 const toHash = require("../to-hash-C05Y906F.cjs");
-const parseStyles = require("../parse-styles-CA3TP5n1.cjs");
+const defineTemplates = require("../define-templates-Deq1aCbN.cjs");
+const parseStyles = require("../parse-styles-CX1WjafO.cjs");
 const css_merge = require("../css/merge.cjs");
-const compiler_getFiles = require("./get-files.cjs");
 const parsers_index = require("../parsers/index.cjs");
+const compiler_getFiles = require("./get-files.cjs");
 const console = require("console");
 var _documentCurrentScript = typeof document !== "undefined" ? document.currentScript : null;
 function _interopNamespaceDefault(e) {
@@ -111,7 +111,7 @@ const saltyReset = {
   }
 };
 class SaltyCompiler {
-  constructor(projectRootDir) {
+  constructor(projectRootDir, options = {}) {
     __publicField(this, "importFile", (path2) => {
       const now = Date.now();
       return import(
@@ -348,7 +348,7 @@ ${currentFile}`;
           });
         }
         const otherGlobalCssFiles = globalCssFiles.map((file) => `@import url('./css/${file}');`).join("\n");
-        const globalCssFilenames = ["_variables.css", "_reset.css", "_global.css", "_templates.css"];
+        const globalCssFilenames = ["_variables.css", "_reset.css", "_global.css", "_templates.css", "_fonts.css"];
         const importsWithData = globalCssFilenames.filter((file) => {
           try {
             const data = fs.readFileSync(path.join(destDir, "css", file), "utf8");
@@ -359,7 +359,7 @@ ${currentFile}`;
         });
         const globalImports = importsWithData.map((file) => `@import url('./css/${file}');`);
         const generatorText = "/*!\n * Generated with Salty CSS (https://salty-css.dev)\n * Do not edit this file directly\n */\n";
-        let cssContent = `${generatorText}@layer reset, global, templates, l0, l1, l2, l3, l4, l5, l6, l7, l8;
+        let cssContent = `${generatorText}@layer reset, global, templates, fonts, l0, l1, l2, l3, l4, l5, l6, l7, l8;
 
 ${globalImports.join(
           "\n"
@@ -405,7 +405,8 @@ ${css}
         mediaQueries: [],
         globalStyles: [],
         variables: [],
-        templates: []
+        templates: [],
+        fonts: []
       };
       await Promise.all(
         [...configFiles].map(async (src) => {
@@ -415,6 +416,7 @@ ${css}
             else if (value.isGlobalDefine) generationResults.globalStyles.push(value);
             else if (value.isDefineVariables) generationResults.variables.push(value);
             else if (value.isDefineTemplates) generationResults.templates.push(value._setPath(`${name};;${outputFilePath}`));
+            else if (value.isDefineFont) generationResults.fonts.push(value);
           });
         })
       );
@@ -516,6 +518,22 @@ ${css}
       const configTemplateFactories = config.templates ? [defineTemplates.defineTemplates(config.templates)._setPath(`config;;${configPath}`)] : [];
       const templateFactories = css_merge.mergeFactories(generationResults.templates, configTemplateFactories);
       configCacheContent.templatePaths = Object.fromEntries(Object.entries(templateFactories).map(([key, faktory]) => [key, faktory._path]));
+      const fontsStylesPath = path.join(destDir, "css/_fonts.css");
+      if (generationResults.fonts.length === 0) {
+        fs.writeFileSync(fontsStylesPath, "");
+      } else {
+        const fontImports = [];
+        const fontBodies = [];
+        for (const font of generationResults.fonts) {
+          const { imports, body } = font._toCss();
+          fontImports.push(...imports);
+          fontBodies.push(body);
+        }
+        const importBlock = fontImports.length ? `${fontImports.join("\n")}
+
+` : "";
+        fs.writeFileSync(fontsStylesPath, `${importBlock}@layer fonts { ${fontBodies.join(" ")} }`);
+      }
       const tsTokensPath = path.join(destDir, "types/css-tokens.d.ts");
       const tsVariableTokens = [...variableTokens].join("|");
       const tsTokensTypes = `
@@ -546,7 +564,8 @@ ${css}
       let currentFile = fs.readFileSync(sourceFilePath, "utf8");
       currentFile = this.replaceStyledTag(currentFile);
       currentFile = this.addConfigCache(currentFile);
-      const outputFilePath = path.join(outputDirectory, "js", hashedName + ".js");
+      const currentFileHash = toHash.toHash(currentFile);
+      const outputFilePath = path.join(outputDirectory, "js", `${hashedName}-${currentFileHash}.js`);
       const rcProject = await this.getRCProjectConfig(this.projectRootDir);
       const coreConfigPath = path.join(this.projectRootDir, (rcProject == null ? void 0 : rcProject.configDir) || "", "salty.config.ts");
       const externalModules = this.getExternalModules(coreConfigPath);
@@ -690,11 +709,13 @@ ${newContent}
       });
     });
     this.projectRootDir = projectRootDir;
+    this.options = options;
     if (typeof process === "undefined") {
       throw new Error("SaltyServer can only be used in a Node.js environment.");
     }
   }
   get isProduction() {
+    if (this.options.mode) return this.options.mode === "production";
     try {
       return process.env["NODE_ENV"] !== "development";
     } catch {

package/compiler/salty-compiler.d.ts

@@ -1,9 +1,14 @@
 import { CachedConfig, SaltyConfig } from '../config';
+export type SaltyCompilerMode = 'production' | 'development';
+export interface SaltyCompilerOptions {
+    mode?: SaltyCompilerMode;
+}
 export declare class SaltyCompiler {
     projectRootDir: string;
+    private options;
     importFile: (path: string) => Promise<any>;
     private cache;
-    constructor(projectRootDir: string);
+    constructor(projectRootDir: string, options?: SaltyCompilerOptions);
     get isProduction(): boolean;
     /**
      * Locate and read the .saltyrc.json file starting from the current directory and moving up the directory tree.
@@ -39,6 +44,7 @@ export declare class SaltyCompiler {
                 isGlobalDefine?: boolean;
                 isDefineVariables?: boolean;
                 isDefineTemplates?: boolean;
+                isDefineFont?: boolean;
                 isKeyframes?: boolean;
                 animationName?: string;
                 css?: Promise<string>;

package/compiler/salty-compiler.js

@@ -8,13 +8,13 @@ import { readFile } from "fs/promises";
 import { readFileSync, existsSync, mkdirSync, statSync, readdirSync, writeFileSync } from "fs";
 import { execSync } from "child_process";
 import { isSaltyFile, resolveExportValue, getCorePackageRoot, saltyFileExtensions } from "./helpers.js";
-import { d as defineTemplates } from "../define-templates-CVhhgPnd.js";
 import { d as dashCase } from "../dash-case-DblXvymC.js";
 import { t as toHash } from "../to-hash-DAN2LcHK.js";
-import { p as parseAndJoinStyles, b as parseVariableTokens } from "../parse-styles-BTIoYnBr.js";
+import { d as defineTemplates } from "../define-templates-CVhhgPnd.js";
+import { p as parseAndJoinStyles, b as parseVariableTokens } from "../parse-styles-DIqJjXF3.js";
 import { mergeObjects, mergeFactories } from "../css/merge.js";
-import { getPackageJson } from "./get-files.js";
 import { parseTemplates, getTemplateTypes } from "../parsers/index.js";
+import { getPackageJson } from "./get-files.js";
 import console from "console";
 const logger = createLogger({
   level: "debug",
@@ -91,7 +91,7 @@ const saltyReset = {
   }
 };
 class SaltyCompiler {
-  constructor(projectRootDir) {
+  constructor(projectRootDir, options = {}) {
     __publicField(this, "importFile", (path) => {
       const now = Date.now();
       return import(
@@ -328,7 +328,7 @@ ${currentFile}`;
           });
         }
         const otherGlobalCssFiles = globalCssFiles.map((file) => `@import url('./css/${file}');`).join("\n");
-        const globalCssFilenames = ["_variables.css", "_reset.css", "_global.css", "_templates.css"];
+        const globalCssFilenames = ["_variables.css", "_reset.css", "_global.css", "_templates.css", "_fonts.css"];
         const importsWithData = globalCssFilenames.filter((file) => {
           try {
             const data = readFileSync(join(destDir, "css", file), "utf8");
@@ -339,7 +339,7 @@ ${currentFile}`;
         });
         const globalImports = importsWithData.map((file) => `@import url('./css/${file}');`);
         const generatorText = "/*!\n * Generated with Salty CSS (https://salty-css.dev)\n * Do not edit this file directly\n */\n";
-        let cssContent = `${generatorText}@layer reset, global, templates, l0, l1, l2, l3, l4, l5, l6, l7, l8;
+        let cssContent = `${generatorText}@layer reset, global, templates, fonts, l0, l1, l2, l3, l4, l5, l6, l7, l8;
 
 ${globalImports.join(
           "\n"
@@ -385,7 +385,8 @@ ${css}
         mediaQueries: [],
         globalStyles: [],
         variables: [],
-        templates: []
+        templates: [],
+        fonts: []
       };
       await Promise.all(
         [...configFiles].map(async (src) => {
@@ -395,6 +396,7 @@ ${css}
             else if (value.isGlobalDefine) generationResults.globalStyles.push(value);
             else if (value.isDefineVariables) generationResults.variables.push(value);
             else if (value.isDefineTemplates) generationResults.templates.push(value._setPath(`${name};;${outputFilePath}`));
+            else if (value.isDefineFont) generationResults.fonts.push(value);
           });
         })
       );
@@ -496,6 +498,22 @@ ${css}
       const configTemplateFactories = config.templates ? [defineTemplates(config.templates)._setPath(`config;;${configPath}`)] : [];
       const templateFactories = mergeFactories(generationResults.templates, configTemplateFactories);
       configCacheContent.templatePaths = Object.fromEntries(Object.entries(templateFactories).map(([key, faktory]) => [key, faktory._path]));
+      const fontsStylesPath = join(destDir, "css/_fonts.css");
+      if (generationResults.fonts.length === 0) {
+        writeFileSync(fontsStylesPath, "");
+      } else {
+        const fontImports = [];
+        const fontBodies = [];
+        for (const font of generationResults.fonts) {
+          const { imports, body } = font._toCss();
+          fontImports.push(...imports);
+          fontBodies.push(body);
+        }
+        const importBlock = fontImports.length ? `${fontImports.join("\n")}
+
+` : "";
+        writeFileSync(fontsStylesPath, `${importBlock}@layer fonts { ${fontBodies.join(" ")} }`);
+      }
       const tsTokensPath = join(destDir, "types/css-tokens.d.ts");
       const tsVariableTokens = [...variableTokens].join("|");
       const tsTokensTypes = `
@@ -526,7 +544,8 @@ ${css}
       let currentFile = readFileSync(sourceFilePath, "utf8");
       currentFile = this.replaceStyledTag(currentFile);
       currentFile = this.addConfigCache(currentFile);
-      const outputFilePath = join(outputDirectory, "js", hashedName + ".js");
+      const currentFileHash = toHash(currentFile);
+      const outputFilePath = join(outputDirectory, "js", `${hashedName}-${currentFileHash}.js`);
       const rcProject = await this.getRCProjectConfig(this.projectRootDir);
       const coreConfigPath = join(this.projectRootDir, (rcProject == null ? void 0 : rcProject.configDir) || "", "salty.config.ts");
       const externalModules = this.getExternalModules(coreConfigPath);
@@ -670,11 +689,13 @@ ${newContent}
       });
     });
     this.projectRootDir = projectRootDir;
+    this.options = options;
     if (typeof process === "undefined") {
       throw new Error("SaltyServer can only be used in a Node.js environment.");
     }
   }
   get isProduction() {
+    if (this.options.mode) return this.options.mode === "production";
     try {
       return process.env["NODE_ENV"] !== "development";
     } catch {

package/config/index.cjs

@@ -5,8 +5,10 @@ const defineTemplates = require("../define-templates-Deq1aCbN.cjs");
 const defineConfig = (config) => {
   return config;
 };
+exports.FontFactory = factories_index.FontFactory;
 exports.GlobalStylesFactory = factories_index.GlobalStylesFactory;
 exports.VariablesFactory = factories_index.VariablesFactory;
+exports.defineFont = factories_index.defineFont;
 exports.defineGlobalStyles = factories_index.defineGlobalStyles;
 exports.defineMediaQuery = factories_index.defineMediaQuery;
 exports.defineVariables = factories_index.defineVariables;

package/config/index.js

@@ -1,14 +1,16 @@
-import { GlobalStylesFactory, VariablesFactory, defineGlobalStyles, defineMediaQuery, defineVariables } from "../factories/index.js";
+import { FontFactory, GlobalStylesFactory, VariablesFactory, defineFont, defineGlobalStyles, defineMediaQuery, defineVariables } from "../factories/index.js";
 import { T, a, d } from "../define-templates-CVhhgPnd.js";
 const defineConfig = (config) => {
   return config;
 };
 export {
+  FontFactory,
   GlobalStylesFactory,
   T as TemplateFactory,
   a as TemplatesFactory,
   VariablesFactory,
   defineConfig,
+  defineFont,
   defineGlobalStyles,
   defineMediaQuery,
   d as defineTemplates,

package/css/dynamic-styles.cjs

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const parseStyles = require("../parse-styles-CX1WjafO.cjs");
+const toHash = require("../to-hash-C05Y906F.cjs");
+const cache_resolveDynamicConfigCache = require("../cache/resolve-dynamic-config-cache.cjs");
+const getDynamicStylesClassName = (styles) => {
+  return toHash.toHash(styles);
+};
+const getDynamicStylesCss = async (styles, scope) => {
+  const config = await cache_resolveDynamicConfigCache.resolveDynamicConfigCache();
+  const parsed = await parseStyles.parseStyles(styles, scope, config);
+  return parsed.join("\n");
+};
+exports.getDynamicStylesClassName = getDynamicStylesClassName;
+exports.getDynamicStylesCss = getDynamicStylesCss;

package/css/dynamic-styles.d.ts

@@ -0,0 +1,10 @@
+import { BaseStyles } from '../types';
+/**
+ * Create a hash of the dynamic styles that then can be used as scope.
+ */
+export declare const getDynamicStylesClassName: (styles: BaseStyles) => string;
+/**
+ * Add any dynamic styles to your app with a custom scope.
+ * Note: this works only with server components.
+ */
+export declare const getDynamicStylesCss: (styles: BaseStyles, scope?: string) => Promise<string>;

package/css/dynamic-styles.js

@@ -0,0 +1,15 @@
+import { a as parseStyles } from "../parse-styles-DIqJjXF3.js";
+import { t as toHash } from "../to-hash-DAN2LcHK.js";
+import { resolveDynamicConfigCache } from "../cache/resolve-dynamic-config-cache.js";
+const getDynamicStylesClassName = (styles) => {
+  return toHash(styles);
+};
+const getDynamicStylesCss = async (styles, scope) => {
+  const config = await resolveDynamicConfigCache();
+  const parsed = await parseStyles(styles, scope, config);
+  return parsed.join("\n");
+};
+export {
+  getDynamicStylesClassName,
+  getDynamicStylesCss
+};

package/css/index.cjs

@@ -4,9 +4,12 @@ const css_keyframes = require("./keyframes.cjs");
 const css_media = require("./media.cjs");
 const css_token = require("./token.cjs");
 const css_merge = require("./merge.cjs");
+const css_dynamicStyles = require("./dynamic-styles.cjs");
 exports.keyframes = css_keyframes.keyframes;
 exports.MediaQueryFactory = css_media.MediaQueryFactory;
 exports.media = css_media.media;
 exports.token = css_token.token;
 exports.mergeFactories = css_merge.mergeFactories;
 exports.mergeObjects = css_merge.mergeObjects;
+exports.getDynamicStylesClassName = css_dynamicStyles.getDynamicStylesClassName;
+exports.getDynamicStylesCss = css_dynamicStyles.getDynamicStylesCss;

package/css/index.d.ts

@@ -2,3 +2,4 @@ export * from './keyframes';
 export * from './media';
 export * from './token';
 export * from './merge';
+export * from './dynamic-styles';

package/css/index.js

@@ -2,8 +2,11 @@ import { keyframes } from "./keyframes.js";
 import { MediaQueryFactory, media } from "./media.js";
 import { token } from "./token.js";
 import { mergeFactories, mergeObjects } from "./merge.js";
+import { getDynamicStylesClassName, getDynamicStylesCss } from "./dynamic-styles.js";
 export {
   MediaQueryFactory,
+  getDynamicStylesClassName,
+  getDynamicStylesCss,
   keyframes,
   media,
   mergeFactories,

package/css/keyframes.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const parseStyles = require("../parse-styles-CA3TP5n1.cjs");
+const parseStyles = require("../parse-styles-CX1WjafO.cjs");
 const toHash = require("../to-hash-C05Y906F.cjs");
 const keyframes = ({ animationName: _name, params: _params, appendInitialStyles, ...keyframes2 }) => {
   const modifyKeyframes = async (params = {}) => {

package/css/keyframes.js

@@ -1,4 +1,4 @@
-import { p as parseAndJoinStyles } from "../parse-styles-BTIoYnBr.js";
+import { p as parseAndJoinStyles } from "../parse-styles-DIqJjXF3.js";
 import { t as toHash } from "../to-hash-DAN2LcHK.js";
 const keyframes = ({ animationName: _name, params: _params, appendInitialStyles, ...keyframes2 }) => {
   const modifyKeyframes = async (params = {}) => {

package/factories/define-font.d.ts

@@ -0,0 +1,28 @@
+import { DefineFontOptions } from '../types/font-types';
+export interface FontCss {
+    /** `@import url(...)` lines that must sit at the top of the stylesheet, before any `@layer`. */
+    imports: string[];
+    /** Body that goes inside the `@layer fonts { ... }` wrapper. */
+    body: string;
+}
+export declare class FontFactory {
+    readonly _options: DefineFontOptions;
+    readonly variable: string;
+    readonly fontFamily: string;
+    readonly className: string;
+    constructor(_options: DefineFontOptions);
+    get isDefineFont(): true;
+    /** Acts as a string equal to the resolved font-family value. */
+    toString(): string;
+    /** Inline-style helper: spread onto a React `style` prop. */
+    get style(): Record<string, string>;
+    /** Build the CSS pieces written to `_fonts.css`. */
+    _toCss(): FontCss;
+}
+/**
+ * Define a custom font that is registered globally as `@font-face` and exposed
+ * as a CSS variable. The returned object stringifies to its `font-family`
+ * value, and exposes `.variable`, `.fontFamily`, `.className`, and `.style`
+ * for use in styles and components.
+ */
+export declare const defineFont: (options: DefineFontOptions) => FontFactory;

package/factories/index.cjs

@@ -1,7 +1,133 @@
 "use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const dashCase = require("../dash-case-DIwKaYgE.cjs");
+const toHash = require("../to-hash-C05Y906F.cjs");
 const css_media = require("../css/media.cjs");
 const defineTemplates = require("../define-templates-Deq1aCbN.cjs");
+const FONT_FORMAT_BY_EXTENSION = {
+  woff2: "woff2",
+  woff: "woff",
+  ttf: "truetype",
+  otf: "opentype",
+  eot: "embedded-opentype",
+  svg: "svg",
+  ttc: "collection"
+};
+const detectFontFormat = (url) => {
+  const cleaned = url.split("?")[0].split("#")[0];
+  const dot = cleaned.lastIndexOf(".");
+  if (dot === -1) return void 0;
+  const ext = cleaned.slice(dot + 1).toLowerCase();
+  return FONT_FORMAT_BY_EXTENSION[ext];
+};
+const toFontSrc = (entry) => {
+  if (typeof entry === "string") return { url: entry, format: detectFontFormat(entry) };
+  return entry;
+};
+const normalizeSources = (src) => {
+  if (Array.isArray(src)) return src.map(toFontSrc);
+  return [toFontSrc(src)];
+};
+const normalizeVariable = (variable) => {
+  const trimmed = variable.trim();
+  const stripped = trimmed.replace(/^--/, "");
+  if (!stripped) throw new Error(`defineFont: invalid \`variable\` value "${variable}".`);
+  return `--${dashCase.dashCase(stripped)}`;
+};
+const deriveVariable = (options) => {
+  const hashSource = [options.name, options.fallback, "variants" in options ? options.variants : void 0, "import" in options ? options.import : void 0];
+  return `--font-${dashCase.dashCase(options.name)}-${toHash.toHash(hashSource, 6)}`;
+};
+const quoteFamily = (name) => {
+  if (/^["'].*["']$/.test(name)) return name;
+  if (/\s/.test(name)) return `"${name}"`;
+  return name;
+};
+const buildFontFamilyValue = (name, fallback) => {
+  const head = quoteFamily(name);
+  if (!fallback || fallback.length === 0) return head;
+  return [head, ...fallback].join(", ");
+};
+const formatSrc = (src) => {
+  const parts = [`url("${src.url}")`];
+  if (src.format) parts.push(`format("${src.format}")`);
+  if (src.tech) parts.push(`tech(${src.tech})`);
+  return parts.join(" ");
+};
+const variantToFontFace = (name, variant, defaultDisplay) => {
+  const sources = normalizeSources(variant.src);
+  if (sources.length === 0) {
+    throw new Error(`defineFont(${name}): variant must declare at least one \`src\`.`);
+  }
+  const lines = [`font-family: ${quoteFamily(name)};`, `src: ${sources.map(formatSrc).join(", ")};`, `font-display: ${variant.display ?? defaultDisplay};`];
+  if (variant.weight !== void 0) lines.push(`font-weight: ${variant.weight};`);
+  if (variant.style !== void 0) lines.push(`font-style: ${variant.style};`);
+  if (variant.stretch !== void 0) lines.push(`font-stretch: ${variant.stretch};`);
+  if (variant.unicodeRange !== void 0) lines.push(`unicode-range: ${variant.unicodeRange};`);
+  if (variant.ascentOverride !== void 0) lines.push(`ascent-override: ${variant.ascentOverride};`);
+  if (variant.descentOverride !== void 0) lines.push(`descent-override: ${variant.descentOverride};`);
+  if (variant.lineGapOverride !== void 0) lines.push(`line-gap-override: ${variant.lineGapOverride};`);
+  if (variant.sizeAdjust !== void 0) lines.push(`size-adjust: ${variant.sizeAdjust};`);
+  return `@font-face { ${lines.join(" ")} }`;
+};
+class FontFactory {
+  constructor(_options) {
+    __publicField(this, "variable");
+    __publicField(this, "fontFamily");
+    __publicField(this, "className");
+    this._options = _options;
+    if (!_options || !_options.name) {
+      throw new Error("defineFont: `name` is required.");
+    }
+    if ("variants" in _options && "import" in _options && _options.import !== void 0 && _options.variants !== void 0) {
+      throw new Error("defineFont: provide either `variants` or `import`, not both.");
+    }
+    if (!("variants" in _options && _options.variants) && !("import" in _options && _options.import)) {
+      throw new Error("defineFont: must provide either `variants` or `import`.");
+    }
+    this.variable = _options.variable ? normalizeVariable(_options.variable) : deriveVariable(_options);
+    this.fontFamily = buildFontFamilyValue(_options.name, _options.fallback);
+    this.className = `font-${dashCase.dashCase(_options.name)}`;
+  }
+  get isDefineFont() {
+    return true;
+  }
+  /** Acts as a string equal to the resolved font-family value. */
+  toString() {
+    return this.fontFamily;
+  }
+  /** Inline-style helper: spread onto a React `style` prop. */
+  get style() {
+    return {
+      fontFamily: this.fontFamily,
+      [this.variable]: this.fontFamily
+    };
+  }
+  /** Build the CSS pieces written to `_fonts.css`. */
+  _toCss() {
+    const imports = [];
+    const blocks = [];
+    if ("import" in this._options && this._options.import) {
+      imports.push(`@import url("${this._options.import}");`);
+    } else if ("variants" in this._options && this._options.variants) {
+      const display = this._options.display ?? "swap";
+      for (const variant of this._options.variants) {
+        blocks.push(variantToFontFace(this._options.name, variant, display));
+      }
+    }
+    blocks.push(
+      `:root { ${this.variable}: ${this.fontFamily}; }`,
+      `.${this.className} { ${this.variable}: ${this.fontFamily}; font-family: var(${this.variable}); }`
+    );
+    return { imports, body: blocks.join(" ") };
+  }
+}
+const defineFont = (options) => {
+  return new FontFactory(options);
+};
 class GlobalStylesFactory {
   constructor(_current) {
     this._current = _current;
@@ -30,8 +156,10 @@ const defineVariables = (variables) => {
 exports.TemplateFactory = defineTemplates.TemplateFactory;
 exports.TemplatesFactory = defineTemplates.TemplatesFactory;
 exports.defineTemplates = defineTemplates.defineTemplates;
+exports.FontFactory = FontFactory;
 exports.GlobalStylesFactory = GlobalStylesFactory;
 exports.VariablesFactory = VariablesFactory;
+exports.defineFont = defineFont;
 exports.defineGlobalStyles = defineGlobalStyles;
 exports.defineMediaQuery = defineMediaQuery;
 exports.defineVariables = defineVariables;

package/factories/index.d.ts

@@ -1,3 +1,4 @@
+export * from './define-font';
 export * from './define-global-styles';
 export * from './define-media-query';
 export * from './define-variables';