@passui/react 0.1.23 → 0.1.24

package/dist/types/src/components/view-controller/view-controller.d.ts

@@ -10,8 +10,8 @@ type HeadingProps = {
     size?: keyof typeof titleSizes;
 };
 declare const titleSizes: {
-    readonly default: "text-3xl md:text-4xl";
-    readonly compact: "text-[1.75rem] font-semibold tracking-tight";
+    readonly default: "text-large-title leading-large-title";
+    readonly compact: "text-title leading-title font-semibold tracking-tight";
 };
 export declare function ViewController({ heading, className, children }: ViewControllerProps): import("react").JSX.Element;
 export declare namespace ViewController {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@passui/react",
-    "version": "0.1.23",
+    "version": "0.1.24",
     "description": "Passui: native React controls, design tokens, presentation and appearance.",
     "license": "MIT",
     "repository": {

package/src/components/tab-bar/tab-bar.tsx

@@ -97,7 +97,7 @@ export function TabBar<Tab extends TabBarTab>({
                                 // Switching tabs is silent, as on Apple and Android: no haptic.
                                 onClick: () => {},
                                 className: cn(
-                                    "relative isolate flex h-11 min-w-0 flex-col items-center justify-center gap-0.5 rounded-full font-semibold text-[10px] tracking-[0.01em] no-underline transition-[color,transform] duration-fast active:scale-[0.94]",
+                                    "relative isolate flex h-11 min-w-0 flex-col items-center justify-center gap-0.5 rounded-full font-semibold text-caption2 tracking-[0.01em] no-underline transition-[color,transform] duration-fast active:scale-[0.94]",
                                     minimized ? "w-11" : "flex-1 px-1",
                                     current ? "text-accent-text" : "text-label-secondary"
                                 ),

package/src/components/tab-view/tab-view.tsx

@@ -96,7 +96,7 @@ export function TabView<Value extends string>({
                             }
                         }}
                         className={cn(
-                            "relative inline-flex h-[calc(100%-1px)] shrink-0 items-center justify-center border border-transparent p-0 text-sm font-medium whitespace-nowrap",
+                            "relative inline-flex h-[calc(100%-1px)] shrink-0 items-center justify-center border border-transparent p-0 text-subheadline font-medium whitespace-nowrap",
                             "focus-visible:outline-2 focus-visible:outline-offset-2",
                             "after:absolute after:inset-x-0 after:bottom-[-5px] after:h-0.5 after:bg-current",
                             option.value === value

package/src/components/view-controller/view-controller.tsx

@@ -14,9 +14,9 @@ type HeadingProps = {
 }
 
 const titleSizes = {
-    default: "text-3xl md:text-4xl",
+    default: "text-large-title leading-large-title",
     // sign in style screens: centered, tighter, like a system sheet
-    compact: "text-[1.75rem] font-semibold tracking-tight",
+    compact: "text-title leading-title font-semibold tracking-tight",
 } as const
 
 export function ViewController({ heading, className, children }: ViewControllerProps) {
@@ -24,12 +24,12 @@ export function ViewController({ heading, className, children }: ViewControllerP
         <article
             className={cn(
                 "container mx-auto flex flex-col",
-                "w-full gap-5 py-20 md:max-w-3xl",
+                "w-full gap-0 py-12 md:max-w-3xl",
                 className
             )}
         >
-            <section>{heading}</section>
-            {children}
+            {heading}
+            <div className="mt-8 flex flex-col gap-6">{children}</div>
         </article>
     )
 }
@@ -50,8 +50,8 @@ function Heading({ title, description, action, size = "default" }: HeadingProps)
             {description && (
                 <p
                     className={cn(
-                        "mt-2 max-w-prose text-subheadline leading-relaxed text-label-secondary",
-                        centered && "mt-1 text-center text-[15px]"
+                        "mt-0 max-w-prose text-subheadline leading-relaxed text-label-secondary",
+                        centered && "text-center"
                     )}
                 >
                     {description}