Merge branch 'main' into docs/keystatic-in-monorepo

.eslintrc.js

@@ -37,6 +37,7 @@ module.exports = {
     'jest/valid-title': OFF,
     'jest/no-try-expect': OFF,
     'jest/no-disabled-tests': ERROR,
+    'jest/no-alias-methods': ERROR,
     'jsx-quotes': ERROR,
     'no-trailing-spaces': ERROR,
     'no-undef': ERROR,

.gitignore

@@ -46,6 +46,9 @@ design-system/docs/generated
 design-system/docs/public/playroom
 design-system/docs/public/storybook
 
+# pagefind
+docs/public/pagefind
+
 # Test coverage
 coverage
 

design-system/docs/CHANGELOG.md

@@ -1,5 +1,36 @@
 # @voussoir/docs
 
+## 0.0.25
+
+### Patch Changes
+
+- Updated dependencies [dad16ba6]
+  - @keystar/ui@0.7.0
+
+## 0.0.24
+
+### Patch Changes
+
+- Updated dependencies [ad59430d]
+- Updated dependencies [53d8fcc7]
+  - @keystar/ui@0.6.0
+
+## 0.0.23
+
+### Patch Changes
+
+- Updated dependencies [f4aaa8e3]
+  - @keystar/ui@0.5.0
+
+## 0.0.22
+
+### Patch Changes
+
+- 0229959f: Replace hard-coded class names with `ClassList` instances.
+- Updated dependencies [9854c6b1]
+- Updated dependencies [0229959f]
+  - @keystar/ui@0.4.2
+
 ## 0.0.21
 
 ### Patch Changes

design-system/docs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@keystar/docs",
-  "version": "0.0.21",
+  "version": "0.0.25",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -19,7 +19,7 @@
     "@babel/core": "^7.23.0",
     "@babel/runtime": "^7.18.3",
     "@internationalized/date": "^3.5.0",
-    "@keystar/ui": "^0.4.0",
+    "@keystar/ui": "^0.7.0",
     "@markdoc/markdoc": "^0.3.0",
     "@react-aria/i18n": "^3.8.0",
     "@types/js-yaml": "^4.0.5",

design-system/jest.config.js

@@ -3,10 +3,11 @@ const config = {
   displayName: 'keystar/ui',
   testEnvironment: 'jsdom',
   clearMocks: true,
-  setupFilesAfterEnv: ['<rootDir>/jest-setup.ts'],
+  setupFilesAfterEnv: ['<rootDir>/pkg/jest-setup.ts'],
   transform: {
     '^.+\\.[tj]sx?$': ['babel-jest', { rootMode: 'upward' }],
   },
+  extensionsToTreatAsEsm: ['.ts', '.tsx'],
 };
 
 module.exports = config;

design-system/pkg/CHANGELOG.md

@@ -1,5 +1,88 @@
 # @keystar/ui
 
+## 0.7.0
+
+### Minor Changes
+
+- dad16ba6: Reduce size of icons
+
+## 0.6.0
+
+### Minor Changes
+
+- 53d8fcc7: Update icons
+
+### Patch Changes
+
+- ad59430d: Fix `onEnter` callback in overlays
+
+## 0.5.0
+
+### Minor Changes
+
+- f4aaa8e3: Switch build to ESM-only
+
+## 0.4.9
+
+### Patch Changes
+
+- 05a71cde: Remove `react-transition-group`
+
+## 0.4.8
+
+### Patch Changes
+
+- bebaa922: Fix `NumberField` not showing error messages
+
+## 0.4.7
+
+### Patch Changes
+
+- 90fd3809: Filter out DOM props TableVirtualizer
+
+## 0.4.6
+
+### Patch Changes
+
+- d76af081: Fix default exports in Node ESM
+
+## 0.4.5
+
+### Patch Changes
+
+- 0ca7f47a: Support "boundary" + "portal" props on `EditorPopover` component.
+  Simulate clipping for portal'd popovers.
+- 13206393: Support "labelElementType" on `Field` component.
+- 56b6b121: Remove support for "uncontrolled state" in `EditorToolbar*`
+  components.
+- bd28cfd4: Fix `transitionProperty` typo in `ActionButton` styles.
+- 0e81263b: Refactor `ProgressCircle` — split animation properties across
+  elements to fix transform-origin issue in safari.
+- 267845b1: New `ScrollView` component from "@keystar/ui/layout" package.
+- 3288c624: Expose `useProseStyleProps` from "@keystar/ui/typography" package.
+
+## 0.4.4
+
+### Patch Changes
+
+- 0673fb03: Fix field types.
+
+## 0.4.3
+
+### Patch Changes
+
+- a3f86e8f: New component `DropZone` and companion `FileTrigger` from
+  "@keystar/ui/drag-and-drop" package.
+- 2b4f24b8: Changes to `Checkbox`, `Radio`, and `Dialog` resolve overflow issues
+  within dialogs. Updated "@react-[aria|stately]/virtualizer" to latest.
+
+## 0.4.2
+
+### Patch Changes
+
+- 9854c6b1: Fix for `StatusLight` passing attributes through to DOM element.
+- 0229959f: Replace hard-coded class names with `ClassList` instances.
+
 ## 0.4.1
 
 ### Patch Changes

design-system/pkg/build-icons.ts

@@ -1,14 +1,24 @@
 import { transform } from '@svgr/core';
-// @ts-expect-error
 import _rawIcons from 'lucide-static';
 import fs from 'fs/promises';
 import path from 'path';
 
+const seenIcons = new Set<string>();
+
 const icons = Object.entries(
   _rawIcons as {
     [key: string]: string;
   }
 )
+  .filter(([, svg]) => {
+    const svgWithoutName = svg.replace(/lucide-.*"/, '');
+    if (seenIcons.has(svgWithoutName)) {
+      return false;
+    }
+    seenIcons.add(svgWithoutName);
+
+    return true;
+  })
   .map(([name, svg]) => {
     return {
       name: name + 'Icon',
@@ -18,30 +28,34 @@ const icons = Object.entries(
   .sort((a, b) => a.name.localeCompare(b.name));
 
 async function writeIcons() {
-  let iconOutDir = path.join(__dirname, 'src', 'icon', 'icons');
+  let iconOutDir = path.join('src', 'icon', 'icons');
 
   await fs.mkdir(iconOutDir, { recursive: true });
   await Promise.all(
     icons.map(async icon => {
+      const name = icon.name[0].toLowerCase() + icon.name.slice(1);
       let code = await transform(
         icon.data,
         {
           icon: true,
           typescript: true,
           expandProps: false,
-
           template: function (variables, context) {
-            variables.jsx.openingElement.attributes =
-              variables.jsx.openingElement.attributes.filter(
-                attr =>
-                  attr.type !== 'JSXAttribute' ||
-                  (attr.name.name !== 'width' &&
-                    attr.name.name !== 'height' &&
-                    attr.name.name !== 'stroke' &&
-                    attr.name.name !== 'fill')
-              );
             return context.tpl`
-            export const ${variables.componentName} = ${variables.jsx};
+            export const ${name} = ${
+              variables.jsx.children.length === 1
+                ? variables.jsx.children[0]
+                : {
+                    type: 'JSXFragment',
+                    openingFragment: {
+                      type: 'JSXOpeningFragment',
+                    },
+                    closingFragment: {
+                      type: 'JSXClosingFragment',
+                    },
+                    children: variables.jsx.children,
+                  }
+            }
             `;
           },
           plugins: [
@@ -50,17 +64,24 @@ async function writeIcons() {
             '@svgr/plugin-prettier',
           ],
         },
-        { componentName: icon.name }
+        { componentName: name }
       );
-      await fs.writeFile(path.join(iconOutDir, `${icon.name}.tsx`), code);
+      await fs.writeFile(path.join(iconOutDir, `${name}.tsx`), code);
     })
   );
 }
 
 async function writeAllFile() {
   const index =
     icons
-      .map(icon => `export { ${icon.name} } from './icons/${icon.name}';`)
+      .map(
+        icon =>
+          `export { ${
+            icon.name[0].toLowerCase() + icon.name.slice(1)
+          } } from './icons/${
+            icon.name[0].toLowerCase() + icon.name.slice(1)
+          }';`
+      )
       .join('\n') + `\n`;
   await fs.writeFile('src/icon/all-inner.ts', index);
   console.info('✅ Index file written successfully');
@@ -71,10 +92,7 @@ async function writeAllFile() {
 
 async function build() {
   console.info('🧹 Cleaning existing exports');
-  await Promise.all([
-    fs.rm('icon/icons', { recursive: true, force: true }),
-    fs.rm('src/icon/icons', { recursive: true, force: true }),
-  ]);
+  await fs.rm('src/icon/icons', { recursive: true, force: true });
   console.info('🚧 Building icon exports');
 
   await writeIcons();