New(React): Set default value for undefined properties #15

master-co · Feb 6, 2023 · c8777a5 · c8777a5
1 parent 9f5e6af
commit c8777a5
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 6 deletions.
diff --git a/packages/react/src/index.tsx b/packages/react/src/index.tsx
@@ -142,12 +142,10 @@ function handle<K extends IntrinsicElementsKeys | React.ComponentType<any>, E ex
             }
 
             for (const name in propClassesMap) {
-                const value = props[name] || props['$' + name]
-                if (value) {
-                    const classes = propClassesMap[name][value]
-                    if (classes) {
-                        classNames.push(classes)
-                    }
+                const value = props[name] ?? props['$' + name] ?? ''
+                const classes = propClassesMap[name][value]
+                if (classes) {
+                    classNames.push(classes)
                 }
             }
 

diff --git a/packages/react/tests/index.test.tsx b/packages/react/tests/index.test.tsx
@@ -97,6 +97,7 @@ test('Alternative syntax', () => {
         'font:semibold rounded',
         {
             intent: {
+                '': 'bg:purple-50 fg:black bg:purple-60:hover',
                 primary: 'bg:blue-50 fg:white bg:blue-60:hover',
                 secondary: 'bg:white fg:gray-80 b:gray-40 bg:gray-50:hover',
             },
@@ -116,6 +117,8 @@ test('Alternative syntax', () => {
         { intent: 'primary', size: 'md', disabled: false, $: 'uppercase' },
         ({ $intent, $size }) => $intent && $size && 'font:italic'
     )
+    expect(renderToStaticMarkup(<Button $size="md" />))
+        .toBe('<button class="font:semibold rounded bg:purple-50 fg:black bg:purple-60:hover font:16 py:2 px:4"></button>')
     expect(renderToStaticMarkup(<Button $intent="primary" $size="md" />))
         .toBe('<button class="font:semibold rounded font:italic uppercase bg:blue-50 fg:white bg:blue-60:hover font:16 py:2 px:4"></button>')
     expect(renderToStaticMarkup(<Button disabled $intent="secondary" $size="lg" />))