@ledgerhq/native-ui 0.32.0-nightly.1 → 0.33.0-nightly.0

package/lib/components/Form/TabSelector/index.d.ts

@@ -6,7 +6,8 @@ type TabSelectorProps<T extends string> = {
     }[];
     initialTab?: T extends infer K ? K : never;
     onToggle: (value: T) => void;
+    filledVariant?: boolean;
 };
-export default function TabSelector<T extends string>({ labels, initialTab, onToggle, }: TabSelectorProps<T>): JSX.Element;
+export default function TabSelector<T extends string>({ labels, initialTab, onToggle, filledVariant, }: TabSelectorProps<T>): JSX.Element;
 export {};
 //# sourceMappingURL=index.d.ts.map

package/lib/components/Form/TabSelector/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Form/TabSelector/index.tsx"],"names":[],"mappings":";AA8BA,KAAK,gBAAgB,CAAC,CAAC,SAAS,MAAM,IAAI;IACxC,MAAM,EAAE;QAAE,EAAE,EAAE,CAAC,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IACnC,UAAU,CAAC,EAAE,CAAC,SAAS,MAAM,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;IAC3C,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;CAC9B,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,CAAC,SAAS,MAAM,EAAE,EACpD,MAAM,EACN,UAAU,EACV,QAAQ,GACT,EAAE,gBAAgB,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,OAAO,CA4DnC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Form/TabSelector/index.tsx"],"names":[],"mappings":";AA8BA,KAAK,gBAAgB,CAAC,CAAC,SAAS,MAAM,IAAI;IACxC,MAAM,EAAE;QAAE,EAAE,EAAE,CAAC,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IACnC,UAAU,CAAC,EAAE,CAAC,SAAS,MAAM,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;IAC3C,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC7B,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,CAAC,SAAS,MAAM,EAAE,EACpD,MAAM,EACN,UAAU,EACV,QAAQ,EACR,aAAqB,GACtB,EAAE,gBAAgB,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,OAAO,CAuEnC"}

package/lib/components/Form/TabSelector/index.js

@@ -24,7 +24,7 @@ const Tab = styled(Flex) `
   align-items: center;
   justify-content: center;
 `;
-export default function TabSelector({ labels, initialTab, onToggle, }) {
+export default function TabSelector({ labels, initialTab, onToggle, filledVariant = false, }) {
     const [containerWidth, setContainerWidth] = useState(0);
     const initialIndex = initialTab ? labels.findIndex((l) => l.id === initialTab) : 0;
     const translateX = useSharedValue(0);
@@ -50,7 +50,16 @@ export default function TabSelector({ labels, initialTab, onToggle, }) {
             width: containerWidth / labels.length,
         };
     });
-    return (React.createElement(Box, { height: "100%", width: "100%", borderRadius: 12, border: 1, borderColor: "opacityDefault.c10", p: 2 },
+    const boxStyles = filledVariant
+        ? {
+            bg: "neutral.c30",
+        }
+        : {
+            p: 2,
+            border: 1,
+            borderColor: "opacityDefault.c10",
+        };
+    return (React.createElement(Box, { height: "100%", width: "100%", borderRadius: 12, bg: boxStyles.bg, p: boxStyles.p, border: boxStyles.border, borderColor: boxStyles.borderColor },
         React.createElement(Container, { onLayout: handleLayout },
             React.createElement(AnimatedBackground, { style: animatedStyle }),
             labels.map((label, index) => (React.createElement(Pressable, { hitSlop: 6, key: label.id, onPress: () => handlePress(label.id, index), style: ({ pressed }) => [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ledgerhq/native-ui",
-  "version": "0.32.0-nightly.1",
+  "version": "0.33.0-nightly.0",
   "description": "Ledger Live - Mobile UI",
   "repository": {
     "type": "git",
@@ -39,9 +39,9 @@
     "react-native-modal": "^13.0.0",
     "rn-range-slider": "2.1.1",
     "styled-system": "^5.1.5",
-    "@ledgerhq/crypto-icons-ui": "^1.12.0-nightly.0",
-    "@ledgerhq/ui-shared": "^0.3.0",
-    "@ledgerhq/icons-ui": "^0.9.0"
+    "@ledgerhq/icons-ui": "^0.9.0",
+    "@ledgerhq/crypto-icons-ui": "^1.12.0",
+    "@ledgerhq/ui-shared": "^0.3.0"
   },
   "peerDependencies": {
     "react": ">=17",