Merge pull request #588 from components-ai/tweaks

Fix gap theme values, make font family consistent in layers panel

Author: johno

.changeset/eight-suns-search.md

@@ -0,0 +1,5 @@
+---
+'@compai/css-gui': patch
+---
+
+Fix inconsistent typefaces

.changeset/strange-wolves-explain.md

@@ -0,0 +1,5 @@
+---
+'@compai/css-gui': patch
+---
+
+Send along options to stringify in tuple schema

packages/gui/src/components/html/TreeNode.tsx

@@ -150,6 +150,7 @@ export function TreeNode({ value, path, onSelect, onChange }: TreeNodeProps) {
         margin: 0,
         padding: 0,
         fontSize: '14px',
+        fontFamily: 'monospace',
       }}
       onClick={() => {
         if (isSelected) {
@@ -171,6 +172,7 @@ export function TreeNode({ value, path, onSelect, onChange }: TreeNodeProps) {
         backgroundColor: isSelected ? '#ff0' : 'background',
         color: 'text',
         fontSize: '14px',
+        fontFamily: 'monospace',
         fontWeight: isSelected ? 700 : 400,
         borderRadius: '6px',
         px: 2,
@@ -300,6 +302,7 @@ export function TreeNode({ value, path, onSelect, onChange }: TreeNodeProps) {
               py: 0,
               px: 2,
               fontSize: '14px',
+              fontFamily: 'monospace',
               bg: isSelected ? '#ff0' : 'background',
               fontWeight: isSelected ? 700 : 400,
               borderRadius: '6px',

packages/gui/src/components/schemas/tuple.tsx

@@ -37,9 +37,11 @@ export function tupleSchema<T>({
     ? [itemSchema.defaultValue]
     : labels.map(() => itemSchema.defaultValue)
 
-  function stringify(value: T[]) {
+  function stringify(value: T[], ...args: any[]) {
     return (
-      value?.map((item) => itemSchema.stringify(item)).join(separator) ?? null
+      value
+        ?.map((item) => itemSchema.stringify(item, ...args))
+        .join(separator) ?? null
     )
   }