@mihcm/ui 0.14.1

package/dist/Toggle.native.d.ts

@@ -0,0 +1,42 @@
+/**
+ * Toggle & ToggleGroup (React Native variant).
+ *
+ * Same API as the web variant. Uses `Pressable` for touch targets.
+ *
+ * Wiki: docs/components/Toggle.md
+ */
+import { type ReactNode } from 'react';
+import { View, type ViewProps } from 'react-native';
+import { type VariantProps } from 'class-variance-authority';
+type ClassedViewProps = Omit<ViewProps, 'style'> & {
+    className?: string;
+};
+export declare const toggleVariants: (props?: ({
+    variant?: "default" | "outline" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface ToggleProps extends ClassedViewProps, VariantProps<typeof toggleVariants> {
+    pressed: boolean;
+    onPressedChange: (pressed: boolean) => void;
+    disabled?: boolean;
+    children?: ReactNode;
+}
+export declare const Toggle: import("react").ForwardRefExoticComponent<ToggleProps & import("react").RefAttributes<View>>;
+export type ToggleGroupProps = ClassedViewProps & VariantProps<typeof toggleVariants> & ({
+    type: 'single';
+    value: string;
+    onValueChange: (value: string) => void;
+} | {
+    type: 'multiple';
+    value: string[];
+    onValueChange: (value: string[]) => void;
+});
+export declare const ToggleGroup: import("react").ForwardRefExoticComponent<ToggleGroupProps & import("react").RefAttributes<View>>;
+export interface ToggleGroupItemProps extends ClassedViewProps {
+    value: string;
+    disabled?: boolean;
+    children?: ReactNode;
+}
+export declare const ToggleGroupItem: import("react").ForwardRefExoticComponent<ToggleGroupItemProps & import("react").RefAttributes<View>>;
+export {};
+//# sourceMappingURL=Toggle.native.d.ts.map

package/dist/Toggle.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.native.d.ts","sourceRoot":"","sources":["../src/Toggle.native.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,EAIL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,EAAa,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAC/D,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGlE,KAAK,gBAAgB,GAAG,IAAI,CAAC,SAAS,EAAE,OAAO,CAAC,GAAG;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAI1E,eAAO,MAAM,cAAc;;;8EAgB1B,CAAC;AAEF,MAAM,WAAW,WACf,SAAQ,gBAAgB,EACtB,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,OAAO,EAAE,OAAO,CAAC;IACjB,eAAe,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC5C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,eAAO,MAAM,MAAM,8FAsBjB,CAAC;AAcH,MAAM,MAAM,gBAAgB,GAAG,gBAAgB,GAC7C,YAAY,CAAC,OAAO,cAAc,CAAC,GACnC,CACI;IACE,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACxC,GACD;IACE,IAAI,EAAE,UAAU,CAAC;IACjB,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CAC1C,CACJ,CAAC;AAEJ,eAAO,MAAM,WAAW,mGAwBvB,CAAC;AAIF,MAAM,WAAW,oBAAqB,SAAQ,gBAAgB;IAC5D,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,eAAO,MAAM,eAAe,uGA4B3B,CAAC"}

package/dist/Toggle.native.js

@@ -0,0 +1,56 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Toggle & ToggleGroup (React Native variant).
+ *
+ * Same API as the web variant. Uses `Pressable` for touch targets.
+ *
+ * Wiki: docs/components/Toggle.md
+ */
+import { createContext, forwardRef, useContext, } from 'react';
+import { Pressable, View } from 'react-native';
+import { cva } from 'class-variance-authority';
+import { cn } from './internal/cn.js';
+/* Toggle */
+export const toggleVariants = cva('flex-row items-center justify-center gap-1.5 rounded-md', {
+    variants: {
+        variant: {
+            default: 'bg-transparent',
+            outline: 'border border-border bg-transparent',
+        },
+        size: {
+            sm: 'h-8 px-2',
+            md: 'h-9 px-3',
+            lg: 'h-10 px-4',
+        },
+    },
+    defaultVariants: { variant: 'default', size: 'md' },
+});
+export const Toggle = forwardRef(function Toggle({ className, variant, size, pressed, onPressedChange, disabled, children, ...props }, ref) {
+    return (_jsx(Pressable, { ref: ref, accessibilityRole: "switch", accessibilityState: { checked: pressed, disabled }, disabled: disabled, onPress: () => onPressedChange(!pressed), className: cn(toggleVariants({ variant, size }), pressed && 'bg-accent/15', disabled && 'opacity-50', className), ...props, children: children }));
+});
+const ToggleGroupContext = createContext(null);
+export const ToggleGroup = forwardRef(function ToggleGroup({ className, type, value, onValueChange, variant, size, ...props }, ref) {
+    const onItemToggle = (itemValue) => {
+        if (type === 'single') {
+            onValueChange(itemValue);
+        }
+        else {
+            const arr = value;
+            const next = arr.includes(itemValue)
+                ? arr.filter((v) => v !== itemValue)
+                : [...arr, itemValue];
+            onValueChange(next);
+        }
+    };
+    return (_jsx(ToggleGroupContext.Provider, { value: { type, value, onItemToggle, variant, size }, children: _jsx(View, { ref: ref, className: cn('flex-row items-center gap-1', className), ...props }) }));
+});
+export const ToggleGroupItem = forwardRef(function ToggleGroupItem({ className, value, disabled, children, ...props }, ref) {
+    const ctx = useContext(ToggleGroupContext);
+    if (!ctx)
+        throw new Error('ToggleGroupItem must be used within <ToggleGroup>');
+    const pressed = ctx.type === 'single'
+        ? ctx.value === value
+        : ctx.value.includes(value);
+    return (_jsx(Pressable, { ref: ref, accessibilityRole: "switch", accessibilityState: { checked: pressed, disabled }, disabled: disabled, onPress: () => ctx.onItemToggle(value), className: cn(toggleVariants({ variant: ctx.variant, size: ctx.size }), pressed && 'bg-accent/15', disabled && 'opacity-50', className), ...props, children: children }));
+});
+//# sourceMappingURL=Toggle.native.js.map

package/dist/Toggle.native.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.native.js","sourceRoot":"","sources":["../src/Toggle.native.tsx"],"names":[],"mappings":"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"}

package/dist/Tooltip.d.ts

@@ -0,0 +1,32 @@
+/**
+ * Tooltip (web variant — React DOM).
+ *
+ * Hover/focus tooltip using CSS anchor positioning fallback.
+ * Renders a `<span>` trigger wrapping children and an absolutely
+ * positioned tooltip element.
+ *
+ *   <Tooltip content="Copy to clipboard">
+ *     <Button variant="ghost"><CopyIcon /></Button>
+ *   </Tooltip>
+ *
+ *   <Tooltip content="Settings" side="right">
+ *     <IconButton>…</IconButton>
+ *   </Tooltip>
+ *
+ * Wiki: docs/components/Tooltip.md
+ */
+import { type HTMLAttributes, type ReactNode } from 'react';
+export interface TooltipProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'content'> {
+    /** Text shown in the tooltip. */
+    content: ReactNode;
+    /** Which side of the trigger to place the tooltip. */
+    side?: 'top' | 'bottom' | 'left' | 'right';
+    /** Delay in ms before showing. */
+    delayMs?: number;
+    /** Allow pointer interaction inside the tooltip content. */
+    interactive?: boolean;
+    /** Content class hook for rich styled tooltip bodies. */
+    contentClassName?: string;
+}
+export declare const Tooltip: import("react").ForwardRefExoticComponent<TooltipProps & import("react").RefAttributes<HTMLSpanElement>>;
+//# sourceMappingURL=Tooltip.d.ts.map

package/dist/Tooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../src/Tooltip.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;GAgBG;AACH,OAAO,EAAwB,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAUlF,MAAM,WAAW,YAAa,SAAQ,IAAI,CAAC,cAAc,CAAC,eAAe,CAAC,EAAE,SAAS,CAAC;IACpF,iCAAiC;IACjC,OAAO,EAAE,SAAS,CAAC;IACnB,sDAAsD;IACtD,IAAI,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;IAC3C,kCAAkC;IAClC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,4DAA4D;IAC5D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,yDAAyD;IACzD,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,eAAO,MAAM,OAAO,0GA6ClB,CAAC"}

package/dist/Tooltip.js

@@ -0,0 +1,43 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Tooltip (web variant — React DOM).
+ *
+ * Hover/focus tooltip using CSS anchor positioning fallback.
+ * Renders a `<span>` trigger wrapping children and an absolutely
+ * positioned tooltip element.
+ *
+ *   <Tooltip content="Copy to clipboard">
+ *     <Button variant="ghost"><CopyIcon /></Button>
+ *   </Tooltip>
+ *
+ *   <Tooltip content="Settings" side="right">
+ *     <IconButton>…</IconButton>
+ *   </Tooltip>
+ *
+ * Wiki: docs/components/Tooltip.md
+ */
+import { forwardRef, useState } from 'react';
+import { cn } from './internal/cn.js';
+const SIDE_CLASSES = {
+    top: 'bottom-full left-1/2 -translate-x-1/2 mb-2',
+    bottom: 'top-full left-1/2 -translate-x-1/2 mt-2',
+    left: 'right-full top-1/2 -translate-y-1/2 mr-2',
+    right: 'left-full top-1/2 -translate-y-1/2 ml-2',
+};
+export const Tooltip = forwardRef(function Tooltip({ className, content, side = 'top', delayMs = 300, interactive = false, contentClassName, children, ...props }, ref) {
+    const [visible, setVisible] = useState(false);
+    const [timeoutId, setTimeoutId] = useState(null);
+    const show = () => {
+        const id = setTimeout(() => setVisible(true), delayMs);
+        setTimeoutId(id);
+    };
+    const hide = () => {
+        if (timeoutId)
+            clearTimeout(timeoutId);
+        setTimeoutId(null);
+        setVisible(false);
+    };
+    return (_jsxs("span", { ref: ref, className: cn('relative inline-flex', className), onMouseEnter: show, onMouseLeave: hide, onFocus: show, onBlur: hide, ...props, children: [children, visible && (_jsx("span", { role: "tooltip", className: cn('pointer-events-none absolute z-50 w-max max-w-[min(20rem,calc(100vw-2rem))] whitespace-nowrap rounded-md', 'bg-foreground px-2.5 py-1.5 text-xs text-background shadow-md', 'animate-fade-in', interactive && 'pointer-events-auto', SIDE_CLASSES[side], contentClassName), children: content }))] }));
+});
+//# sourceMappingURL=Tooltip.js.map

package/dist/Tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../src/Tooltip.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb;;;;;;;;;;;;;;;;GAgBG;AACH,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAuC,MAAM,OAAO,CAAC;AAClF,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AAEtC,MAAM,YAAY,GAA2B;IAC3C,GAAG,EAAE,4CAA4C;IACjD,MAAM,EAAE,yCAAyC;IACjD,IAAI,EAAE,0CAA0C;IAChD,KAAK,EAAE,yCAAyC;CACjD,CAAC;AAeF,MAAM,CAAC,MAAM,OAAO,GAAG,UAAU,CAAgC,SAAS,OAAO,CAC/E,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,GAAG,KAAK,EAAE,OAAO,GAAG,GAAG,EAAE,WAAW,GAAG,KAAK,EAAE,gBAAgB,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAC9G,GAAG;IAEH,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAuC,IAAI,CAAC,CAAC;IAEvF,MAAM,IAAI,GAAG,GAAG,EAAE;QAChB,MAAM,EAAE,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC,CAAC;QACvD,YAAY,CAAC,EAAE,CAAC,CAAC;IACnB,CAAC,CAAC;IACF,MAAM,IAAI,GAAG,GAAG,EAAE;QAChB,IAAI,SAAS;YAAE,YAAY,CAAC,SAAS,CAAC,CAAC;QACvC,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,UAAU,CAAC,KAAK,CAAC,CAAC;IACpB,CAAC,CAAC;IAEF,OAAO,CACL,gBACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,SAAS,CAAC,EAChD,YAAY,EAAE,IAAI,EAClB,YAAY,EAAE,IAAI,EAClB,OAAO,EAAE,IAAI,EACb,MAAM,EAAE,IAAI,KACR,KAAK,aAER,QAAQ,EACR,OAAO,IAAI,CACV,eACE,IAAI,EAAC,SAAS,EACd,SAAS,EAAE,EAAE,CACX,0GAA0G,EAC1G,+DAA+D,EAC/D,iBAAiB,EACjB,WAAW,IAAI,qBAAqB,EACpC,YAAY,CAAC,IAAI,CAAC,EAClB,gBAAgB,CACjB,YAEA,OAAO,GACH,CACR,IACI,CACR,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/dist/Tooltip.native.d.ts

@@ -0,0 +1,25 @@
+/**
+ * Tooltip (React Native variant).
+ *
+ * On native, tooltips display on long-press since there is no hover.
+ * A small popover appears above/below the trigger.
+ *
+ *   <Tooltip content="Copy to clipboard">
+ *     <Button variant="ghost"><CopyIcon /></Button>
+ *   </Tooltip>
+ *
+ * Wiki: docs/components/Tooltip.md
+ */
+import { type ReactNode } from 'react';
+import { View, type ViewProps } from 'react-native';
+type ClassedViewProps = Omit<ViewProps, 'style'> & {
+    className?: string;
+};
+export interface TooltipProps extends ClassedViewProps {
+    content: ReactNode;
+    side?: 'top' | 'bottom';
+    children?: ReactNode;
+}
+export declare const Tooltip: import("react").ForwardRefExoticComponent<TooltipProps & import("react").RefAttributes<View>>;
+export {};
+//# sourceMappingURL=Tooltip.native.d.ts.map

package/dist/Tooltip.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.native.d.ts","sourceRoot":"","sources":["../src/Tooltip.native.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AACH,OAAO,EAAwB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC7D,OAAO,EAAmB,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAGrE,KAAK,gBAAgB,GAAG,IAAI,CAAC,SAAS,EAAE,OAAO,CAAC,GAAG;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAO1E,MAAM,WAAW,YAAa,SAAQ,gBAAgB;IACpD,OAAO,EAAE,SAAS,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IACxB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,eAAO,MAAM,OAAO,+FAgClB,CAAC"}

package/dist/Tooltip.native.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Tooltip (React Native variant).
+ *
+ * On native, tooltips display on long-press since there is no hover.
+ * A small popover appears above/below the trigger.
+ *
+ *   <Tooltip content="Copy to clipboard">
+ *     <Button variant="ghost"><CopyIcon /></Button>
+ *   </Tooltip>
+ *
+ * Wiki: docs/components/Tooltip.md
+ */
+import { forwardRef, useState } from 'react';
+import { Pressable, Text, View } from 'react-native';
+import { cn } from './internal/cn.js';
+const SIDE_CLASSES = {
+    top: 'bottom-full left-1/2 -translate-x-1/2 mb-2',
+    bottom: 'top-full left-1/2 -translate-x-1/2 mt-2',
+};
+export const Tooltip = forwardRef(function Tooltip({ className, content, side = 'top', children, ...props }, ref) {
+    const [visible, setVisible] = useState(false);
+    return (_jsxs(View, { ref: ref, className: cn('relative', className), ...props, children: [_jsx(Pressable, { onLongPress: () => setVisible(true), onPressOut: () => setVisible(false), accessibilityHint: typeof content === 'string' ? content : undefined, children: children }), visible && (_jsx(View, { className: cn('absolute z-50 rounded-md bg-foreground px-2.5 py-1.5', SIDE_CLASSES[side]), pointerEvents: "none", children: typeof content === 'string' ? (_jsx(Text, { className: "text-xs text-background", children: content })) : (content) }))] }));
+});
+//# sourceMappingURL=Tooltip.native.js.map

package/dist/Tooltip.native.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.native.js","sourceRoot":"","sources":["../src/Tooltip.native.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;GAWG;AACH,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAkB,MAAM,OAAO,CAAC;AAC7D,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAkB,MAAM,cAAc,CAAC;AACrE,OAAO,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AAItC,MAAM,YAAY,GAA2B;IAC3C,GAAG,EAAE,4CAA4C;IACjD,MAAM,EAAE,yCAAyC;CAClD,CAAC;AAQF,MAAM,CAAC,MAAM,OAAO,GAAG,UAAU,CAAqB,SAAS,OAAO,CACpE,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,GAAG,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EACxD,GAAG;IAEH,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE9C,OAAO,CACL,MAAC,IAAI,IAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,CAAC,UAAU,EAAE,SAAS,CAAC,KAAM,KAAK,aAC7D,KAAC,SAAS,IACR,WAAW,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,EACnC,UAAU,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,KAAK,CAAC,EACnC,iBAAiB,EAAE,OAAO,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,YAEnE,QAAQ,GACC,EACX,OAAO,IAAI,CACV,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,CACX,sDAAsD,EACtD,YAAY,CAAC,IAAI,CAAC,CACnB,EACD,aAAa,EAAC,MAAM,YAEnB,OAAO,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,CAC7B,KAAC,IAAI,IAAC,SAAS,EAAC,yBAAyB,YAAE,OAAO,GAAQ,CAC3D,CAAC,CAAC,CAAC,CACF,OAAO,CACR,GACI,CACR,IACI,CACR,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/dist/TopBar.d.ts

@@ -0,0 +1,105 @@
+/**
+ * TopBar (web variant — React DOM) + compound sub-components.
+ *
+ * Segmented app header from the MiHCM Figma prototype.
+ * 60 px height on desktop, compact on mobile. Overflow is clipped so the
+ * parallelogram shapes stay within bounds without leaving visual gaps.
+ *
+ * Sub-components:
+ *   TopBarLogo         — brand mark using the Logo primitive
+ *   TopBarHomeButton   — parallelogram home nav button
+ *   TopBarBackLink     — parallelogram back link with ‹ arrow + text
+ *   TopBarNotification — icon with badge count
+ *   TopBarProfile      — user greeting + avatar + status
+ *   TopBarDivider      — thin vertical separator
+ *   TopBarAction       — generic action button (icon + optional label)
+ *
+ * Wiki: docs/components/TopBar.md
+ */
+import { type HTMLAttributes, type ReactNode } from 'react';
+import { type LogoProps } from './Logo.js';
+export interface TopBarProps extends HTMLAttributes<HTMLElement> {
+    /** Leading slot — logo, home button, back link, notification. */
+    start?: ReactNode;
+    /** Optional middle slot — global search, page-level controls. */
+    center?: ReactNode;
+    /** Trailing slot — profile, actions, logout. */
+    end?: ReactNode;
+    /** Force a surface treatment, or follow the app `.dark` class. */
+    appearance?: 'system' | 'light' | 'dark';
+}
+export declare const TopBar: import("react").ForwardRefExoticComponent<TopBarProps & import("react").RefAttributes<HTMLElement>>;
+export interface TopBarLogoProps extends HTMLAttributes<HTMLDivElement> {
+    /** Built-in Logo color treatment. */
+    variant?: LogoProps['variant'];
+    /** Built-in Logo size. */
+    size?: LogoProps['size'];
+    /** Approved brand asset family to swap the mark. */
+    brand?: LogoProps['brand'];
+    /** Approved asset variant when `brand` is set. */
+    assetVariant?: LogoProps['assetVariant'];
+    /** Base public path for approved logo assets. */
+    assetBasePath?: LogoProps['assetBasePath'];
+    /** Logo image source. Overrides `brand`. */
+    src?: string;
+    /** Alt text for the logo image or built-in mark. */
+    alt?: string;
+    /** Classes for the inner Logo primitive. */
+    logoClassName?: string;
+}
+export declare const TopBarLogo: import("react").ForwardRefExoticComponent<TopBarLogoProps & import("react").RefAttributes<HTMLDivElement>>;
+export interface TopBarHomeButtonProps extends Omit<HTMLAttributes<HTMLButtonElement>, 'children'> {
+    /** The icon rendered inside the parallelogram. */
+    icon: ReactNode;
+}
+/**
+ * Parallelogram-shaped home navigation button.
+ * Hidden on mobile (`hidden md:block`) by default.
+ */
+export declare const TopBarHomeButton: import("react").ForwardRefExoticComponent<TopBarHomeButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
+export interface TopBarBackLinkProps extends HTMLAttributes<HTMLElement> {
+    /** Navigates as an anchor when provided. Renders a button otherwise. */
+    href?: string;
+    /** Override the default chevron icon. */
+    icon?: ReactNode;
+}
+/**
+ * Back navigation — parallelogram with chevron + text.
+ * Hidden on mobile (`hidden md:flex`). The text is hidden below `sm`.
+ */
+export declare const TopBarBackLink: import("react").ForwardRefExoticComponent<TopBarBackLinkProps & import("react").RefAttributes<HTMLElement>>;
+export interface TopBarNotificationProps extends Omit<HTMLAttributes<HTMLButtonElement>, 'children'> {
+    /** The notification icon (e.g. Bell from lucide). */
+    icon: ReactNode;
+    /** Badge count. Hidden when 0 or undefined. */
+    count?: number;
+}
+export declare const TopBarNotification: import("react").ForwardRefExoticComponent<TopBarNotificationProps & import("react").RefAttributes<HTMLButtonElement>>;
+export interface TopBarProfileProps extends HTMLAttributes<HTMLDivElement> {
+    /** Primary line, e.g. "Good Morning Yashi". */
+    name?: string;
+    /** Secondary line, e.g. "Edit Profile". */
+    subtitle?: string;
+    /** Avatar element (use the Avatar component). */
+    avatar: ReactNode;
+    /** Optional status indicator overlaid on the avatar. */
+    status?: ReactNode;
+}
+export declare const TopBarProfile: import("react").ForwardRefExoticComponent<TopBarProfileProps & import("react").RefAttributes<HTMLDivElement>>;
+/**
+ * Thin vertical separator between TopBar items.
+ * Hidden below `lg` by default; override with `className`.
+ */
+export declare const TopBarDivider: import("react").ForwardRefExoticComponent<HTMLAttributes<HTMLSpanElement> & import("react").RefAttributes<HTMLSpanElement>>;
+export interface TopBarActionProps extends HTMLAttributes<HTMLButtonElement> {
+    /** Leading icon (e.g. Sparkles, Headphones from lucide). */
+    icon?: ReactNode;
+}
+/**
+ * Generic action button for the TopBar end slot.
+ * Pass `icon` for an icon-only or icon+label button.
+ * Pass `children` (string or node) for the visible label.
+ * Control responsive visibility via `className` (e.g. `hidden lg:flex`).
+ */
+export declare const TopBarAction: import("react").ForwardRefExoticComponent<TopBarActionProps & import("react").RefAttributes<HTMLButtonElement>>;
+//# sourceMappingURL=TopBar.d.ts.map

package/dist/TopBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TopBar.d.ts","sourceRoot":"","sources":["../src/TopBar.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;GAiBG;AACH,OAAO,EAAc,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAExE,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,WAAW,CAAC;AAKjD,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAC,WAAW,CAAC;IAC9D,iEAAiE;IACjE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,iEAAiE;IACjE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,gDAAgD;IAChD,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB,kEAAkE;IAClE,UAAU,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;CAC1C;AAED,eAAO,MAAM,MAAM,qGAqCjB,CAAC;AAIH,MAAM,WAAW,eAAgB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACrE,qCAAqC;IACrC,OAAO,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC/B,0BAA0B;IAC1B,IAAI,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IACzB,oDAAoD;IACpD,KAAK,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAC3B,kDAAkD;IAClD,YAAY,CAAC,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IACzC,iDAAiD;IACjD,aAAa,CAAC,EAAE,SAAS,CAAC,eAAe,CAAC,CAAC;IAC3C,4CAA4C;IAC5C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,oDAAoD;IACpD,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,4CAA4C;IAC5C,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,eAAO,MAAM,UAAU,4GAuFrB,CAAC;AAIH,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC;IAChG,kDAAkD;IAClD,IAAI,EAAE,SAAS,CAAC;CACjB;AAED;;;GAGG;AACH,eAAO,MAAM,gBAAgB,qHAyB5B,CAAC;AAIF,MAAM,WAAW,mBAAoB,SAAQ,cAAc,CAAC,WAAW,CAAC;IACtE,wEAAwE;IACxE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,yCAAyC;IACzC,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED;;;GAGG;AACH,eAAO,MAAM,cAAc,6GA6DzB,CAAC;AAIH,MAAM,WAAW,uBAAwB,SAAQ,IAAI,CACnD,cAAc,CAAC,iBAAiB,CAAC,EACjC,UAAU,CACX;IACC,qDAAqD;IACrD,IAAI,EAAE,SAAS,CAAC;IAChB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,kBAAkB,uHAqB9B,CAAC;AAIF,MAAM,WAAW,kBAAmB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACxE,+CAA+C;IAC/C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iDAAiD;IACjD,MAAM,EAAE,SAAS,CAAC;IAClB,wDAAwD;IACxD,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAED,eAAO,MAAM,aAAa,+GA0BxB,CAAC;AAIH;;;GAGG;AACH,eAAO,MAAM,aAAa,6HAezB,CAAC;AAIF,MAAM,WAAW,iBAAkB,SAAQ,cAAc,CAAC,iBAAiB,CAAC;IAC1E,4DAA4D;IAC5D,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED;;;;;GAKG;AACH,eAAO,MAAM,YAAY,iHAsBvB,CAAC"}

package/dist/TopBar.js

@@ -0,0 +1,90 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * TopBar (web variant — React DOM) + compound sub-components.
+ *
+ * Segmented app header from the MiHCM Figma prototype.
+ * 60 px height on desktop, compact on mobile. Overflow is clipped so the
+ * parallelogram shapes stay within bounds without leaving visual gaps.
+ *
+ * Sub-components:
+ *   TopBarLogo         — brand mark using the Logo primitive
+ *   TopBarHomeButton   — parallelogram home nav button
+ *   TopBarBackLink     — parallelogram back link with ‹ arrow + text
+ *   TopBarNotification — icon with badge count
+ *   TopBarProfile      — user greeting + avatar + status
+ *   TopBarDivider      — thin vertical separator
+ *   TopBarAction       — generic action button (icon + optional label)
+ *
+ * Wiki: docs/components/TopBar.md
+ */
+import { forwardRef } from 'react';
+import { cn } from './internal/cn.js';
+import { Logo } from './Logo.js';
+import { NotificationBadge } from './NotificationBadge.js';
+export const TopBar = forwardRef(function TopBar({ className, start, center, end, children, appearance = 'system', ...props }, ref) {
+    const surfaceClass = appearance === 'dark'
+        ? 'bg-topbar-dark-surface text-topbar-dark-foreground'
+        : appearance === 'light'
+            ? 'bg-topbar-light-surface text-topbar-light-foreground'
+            : 'bg-topbar-light-surface text-topbar-light-foreground dark:!bg-topbar-dark-surface dark:!text-topbar-dark-foreground';
+    return (_jsx("header", { ref: ref, "data-appearance": appearance, className: cn('group/topbar z-30 flex h-15 flex-shrink-0 items-center justify-between overflow-hidden px-6 py-2 shadow-mi-soft', surfaceClass, className), ...props, children: children ?? (_jsxs(_Fragment, { children: [start ? (_jsx("div", { className: "flex min-w-0 shrink-0 items-center gap-0.5", children: start })) : (_jsx("span", {})), center ? (_jsx("div", { className: "hidden md:flex flex-1 justify-center px-6", children: center })) : null, end ? _jsx("div", { className: "flex h-10 shrink-0 items-center gap-6", children: end }) : _jsx("span", {})] })) }));
+});
+export const TopBarLogo = forwardRef(function TopBarLogo({ className, src, alt = 'MiHCM', variant = 'primary', size = 'md', brand, assetVariant, assetBasePath, logoClassName, children, ...props }, ref) {
+    const logoProps = {
+        ...(src ? { src } : {}),
+        ...(brand ? { brand } : {}),
+        ...(assetVariant ? { assetVariant } : {}),
+        ...(assetBasePath ? { assetBasePath } : {}),
+    };
+    const shouldAutoSwapBuiltIn = !children && !src && !brand && variant === 'primary';
+    const shouldAutoSwapAsset = !children && !src && Boolean(brand) && (assetVariant === undefined || assetVariant === 'primary');
+    return (_jsx("div", { ref: ref, className: cn('flex flex-shrink-0 items-center justify-center', className), ...props, children: children ?? (shouldAutoSwapBuiltIn ? (_jsxs(_Fragment, { children: [_jsx(Logo, { alt: alt, variant: "primary", size: size, className: cn('dark:!hidden group-data-[appearance=dark]/topbar:!hidden group-data-[appearance=light]/topbar:!inline-flex', logoClassName) }), _jsx(Logo, { alt: alt, variant: "white", size: size, className: cn('hidden dark:!inline-flex group-data-[appearance=dark]/topbar:!inline-flex group-data-[appearance=light]/topbar:!hidden', logoClassName) })] })) : shouldAutoSwapAsset ? (_jsxs(_Fragment, { children: [_jsx(Logo, { ...logoProps, alt: alt, assetVariant: "primary", size: size, className: cn('dark:!hidden group-data-[appearance=dark]/topbar:!hidden group-data-[appearance=light]/topbar:!inline-flex', logoClassName) }), _jsx(Logo, { ...logoProps, alt: alt, assetVariant: "white", size: size, className: cn('hidden dark:!inline-flex group-data-[appearance=dark]/topbar:!inline-flex group-data-[appearance=light]/topbar:!hidden', logoClassName) })] })) : (_jsx(Logo, { ...logoProps, alt: alt, variant: variant, size: size, className: logoClassName }))) }));
+});
+/**
+ * Parallelogram-shaped home navigation button.
+ * Hidden on mobile (`hidden md:block`) by default.
+ */
+export const TopBarHomeButton = forwardRef(function TopBarHomeButton({ className, icon, ...props }, ref) {
+    return (_jsxs("button", { ref: ref, type: "button", "aria-label": "Home", className: cn('relative -mr-12 hidden h-[65px] w-[102px] shrink-0 md:block', 'cursor-pointer focus:outline-none focus-visible:ring-2 focus-visible:ring-ring', className), ...props, children: [_jsx("span", { className: "absolute inset-0 bg-topbar-light-home dark:!bg-topbar-dark-home group-data-[appearance=dark]/topbar:!bg-topbar-dark-home group-data-[appearance=light]/topbar:!bg-topbar-light-home", style: { clipPath: 'polygon(48px 0, 100% 0, calc(100% - 48px) 100%, 0 100%)' }, "aria-hidden": true }), _jsx("span", { className: "absolute inset-0 flex items-center justify-center text-topbar-light-muted dark:!text-topbar-dark-muted group-data-[appearance=dark]/topbar:!text-topbar-dark-muted group-data-[appearance=light]/topbar:!text-topbar-light-muted [&_svg]:size-4", children: icon })] }));
+});
+/**
+ * Back navigation — parallelogram with chevron + text.
+ * Hidden on mobile (`hidden md:flex`). The text is hidden below `sm`.
+ */
+export const TopBarBackLink = forwardRef(function TopBarBackLink({ className, href, icon, children, ...props }, ref) {
+    const chevron = icon ?? (_jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: _jsx("path", { d: "M15 18L9 12L15 6" }) }));
+    const inner = (_jsxs(_Fragment, { children: [_jsx("span", { className: "absolute inset-0 bg-topbar-light-segment dark:!bg-topbar-dark-segment group-data-[appearance=dark]/topbar:!bg-topbar-dark-segment group-data-[appearance=light]/topbar:!bg-topbar-light-segment", style: { clipPath: 'polygon(48px 0, 100% 0, calc(100% - 48px) 100%, 0 100%)' }, "aria-hidden": true }), _jsxs("span", { className: "relative flex h-full items-center gap-2 pl-[39.77px] pr-12", children: [_jsx("span", { className: "w-4 h-4 flex items-center justify-center shrink-0", children: chevron }), children ? (_jsx("span", { className: "hidden whitespace-nowrap text-xs font-medium text-topbar-light-foreground dark:!text-topbar-dark-foreground group-data-[appearance=dark]/topbar:!text-topbar-dark-foreground group-data-[appearance=light]/topbar:!text-topbar-light-foreground sm:inline", children: children })) : null] })] }));
+    const shared = {
+        className: cn('relative hidden h-[65px] w-[193.773px] shrink-0 md:block', 'cursor-pointer focus:outline-none focus-visible:ring-2 focus-visible:ring-ring', className),
+        ...props,
+    };
+    if (href) {
+        return (_jsx("a", { ref: ref, href: href, ...shared, children: inner }));
+    }
+    return (_jsx("button", { ref: ref, type: "button", ...shared, children: inner }));
+});
+export const TopBarNotification = forwardRef(function TopBarNotification({ className, icon, count, ...props }, ref) {
+    return (_jsxs("button", { ref: ref, type: "button", "aria-label": count ? `Notifications (${count})` : 'Notifications', className: cn('relative ml-0 cursor-pointer', 'focus:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded', className), ...props, children: [_jsx("span", { className: "flex size-4 items-center justify-center text-topbar-light-muted dark:!text-topbar-dark-muted group-data-[appearance=dark]/topbar:!text-topbar-dark-muted group-data-[appearance=light]/topbar:!text-topbar-light-muted [&_svg]:size-4", children: icon }), _jsx(NotificationBadge, { count: count ?? 0, className: "-top-[9px] -right-2.5" })] }));
+});
+export const TopBarProfile = forwardRef(function TopBarProfile({ className, name, subtitle, avatar, status, ...props }, ref) {
+    return (_jsxs("div", { ref: ref, className: cn('relative flex items-center gap-4', className), ...props, children: [(name || subtitle) && (_jsxs("div", { className: "text-right leading-4 hidden md:flex md:flex-col md:items-end gap-0.5", children: [name && (_jsx("span", { className: "whitespace-nowrap text-xs font-medium text-topbar-light-foreground dark:!text-topbar-dark-foreground group-data-[appearance=dark]/topbar:!text-topbar-dark-foreground group-data-[appearance=light]/topbar:!text-topbar-light-foreground", children: name })), subtitle && (_jsx("span", { className: "whitespace-nowrap text-xs leading-4 text-topbar-light-muted dark:!text-topbar-dark-muted group-data-[appearance=dark]/topbar:!text-topbar-dark-muted group-data-[appearance=light]/topbar:!text-topbar-light-muted", children: subtitle }))] })), _jsxs("div", { className: "relative", children: [avatar, status && _jsx("span", { className: "absolute -bottom-0.5 -right-0.5", children: status })] })] }));
+});
+/* ── TopBarDivider ────────────────────────────────────────────────── */
+/**
+ * Thin vertical separator between TopBar items.
+ * Hidden below `lg` by default; override with `className`.
+ */
+export const TopBarDivider = forwardRef(function TopBarDivider({ className, ...props }, ref) {
+    return (_jsx("span", { ref: ref, "aria-hidden": true, className: cn('hidden h-[15px] w-px bg-topbar-light-divider dark:!bg-topbar-dark-divider lg:block', 'group-data-[appearance=dark]/topbar:!bg-topbar-dark-divider group-data-[appearance=light]/topbar:!bg-topbar-light-divider', className), ...props }));
+});
+/**
+ * Generic action button for the TopBar end slot.
+ * Pass `icon` for an icon-only or icon+label button.
+ * Pass `children` (string or node) for the visible label.
+ * Control responsive visibility via `className` (e.g. `hidden lg:flex`).
+ */
+export const TopBarAction = forwardRef(function TopBarAction({ className, icon, children, ...props }, ref) {
+    return (_jsxs("button", { ref: ref, type: "button", className: cn('flex items-center gap-2 cursor-pointer', 'text-topbar-light-muted transition-colors duration-150 hover:text-topbar-light-foreground dark:!text-topbar-dark-muted dark:hover:!text-topbar-dark-foreground', 'group-data-[appearance=dark]/topbar:!text-topbar-dark-muted group-data-[appearance=dark]/topbar:hover:!text-topbar-dark-foreground', 'group-data-[appearance=light]/topbar:!text-topbar-light-muted group-data-[appearance=light]/topbar:hover:!text-topbar-light-foreground', 'focus:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded', className), ...props, children: [icon && _jsx("span", { className: "[&_svg]:size-4", children: icon }), children && _jsx("span", { className: "text-xs leading-4", children: children })] }));
+});
+//# sourceMappingURL=TopBar.js.map

package/dist/TopBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TopBar.js","sourceRoot":"","sources":["../src/TopBar.tsx"],"names":[],"mappings":"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"}

package/dist/TopBar.native.d.ts

@@ -0,0 +1,67 @@
+/**
+ * TopBar (React Native variant) + compound sub-components.
+ *
+ * Mobile-first: horizontal bar with back button, title, and actions.
+ * Parallelograms omitted (web CSS-only). TopBarHomeButton skipped.
+ *
+ * Wiki: docs/components/TopBar.md
+ */
+import { type ReactNode } from 'react';
+import { type LogoProps } from './Logo.js';
+import { View, type ViewProps } from 'react-native';
+export interface TopBarProps extends Omit<ViewProps, 'style' | 'children'> {
+    start?: ReactNode;
+    center?: ReactNode;
+    end?: ReactNode;
+    children?: ReactNode;
+    className?: string;
+    appearance?: 'system' | 'light' | 'dark';
+}
+export declare const TopBar: import("react").ForwardRefExoticComponent<TopBarProps & import("react").RefAttributes<View>>;
+export interface TopBarLogoProps extends Omit<ViewProps, 'style' | 'children'> {
+    variant?: LogoProps['variant'];
+    size?: LogoProps['size'];
+    brand?: LogoProps['brand'];
+    assetVariant?: LogoProps['assetVariant'];
+    assetBasePath?: LogoProps['assetBasePath'];
+    src?: string;
+    alt?: string;
+    logoClassName?: string;
+    children?: ReactNode;
+    className?: string;
+}
+export declare const TopBarLogo: import("react").ForwardRefExoticComponent<TopBarLogoProps & import("react").RefAttributes<View>>;
+export interface TopBarBackLinkProps extends Omit<ViewProps, 'style' | 'children'> {
+    href?: string;
+    icon?: ReactNode;
+    onPress?: () => void;
+    children?: ReactNode;
+    className?: string;
+}
+export declare const TopBarBackLink: import("react").ForwardRefExoticComponent<TopBarBackLinkProps & import("react").RefAttributes<View>>;
+export interface TopBarNotificationProps extends Omit<ViewProps, 'style' | 'children'> {
+    icon: ReactNode;
+    count?: number;
+    onPress?: () => void;
+    className?: string;
+}
+export declare const TopBarNotification: import("react").ForwardRefExoticComponent<TopBarNotificationProps & import("react").RefAttributes<View>>;
+export interface TopBarProfileProps extends Omit<ViewProps, 'style'> {
+    name?: string;
+    subtitle?: string;
+    avatar: ReactNode;
+    status?: ReactNode;
+    className?: string;
+}
+export declare const TopBarProfile: import("react").ForwardRefExoticComponent<TopBarProfileProps & import("react").RefAttributes<View>>;
+export declare const TopBarDivider: import("react").ForwardRefExoticComponent<Omit<ViewProps, "style"> & {
+    className?: string;
+} & import("react").RefAttributes<View>>;
+export interface TopBarActionProps extends Omit<ViewProps, 'style' | 'children'> {
+    icon?: ReactNode;
+    onPress?: () => void;
+    children?: ReactNode;
+    className?: string;
+}
+export declare const TopBarAction: import("react").ForwardRefExoticComponent<TopBarActionProps & import("react").RefAttributes<View>>;
+//# sourceMappingURL=TopBar.native.d.ts.map

package/dist/TopBar.native.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TopBar.native.d.ts","sourceRoot":"","sources":["../src/TopBar.native.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,EAAc,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,WAAW,CAAC;AACjD,OAAO,EAAmB,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAErE,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,SAAS,EAAE,OAAO,GAAG,UAAU,CAAC;IACxE,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;CAC1C;AAED,eAAO,MAAM,MAAM,8FA0BjB,CAAC;AAEH,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,SAAS,EAAE,OAAO,GAAG,UAAU,CAAC;IAC5E,OAAO,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC/B,IAAI,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IACzB,KAAK,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAC3B,YAAY,CAAC,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IACzC,aAAa,CAAC,EAAE,SAAS,CAAC,eAAe,CAAC,CAAC;IAC3C,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,UAAU,kGAsCtB,CAAC;AAEF,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,SAAS,EAAE,OAAO,GAAG,UAAU,CAAC;IAChF,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,cAAc,sGAkB1B,CAAC;AAEF,MAAM,WAAW,uBAAwB,SAAQ,IAAI,CAAC,SAAS,EAAE,OAAO,GAAG,UAAU,CAAC;IACpF,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,kBAAkB,0GAwB9B,CAAC;AAEF,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,SAAS,EAAE,OAAO,CAAC;IAClE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,SAAS,CAAC;IAClB,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,aAAa,qGAazB,CAAC;AAEF,eAAO,MAAM,aAAa;gBAA6D,MAAM;wCAW5F,CAAC;AAEF,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,SAAS,EAAE,OAAO,GAAG,UAAU,CAAC;IAC9E,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,YAAY,oGAexB,CAAC"}

package/dist/TopBar.native.js

@@ -0,0 +1,41 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * TopBar (React Native variant) + compound sub-components.
+ *
+ * Mobile-first: horizontal bar with back button, title, and actions.
+ * Parallelograms omitted (web CSS-only). TopBarHomeButton skipped.
+ *
+ * Wiki: docs/components/TopBar.md
+ */
+import { forwardRef } from 'react';
+import { cn } from './internal/cn.js';
+import { Logo } from './Logo.js';
+import { Pressable, Text, View } from 'react-native';
+export const TopBar = forwardRef(function TopBar({ className, start, center, end, children, appearance = 'system', ...props }, ref) {
+    return (_jsx(View, { ref: ref, accessibilityRole: "header", className: cn('flex-row items-center justify-between px-3 py-2', appearance === 'dark' && 'bg-topbar-dark-surface', appearance === 'light' && 'bg-topbar-light-surface', appearance === 'system' && 'bg-card', className), ...props, children: children ?? (_jsxs(_Fragment, { children: [_jsx(View, { className: "flex-row items-center", children: start }), center ? _jsx(View, { className: "flex-1 items-center px-3", children: center }) : null, _jsx(View, { className: "flex-row items-center gap-3", children: end })] })) }));
+});
+export const TopBarLogo = forwardRef(function TopBarLogo({ className, src, alt = 'MiHCM', variant = 'primary', size = 'md', brand, assetVariant, assetBasePath, logoClassName, children, ...props }, ref) {
+    const logoProps = {
+        ...(src ? { src } : {}),
+        ...(brand ? { brand } : {}),
+        ...(assetVariant ? { assetVariant } : {}),
+        ...(assetBasePath ? { assetBasePath } : {}),
+    };
+    return (_jsx(View, { ref: ref, className: cn('mr-1', className), ...props, children: children ?? (_jsx(Logo, { ...logoProps, alt: alt, variant: variant, size: size, className: logoClassName })) }));
+});
+export const TopBarBackLink = forwardRef(function TopBarBackLink({ className, icon, onPress, children, ...props }, ref) {
+    return (_jsxs(Pressable, { ref: ref, accessibilityRole: "button", accessibilityLabel: typeof children === 'string' ? children : 'Back', onPress: onPress, className: cn('flex-row items-center gap-1 py-1', className), ...props, children: [icon ?? _jsx(Text, { className: "text-lg text-foreground", children: '‹' }), children ? (_jsx(Text, { className: "text-xs font-medium text-foreground", children: children })) : null] }));
+});
+export const TopBarNotification = forwardRef(function TopBarNotification({ className, icon, count, onPress, ...props }, ref) {
+    return (_jsxs(Pressable, { ref: ref, accessibilityRole: "button", accessibilityLabel: count ? `Notifications (${count})` : 'Notifications', onPress: onPress, className: cn('relative', className), ...props, children: [_jsx(View, { className: "h-6 w-6 items-center justify-center text-muted-foreground", children: icon }), count != null && count > 0 && (_jsx(View, { className: "absolute -top-1 -right-1 min-w-4 h-4 items-center justify-center rounded-full bg-destructive px-1", children: _jsx(Text, { className: "text-caption font-bold text-destructive-foreground", children: count > 99 ? '99+' : count }) }))] }));
+});
+export const TopBarProfile = forwardRef(function TopBarProfile({ className, name: _name, subtitle: _subtitle, avatar, status, ...props }, ref) {
+    return (_jsx(View, { ref: ref, className: cn('flex-row items-center', className), ...props, children: _jsxs(View, { className: "relative", children: [avatar, status && (_jsx(View, { className: "absolute -bottom-0.5 -right-0.5", children: status }))] }) }));
+});
+export const TopBarDivider = forwardRef(function TopBarDivider({ className, ...props }, ref) {
+    return (_jsx(View, { ref: ref, accessibilityRole: "none", className: cn('h-4 w-px bg-border mx-1', className), ...props }));
+});
+export const TopBarAction = forwardRef(function TopBarAction({ className, icon, onPress, children, ...props }, ref) {
+    return (_jsxs(Pressable, { ref: ref, accessibilityRole: "button", onPress: onPress, className: cn('flex-row items-center gap-1', className), ...props, children: [icon && _jsx(View, { className: "h-5 w-5 items-center justify-center", children: icon }), children ? _jsx(Text, { className: "text-xs text-muted-foreground", children: children }) : null] }));
+});
+//# sourceMappingURL=TopBar.native.js.map

package/dist/TopBar.native.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TopBar.native.js","sourceRoot":"","sources":["../src/TopBar.native.tsx"],"names":[],"mappings":"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"}