@ledgerhq/lumen-ui-rnative 0.1.45 → 0.1.47

package/src/lib/Components/Slot/Slot.tsx

@@ -2,6 +2,7 @@ import type {
   ComponentRef,
   ComponentPropsWithoutRef,
   ComponentPropsWithRef,
+  RefObject,
 } from 'react';
 import { isValidElement, cloneElement } from 'react';
 import type {
@@ -110,7 +111,7 @@ function composeRefs<T>(...refs: (React.Ref<T> | undefined)[]) {
       if (typeof ref === 'function') {
         ref(node);
       } else if (ref != null) {
-        (ref as React.MutableRefObject<T>).current = node;
+        (ref as RefObject<T>).current = node;
       }
     });
 }

package/src/lib/Components/Spinner/Spinner.mdx

@@ -6,7 +6,7 @@ import CommonRulesDoAndDont from '../../../../.storybook/components/DoVsDont/Com
 import { Box } from '../Utility/Box';
 import { Text } from '../Utility/Text';
 
-<Meta title='Communication/Spinner/Docs' of={SpinnerStories} />
+<Meta title='Core/Spinner' of={SpinnerStories} />
 
 # Spinner
 

package/src/lib/Components/Spinner/Spinner.stories.tsx

@@ -4,7 +4,8 @@ import { Text } from '../Utility/Text';
 import { Spinner } from './Spinner';
 
 const meta: Meta<typeof Spinner> = {
-  title: 'Communication/Spinner',
+  id: 'rnative-spinner',
+  title: 'Core/Spinner',
   component: Spinner,
   parameters: {
     actions: { disable: true },

package/src/lib/Components/Spot/Spot.mdx

@@ -6,7 +6,7 @@ import { CustomTabs, Tab } from '../../../../.storybook/components';
 import { DoVsDontRow, DoBlockItem, DontBlockItem } from '../../../../.storybook/components/DoVsDont';
 import CommonRulesDoAndDont from '../../../../.storybook/components/DoVsDont/CommonRulesDoAndDont.mdx';
 
-<Meta title='Components/Spot' of={SpotStories} />
+<Meta title='Core/Spot' of={SpotStories} />
 
 # Spot
 

package/src/lib/Components/Spot/Spot.stories.tsx

@@ -7,7 +7,8 @@ import type { SpotProps } from './types';
 
 const meta: Meta<typeof Spot> = {
   component: Spot,
-  title: 'Communication/Spot',
+  id: 'rnative-spot',
+  title: 'Core/Spot',
   parameters: {
     docs: {
       source: {

package/src/lib/Components/Spot/Spot.tsx

@@ -103,7 +103,7 @@ const useStyles = ({
  * - `'number'` appearance requires a `number` prop
  * - All other appearances are self-contained
  *
- * @see {@link https://ldls.vercel.app/?path=/docs/react-native_media-graphics-spot--docs Storybook}
+ * @see {@link https://ldls-react-native.vercel.app/?path=/docs/rnative-spot--docs Storybook}
  *
  * @warning The `lx` prop should only be used for layout adjustments like margins or positioning.
  * Do not use it to modify the spot's core appearance (colors, size, etc). Use the `appearance` prop instead.

package/src/lib/Components/Stepper/Stepper.mdx

@@ -6,7 +6,7 @@ import CommonRulesDoAndDont from '../../../../.storybook/components/DoVsDont/Com
 import { Box } from '../Utility/Box';
 import { Text } from '../Utility/Text';
 
-<Meta title='Communication/Stepper/Docs' of={StepperStories} />
+<Meta title='Core/Stepper' of={StepperStories} />
 
 # Stepper
 

package/src/lib/Components/Stepper/Stepper.stories.tsx

@@ -4,7 +4,8 @@ import { Text } from '../Utility/Text';
 import { Stepper } from './Stepper';
 
 const meta: Meta<typeof Stepper> = {
-  title: 'Communication/Stepper',
+  id: 'rnative-stepper',
+  title: 'Core/Stepper',
   component: Stepper,
   parameters: {
     actions: { disable: true },

package/src/lib/Components/Subheader/Subheader.mdx

@@ -19,7 +19,7 @@ import {
 } from '../../../../.storybook/components';
 import CommonRulesDoAndDont from '../../../../.storybook/components/DoVsDont/CommonRulesDoAndDont.mdx';
 
-<Meta title='Components/Subheader' of={SubheaderStories} />
+<Meta title='Core/Subheader' of={SubheaderStories} />
 
 # Subheader
 

package/src/lib/Components/Subheader/Subheader.stories.tsx

@@ -20,7 +20,8 @@ const Container = ({ children }: { children: React.ReactNode }) => (
 
 const meta: Meta<typeof Subheader> = {
   component: Subheader,
-  title: 'Communication/Subheader',
+  id: 'rnative-subheader',
+  title: 'Core/Subheader',
   subcomponents: {
     SubheaderRow,
     SubheaderTitle,

package/src/lib/Components/Switch/Switch.mdx

@@ -6,7 +6,7 @@ import { CustomTabs, Tab } from '../../../../.storybook/components';
 import { DoVsDontRow, DoBlockItem, DontBlockItem } from '../../../../.storybook/components/DoVsDont';
 import CommonRulesDoAndDont from '../../../../.storybook/components/DoVsDont/CommonRulesDoAndDont.mdx';
 
-<Meta title="Components/Switch" of={SwitchStories} />
+<Meta title='Core/Switch' of={SwitchStories} />
 
 # Switch
 

package/src/lib/Components/Switch/Switch.stories.tsx

@@ -3,7 +3,8 @@ import { Box, Text } from '../Utility';
 import { Switch } from './Switch';
 
 const meta: Meta<typeof Switch> = {
-  title: 'Selection/Switch',
+  id: 'rnative-switch',
+  title: 'Core/Switch',
   component: Switch,
   parameters: {
     layout: 'fullscreen',

package/src/lib/Components/Switch/Switch.tsx

@@ -107,8 +107,7 @@ const useAnimatedThumb = (checked: boolean, translate: number) => {
  * The switch follows the design system tokens and supports checked, unchecked,
  * disabled, and focus states with proper active interactions.
  *
- * @see {@link https://ldls.vercel.app/?path=/docs/react-native_selection-switch--docs Storybook}
- * @see {@link https://ldls.vercel.app/?path=/docs/react-native_selection-switch--docs#dos-and-donts Guidelines}
+ * @see {@link https://ldls-react-native.vercel.app/?path=/docs/rnative-switch--docs Guidelines}
  *
  * @warning The `lx` prop should only be used for layout adjustments like margins or positioning.
  * Do not use it to modify the switch's core appearance.

package/src/lib/Components/TabBar/TabBar.mdx

@@ -6,7 +6,7 @@ import { DoVsDontRow, DoBlockItem, DontBlockItem } from '../../../../.storybook/
 import CommonRulesDoAndDont from '../../../../.storybook/components/DoVsDont/CommonRulesDoAndDont.mdx';
 import { Box } from '../Utility';
 
-<Meta title='Navigation/TabBar' of={TabBarStories} />
+<Meta title='Core/TabBar' of={TabBarStories} />
 
 # TabBar
 

package/src/lib/Components/TabBar/TabBar.stories.tsx

@@ -18,7 +18,8 @@ import {
 import { TabBar, TabBarItem } from './TabBar';
 
 const meta = {
-  title: 'Navigation/TabBar',
+  id: 'rnative-tabbar',
+  title: 'Core/TabBar',
   component: TabBar,
   subcomponents: {
     TabBarItem,

package/src/lib/Components/TabBar/TabBar.tsx

@@ -227,8 +227,7 @@ export function TabBarItem({
  * A horizontal tab bar with animated pill background and icon transitions.
  * Provides smooth animations for active state changes and press interactions.
  *
- * @see {@link https://ldls.vercel.app/?path=/docs/react-native_navigation-tabbar--docs Storybook}
- * @see {@link https://ldls.vercel.app/?path=/docs/react-native_navigation-tabbar--docs#dos-and-donts Guidelines}
+ * @see {@link https://ldls-react-native.vercel.app/?path=/docs/rnative-tabbar--docs Guidelines}
  *
  * @warning The `lx` prop should only be used for layout adjustments like margins or positioning.
  *

package/src/lib/Components/Tag/Tag.mdx

@@ -5,7 +5,7 @@ import { DoVsDontRow, DoBlockItem, DontBlockItem } from '../../../../.storybook/
 import CommonRulesDoAndDont from '../../../../.storybook/components/DoVsDont/CommonRulesDoAndDont.mdx';
 import { Box } from '../Utility/Box';
 
-<Meta title='Components/Tag' of={TagStories} />
+<Meta title='Core/Tag' of={TagStories} />
 
 # Tag
 

package/src/lib/Components/Tag/Tag.stories.tsx

@@ -5,7 +5,8 @@ import { Tag } from './Tag';
 
 const meta: Meta<typeof Tag> = {
   component: Tag,
-  title: 'Communication/Tag',
+  id: 'rnative-tag',
+  title: 'Core/Tag',
   argTypes: {
     appearance: {
       control: 'select',

package/src/lib/Components/Tag/Tag.tsx

@@ -14,8 +14,7 @@ const iconSizeMap: Record<Size, IconSize> = {
  *
  * The appearance determines the color scheme used.
  *
- * @see {@link https://ldls.vercel.app/?path=/docs/communication-tag-overview--docs Storybook}
- * @see {@link https://ldls.vercel.app/?path=/docs/communication-tag-implementation--docs#dos-and-donts Guidelines}
+ * @see {@link https://ldls-react-native.vercel.app/?path=/docs/rnative-tag--docs Guidelines}
  *
  * @warning The `lx` prop should only be used for layout adjustments like margins or positioning.
  * Do not use it to modify the tag's core appearance (colors, padding, etc). Use the `appearance` prop instead.

package/src/lib/Components/TextInput/TextInput.mdx

@@ -5,7 +5,7 @@ import { CustomTabs, Tab } from '../../../../.storybook/components';
 import { DoVsDontRow, DoBlockItem, DontBlockItem } from '../../../../.storybook/components/DoVsDont';
 import CommonRulesDoAndDont from '../../../../.storybook/components/DoVsDont/CommonRulesDoAndDont.mdx';
 
-<Meta title='Input/TextInput' of={TextInputStories} />
+<Meta title='Core/TextInput' of={TextInputStories} />
 
 # TextInput
 

package/src/lib/Components/TextInput/TextInput.stories.tsx

@@ -6,7 +6,8 @@ import { type TextInputProps } from './types';
 
 const meta: Meta<typeof TextInput> = {
   component: TextInput,
-  title: 'Input/TextInput',
+  id: 'rnative-textinput',
+  title: 'Core/TextInput',
   parameters: {
     docs: {
       source: {

package/src/lib/Components/Tile/Tile.mdx

@@ -11,7 +11,7 @@ import {
 import CommonRulesDoAndDont from '../../../../.storybook/components/DoVsDont/CommonRulesDoAndDont.mdx';
 import { Box } from '../Utility';
 
-<Meta title='Containment/Tile' of={TileStories} />
+<Meta title='Core/Tile' of={TileStories} />
 
 # Tile
 

package/src/lib/Components/Tile/Tile.stories.tsx

@@ -19,7 +19,8 @@ const meta: Meta<typeof Tile> = {
     TileDescription,
     TileTrailingContent,
   },
-  title: 'Containment/Tile',
+  id: 'rnative-tile',
+  title: 'Core/Tile',
   parameters: {
     docs: {
       source: {

package/src/lib/Components/Tile/Tile.tsx

@@ -73,8 +73,7 @@ const useRootStyles = ({
  * A flexible tile component that uses a composite pattern for maximum customization.
  * Displays content in a vertical layout with support for spots, text, and custom content.
  *
- * @see {@link https://ldls.vercel.app/?path=/docs/react-native_containment-tile--docs Storybook}
- * @see {@link https://ldls.vercel.app/?path=/docs/react-native_containment-tile--docs#dos-and-donts Guidelines}
+ * @see {@link https://ldls-react-native.vercel.app/?path=/docs/rnative-tile--docs Guidelines}
  *
  * @warning The `lx` prop should only be used for layout adjustments like margins or positioning.
  * Do not use it to modify the tile's core appearance (colors, padding, etc). Use the `appearance` prop instead.

package/src/lib/Components/TileButton/TileButton.mdx

@@ -5,7 +5,7 @@ import { CustomTabs, Tab } from '../../../../.storybook/components';
 import { DoVsDontRow, DoBlockItem, DontBlockItem } from '../../../../.storybook/components/DoVsDont';
 import CommonRulesDoAndDont from '../../../../.storybook/components/DoVsDont/CommonRulesDoAndDont.mdx';
 
-<Meta title='Action/TileButton' of={TileButtonStories} />
+<Meta title='Core/TileButton' of={TileButtonStories} />
 
 # TileButton
 

package/src/lib/Components/TileButton/TileButton.stories.tsx

@@ -15,7 +15,8 @@ const iconOptions = {
 
 const meta: Meta<typeof TileButton> = {
   component: TileButton,
-  title: 'Action/TileButton',
+  id: 'rnative-tilebutton',
+  title: 'Core/TileButton',
   argTypes: {
     icon: {
       options: Object.keys(iconOptions),

package/src/lib/Components/TileButton/TileButton.tsx

@@ -67,7 +67,7 @@ const useStyles = ({
  * A compact button component displaying an icon above a label in a vertical layout.
  * Ideal for grids, toolbars, or quick action menus.
  *
- * @see {@link https://ldls.vercel.app/?path=/docs/react-native_action-tilebutton--docs Storybook}
+ * @see {@link https://ldls-react-native.vercel.app/?path=/docs/rnative-tilebutton--docs Storybook}
  *
  * @example
  * import { TileButton } from '@ledgerhq/lumen-ui-rnative';

package/src/lib/Components/Tooltip/GlobalTooltipBottomSheet.tsx

@@ -11,7 +11,7 @@ import { useGlobalTooltipSafeContext } from './GlobalTooltipContext';
  * BottomSheet component that displays tooltip content.
  * This should be placed at the root level inside GestureHandlerRootView.
  *
- * @see {@link https://ldls.vercel.app/?path=/docs/components-tooltip-overview--docs Storybook}
+ * @see {@link https://ldls-react-native.vercel.app/?path=/docs/rnative-tooltip--docs Storybook}
  *
  * @example
  * import { GlobalTooltipProvider, GlobalTooltipBottomSheet } from '@ledgerhq/lumen-ui-rnative';

package/src/lib/Components/Tooltip/GlobalTooltipContext.tsx

@@ -1,5 +1,5 @@
 import { createSafeContext } from '@ledgerhq/lumen-utils-shared';
-import type { ReactNode } from 'react';
+import type { ReactNode, RefObject } from 'react';
 import { useState, useCallback, useRef, useMemo } from 'react';
 
 export type TooltipData = {
@@ -11,8 +11,8 @@ export type TooltipData = {
 
 type GlobalTooltipBottomSheetContextValue = {
   currentTooltip: TooltipData | null;
-  showTooltipRef: React.MutableRefObject<(data: TooltipData) => void>;
-  hideTooltipRef: React.MutableRefObject<() => void>;
+  showTooltipRef: RefObject<(data: TooltipData) => void>;
+  hideTooltipRef: RefObject<() => void>;
 };
 
 const [GlobalTooltipContextProvider, _useGlobalTooltipSafeContext] =

package/src/lib/Components/Tooltip/Tooltip.mdx

@@ -5,7 +5,7 @@ import CommonRulesDoAndDont from '../../../../.storybook/components/DoVsDont/Com
 import * as TooltipStories from './Tooltip.stories';
 import { Box } from '../Utility/Box';
 
-<Meta title='Communication/Tooltip' of={TooltipStories} />
+<Meta title='Core/Tooltip' of={TooltipStories} />
 
 # Tooltip
 

package/src/lib/Components/Tooltip/Tooltip.stories.tsx

@@ -10,7 +10,8 @@ import { Tooltip, TooltipTrigger, TooltipContent } from './Tooltip';
 const meta: Meta<typeof Tooltip> = {
   component: Tooltip,
   subcomponents: { TooltipTrigger, TooltipContent },
-  title: 'Communication/Tooltip',
+  id: 'rnative-tooltip',
+  title: 'Core/Tooltip',
 };
 
 export default meta;

package/src/lib/Components/Tooltip/Tooltip.tsx

@@ -20,7 +20,7 @@ import type {
  * This component coordinates between the trigger and content components.
  * It works with GlobalTooltipProvider to ensure only one tooltip can be shown at a time.
  *
- * @see {@link https://ldls.vercel.app/?path=/docs/components-tooltip-overview--docs Storybook}
+ * @see {@link https://ldls-react-native.vercel.app/?path=/docs/rnative-tooltip--docs Storybook}
  *
  * @example
  * import { GlobalTooltipProvider, Tooltip, TooltipTrigger, TooltipContent, GlobalTooltipBottomSheet } from '@ledgerhq/lumen-ui-rnative';

package/src/lib/Components/Trend/Trend.mdx

@@ -4,7 +4,7 @@ import { CustomTabs, Tab } from '../../../../.storybook/components';
 import { DoVsDontRow, DoBlockItem, DontBlockItem } from '../../../../.storybook/components/DoVsDont';
 import CommonRulesDoAndDont from '../../../../.storybook/components/DoVsDont/CommonRulesDoAndDont.mdx';
 
-<Meta title='Communication/Trend' of={TrendStories} />
+<Meta title='Core/Trend' of={TrendStories} />
 
 # Trend
 

package/src/lib/Components/Trend/Trend.stories.tsx

@@ -4,7 +4,8 @@ import { Trend } from './Trend';
 
 const meta: Meta<typeof Trend> = {
   component: Trend,
-  title: 'Communication/Trend',
+  id: 'rnative-trend',
+  title: 'Core/Trend',
   argTypes: {
     value: {
       control: 'number',

package/src/lib/Components/Utility/Box/Box.mdx

@@ -2,7 +2,7 @@ import { Meta, Canvas, Controls } from '@storybook/addon-docs/blocks';
 import * as BoxStories from './Box.stories';
 import { CustomTabs, Tab } from '../../../../../.storybook/components';
 
-<Meta title='Utility/Box' of={BoxStories} />
+<Meta title='Primitives/Box' of={BoxStories} />
 
 # Box
 

package/src/lib/Components/Utility/Box/Box.stories.tsx

@@ -3,7 +3,8 @@ import { Box } from './Box';
 
 const meta: Meta<typeof Box> = {
   component: Box,
-  title: 'Utility/Box',
+  id: 'rnative-box',
+  title: 'Primitives/Box',
   parameters: {
     docs: {
       source: {

package/src/lib/Components/Utility/Box/Box.tsx

@@ -7,7 +7,7 @@ import { createStyledView } from '../../../../styles';
  * Box is a View wrapper that accepts design token-based style props directly,
  * providing type-safe styling with autocomplete for spacing, sizes, colors, etc.
  *
- * @see {@link https://ldls.vercel.app/?path=/docs/layout-box--docs Storybook}
+ * @see {@link https://ldls-react-native.vercel.app/?path=/docs/rnative-box--docs Storybook}
  *
  * @example
  * ```tsx

package/src/lib/Components/Utility/Gradient/LinearGradient/LinearGradient.mdx

@@ -2,7 +2,7 @@ import { Meta, Canvas, Controls } from '@storybook/addon-docs/blocks';
 import * as LinearGradientStories from './LinearGradient.stories';
 import { CustomTabs, Tab } from '../../../../../../.storybook/components';
 
-<Meta title='Utility/LinearGradient' of={LinearGradientStories} />
+<Meta title='Primitives/LinearGradient' of={LinearGradientStories} />
 
 # LinearGradient
 

package/src/lib/Components/Utility/Gradient/LinearGradient/LinearGradient.stories.tsx

@@ -6,7 +6,8 @@ import { LinearGradient } from './LinearGradient';
 
 const meta: Meta<typeof LinearGradient> = {
   component: LinearGradient,
-  title: 'Utility/LinearGradient',
+  id: 'rnative-lineargradient',
+  title: 'Primitives/LinearGradient',
   parameters: {
     layout: 'centered',
     backgrounds: { default: 'light' },

package/src/lib/Components/Utility/Gradient/LinearGradient/LinearGradient.tsx

@@ -59,7 +59,7 @@ const styles = StyleSheet.create({
  * Uses react-native-svg to render gradients that work consistently across platforms.
  * Extends Box, so it supports all lx style props for layout and sizing.
  *
- * @see {@link https://ldls.vercel.app/?path=/docs/utility-lineargradient--docs Storybook}
+ * @see {@link https://ldls-react-native.vercel.app/?path=/docs/rnative-lineargradient--docs Storybook}
  *
  * @example
  * ```tsx

package/src/lib/Components/Utility/Gradient/RadialGradient/RadialGradient.mdx

@@ -2,7 +2,7 @@ import { Meta, Canvas, Controls } from '@storybook/addon-docs/blocks';
 import * as RadialGradientStories from './RadialGradient.stories';
 import { CustomTabs, Tab } from '../../../../../../.storybook/components';
 
-<Meta title='Utility/RadialGradient' of={RadialGradientStories} />
+<Meta title='Primitives/RadialGradient' of={RadialGradientStories} />
 
 # RadialGradient
 

package/src/lib/Components/Utility/Gradient/RadialGradient/RadialGradient.stories.tsx

@@ -5,7 +5,8 @@ import { RadialGradient } from './RadialGradient';
 
 const meta: Meta<typeof RadialGradient> = {
   component: RadialGradient,
-  title: 'Utility/RadialGradient',
+  id: 'rnative-radialgradient',
+  title: 'Primitives/RadialGradient',
   parameters: {
     layout: 'centered',
     backgrounds: { default: 'light' },

package/src/lib/Components/Utility/Gradient/RadialGradient/RadialGradient.tsx

@@ -27,7 +27,7 @@ const styles = StyleSheet.create({
  * Uses react-native-svg to render gradients that work consistently across platforms.
  * Extends Box, so it supports all lx style props for layout and sizing.
  *
- * @see {@link https://ldls.vercel.app/?path=/docs/utility-radialgradient--docs Storybook}
+ * @see {@link https://ldls-react-native.vercel.app/?path=/docs/rnative-radialgradient--docs Storybook}
  *
  * @example
  * ```tsx

package/src/lib/Components/Utility/Gradient/utils/resolveGradientColor.ts

@@ -41,14 +41,10 @@ export const processGradientStops = (
 
     // Auto-spread offsets if not provided
     // For n stops: 0, 1/(n-1), 2/(n-1), ..., 1
-    const offset =
-      stop.offset !== undefined
-        ? stop.offset
-        : stopCount === 1
-          ? DEFAULT_OFFSET
-          : index / (stopCount - 1);
-
-    const opacity = stop.opacity !== undefined ? stop.opacity : DEFAULT_OPACITY;
+    const autoOffset =
+      stopCount === 1 ? DEFAULT_OFFSET : index / (stopCount - 1);
+    const offset = stop.offset ?? autoOffset;
+    const opacity = stop.opacity ?? DEFAULT_OPACITY;
 
     return {
       color: resolvedColor,

package/src/lib/Components/Utility/Pressable/Pressable.mdx

@@ -2,7 +2,7 @@ import { Meta, Canvas, Controls } from '@storybook/addon-docs/blocks';
 import * as PressableStories from './Pressable.stories';
 import { CustomTabs, Tab } from '../../../../../.storybook/components';
 
-<Meta title='Utility/Pressable' of={PressableStories} />
+<Meta title='Primitives/Pressable' of={PressableStories} />
 
 # Pressable
 

package/src/lib/Components/Utility/Pressable/Pressable.stories.tsx

@@ -3,7 +3,8 @@ import { Pressable } from './Pressable';
 
 const meta: Meta<typeof Pressable> = {
   component: Pressable,
-  title: 'Utility/Pressable',
+  id: 'rnative-pressable',
+  title: 'Primitives/Pressable',
   parameters: {
     docs: {
       source: {

package/src/lib/Components/Utility/Pressable/Pressable.tsx

@@ -8,7 +8,7 @@ import { createStyledPressable } from '../../../../styles';
  * token-based style props directly, providing type-safe styling with autocomplete
  * for spacing, sizes, colors, etc. Use the `style` prop for pressed-state styling.
  *
- * @see {@link https://ldls.vercel.app/?path=/docs/utility-pressable--docs Storybook}
+ * @see {@link https://ldls-react-native.vercel.app/?path=/docs/rnative-pressable--docs Storybook}
  *
  * @example
  * ```tsx

package/src/lib/Components/Utility/Text/Text.mdx

@@ -2,7 +2,7 @@ import { Meta, Canvas, Controls } from '@storybook/addon-docs/blocks';
 import * as TextStories from './Text.stories';
 import { CustomTabs, Tab } from '../../../../../.storybook/components';
 
-<Meta title='Utility/Text' of={TextStories} />
+<Meta title='Primitives/Text' of={TextStories} />
 
 # Text
 

package/src/lib/Components/Utility/Text/Text.stories.tsx

@@ -4,7 +4,8 @@ import type { TextProps } from './types';
 
 const meta: Meta<TextProps> = {
   component: Text,
-  title: 'Utility/Text',
+  id: 'rnative-text',
+  title: 'Primitives/Text',
   parameters: {
     docs: {
       source: {

package/src/lib/Components/Utility/Text/Text.tsx

@@ -7,7 +7,7 @@ import { createStyledText } from '../../../../styles';
  * Text is a wrapper around React Native's Text that accepts a `typography` prop for
  * typography presets, plus design token-based style props for colors, spacing, etc.
  *
- * @see {@link https://ldls.vercel.app/?path=/docs/typography-text--docs Storybook}
+ * @see {@link https://ldls-react-native.vercel.app/?path=/docs/rnative-text--docs Storybook}
  *
  * @example
  * ```tsx

package/src/lib/utils/startTransition/startTransition.ts

@@ -2,11 +2,11 @@ import { startTransition as reactStartTransition } from 'react';
 import { RuntimeConstants } from '../constants';
 
 export const startTransition = (callback: React.TransitionFunction): void => {
-  if (!RuntimeConstants.isBrowser) {
-    // Pass-through function
-    callback();
-  } else {
+  if (RuntimeConstants.isBrowser) {
     // Proxy to react.startTransition
     reactStartTransition(callback);
+  } else {
+    // Pass-through function
+    callback();
   }
 };