@mangtre/ui 0.1.0

package/dist/feedback.js

@@ -0,0 +1,16 @@
+import {
+  EmptyState,
+  ErrorState,
+  Progress,
+  Skeleton,
+  Spinner
+} from "./chunk-VGC5DMOM.js";
+import "./chunk-3AL4SUFD.js";
+import "./chunk-PPOYMKV3.js";
+export {
+  EmptyState,
+  ErrorState,
+  Progress,
+  Skeleton,
+  Spinner
+};

package/dist/forms.d.ts

@@ -0,0 +1,91 @@
+import * as react from 'react';
+import { ReactNode, InputHTMLAttributes, SelectHTMLAttributes, TextareaHTMLAttributes } from 'react';
+import { T as ThemeMode } from './MangThemeProvider-BqdGKBP2.js';
+import '@mangtre/core';
+
+interface FieldProps {
+    label?: ReactNode;
+    description?: ReactNode;
+    /** Error message; when set the control is marked `aria-invalid`. */
+    error?: ReactNode;
+    required?: boolean;
+    theme?: ThemeMode;
+    className?: string;
+    /** A single form control (Input/Select/TextArea/…). */
+    children: ReactNode;
+}
+declare function Field({ label, description, error, required, theme, className, children, }: FieldProps): react.JSX.Element;
+
+interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
+    theme?: ThemeMode;
+}
+declare function Input({ theme, className, ...rest }: InputProps): react.JSX.Element;
+interface TextAreaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
+    theme?: ThemeMode;
+}
+declare function TextArea({ theme, className, ...rest }: TextAreaProps): react.JSX.Element;
+interface SelectProps extends SelectHTMLAttributes<HTMLSelectElement> {
+    theme?: ThemeMode;
+}
+declare function Select({ theme, className, children, ...rest }: SelectProps): react.JSX.Element;
+
+type BaseProps = Omit<InputHTMLAttributes<HTMLInputElement>, "type"> & {
+    label?: ReactNode;
+    theme?: ThemeMode;
+};
+interface CheckboxProps extends BaseProps {
+}
+declare function Checkbox({ label, theme, className, disabled, ...rest }: CheckboxProps): react.JSX.Element;
+interface SwitchProps extends BaseProps {
+}
+/** Toggle switch — a styled checkbox (`role` stays the native checkbox for AT support). */
+declare function Switch({ label, theme, className, disabled, ...rest }: SwitchProps): react.JSX.Element;
+
+interface SegmentOption {
+    value: string;
+    label: ReactNode;
+    disabled?: boolean;
+}
+interface SegmentedControlProps {
+    options: SegmentOption[];
+    value: string;
+    onChange: (value: string) => void;
+    /** Accessible name for the group. */
+    ariaLabel?: string;
+    size?: "sm" | "md";
+    theme?: ThemeMode;
+    className?: string;
+}
+/** Single-select mode/filter toggle (radio-like, button-flush). For 2–4 mutually exclusive modes. */
+declare function SegmentedControl({ options, value, onChange, ariaLabel, size, theme, className, }: SegmentedControlProps): react.JSX.Element;
+interface ChipProps {
+    children: ReactNode;
+    /** Selected styling (for filter/tag pickers). */
+    selected?: boolean;
+    /** Makes the whole chip a toggle button. */
+    onClick?: () => void;
+    /** Adds a trailing × remove button. */
+    onRemove?: () => void;
+    /** Accessible label for the × button. Default "Xoá". */
+    removeLabel?: string;
+    icon?: ReactNode;
+    theme?: ThemeMode;
+    className?: string;
+}
+/** Compact pill — selectable (`onClick`) and/or removable (`onRemove`). For tags & quick filters. */
+declare function Chip({ children, selected, onClick, onRemove, removeLabel, icon, theme, className, }: ChipProps): react.JSX.Element;
+interface NumberStepperProps {
+    value: number;
+    onChange: (value: number) => void;
+    min?: number;
+    max?: number;
+    step?: number;
+    /** Accessible name for the numeric input. */
+    ariaLabel?: string;
+    theme?: ThemeMode;
+    className?: string;
+}
+/** Numeric entry with −/+ buttons, clamped to [min,max]. For quantities, reps, counts. */
+declare function NumberStepper({ value, onChange, min, max, step, ariaLabel, theme, className, }: NumberStepperProps): react.JSX.Element;
+
+export { Checkbox, type CheckboxProps, Chip, type ChipProps, Field, type FieldProps, Input, type InputProps, NumberStepper, type NumberStepperProps, type SegmentOption, SegmentedControl, type SegmentedControlProps, Select, type SelectProps, Switch, type SwitchProps, TextArea, type TextAreaProps };

package/dist/forms.js

@@ -0,0 +1,26 @@
+import {
+  Chip,
+  Field,
+  Input,
+  NumberStepper,
+  SegmentedControl,
+  Select,
+  TextArea
+} from "./chunk-OBPXCUVF.js";
+import {
+  Checkbox,
+  Switch
+} from "./chunk-PQGUWJG4.js";
+import "./chunk-3AL4SUFD.js";
+import "./chunk-PPOYMKV3.js";
+export {
+  Checkbox,
+  Chip,
+  Field,
+  Input,
+  NumberStepper,
+  SegmentedControl,
+  Select,
+  Switch,
+  TextArea
+};

package/dist/handoff.d.ts

@@ -0,0 +1,37 @@
+import * as react from 'react';
+import { ReactNode } from 'react';
+import { Locale } from '@mangtre/core';
+import { T as ThemeMode } from './MangThemeProvider-BqdGKBP2.js';
+
+interface HandoffConnectionStatusProps {
+    connected: boolean;
+    /** Connected device label. */
+    device?: string;
+    locale?: Locale;
+}
+declare function HandoffConnectionStatus({ connected, device, locale, }: HandoffConnectionStatusProps): react.JSX.Element;
+interface HandoffPairingPanelProps {
+    /** The QR node (app-generated, e.g. a <canvas>/<svg>/<img>). */
+    qr?: ReactNode;
+    connected?: boolean;
+    device?: string;
+    title?: ReactNode;
+    note?: ReactNode;
+    locale?: Locale;
+    theme?: ThemeMode;
+    className?: string;
+}
+declare function HandoffPairingPanel({ qr, connected, device, title, note, locale, theme, className, }: HandoffPairingPanelProps): react.JSX.Element;
+interface HandoffPayloadBannerProps {
+    /** Payload kind label (text/json/image). */
+    kind: string;
+    device?: string;
+    onPaste: () => void;
+    onDismiss?: () => void;
+    locale?: Locale;
+    theme?: ThemeMode;
+    className?: string;
+}
+declare function HandoffPayloadBanner({ kind, device, onPaste, onDismiss, locale, theme, className, }: HandoffPayloadBannerProps): react.JSX.Element;
+
+export { HandoffConnectionStatus, type HandoffConnectionStatusProps, HandoffPairingPanel, type HandoffPairingPanelProps, HandoffPayloadBanner, type HandoffPayloadBannerProps };

package/dist/handoff.js

@@ -0,0 +1,13 @@
+import {
+  HandoffConnectionStatus,
+  HandoffPairingPanel,
+  HandoffPayloadBanner
+} from "./chunk-DLKEXWPA.js";
+import "./chunk-YN5O6YL6.js";
+import "./chunk-3AL4SUFD.js";
+import "./chunk-PPOYMKV3.js";
+export {
+  HandoffConnectionStatus,
+  HandoffPairingPanel,
+  HandoffPayloadBanner
+};

package/dist/index.css

@@ -0,0 +1,2 @@
+/* src/theme.css */
+@theme { --color-mang-green: #37b693; --color-mang-shoot: #8fe3b8; --color-mang-bamboo: #1f7a5c; --color-mang-soil: #b5793a; --color-mang-sun: #e8c547; --color-mang-paper: #f4f1e8; --color-mang-dark: #14201c; --color-surface-base: #ffffff; --color-surface-sunken: #f6faf9; --color-surface-inverse: #14201c; --color-content-default: #16242c; --color-content-strong: #14201c; --color-content-muted: #5d6f78; --color-content-inverse: #f4f1e8; --color-content-on-accent: #ffffff; --color-line-subtle: #eef3f2; --color-line-default: #e4eceb; --color-line-strong: #cdd9d6; --color-accent-default: #37b693; --color-accent-hover: #2e9e80; --color-accent-soft: #e7f6f1; --color-state-success: #1f9c7e; --color-state-success-soft: #e7f6f1; --color-state-danger: #d2674a; --color-state-danger-soft: #fbeee9; --color-state-warning: #c77d2e; --color-state-warning-soft: #fbf1e2; --color-state-info: #2e7cb8; --color-state-info-soft: #e6f0f8; --font-heading: "Quicksand Variable", system-ui, sans-serif; --font-body: "Inter", system-ui, sans-serif; }

package/dist/index.d.ts

@@ -0,0 +1,62 @@
+export { Tokens, defaultTheme, tokens } from './tokens.js';
+export { D as Density, M as MangThemeContextValue, a as MangThemeProvider, b as MangThemeProviderProps, T as ThemeMode, u as useDensity, c as useLocale, d as useMangTheme, e as useResolvedTheme } from './MangThemeProvider-BqdGKBP2.js';
+export { KIT_STYLE_ID, ScopeProps, cx, useAreaStyles, useKitStyles, useScope, useScopedStyle } from './theme.js';
+export { Box, BoxProps, Divider, DividerProps, HStack, Heading, HeadingProps, Spacer, SpacerProps, Stack, StackProps, Text, TextProps, VStack } from './primitives.js';
+export { Button, ButtonGroup, ButtonGroupProps, ButtonProps, ButtonSize, ButtonVariant, IconButton, IconButtonProps } from './actions.js';
+export { Checkbox, CheckboxProps, Chip, ChipProps, Field, FieldProps, Input, InputProps, NumberStepper, NumberStepperProps, SegmentOption, SegmentedControl, SegmentedControlProps, Select, SelectProps, Switch, SwitchProps, TextArea, TextAreaProps } from './forms.js';
+export { Card, CardBody, CardFooter, CardHeader, CardProps, Panel, PanelProps } from './surface.js';
+export { Tab, TabList, TabListProps, TabPanel, TabPanelProps, TabProps, Tabs, TabsProps } from './navigation.js';
+export { Dialog, DialogProps, Sheet, SheetProps, ToastAction, ToastInput, ToastItem, ToastProvider, ToastProviderProps, ToastTone, ToastViewport, ToastViewportProps, toastReducer, useToast } from './overlay.js';
+export { EmptyState, EmptyStateProps, ErrorState, ErrorStateProps, Progress, ProgressProps, Skeleton, SkeletonProps, Spinner, SpinnerProps } from './feedback.js';
+export { Badge, BadgeProps, BadgeTone, CloudBadge, DesktopOnly, GracefulDegradePanel, GracefulDegradePanelProps, LocalBadge, PermissionBadge, PermissionBadgeProps, PermissionGate, PermissionGateProps, RealtimeBadge, Surface, SurfaceBadge, SurfaceBadgeProps, SurfaceGate, SurfaceGateProps, VerifiedBadge, VerifiedBadgeProps, WebOnly, ZaloOnly } from './platform.js';
+export { M as MoneyText, a as MoneyTextProps, V as VndText, b as VndTextProps, f as formatVnd } from './Money-Dw3GnUvX.js';
+export { AiModelOption, AiSetupCard, AiSetupCardProps, AiStatusCard, AiStatusCardProps, PowerPicker, PowerPickerProps } from './ai.js';
+export { AreaChart, BarChart, BarChartProps, DonutChart, DonutChartProps, Heatmap, HeatmapProps, Legend, LegendItem, LineChart, LineChartProps, SERIES, Segment, Sparkline, SparklineProps, Stat, StatGroup, StatProps, axisMax, barFractions, linePoints, pieSegments } from './charts.js';
+export { HandoffConnectionStatus, HandoffConnectionStatusProps, HandoffPairingPanel, HandoffPairingPanelProps, HandoffPayloadBanner, HandoffPayloadBannerProps } from './handoff.js';
+export { RoomConflictNotice, RoomConflictNoticeProps, RoomLinkCard, RoomLinkCardProps, RoomPresence, RoomPresenceProps, RoomShareButton, RoomShareButtonProps, RoomStatus, RoomStatusBadge, RoomStatusBadgeProps } from './data-room.js';
+export { AnalyticsConsentToggle, AnalyticsConsentToggleProps, EventLogRow, EventLogTable, EventLogTableProps, GateMetBadge, GateMetBadgeProps, GateReport, GateReportProps, GateReportRow } from './analytics.js';
+export { SafetyScanBadge, SafetyScanBadgeProps, SandboxError, SandboxErrorProps, SandboxFrame, SandboxFrameProps, ScanFinding, ScanLevel, StaticScanResult, StaticScanResultProps } from './sandbox.js';
+export { BuildBadge, BuildBadgeProps, BundleUploadDropzone, BundleUploadDropzoneProps, ManifestPreview, ManifestPreviewProps, ManifestSummary, ReviewStatus, ReviewStatusBadge, ReviewStatusBadgeProps, StaticScanPanel, StaticScanPanelProps, VersionBadge, VersionBadgeProps } from './creator.js';
+export { AmountSummary, AmountSummaryProps, ExpenseList, ExpenseRow, ExpenseRowProps, PaidBadge, PaidBadgeProps, SettlementCard, SettlementCardProps, UnpaidBadge } from './money.js';
+export { Flashcard, FlashcardProps, QuizCard, QuizCardProps, QuizOption, ScoreCard, ScoreCardProps, StreakBadge, StreakBadgeProps } from './learning.js';
+export { AppFrame, AppFrameProps, BottomActionBar, Container, ContainerProps, ListRow, ListRowProps, Page, PageHeader, PageHeaderProps, SafeArea, SafeAreaProps, Section, SectionProps } from './layout.js';
+export { Avatar, AvatarGroup, AvatarGroupProps, AvatarProps, Dropzone, DropzoneProps, FilePreview, FilePreviewProps, ImagePreview, ImagePreviewProps } from './media.js';
+export { SettingsRow, SettingsRowProps, SettingsSection, SettingsToggle, SettingsToggleProps } from './settings.js';
+export { ExternalLinkWarning, ExternalLinkWarningProps, LocalFirstNotice, NoPiiBadge, PrivacyNotice, PrivacyNoticeProps } from './privacy.js';
+export { CalloutBlock, CalloutBlockProps, CalloutTone, CodeBlock, CodeBlockProps, Kbd, Prose } from './editor.js';
+export { ComingSoonMonetizationCard, ComingSoonMonetizationCardProps, EarningsLedgerTable, EarningsRow, PayoutStatus, PayoutStatusBadge } from './monetization.js';
+import { ThemeTokens } from '@mangtre/core';
+export { MangApp, MangAppProps } from './app.js';
+import 'react';
+
+/**
+ * Refcounted, id-keyed `<style>` injection — the shared mechanism every Măng UI piece uses to
+ * mount its scoped CSS (a mini-app's whole stylesheet, or a self-styling component like
+ * `PowerPicker`). Extracted from `index.ts` so components can import it without a barrel cycle.
+ */
+/**
+ * Mount a refcounted, id-keyed `<style>` into `<head>` and return a disposer.
+ *
+ * A mini-app injects its whole stylesheet as one `<style>` on mount and drops it on unmount.
+ * The shell can mount → unmount → re-mount an app in quick succession — React StrictMode
+ * double-invokes effects in dev, and an async-loaded app can overlap a stale teardown — so a
+ * naive "whoever created the tag removes it" flag lets a STALE instance's cleanup delete the
+ * `<style>` out from under a LIVE one, leaving the app rendered but unstyled. Counting live
+ * instances and only removing the tag when the count hits zero makes teardown correct under
+ * ANY mount/unmount interleaving. The latest mount refreshes the CSS (the theme may differ).
+ *
+ * The returned disposer is idempotent (safe to call more than once — extra calls are no-ops).
+ */
+declare function mountScopedStyle(id: string, css: string): () => void;
+
+/**
+ * `applyThemeVars` — write the brand theme onto an element as CSS custom properties
+ * (`--mang-color-*`, `--mang-font-*`). The RUNTIME seam: projects the `sdk.theme` accent thread
+ * (7 colors + fonts) onto a host element, independent of the build-time `@mangtre/ui` import.
+ *
+ * Kept in its own module (not the barrel) so `MangApp` can use it without a circular import.
+ */
+
+declare function applyThemeVars(el: HTMLElement, theme?: ThemeTokens): void;
+
+export { applyThemeVars, mountScopedStyle };

package/dist/index.js

@@ -0,0 +1,338 @@
+import {
+  ExternalLinkWarning,
+  LocalFirstNotice,
+  NoPiiBadge,
+  PrivacyNotice
+} from "./chunk-IVYXOKMO.js";
+import {
+  CalloutBlock,
+  CodeBlock,
+  Kbd,
+  Prose
+} from "./chunk-Z4ANGBPC.js";
+import {
+  ComingSoonMonetizationCard,
+  EarningsLedgerTable,
+  PayoutStatusBadge
+} from "./chunk-ASZKHSMG.js";
+import {
+  AnalyticsConsentToggle,
+  EventLogTable,
+  GateMetBadge,
+  GateReport
+} from "./chunk-ID233AGM.js";
+import "./chunk-VP56Z4BS.js";
+import {
+  BuildBadge,
+  BundleUploadDropzone,
+  ManifestPreview,
+  ReviewStatusBadge,
+  StaticScanPanel,
+  VersionBadge
+} from "./chunk-JJB4PJC3.js";
+import {
+  SafetyScanBadge,
+  SandboxError,
+  SandboxFrame,
+  StaticScanResult
+} from "./chunk-X7T2DJLU.js";
+import {
+  AmountSummary,
+  ExpenseList,
+  ExpenseRow,
+  PaidBadge,
+  SettlementCard,
+  UnpaidBadge
+} from "./chunk-UF6ANDJZ.js";
+import {
+  Flashcard,
+  QuizCard,
+  ScoreCard,
+  StreakBadge
+} from "./chunk-4XNSYKQE.js";
+import {
+  AppFrame,
+  BottomActionBar,
+  Container,
+  ListRow,
+  Page,
+  PageHeader,
+  SafeArea,
+  Section
+} from "./chunk-XPV3OOLU.js";
+import {
+  Avatar,
+  AvatarGroup,
+  Dropzone,
+  FilePreview,
+  ImagePreview
+} from "./chunk-RE7OWRA4.js";
+import {
+  SettingsRow,
+  SettingsSection,
+  SettingsToggle
+} from "./chunk-VRD66FIA.js";
+import {
+  Tab,
+  TabList,
+  TabPanel,
+  Tabs
+} from "./chunk-SJF3CHAW.js";
+import {
+  Dialog,
+  Sheet
+} from "./chunk-LNRUPJDF.js";
+import {
+  EmptyState,
+  ErrorState,
+  Progress,
+  Skeleton,
+  Spinner
+} from "./chunk-VGC5DMOM.js";
+import {
+  CloudBadge,
+  DesktopOnly,
+  GracefulDegradePanel,
+  LocalBadge,
+  PermissionBadge,
+  PermissionGate,
+  RealtimeBadge,
+  SurfaceBadge,
+  SurfaceGate,
+  WebOnly,
+  ZaloOnly
+} from "./chunk-K5Q3RCV6.js";
+import {
+  MoneyText,
+  VndText,
+  formatVnd
+} from "./chunk-IX3DYETF.js";
+import {
+  Badge,
+  VerifiedBadge
+} from "./chunk-FZRXVRC7.js";
+import {
+  AiSetupCard,
+  AiStatusCard,
+  PowerPicker
+} from "./chunk-BCBN2EGH.js";
+import {
+  AreaChart,
+  BarChart,
+  DonutChart,
+  Heatmap,
+  Legend,
+  LineChart,
+  SERIES,
+  Sparkline,
+  Stat,
+  StatGroup,
+  axisMax,
+  barFractions,
+  linePoints,
+  pieSegments
+} from "./chunk-BLYAFV45.js";
+import {
+  HandoffConnectionStatus,
+  HandoffPairingPanel,
+  HandoffPayloadBanner
+} from "./chunk-DLKEXWPA.js";
+import {
+  RoomConflictNotice,
+  RoomLinkCard,
+  RoomPresence,
+  RoomShareButton,
+  RoomStatusBadge
+} from "./chunk-OJX2EIMB.js";
+import {
+  MangApp,
+  applyThemeVars
+} from "./chunk-7P2EQZYD.js";
+import {
+  ToastProvider,
+  ToastViewport,
+  toastReducer,
+  useToast
+} from "./chunk-DTASXPTB.js";
+import {
+  Box,
+  Divider,
+  HStack,
+  Heading,
+  Spacer,
+  Stack,
+  Text,
+  VStack
+} from "./chunk-7WHNIEDV.js";
+import "./chunk-LZORNMBL.js";
+import {
+  Button,
+  ButtonGroup,
+  IconButton
+} from "./chunk-YN5O6YL6.js";
+import {
+  Chip,
+  Field,
+  Input,
+  NumberStepper,
+  SegmentedControl,
+  Select,
+  TextArea
+} from "./chunk-OBPXCUVF.js";
+import {
+  Checkbox,
+  Switch
+} from "./chunk-PQGUWJG4.js";
+import {
+  Card,
+  CardBody,
+  CardFooter,
+  CardHeader,
+  Panel
+} from "./chunk-5Z4VLQKH.js";
+import {
+  mountScopedStyle
+} from "./chunk-3AL4SUFD.js";
+import {
+  defaultTheme,
+  tokens
+} from "./chunk-PPOYMKV3.js";
+export {
+  AiSetupCard,
+  AiStatusCard,
+  AmountSummary,
+  AnalyticsConsentToggle,
+  AppFrame,
+  AreaChart,
+  Avatar,
+  AvatarGroup,
+  Badge,
+  BarChart,
+  BottomActionBar,
+  Box,
+  BuildBadge,
+  BundleUploadDropzone,
+  Button,
+  ButtonGroup,
+  CalloutBlock,
+  Card,
+  CardBody,
+  CardFooter,
+  CardHeader,
+  Checkbox,
+  Chip,
+  CloudBadge,
+  CodeBlock,
+  ComingSoonMonetizationCard,
+  Container,
+  DesktopOnly,
+  Dialog,
+  Divider,
+  DonutChart,
+  Dropzone,
+  EarningsLedgerTable,
+  EmptyState,
+  ErrorState,
+  EventLogTable,
+  ExpenseList,
+  ExpenseRow,
+  ExternalLinkWarning,
+  Field,
+  FilePreview,
+  Flashcard,
+  GateMetBadge,
+  GateReport,
+  GracefulDegradePanel,
+  HStack,
+  HandoffConnectionStatus,
+  HandoffPairingPanel,
+  HandoffPayloadBanner,
+  Heading,
+  Heatmap,
+  IconButton,
+  ImagePreview,
+  Input,
+  Kbd,
+  Legend,
+  LineChart,
+  ListRow,
+  LocalBadge,
+  LocalFirstNotice,
+  MangApp,
+  ManifestPreview,
+  MoneyText,
+  NoPiiBadge,
+  NumberStepper,
+  Page,
+  PageHeader,
+  PaidBadge,
+  Panel,
+  PayoutStatusBadge,
+  PermissionBadge,
+  PermissionGate,
+  PowerPicker,
+  PrivacyNotice,
+  Progress,
+  Prose,
+  QuizCard,
+  RealtimeBadge,
+  ReviewStatusBadge,
+  RoomConflictNotice,
+  RoomLinkCard,
+  RoomPresence,
+  RoomShareButton,
+  RoomStatusBadge,
+  SERIES,
+  SafeArea,
+  SafetyScanBadge,
+  SandboxError,
+  SandboxFrame,
+  ScoreCard,
+  Section,
+  SegmentedControl,
+  Select,
+  SettingsRow,
+  SettingsSection,
+  SettingsToggle,
+  SettlementCard,
+  Sheet,
+  Skeleton,
+  Spacer,
+  Sparkline,
+  Spinner,
+  Stack,
+  Stat,
+  StatGroup,
+  StaticScanPanel,
+  StaticScanResult,
+  StreakBadge,
+  SurfaceBadge,
+  SurfaceGate,
+  Switch,
+  Tab,
+  TabList,
+  TabPanel,
+  Tabs,
+  Text,
+  TextArea,
+  ToastProvider,
+  ToastViewport,
+  UnpaidBadge,
+  VStack,
+  VerifiedBadge,
+  VersionBadge,
+  VndText,
+  WebOnly,
+  ZaloOnly,
+  applyThemeVars,
+  axisMax,
+  barFractions,
+  defaultTheme,
+  formatVnd,
+  linePoints,
+  mountScopedStyle,
+  pieSegments,
+  toastReducer,
+  tokens,
+  useToast
+};

package/dist/layout.d.ts

@@ -0,0 +1,57 @@
+import * as react from 'react';
+import { CSSProperties, ReactNode } from 'react';
+import { T as ThemeMode } from './MangThemeProvider-BqdGKBP2.js';
+import '@mangtre/core';
+
+interface AppFrameProps {
+    className?: string;
+    style?: CSSProperties;
+    children?: ReactNode;
+}
+/** Full-height column frame (header/body/footer compose inside). */
+declare function AppFrame({ className, style, children }: AppFrameProps): react.JSX.Element;
+interface Themed {
+    theme?: ThemeMode;
+    className?: string;
+    children?: ReactNode;
+}
+declare function Page({ theme, className, children }: Themed): react.JSX.Element;
+interface ContainerProps extends Themed {
+    width?: "default" | "reading";
+}
+declare function Container({ width, theme, className, children }: ContainerProps): react.JSX.Element;
+interface PageHeaderProps extends Themed {
+    eyebrow?: ReactNode;
+    title: ReactNode;
+    actions?: ReactNode;
+}
+declare function PageHeader({ eyebrow, title, actions, theme, className }: PageHeaderProps): react.JSX.Element;
+interface SectionProps extends Themed {
+    title?: ReactNode;
+}
+declare function Section({ title, theme, className, children }: SectionProps): react.JSX.Element;
+declare function BottomActionBar({ theme, className, children }: Themed): react.JSX.Element;
+interface ListRowProps extends Themed {
+    /** Leading slot — icon, avatar, emoji. */
+    leading?: ReactNode;
+    title: ReactNode;
+    /** Secondary line under the title. */
+    meta?: ReactNode;
+    /** Trailing slot — badge, amount, chevron, action. */
+    trailing?: ReactNode;
+    /** Makes the whole row a button. */
+    onClick?: () => void;
+}
+/** A list item with leading / title+meta / trailing slots. Interactive when `onClick` is set. */
+declare function ListRow({ leading, title, meta, trailing, onClick, theme, className, }: ListRowProps): react.JSX.Element;
+interface SafeAreaProps {
+    /** Edges to pad for device insets. Default all. */
+    edges?: Array<"top" | "bottom" | "left" | "right">;
+    className?: string;
+    style?: CSSProperties;
+    children?: ReactNode;
+}
+/** Adds `env(safe-area-inset-*)` padding for notched devices/PWAs. */
+declare function SafeArea({ edges, className, style, children, }: SafeAreaProps): react.JSX.Element;
+
+export { AppFrame, type AppFrameProps, BottomActionBar, Container, type ContainerProps, ListRow, type ListRowProps, Page, PageHeader, type PageHeaderProps, SafeArea, type SafeAreaProps, Section, type SectionProps };

package/dist/layout.js

@@ -0,0 +1,22 @@
+import {
+  AppFrame,
+  BottomActionBar,
+  Container,
+  ListRow,
+  Page,
+  PageHeader,
+  SafeArea,
+  Section
+} from "./chunk-XPV3OOLU.js";
+import "./chunk-3AL4SUFD.js";
+import "./chunk-PPOYMKV3.js";
+export {
+  AppFrame,
+  BottomActionBar,
+  Container,
+  ListRow,
+  Page,
+  PageHeader,
+  SafeArea,
+  Section
+};