react-native-terra-ui 0.3.0 → 0.4.0

package/lib/typescript/src/components/screen/ScreenScrollView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScreenScrollView.d.ts","sourceRoot":"","sources":["../../../../../src/components/screen/ScreenScrollView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,EAGL,KAAK,eAAe,EAErB,MAAM,cAAc,CAAC;AAEtB,OAAiB,EACf,KAAK,sBAAsB,EAG5B,MAAM,yBAAyB,CAAC;AAOjC,OAAO,KAAK,EAAiB,qBAAqB,EAAE,MAAM,YAAS,CAAC;AAGpE,MAAM,WAAW,qBACf,SAAQ,IAAI,CAAC,eAAe,EAAE,YAAY,CAAC,EACzC,qBAAqB;IACvB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,sBAAsB,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;CACjE;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsDG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,KAAK,EACL,qBAAqB,EACrB,aAAa,EAAE,qBAAqB,EACpC,QAAQ,EAAE,YAAY,EACtB,UAAkB,EAClB,OAAe,EACf,gBAAgB,EAChB,cAAc,EACd,OAAO,EACP,GAAG,IAAI,EACR,EAAE,qBAAqB,+BAoEvB"}
+{"version":3,"file":"ScreenScrollView.d.ts","sourceRoot":"","sources":["../../../../../src/components/screen/ScreenScrollView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,EAGL,KAAK,eAAe,EAErB,MAAM,cAAc,CAAC;AAEtB,OAAiB,EACf,KAAK,sBAAsB,EAG5B,MAAM,yBAAyB,CAAC;AASjC,OAAO,KAAK,EAAiB,qBAAqB,EAAE,MAAM,YAAS,CAAC;AAGpE,MAAM,WAAW,qBACf,SAAQ,IAAI,CAAC,eAAe,EAAE,YAAY,CAAC,EACzC,qBAAqB;IACvB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,sBAAsB,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;CACjE;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsDG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,KAAK,EACL,qBAAqB,EACrB,aAAa,EAAE,qBAAqB,EACpC,QAAQ,EAAE,YAAY,EACtB,UAAkB,EAClB,OAAe,EACf,gBAAgB,EAChB,cAAc,EACd,OAAO,EACP,GAAG,IAAI,EACR,EAAE,qBAAqB,+BAoEvB"}

package/lib/typescript/src/context/ThemeProvider.d.ts

@@ -1,4 +1,5 @@
 import { type PropsWithChildren } from 'react';
+import { type ResolvedScreenMargin } from '../theme/screen-margin.js';
 import type { Scheme, TerraTheme } from '../theme/types.js';
 /**
  * Root provider for Terra UI. Wrap your app once near the root.
@@ -26,4 +27,11 @@ export interface UseThemeResult {
  * Must be used under {@link TerraUIProvider}.
  */
 export declare function useTheme(): UseThemeResult;
+/**
+ * Resolves `theme.layout.screen.margin` for the current runtime breakpoint.
+ * For use outside a `StyleSheet.create` factory (e.g. plain-JS layout maths);
+ * inside one, call `resolveScreenMargin(theme, rt.breakpoint)` directly so
+ * the value stays reactive without a React re-render.
+ */
+export declare function useScreenMargin(): ResolvedScreenMargin;
 //# sourceMappingURL=ThemeProvider.d.ts.map

package/lib/typescript/src/context/ThemeProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../../../src/context/ThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,iBAAiB,EAKvB,MAAM,OAAO,CAAC;AAKf,OAAO,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,mBAAgB,CAAC;AAczD;;;;;;;GAOG;AACH,eAAO,MAAM,eAAe,GAAI,cAAc,iBAAiB,gCAoB9D,CAAC;AAEF,MAAM,WAAW,cAAc;IAC7B,iCAAiC;IACjC,KAAK,EAAE,UAAU,CAAC;IAClB,2BAA2B;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,wDAAwD;IACxD,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,kCAAkC;IAClC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,qCAAqC;IACrC,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC;AAED;;;GAGG;AACH,wBAAgB,QAAQ,IAAI,cAAc,CAezC"}
+{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../../../src/context/ThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,iBAAiB,EAKvB,MAAM,OAAO,CAAC;AAKf,OAAO,EACL,KAAK,oBAAoB,EAE1B,MAAM,2BAAwB,CAAC;AAChC,OAAO,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,mBAAgB,CAAC;AAczD;;;;;;;GAOG;AACH,eAAO,MAAM,eAAe,GAAI,cAAc,iBAAiB,gCAoB9D,CAAC;AAEF,MAAM,WAAW,cAAc;IAC7B,iCAAiC;IACjC,KAAK,EAAE,UAAU,CAAC;IAClB,2BAA2B;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,wDAAwD;IACxD,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,kCAAkC;IAClC,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,qCAAqC;IACrC,SAAS,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC;AAED;;;GAGG;AACH,wBAAgB,QAAQ,IAAI,cAAc,CAezC;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,IAAI,oBAAoB,CAGtD"}

package/lib/typescript/src/context/index.d.ts

@@ -1,3 +1,3 @@
 export type { UseThemeResult } from './ThemeProvider.js';
-export { TerraUIProvider, useTheme } from './ThemeProvider.js';
+export { TerraUIProvider, useScreenMargin, useTheme } from './ThemeProvider.js';
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/context/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/context/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,cAAc,EAAE,MAAM,oBAAiB,CAAC;AACtD,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,oBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/context/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,cAAc,EAAE,MAAM,oBAAiB,CAAC;AACtD,OAAO,EAAE,eAAe,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,oBAAiB,CAAC"}

package/lib/typescript/src/theme/breakpoints.d.ts

@@ -0,0 +1,32 @@
+import type { UnistylesBreakpoints } from 'react-native-unistyles';
+/**
+ * Viewport-width breakpoints (dp), registered with Unistyles via
+ * `StyleSheet.configure({ breakpoints })` in {@link ./registry.ts}. `xs` must
+ * stay `0` — Unistyles falls back to it below `sm`.
+ */
+export declare const breakpoints: {
+    readonly xs: 0;
+    readonly sm: 576;
+    readonly md: 768;
+    readonly lg: 992;
+    readonly xl: 1200;
+};
+export type AppBreakpoints = typeof breakpoints;
+export type BreakpointName = keyof AppBreakpoints;
+declare module 'react-native-unistyles' {
+    interface UnistylesBreakpoints extends AppBreakpoints {
+    }
+}
+/**
+ * Resolves a per-breakpoint record (e.g. `theme.layout.screen.margin.x`) to
+ * the value for the current runtime breakpoint (`rt.breakpoint`). A
+ * `StyleSheet.create` factory re-runs on breakpoint change, so calling this
+ * inside one keeps the resolved value reactive.
+ *
+ * `rt.breakpoint`'s type also includes Unistyles' built-in `landscape` /
+ * `portrait` orientation keys, which this record has no entry for — those
+ * (and `undefined`, below the smallest configured breakpoint) fall back to
+ * `xs`.
+ */
+export declare function resolveBreakpointValue<T>(values: Record<BreakpointName, T>, breakpoint: keyof UnistylesBreakpoints | undefined): T;
+//# sourceMappingURL=breakpoints.d.ts.map

package/lib/typescript/src/theme/breakpoints.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"breakpoints.d.ts","sourceRoot":"","sources":["../../../../src/theme/breakpoints.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAEnE;;;;GAIG;AACH,eAAO,MAAM,WAAW;;;;;;CAMd,CAAC;AAEX,MAAM,MAAM,cAAc,GAAG,OAAO,WAAW,CAAC;AAChD,MAAM,MAAM,cAAc,GAAG,MAAM,cAAc,CAAC;AAElD,OAAO,QAAQ,wBAAwB,CAAC;IACtC,UAAiB,oBAAqB,SAAQ,cAAc;KAAG;CAChE;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,sBAAsB,CAAC,CAAC,EACtC,MAAM,EAAE,MAAM,CAAC,cAAc,EAAE,CAAC,CAAC,EACjC,UAAU,EAAE,MAAM,oBAAoB,GAAG,SAAS,GACjD,CAAC,CAIH"}

package/lib/typescript/src/theme/index.d.ts

@@ -4,8 +4,12 @@ export type { DeepPartial } from '../utils/deep-merge';
 export { deepMerge } from '../utils/deep-merge';
 export { resolveThemeColor } from '../utils/resolve-theme-color';
 export { FONT_WEIGHT_VALUE, SYSTEM_FONT } from '../utils/typography';
+export type { AppBreakpoints, BreakpointName } from './breakpoints.js';
+export { breakpoints, resolveBreakpointValue } from './breakpoints.js';
 export { configureTerraUI, getAccentNames, getDefaultRadius, getIcon, getImageComponent, getIsConfigured, getRequiredIcon, getSurfaceElevation, resolveTheme, } from './registry.js';
 export { applyAccent, applyScheme, getCurrentAccent } from './runtime.js';
+export type { ResolvedScreenMargin } from './screen-margin.js';
+export { resolveScreenMargin } from './screen-margin.js';
 export { defaultDarkTheme, defaultLightTheme } from './theme.js';
 export type { Accent, AccentOverride, AccentShorthand, ActionColorToken, BackgroundColorToken, BorderColorToken, ButtonDefaults, ColorToken, ComponentDefaults, ContentColorToken, DefaultRadiusToken, ElevationKey, ElevationScale, ElevationStyle, FontWeightToken, LayoutTokens, OpacityTokens, RadiusComponent, RadiusKey, Scheme, SpacingKey, StatusColorToken, SurfaceColorToken, SurfaceDefaults, TerraConfig, TerraIconComponent, TerraIconName, TerraIconProps, TerraImageComponent, TerraImageContentFit, TerraImageProps, TerraSemanticIconName, TerraTheme, TerraThemeOverride, TextColorToken, TextVariant, ThemeColor, ThemeRadiusOverride, TypeStyle, Typography, } from './types.js';
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/theme/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/theme/index.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAClE,YAAY,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC9C,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAC/D,OAAO,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAEnE,OAAO,EACL,gBAAgB,EAChB,cAAc,EACd,gBAAgB,EAChB,OAAO,EACP,iBAAiB,EACjB,eAAe,EACf,eAAe,EACf,mBAAmB,EACnB,YAAY,GACb,MAAM,eAAY,CAAC;AACpB,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,cAAW,CAAC;AAEvE,OAAO,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,YAAS,CAAC;AAE9D,YAAY,EACV,MAAM,EACN,cAAc,EACd,eAAe,EACf,gBAAgB,EAChB,oBAAoB,EACpB,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,YAAY,EACZ,cAAc,EACd,cAAc,EACd,eAAe,EACf,YAAY,EACZ,aAAa,EACb,eAAe,EACf,SAAS,EACT,MAAM,EACN,UAAU,EACV,gBAAgB,EAChB,iBAAiB,EACjB,eAAe,EACf,WAAW,EACX,kBAAkB,EAClB,aAAa,EACb,cAAc,EACd,mBAAmB,EACnB,oBAAoB,EACpB,eAAe,EACf,qBAAqB,EACrB,UAAU,EACV,kBAAkB,EAClB,cAAc,EACd,WAAW,EACX,UAAU,EACV,mBAAmB,EACnB,SAAS,EACT,UAAU,GACX,MAAM,YAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/theme/index.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAClE,YAAY,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC9C,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAC/D,OAAO,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAEnE,YAAY,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,kBAAe,CAAC;AACpE,OAAO,EAAE,WAAW,EAAE,sBAAsB,EAAE,MAAM,kBAAe,CAAC;AAEpE,OAAO,EACL,gBAAgB,EAChB,cAAc,EACd,gBAAgB,EAChB,OAAO,EACP,iBAAiB,EACjB,eAAe,EACf,eAAe,EACf,mBAAmB,EACnB,YAAY,GACb,MAAM,eAAY,CAAC;AACpB,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,cAAW,CAAC;AACvE,YAAY,EAAE,oBAAoB,EAAE,MAAM,oBAAiB,CAAC;AAC5D,OAAO,EAAE,mBAAmB,EAAE,MAAM,oBAAiB,CAAC;AAEtD,OAAO,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,MAAM,YAAS,CAAC;AAE9D,YAAY,EACV,MAAM,EACN,cAAc,EACd,eAAe,EACf,gBAAgB,EAChB,oBAAoB,EACpB,gBAAgB,EAChB,cAAc,EACd,UAAU,EACV,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,YAAY,EACZ,cAAc,EACd,cAAc,EACd,eAAe,EACf,YAAY,EACZ,aAAa,EACb,eAAe,EACf,SAAS,EACT,MAAM,EACN,UAAU,EACV,gBAAgB,EAChB,iBAAiB,EACjB,eAAe,EACf,WAAW,EACX,kBAAkB,EAClB,aAAa,EACb,cAAc,EACd,mBAAmB,EACnB,oBAAoB,EACpB,eAAe,EACf,qBAAqB,EACrB,UAAU,EACV,kBAAkB,EAClB,cAAc,EACd,WAAW,EACX,UAAU,EACV,mBAAmB,EACnB,SAAS,EACT,UAAU,GACX,MAAM,YAAS,CAAC"}

package/lib/typescript/src/theme/registry.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"registry.d.ts","sourceRoot":"","sources":["../../../../src/theme/registry.ts"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAEV,kBAAkB,EAClB,YAAY,EACZ,gBAAgB,EAChB,eAAe,EACf,MAAM,EACN,WAAW,EACX,kBAAkB,EAClB,mBAAmB,EACnB,qBAAqB,EACrB,UAAU,EAEX,MAAM,YAAS,CAAC;AASjB,KAAK,cAAc,GAAG,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,CAAC;AAWlE,OAAO,QAAQ,wBAAwB,CAAC;IACtC,UAAiB,eAAe;QAC9B,KAAK,EAAE,UAAU,CAAC;QAClB,IAAI,EAAE,UAAU,CAAC;KAClB;CACF;AAED,UAAU,QAAQ;IAChB,SAAS,EAAE,UAAU,CAAC;IACtB,QAAQ,EAAE,UAAU,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IAC1C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE,cAAc,CAAC;IAC9B,gBAAgB,EAAE,YAAY,CAAC;IAC/B,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IAC1C,cAAc,EAAE,mBAAmB,CAAC;IACpC,UAAU,EAAE,OAAO,CAAC;CACrB;AAcD,gBAAgB;AAChB,eAAO,MAAM,WAAW,QAAO,QAAoB,CAAC;AAEpD,eAAO,MAAM,eAAe,QAAO,OAA8B,CAAC;AAElE,eAAO,MAAM,cAAc,QAAO,MAAM,EAAmC,CAAC;AAE5E,eAAO,MAAM,iBAAiB,QAAO,mBACZ,CAAC;AAE1B,eAAO,MAAM,OAAO,GAAI,MAAM,MAAM,KAAG,kBAAkB,GAAG,SACS,CAAC;AAEtE,eAAO,MAAM,eAAe,GAC1B,MAAM,qBAAqB,KAC1B,kBAAgE,CAAC;AAEpE;;;GAGG;AACH,eAAO,MAAM,gBAAgB,GAC3B,WAAW,eAAe,KACzB,kBAAuD,CAAC;AAE3D;;;GAGG;AACH,eAAO,MAAM,mBAAmB,QAAO,YACZ,CAAC;AAE5B,8EAA8E;AAC9E,wBAAgB,YAAY,CAAC,MAAM,EAAE,MAAM,EAAE,UAAU,CAAC,EAAE,MAAM,GAAG,UAAU,CAI5E;AA2CD;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,GAAE,WAAgB,GAAG,IAAI,CAY/D;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,gBAAgB,IAAI,IAAI,CAOvC"}
+{"version":3,"file":"registry.d.ts","sourceRoot":"","sources":["../../../../src/theme/registry.ts"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAEV,kBAAkB,EAClB,YAAY,EACZ,gBAAgB,EAChB,eAAe,EACf,MAAM,EACN,WAAW,EACX,kBAAkB,EAClB,mBAAmB,EACnB,qBAAqB,EACrB,UAAU,EAEX,MAAM,YAAS,CAAC;AASjB,KAAK,cAAc,GAAG,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,CAAC;AAWlE,OAAO,QAAQ,wBAAwB,CAAC;IACtC,UAAiB,eAAe;QAC9B,KAAK,EAAE,UAAU,CAAC;QAClB,IAAI,EAAE,UAAU,CAAC;KAClB;CACF;AAED,UAAU,QAAQ;IAChB,SAAS,EAAE,UAAU,CAAC;IACtB,QAAQ,EAAE,UAAU,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IAC1C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,EAAE,cAAc,CAAC;IAC9B,gBAAgB,EAAE,YAAY,CAAC;IAC/B,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IAC1C,cAAc,EAAE,mBAAmB,CAAC;IACpC,UAAU,EAAE,OAAO,CAAC;CACrB;AAcD,gBAAgB;AAChB,eAAO,MAAM,WAAW,QAAO,QAAoB,CAAC;AAEpD,eAAO,MAAM,eAAe,QAAO,OAA8B,CAAC;AAElE,eAAO,MAAM,cAAc,QAAO,MAAM,EAAmC,CAAC;AAE5E,eAAO,MAAM,iBAAiB,QAAO,mBACZ,CAAC;AAE1B,eAAO,MAAM,OAAO,GAAI,MAAM,MAAM,KAAG,kBAAkB,GAAG,SACS,CAAC;AAEtE,eAAO,MAAM,eAAe,GAC1B,MAAM,qBAAqB,KAC1B,kBAAgE,CAAC;AAEpE;;;GAGG;AACH,eAAO,MAAM,gBAAgB,GAC3B,WAAW,eAAe,KACzB,kBAAuD,CAAC;AAE3D;;;GAGG;AACH,eAAO,MAAM,mBAAmB,QAAO,YACZ,CAAC;AAE5B,8EAA8E;AAC9E,wBAAgB,YAAY,CAAC,MAAM,EAAE,MAAM,EAAE,UAAU,CAAC,EAAE,MAAM,GAAG,UAAU,CAI5E;AA2CD;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,MAAM,GAAE,WAAgB,GAAG,IAAI,CAY/D;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,gBAAgB,IAAI,IAAI,CAOvC"}

package/lib/typescript/src/theme/screen-margin.d.ts

@@ -0,0 +1,15 @@
+import type { UnistylesBreakpoints } from 'react-native-unistyles';
+import type { TerraTheme } from './types.js';
+export interface ResolvedScreenMargin {
+    x: number;
+    y: number;
+}
+/**
+ * Resolves both axes of `theme.layout.screen.margin` for the current runtime
+ * breakpoint in one call — nearly every consumer needs both axes, so this
+ * saves calling `resolveBreakpointValue` twice. Call inside a
+ * `StyleSheet.create` factory (passing `rt.breakpoint`) so the result stays
+ * reactive to breakpoint changes; outside one, use {@link useScreenMargin}.
+ */
+export declare function resolveScreenMargin(theme: TerraTheme, breakpoint: keyof UnistylesBreakpoints | undefined): ResolvedScreenMargin;
+//# sourceMappingURL=screen-margin.d.ts.map

package/lib/typescript/src/theme/screen-margin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"screen-margin.d.ts","sourceRoot":"","sources":["../../../../src/theme/screen-margin.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAGnE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAS,CAAC;AAE1C,MAAM,WAAW,oBAAoB;IACnC,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED;;;;;;GAMG;AACH,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,UAAU,EACjB,UAAU,EAAE,MAAM,oBAAoB,GAAG,SAAS,GACjD,oBAAoB,CAKtB"}

package/lib/typescript/src/theme/tokens/primitives.d.ts

@@ -416,8 +416,16 @@ export declare const primitives: {
     'typography.variants.caption.maxFontSizeMultiplier': number;
     'opacity.disabled': number;
     'opacity.pressed': number;
-    'layout.screen.margin.x': number;
-    'layout.screen.margin.y': number;
+    'layout.screen.margin.x.xs': number;
+    'layout.screen.margin.x.sm': number;
+    'layout.screen.margin.x.md': number;
+    'layout.screen.margin.x.lg': number;
+    'layout.screen.margin.x.xl': number;
+    'layout.screen.margin.y.xs': number;
+    'layout.screen.margin.y.sm': number;
+    'layout.screen.margin.y.md': number;
+    'layout.screen.margin.y.lg': number;
+    'layout.screen.margin.y.xl': number;
     'layout.header.height': number;
 };
 //# sourceMappingURL=primitives.d.ts.map

package/lib/typescript/src/theme/tokens/primitives.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"primitives.d.ts","sourceRoot":"","sources":["../../../../../src/theme/tokens/primitives.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2btB,CAAC"}
+{"version":3,"file":"primitives.d.ts","sourceRoot":"","sources":["../../../../../src/theme/tokens/primitives.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqctB,CAAC"}

package/lib/typescript/src/theme/types.d.ts

@@ -7,6 +7,7 @@
 import type { ComponentType } from 'react';
 import type { ImageStyle, StyleProp } from 'react-native';
 import type { DeepPartial } from '../utils/deep-merge';
+import type { BreakpointName } from './breakpoints.js';
 /** Spacing scale keys (dp, 4dp base unit). Read as `gap={3}` → string '3'. */
 export type SpacingKey = '0' | '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9' | '10' | '12' | '14' | '16' | '20' | '24' | '32';
 /** Border-radius scale keys. */
@@ -145,10 +146,15 @@ export interface OpacityTokens {
 /** Screen-level layout tokens. */
 export interface LayoutTokens {
     screen: {
-        /** Margin between content and the screen edge (applied as container padding). */
+        /**
+         * Margin between content and the screen edge (applied as container
+         * padding). Both axes scale with the viewport breakpoint — resolve with
+         * `resolveBreakpointValue(theme.layout.screen.margin.x, rt.breakpoint)`
+         * (same for `y`).
+         */
         margin: {
-            x: number;
-            y: number;
+            x: Record<BreakpointName, number>;
+            y: Record<BreakpointName, number>;
         };
     };
     header: {

package/lib/typescript/src/theme/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/theme/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/theme/types.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-terra-ui",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "Themeable React Native UI components built on react-native-unistyles",
   "main": "./lib/module/index.js",
   "types": "./lib/typescript/src/index.d.ts",
@@ -21,7 +21,6 @@
   "files": [
     "src",
     "lib",
-    "skills",
     "CHANGELOG.md",
     "!**/__tests__",
     "!**/__fixtures__",

package/src/components/screen/ScreenFlashList.tsx

@@ -12,6 +12,7 @@ import Animated, {
 
 import { StyleSheet } from 'react-native-unistyles';
 
+import { resolveScreenMargin } from '#theme/screen-margin';
 import { PortalHost } from '../portal';
 import { BottomSafeArea } from './parts/BottomSafeArea';
 import { renderScreenPlaceholder } from './parts/ScreenPlaceholder';
@@ -164,33 +165,39 @@ export function ScreenFlashList<T>({
   );
 }
 
-const styles = StyleSheet.create((theme, runtime) => ({
-  content: (
-    margins: ScreenMargins,
-    hasHeader: boolean,
-    bottomInset: number | undefined
-  ) => {
-    return {
-      flexGrow: 1,
-      // The header is absolutely positioned, so the list reserves its full
-      // height — bar plus top safe area. This assumes the scroll view does not
-      // also get UIKit's automatic inset adjustment: on a native tab screen
-      // that means `disableAutomaticContentInsets` on the tab, or the two
-      // insets are counted twice.
-      paddingTop:
-        (hasHeader ? theme.layout.header.height + runtime.insets.top : 0) +
-        (hasYMargin(margins) ? theme.layout.screen.margin.y : 0),
-      paddingHorizontal: hasXMargin(margins) ? theme.layout.screen.margin.x : 0,
-      // The safe area is `BottomSafeArea`'s job; counting it here as well
-      // would leave a gap the height of the gesture bar.
-      paddingBottom:
-        bottomInset ?? (hasYMargin(margins) ? theme.layout.screen.margin.y : 0),
-    };
-  },
-  safeArea: {
-    height: runtime.insets.top,
-  },
-  headerWrapper: (margins: ScreenMargins) => ({
-    marginHorizontal: hasXMargin(margins) ? -theme.layout.screen.margin.x : 0,
-  }),
-}));
+const styles = StyleSheet.create((theme, runtime) => {
+  const { x: marginX, y: marginY } = resolveScreenMargin(
+    theme,
+    runtime.breakpoint
+  );
+
+  return {
+    content: (
+      margins: ScreenMargins,
+      hasHeader: boolean,
+      bottomInset: number | undefined
+    ) => {
+      return {
+        flexGrow: 1,
+        // The header is absolutely positioned, so the list reserves its full
+        // height — bar plus top safe area. This assumes the scroll view does not
+        // also get UIKit's automatic inset adjustment: on a native tab screen
+        // that means `disableAutomaticContentInsets` on the tab, or the two
+        // insets are counted twice.
+        paddingTop:
+          (hasHeader ? theme.layout.header.height + runtime.insets.top : 0) +
+          (hasYMargin(margins) ? marginY : 0),
+        paddingHorizontal: hasXMargin(margins) ? marginX : 0,
+        // The safe area is `BottomSafeArea`'s job; counting it here as well
+        // would leave a gap the height of the gesture bar.
+        paddingBottom: bottomInset ?? (hasYMargin(margins) ? marginY : 0),
+      };
+    },
+    safeArea: {
+      height: runtime.insets.top,
+    },
+    headerWrapper: (margins: ScreenMargins) => ({
+      marginHorizontal: hasXMargin(margins) ? -marginX : 0,
+    }),
+  };
+});

package/src/components/screen/ScreenFlatList.tsx

@@ -12,6 +12,7 @@ import Animated, {
 } from 'react-native-reanimated';
 import { StyleSheet } from 'react-native-unistyles';
 
+import { resolveScreenMargin } from '#theme/screen-margin';
 import { PortalHost } from '../portal';
 import { BottomSafeArea } from './parts/BottomSafeArea';
 import { renderScreenPlaceholder } from './parts/ScreenPlaceholder';
@@ -146,37 +147,43 @@ export function ScreenFlatList<T>({
   );
 }
 
-const styles = StyleSheet.create((theme, runtime) => ({
-  scrollContent: {
-    flexGrow: 1,
-  },
-  content: (
-    margins: ScreenMargins,
-    hasHeader: boolean,
-    bottomInset: number | undefined
-  ) => ({
-    flexGrow: 1,
-    // The header is absolutely positioned, so the list reserves its full
-    // height — bar plus top safe area. This assumes the scroll view does not
-    // also get UIKit's automatic inset adjustment: on a native tab screen
-    // that means `disableAutomaticContentInsets` on the tab, or the two
-    // insets are counted twice.
-    paddingTop:
-      (hasHeader ? theme.layout.header.height + runtime.insets.top : 0) +
-      (hasYMargin(margins) ? theme.layout.screen.margin.y : 0),
-    paddingHorizontal: hasXMargin(margins) ? theme.layout.screen.margin.x : 0,
-    // The safe area is `BottomSafeArea`'s job; counting it here as well would
-    // leave a gap the height of the gesture bar.
-    paddingBottom:
-      bottomInset ?? (hasYMargin(margins) ? theme.layout.screen.margin.y : 0),
-  }),
-  safeArea: {
-    height: runtime.insets.top,
-  },
-  headerWrapper: (margins: ScreenMargins) => ({
-    marginHorizontal: hasXMargin(margins) ? -theme.layout.screen.margin.x : 0,
-  }),
-  header: {
-    height: theme.layout.header.height,
-  },
-}));
+const styles = StyleSheet.create((theme, runtime) => {
+  const { x: marginX, y: marginY } = resolveScreenMargin(
+    theme,
+    runtime.breakpoint
+  );
+
+  return {
+    scrollContent: {
+      flexGrow: 1,
+    },
+    content: (
+      margins: ScreenMargins,
+      hasHeader: boolean,
+      bottomInset: number | undefined
+    ) => ({
+      flexGrow: 1,
+      // The header is absolutely positioned, so the list reserves its full
+      // height — bar plus top safe area. This assumes the scroll view does not
+      // also get UIKit's automatic inset adjustment: on a native tab screen
+      // that means `disableAutomaticContentInsets` on the tab, or the two
+      // insets are counted twice.
+      paddingTop:
+        (hasHeader ? theme.layout.header.height + runtime.insets.top : 0) +
+        (hasYMargin(margins) ? marginY : 0),
+      paddingHorizontal: hasXMargin(margins) ? marginX : 0,
+      // The safe area is `BottomSafeArea`'s job; counting it here as well
+      // would leave a gap the height of the gesture bar.
+      paddingBottom: bottomInset ?? (hasYMargin(margins) ? marginY : 0),
+    }),
+    safeArea: {
+      height: runtime.insets.top,
+    },
+    headerWrapper: (margins: ScreenMargins) => ({
+      marginHorizontal: hasXMargin(margins) ? -marginX : 0,
+    }),
+    header: {
+      height: theme.layout.header.height,
+    },
+  };
+});

package/src/components/screen/ScreenScrollView.tsx

@@ -13,6 +13,8 @@ import Animated, {
 } from 'react-native-reanimated';
 import { StyleSheet } from 'react-native-unistyles';
 import { scheduleOnRN } from 'react-native-worklets';
+
+import { resolveScreenMargin } from '#theme/screen-margin';
 import { PortalHost } from '../portal';
 import { BottomSafeArea } from './parts/BottomSafeArea';
 import { renderScreenPlaceholder } from './parts/ScreenPlaceholder';
@@ -170,22 +172,26 @@ export function ScreenScrollView({
   );
 }
 
-const styles = StyleSheet.create((theme, rt) => ({
-  scrollContent: (hasHeader: boolean, margins: ScreenMargins) => ({
-    flexGrow: 1,
-    // The header inset and the safe area are structural — they apply whether
-    // or not margins are on; the y margin stacks on top of them.
-    paddingTop:
-      (hasHeader ? theme.layout.header.height + rt.insets.top : 0) +
-      (hasYMargin(margins) ? theme.layout.screen.margin.y : 0),
-    // The safe area is `BottomSafeArea`'s job; counting it here as well would
-    // leave a gap the height of the gesture bar.
-    paddingBottom: hasYMargin(margins) ? theme.layout.screen.margin.y : 0,
-  }),
+const styles = StyleSheet.create((theme, rt) => {
+  const { x: marginX, y: marginY } = resolveScreenMargin(theme, rt.breakpoint);
+
+  return {
+    scrollContent: (hasHeader: boolean, margins: ScreenMargins) => ({
+      flexGrow: 1,
+      // The header inset and the safe area are structural — they apply
+      // whether or not margins are on; the y margin stacks on top of them.
+      paddingTop:
+        (hasHeader ? theme.layout.header.height + rt.insets.top : 0) +
+        (hasYMargin(margins) ? marginY : 0),
+      // The safe area is `BottomSafeArea`'s job; counting it here as well
+      // would leave a gap the height of the gesture bar.
+      paddingBottom: hasYMargin(margins) ? marginY : 0,
+    }),
 
-  content: (horizontal: boolean, margins: ScreenMargins) => ({
-    flexGrow: 1,
-    paddingHorizontal: hasXMargin(margins) ? theme.layout.screen.margin.x : 0,
-    flexDirection: horizontal ? 'row' : 'column',
-  }),
-}));
+    content: (horizontal: boolean, margins: ScreenMargins) => ({
+      flexGrow: 1,
+      paddingHorizontal: hasXMargin(margins) ? marginX : 0,
+      flexDirection: horizontal ? 'row' : 'column',
+    }),
+  };
+});

package/src/context/ThemeProvider.tsx

@@ -10,6 +10,10 @@ import { SafeAreaProvider } from 'react-native-safe-area-context';
 import { useUnistyles } from 'react-native-unistyles';
 import { bootstrapTerraUI } from '../theme/registry';
 import { applyAccent, applyScheme, getCurrentAccent } from '../theme/runtime';
+import {
+  type ResolvedScreenMargin,
+  resolveScreenMargin,
+} from '../theme/screen-margin';
 import type { Scheme, TerraTheme } from '../theme/types';
 
 // Ensure the default theme is registered on first import. An app that calls
@@ -88,6 +92,17 @@ export function useTheme(): UseThemeResult {
   };
 }
 
+/**
+ * Resolves `theme.layout.screen.margin` for the current runtime breakpoint.
+ * For use outside a `StyleSheet.create` factory (e.g. plain-JS layout maths);
+ * inside one, call `resolveScreenMargin(theme, rt.breakpoint)` directly so
+ * the value stays reactive without a React re-render.
+ */
+export function useScreenMargin(): ResolvedScreenMargin {
+  const { theme, rt } = useUnistyles();
+  return resolveScreenMargin(theme, rt.breakpoint);
+}
+
 const noopSetAccent = (_name: string): void => {
   if (__DEV__) {
     console.warn(

package/src/context/index.ts

@@ -1,2 +1,2 @@
 export type { UseThemeResult } from './ThemeProvider';
-export { TerraUIProvider, useTheme } from './ThemeProvider';
+export { TerraUIProvider, useScreenMargin, useTheme } from './ThemeProvider';

package/src/theme/breakpoints.ts

@@ -0,0 +1,41 @@
+import type { UnistylesBreakpoints } from 'react-native-unistyles';
+
+/**
+ * Viewport-width breakpoints (dp), registered with Unistyles via
+ * `StyleSheet.configure({ breakpoints })` in {@link ./registry.ts}. `xs` must
+ * stay `0` — Unistyles falls back to it below `sm`.
+ */
+export const breakpoints = {
+  xs: 0,
+  sm: 576,
+  md: 768,
+  lg: 992,
+  xl: 1200,
+} as const;
+
+export type AppBreakpoints = typeof breakpoints;
+export type BreakpointName = keyof AppBreakpoints;
+
+declare module 'react-native-unistyles' {
+  export interface UnistylesBreakpoints extends AppBreakpoints {}
+}
+
+/**
+ * Resolves a per-breakpoint record (e.g. `theme.layout.screen.margin.x`) to
+ * the value for the current runtime breakpoint (`rt.breakpoint`). A
+ * `StyleSheet.create` factory re-runs on breakpoint change, so calling this
+ * inside one keeps the resolved value reactive.
+ *
+ * `rt.breakpoint`'s type also includes Unistyles' built-in `landscape` /
+ * `portrait` orientation keys, which this record has no entry for — those
+ * (and `undefined`, below the smallest configured breakpoint) fall back to
+ * `xs`.
+ */
+export function resolveBreakpointValue<T>(
+  values: Record<BreakpointName, T>,
+  breakpoint: keyof UnistylesBreakpoints | undefined
+): T {
+  return breakpoint !== undefined && breakpoint in values
+    ? values[breakpoint as BreakpointName]
+    : values.xs;
+}

package/src/theme/index.ts

@@ -12,6 +12,9 @@ export type { DeepPartial } from '#utils/deep-merge';
 export { deepMerge } from '#utils/deep-merge';
 export { resolveThemeColor } from '#utils/resolve-theme-color';
 export { FONT_WEIGHT_VALUE, SYSTEM_FONT } from '#utils/typography';
+// ─── Breakpoints ─────────────────────────────────────────────────────────────
+export type { AppBreakpoints, BreakpointName } from './breakpoints';
+export { breakpoints, resolveBreakpointValue } from './breakpoints';
 // ─── Config + runtime ───────────────────────────────────────────────────────
 export {
   configureTerraUI,
@@ -25,6 +28,8 @@ export {
   resolveTheme,
 } from './registry';
 export { applyAccent, applyScheme, getCurrentAccent } from './runtime';
+export type { ResolvedScreenMargin } from './screen-margin';
+export { resolveScreenMargin } from './screen-margin';
 // ─── Default themes ───────────────────────────────────────────────────────────
 export { defaultDarkTheme, defaultLightTheme } from './theme';
 // ─── Types ────────────────────────────────────────────────────────────────────

package/src/theme/registry.ts

@@ -3,6 +3,7 @@ import { StyleSheet, UnistylesRuntime } from 'react-native-unistyles';
 import { normalizeAccent } from '#utils/accent-utils';
 import { deepMerge } from '#utils/deep-merge';
 
+import { breakpoints } from './breakpoints';
 import { defaultIcons } from './defaults/icons';
 import { defaultImage } from './defaults/image';
 import {
@@ -254,6 +255,6 @@ function applyConfig(config: TerraConfig): void {
     return;
   }
 
-  StyleSheet.configure({ themes, settings });
+  StyleSheet.configure({ themes, settings, breakpoints });
   unistylesConfigured = true;
 }

package/src/theme/screen-margin.ts

@@ -0,0 +1,26 @@
+import type { UnistylesBreakpoints } from 'react-native-unistyles';
+
+import { resolveBreakpointValue } from './breakpoints';
+import type { TerraTheme } from './types';
+
+export interface ResolvedScreenMargin {
+  x: number;
+  y: number;
+}
+
+/**
+ * Resolves both axes of `theme.layout.screen.margin` for the current runtime
+ * breakpoint in one call — nearly every consumer needs both axes, so this
+ * saves calling `resolveBreakpointValue` twice. Call inside a
+ * `StyleSheet.create` factory (passing `rt.breakpoint`) so the result stays
+ * reactive to breakpoint changes; outside one, use {@link useScreenMargin}.
+ */
+export function resolveScreenMargin(
+  theme: TerraTheme,
+  breakpoint: keyof UnistylesBreakpoints | undefined
+): ResolvedScreenMargin {
+  return {
+    x: resolveBreakpointValue(theme.layout.screen.margin.x, breakpoint),
+    y: resolveBreakpointValue(theme.layout.screen.margin.y, breakpoint),
+  };
+}