@storybook/react-native-ui-lite 10.2.2-alpha.3 → 10.2.2-alpha.5

package/dist/index.js

@@ -464,10 +464,6 @@ var useSelectedNode = () => (0, import_react3.useContext)(SelectedNodeContext);
 
 // src/Tree.tsx
 var import_jsx_runtime4 = require("react/jsx-runtime");
-var TextItem = import_react_native_theming3.styled.Text(({ theme }) => ({
-  fontSize: theme.typography.size.s2 + 1,
-  color: theme.color.defaultText
-}));
 var Node = import_react4.default.memo(function Node2({
   item,
   refId,
@@ -512,7 +508,7 @@ var Node = import_react4.default.memo(function Node2({
           "aria-expanded": isExpanded,
           children: [
             /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CollapseIcon, { isExpanded }),
-            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(TextItem, { children: item.renderLabel?.(item, {}) || item.name })
+            /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(RootNodeText, { children: (0, import_react_native_ui_common.startCase)(item.name) })
           ]
         }
       ),
@@ -548,7 +544,7 @@ var Node = import_react4.default.memo(function Node2({
           event.preventDefault();
           setExpanded({ ids: [item.id], value: !isExpanded });
         },
-        children: item.renderLabel?.(item) || item.name
+        children: (0, import_react_native_ui_common.startCase)(item.name)
       },
       id
     );
@@ -577,7 +573,7 @@ var RootNode = import_react_native_theming3.styled.View(() => ({
   minHeight: 34
 }));
 var RootNodeText = import_react_native_theming3.styled.Text(({ theme }) => ({
-  fontSize: theme.typography.size.s1 - 1,
+  fontSize: theme.typography.size.s2 - 1,
   fontWeight: theme.typography.weight.bold,
   color: theme.textMutedColor,
   lineHeight: 16,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react-native-ui-lite",
-  "version": "10.2.2-alpha.3",
+  "version": "10.2.2-alpha.5",
   "description": "lightweight ui components for react native storybook",
   "keywords": [
     "react",
@@ -42,8 +42,8 @@
     "@legendapp/list": "3.0.0-beta.31",
     "@nozbe/microfuzz": "^1.0.0",
     "@storybook/react": "^10.2.2",
-    "@storybook/react-native-theming": "^10.2.2-alpha.3",
-    "@storybook/react-native-ui-common": "^10.2.2-alpha.3",
+    "@storybook/react-native-theming": "^10.2.2-alpha.5",
+    "@storybook/react-native-ui-common": "^10.2.2-alpha.5",
     "polished": "^4.3.1",
     "react-native-safe-area-context": "^5"
   },
@@ -58,5 +58,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "b996f5156b78ae94b967434130a6af1bee2876a2"
+  "gitHead": "51485fba2ef3d8f323905bdbee0ad1828ce45eb4"
 }

package/src/Tree.tsx

@@ -8,6 +8,7 @@ import {
   isStoryHoistable,
   Item,
   useExpanded,
+  startCase,
 } from '@storybook/react-native-ui-common';
 import React, { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
 import { View, ViewStyle } from 'react-native';
@@ -40,11 +41,6 @@ interface NodeProps {
   status: State['status'][keyof State['status']];
 }
 
-const TextItem = styled.Text(({ theme }) => ({
-  fontSize: theme.typography.size.s2 + 1,
-  color: theme.color.defaultText,
-}));
-
 export const Node = React.memo<NodeProps>(function Node({
   item,
   refId,
@@ -92,7 +88,7 @@ export const Node = React.memo<NodeProps>(function Node({
           aria-expanded={isExpanded}
         >
           <CollapseIcon isExpanded={isExpanded} />
-          <TextItem>{item.renderLabel?.(item, {}) || item.name}</TextItem>
+          <RootNodeText>{startCase(item.name)}</RootNodeText>
         </CollapseButton>
         {isExpanded && (
           <IconButton
@@ -129,7 +125,7 @@ export const Node = React.memo<NodeProps>(function Node({
           setExpanded({ ids: [item.id], value: !isExpanded });
         }}
       >
-        {(item.renderLabel as (i: typeof item) => React.ReactNode)?.(item) || item.name}
+        {startCase(item.name)}
       </BranchNode>
     );
   }
@@ -161,7 +157,7 @@ export const RootNode = styled.View(() => ({
 }));
 
 export const RootNodeText = styled.Text(({ theme }) => ({
-  fontSize: theme.typography.size.s1 - 1,
+  fontSize: theme.typography.size.s2 - 1,
   fontWeight: theme.typography.weight.bold,
   color: theme.textMutedColor,
   lineHeight: 16,