@cntrl-site/sdk 0.0.7 → 0.1.0

package/lib/FontFaceGenerator/FontFaceGenerator.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FontFaceGenerator = void 0;
+const FILE_TYPES_MAP = {
+    ttf: 'truetype'
+};
+class FontFaceGenerator {
+    constructor(fonts) {
+        this.fonts = fonts;
+    }
+    generate() {
+        return this.fonts.map(font => {
+            const eotFile = font.files.find(file => file.type === 'eot');
+            const otherFiles = font.files
+                .filter(file => file.type !== 'eot')
+                .map(file => `url('${file.url}') format('${FILE_TYPES_MAP[file.type] || file.type}')`);
+            return `
+@font-face {
+  font-family: ${font.name};
+  font-weight: ${font.weight};
+  ${eotFile ? `src: url('${eotFile.url}');\n  ` : ''}src: ${otherFiles.join(', ')};
+}`;
+        }).join('\n');
+    }
+}
+exports.FontFaceGenerator = FontFaceGenerator;

package/lib/index.js

@@ -1,7 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getLayoutStyles = exports.CntrlClient = void 0;
-var Client_1 = require("./client/Client");
+exports.getLayoutStyles = exports.FontFaceGenerator = exports.CntrlClient = void 0;
+var Client_1 = require("./Client/Client");
 Object.defineProperty(exports, "CntrlClient", { enumerable: true, get: function () { return Client_1.Client; } });
+var FontFaceGenerator_1 = require("./FontFaceGenerator/FontFaceGenerator");
+Object.defineProperty(exports, "FontFaceGenerator", { enumerable: true, get: function () { return FontFaceGenerator_1.FontFaceGenerator; } });
 var utils_1 = require("./utils");
 Object.defineProperty(exports, "getLayoutStyles", { enumerable: true, get: function () { return utils_1.getLayoutStyles; } });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cntrl-site/sdk",
-  "version": "0.0.7",
+  "version": "0.1.0",
   "description": "Generic SDK for use in public websites.",
   "main": "lib/index.js",
   "types": "src/index.ts",
@@ -24,13 +24,16 @@
     "lib": "lib"
   },
   "dependencies": {
-    "@cntrl-site/core": "^1.0.9",
+    "@cntrl-site/core": "^1.0.12",
     "@types/isomorphic-fetch": "^0.0.36",
     "isomorphic-fetch": "^3.0.0"
   },
   "devDependencies": {
     "@tsconfig/node16": "^1.0.3",
     "@tsconfig/recommended": "^1.0.1",
+    "@types/jest": "^29.0.0",
+    "jest": "^28.1.3",
+    "ts-jest": "^28.0.8",
     "typescript": "^4.7.4"
   }
 }

package/src/FontFaceGenerator/FontFaceGenerator.test.ts

@@ -0,0 +1,53 @@
+import { FontFaceGenerator } from './FontFaceGenerator';
+import { FontFileTypes, TCustomFont } from '@cntrl-site/core';
+
+describe('FontFaceGenerator', () => {
+  it('generates font face with eot', () => {
+    const fonts: TCustomFont[] = [
+      {
+        name: 'Aeonik',
+        weight: 400,
+        style: 'normal',
+        files: [
+          {
+            type: FontFileTypes.EOT,
+            url: 'link/to/font.eot'
+          },
+          {
+            type: FontFileTypes.WOFF,
+            url: 'link/to/font.woff'
+          }
+        ]
+      },
+      {
+        name: 'Anek Odia',
+        weight: 700,
+        style: 'italic',
+        files: [
+          {
+            type: FontFileTypes.WOFF,
+            url: 'link/to/font.woff'
+          },
+          {
+            type: FontFileTypes.TTF,
+            url: 'link/to/font.ttf'
+          }
+        ]
+      }
+    ];
+    const generator = new FontFaceGenerator(fonts);
+    expect(generator.generate()).toEqual(`
+@font-face {
+  font-family: Aeonik;
+  font-weight: 400;
+  src: url('link/to/font.eot');
+  src: url('link/to/font.woff') format('woff');
+}
+
+@font-face {
+  font-family: Anek Odia;
+  font-weight: 700;
+  src: url('link/to/font.woff') format('woff'), url('link/to/font.ttf') format('truetype');
+}`)
+  });
+});

package/src/FontFaceGenerator/FontFaceGenerator.ts

@@ -0,0 +1,26 @@
+import { TCustomFont } from '@cntrl-site/core';
+
+const FILE_TYPES_MAP: Record<string, string> = {
+  ttf: 'truetype'
+};
+
+export class FontFaceGenerator {
+  constructor(
+    private fonts: TCustomFont[]
+  ) {}
+
+  generate(): string {
+    return this.fonts.map(font => {
+      const eotFile = font.files.find(file => file.type === 'eot');
+      const otherFiles = font.files
+        .filter(file => file.type !== 'eot')
+        .map(file => `url('${file.url}') format('${FILE_TYPES_MAP[file.type] || file.type}')`);
+      return `
+@font-face {
+  font-family: ${font.name};
+  font-weight: ${font.weight};
+  ${eotFile ? `src: url('${eotFile.url}');\n  ` : ''}src: ${otherFiles.join(', ')};
+}`;
+    }).join('\n');
+  }
+}

package/src/index.ts

@@ -1,2 +1,3 @@
-export { Client as CntrlClient } from './client/Client';
+export { Client as CntrlClient } from './Client/Client';
+export { FontFaceGenerator } from './FontFaceGenerator/FontFaceGenerator';
 export { getLayoutStyles } from './utils';

package/src/utils.ts

@@ -19,3 +19,4 @@ export function getLayoutStyles<V, M> (
     '');
   return mediaQueries;
 }
+