feat: Design tokens package (#7)

Author: jhechtf

.github/workflows/pr.yml

@@ -29,6 +29,11 @@ jobs:
           node-version: '18.x'
       - run: pnpm i --frozen-lockfile
       - run: pnpm test:changed
+      - name: Upload code coverage
+        uses: actions/upload-artifact@v4
+        with:
+          name: code-coverage-report
+          path: '**/html/**/*'
   format:
     name: Format checker
     runs-on: ubuntu-latest

.gitignore

@@ -36,3 +36,4 @@ yarn-error.log*
 # Misc
 .DS_Store
 *.pem
+html/

.prettierrc

@@ -1,5 +1,7 @@
 {
   "singleQuote": true,
   "tabWidth": 2,
-  "semi": true
+  "semi": true,
+  "arrowParens": "avoid",
+  "endOfLine": "lf"
 }

.vscode/settings.json

@@ -7,5 +7,9 @@
   "lnf.aliases": {
     "$/": "${workspaceRoot}/",
     "$packages/": "${workspaceRoot}/packages/"
+  },
+  "[typescript]": {
+    "editor.formatOnSave": true,
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
   }
 }

packages/arktype-utils/src/formData.ts

@@ -33,7 +33,8 @@ export function formDataToObject(
       } else {
         if (pruneKeyNames && /\[.?\]/.test(key))
           key = key.replace(/\[.?\]/, '');
-        ret[key] = all.map((v) =>
+
+        ret[key] = all.map(v =>
           typeof v === 'string' ? stringToJSValue(v) : v,
         );
       }

packages/arktype-utils/src/strToObject.ts

@@ -0,0 +1,23 @@
+/**
+ *
+ * @description Modifies the base object the structure of the `str`
+ * @param str
+ * @param value
+ * @param base
+ * @returns
+ */
+export function strToObject<T>(
+  str: string,
+  value: T,
+  base: object = {},
+): object {
+  const ret = base;
+  const parts = str.split('.');
+
+  while (parts.length > 0) {
+    const key = parts.shift();
+    if (!key) continue;
+  }
+
+  return ret;
+}

packages/arktype-utils/src/strToObjects.test.ts

@@ -0,0 +1,52 @@
+import { describe, expect, it } from 'vitest';
+import { strToObject } from './strToObject.js';
+
+describe('strToObjects', () => {
+  it('does a thing', () => {
+    const a = strToObject('a[4]', 3);
+    expect(a.a[4]).toBe(3);
+    expect(a.a).toHaveLength(5);
+    expect(a.a.slice(0, 3).every(f => f === undefined)).toBeTruthy();
+    expect(1).toBe(1);
+
+    const b = strToObject('b[]', 7);
+    expect(b.b).toHaveLength(1);
+    expect(b.b[0]).toBe(7);
+
+    expect(strToObject('a', 3)).toStrictEqual({
+      a: 3,
+    });
+    // const a = strToObject('a.b', 3);
+    // expect(a).toStrictEqual({
+    //   a: {
+    //     b: 3
+    //   }
+    // });
+    // const b = strToObject('a[]', 3);
+
+    // expect(b).toStrictEqual({
+    //   a: [3],
+    // });
+
+    // const c = strToObject('a.b.c[]', 4);
+
+    // expect(c).toStrictEqual({
+    //   a: {
+    //     b: {
+    //       c: [4],
+    //     },
+    //   },
+    // });
+
+    // expect(strToObject('a', 3, { b: 7 })).toStrictEqual({
+    //   a: 3,
+    //   b: 7,
+    // });
+  });
+
+  // expect(strToObject('a[].b[]', 7)).toStrictEqual({
+  //   a: [
+  //     { b: [7] }
+  //   ]
+  // });
+});

packages/design-tokens/design.tokens.ts

@@ -0,0 +1,25 @@
+import { makeConfig } from './src/types.js';
+
+export default makeConfig({
+  tokens: {
+    red: {
+      100: 'lightred',
+      500: 'red',
+      900: 'darkred',
+    },
+    blue: {
+      100: 'lightblue',
+      500: 'blue',
+      900: 'darkblue',
+    },
+
+    primary: '!blue.900',
+    secondary: '!red.100',
+  },
+  variants: {
+    'prefer-color-scheme: dark': {
+      something: 'red',
+      primary: '!blue.100',
+    },
+  },
+});