@thi.ng/hiccup-css 2.7.95 → 2.8.0

package/README.md

@@ -125,7 +125,7 @@ Browser ESM import:
 
 [JSDelivr documentation](https://www.jsdelivr.com/)
 
-Package sizes (brotli'd, pre-treeshake): ESM: 2.24 KB
+Package sizes (brotli'd, pre-treeshake): ESM: 2.42 KB
 
 ## Dependencies
 

package/font-face.d.ts

@@ -0,0 +1,21 @@
+import type { CSSOpts } from "./api.js";
+export interface FontFaceSpec {
+    family: string;
+    src: {
+        format: string;
+        url: string;
+    }[];
+    style: string;
+    weight: string;
+    stretch?: string;
+    display?: string;
+    unicode?: string[];
+    ascent?: string;
+    descent?: string;
+    feature?: string;
+    variation?: string;
+    lineGap?: string;
+    size?: string;
+}
+export declare const at_fontface: (spec: FontFaceSpec) => (acc: string[], opts: CSSOpts) => string[];
+//# sourceMappingURL=font-face.d.ts.map

package/font-face.js

@@ -0,0 +1,32 @@
+import { formatDecls, indent } from "./impl.js";
+const at_fontface = (spec) => {
+  return (acc, opts) => {
+    const outer = indent(opts);
+    acc.push(
+      `${outer}@font-face${opts.format.declStart}${formatDecls(
+        {
+          "font-family": spec.family,
+          "font-style": spec.style,
+          "font-weight": spec.weight,
+          "font-stretch": spec.stretch,
+          "font-display": spec.display,
+          src: spec.src.map(
+            ({ format, url }) => `url(${url}) format(${format})`
+          ),
+          "unicode-range": spec.unicode,
+          "ascent-override": spec.ascent,
+          "descent-override": spec.ascent,
+          "font-feature-settings": spec.feature,
+          "font-variation-settings": spec.variation,
+          "line-gap-override": spec.lineGap,
+          "size-adjust": spec.size
+        },
+        opts
+      )}${outer}${opts.format.declEnd}`
+    );
+    return acc;
+  };
+};
+export {
+  at_fontface
+};

package/impl.js

@@ -87,6 +87,7 @@ const formatDecls = (rules, opts) => {
   for (const r in rules) {
     if (rules.hasOwnProperty(r)) {
       let val = rules[r];
+      if (val == null) continue;
       if (isFunction(val)) {
         val = val(rules);
       }

package/index.d.ts

@@ -4,6 +4,7 @@ export * from "./attribs.js";
 export * from "./comment.js";
 export * from "./conditional.js";
 export * from "./css.js";
+export * from "./font-face.js";
 export * from "./import.js";
 export * from "./inject.js";
 export * from "./keyframes.js";

package/index.js

@@ -4,6 +4,7 @@ export * from "./attribs.js";
 export * from "./comment.js";
 export * from "./conditional.js";
 export * from "./css.js";
+export * from "./font-face.js";
 export * from "./import.js";
 export * from "./inject.js";
 export * from "./keyframes.js";

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@thi.ng/hiccup-css",
-	"version": "2.7.95",
+	"version": "2.8.0",
 	"description": "CSS from nested JS data structures",
 	"type": "module",
 	"module": "./index.js",
@@ -96,6 +96,9 @@
 		"./css": {
 			"default": "./css.js"
 		},
+		"./font-face": {
+			"default": "./font-face.js"
+		},
 		"./import": {
 			"default": "./import.js"
 		},
@@ -130,5 +133,5 @@
 		],
 		"year": 2016
 	},
-	"gitHead": "c47c56420bcae2e0477d252a497be44f08ca185a"
+	"gitHead": "c87ef48d7000abc4e38ecf04ab8685f3901b2952"
 }

package/quoted-functions.d.ts

@@ -3,6 +3,7 @@ import { at_namespace } from "./namespace.js";
 /** @internal */
 export declare const QUOTED_FNS: {
     "@comment": (body: string, force?: boolean) => import("./api.js").RuleFn;
+    "@font-face": (spec: import("./font-face.js").FontFaceSpec) => (acc: string[], opts: import("./api.js").CSSOpts) => string[];
     "@import": (url: string, ...queries: string[]) => import("./api.js").RuleFn;
     "@keyframes": typeof at_keyframes;
     "@media": (cond: import("./api.js").Conditional, rules: any[]) => import("./api.js").RuleFn;

package/quoted-functions.js

@@ -1,4 +1,5 @@
 import { comment } from "./comment.js";
+import { at_fontface } from "./font-face.js";
 import { at_import } from "./import.js";
 import { at_keyframes } from "./keyframes.js";
 import { at_media } from "./media.js";
@@ -6,6 +7,7 @@ import { at_namespace } from "./namespace.js";
 import { at_supports } from "./supports.js";
 const QUOTED_FNS = {
   "@comment": comment,
+  "@font-face": at_fontface,
   "@import": at_import,
   "@keyframes": at_keyframes,
   "@media": at_media,