@kanso-labs/react-native-kanso-ui 0.11.5 → 0.11.6

package/README.md

@@ -1,5 +1,7 @@
 # react-native-kanso-ui
 
+[![npm version][npm-version-shield]][npm]
+[![npm downloads][npm-downloads-shield]][npm]
 [![License][license-shield]][license] [![Build][build-shield]][build-workflow]
 [![Test][test-shield]][test-workflow] [![Coverage][coverage-shield]][codecov]
 
@@ -11,7 +13,14 @@ A theme is the web library's: a set of `--kui-*` custom properties with values
 in CSS syntax, as kanso-ui's `tokens.css` declares them, so one theme object
 serves a web app and a native app alike.
 
-The package has not been released yet.
+## Installation
+
+```bash
+npm install @kanso-labs/react-native-kanso-ui
+```
+
+It needs a handful of React Native libraries beside it, listed under
+[Peer dependencies](#peer-dependencies).
 
 ## Theming
 
@@ -240,6 +249,11 @@ pages, which each render in their own.
 [license]: ./LICENSE.md
 [license-shield]:
   https://img.shields.io/github/license/kanso-labs/react-native-kanso-ui
+[npm]: https://www.npmjs.com/package/@kanso-labs/react-native-kanso-ui
+[npm-downloads-shield]:
+  https://img.shields.io/npm/dm/@kanso-labs/react-native-kanso-ui
+[npm-version-shield]:
+  https://img.shields.io/npm/v/@kanso-labs/react-native-kanso-ui
 [test-shield]:
   https://img.shields.io/github/actions/workflow/status/kanso-labs/react-native-kanso-ui/test.yaml?branch=main&label=Test
 [test-workflow]:

package/dist/autocomplete/index.js

@@ -1,5 +1,5 @@
 import { createContext } from "react";
-//#region src/autocomplete/index.ts
+// src/autocomplete/index.ts
 const AutocompleteContext = createContext(null);
 const collators = /* @__PURE__ */ new Map();
 function collatorIn(locale) {
@@ -47,7 +47,6 @@ function startsWithIn(locale) {
 		return collator.compare(normalized, start) === 0;
 	};
 }
-//#endregion
 export { AutocompleteContext, containsIn, startsWithIn };
 
 //# sourceMappingURL=index.js.map

package/dist/badge/index.js

@@ -1,5 +1,5 @@
 import { createContext } from "react";
-//#region src/badge/index.tsx
+// src/badge/index.tsx
 /**
 * Whether a large badge joins the flow after what it is drawn on rather than
 * standing over its corner. A navigation destination sets its label beside
@@ -9,7 +9,6 @@ import { createContext } from "react";
 * its icon's box, so nothing has to make room for it.
 */
 const BadgeInFlowContext = createContext(false);
-//#endregion
 export { BadgeInFlowContext };
 
 //# sourceMappingURL=index.js.map

package/dist/button/group.js

@@ -3,7 +3,7 @@ import { toggleState } from "./index.js";
 import { StyleSheet } from "react-native";
 import { Easing, useAnimatedStyle, useReducedMotion, withTiming } from "react-native-reanimated";
 import { createContext } from "react";
-//#region src/button/group.ts
+// src/button/group.ts
 const ButtonGroupItemContext = createContext(null);
 const groupStyles = StyleSheet.create({ target: { minWidth: 48 } });
 /**
@@ -109,7 +109,6 @@ function useGroupShift(group, base, property) {
 	});
 	return group?.onPressStart === void 0 ? void 0 : style;
 }
-//#endregion
 export { ButtonGroupItemContext, groupCornersOf, groupPressHandlers, groupSelectionOf, groupStyles, groupWidthThen, useGroupShift };
 
 //# sourceMappingURL=group.js.map

package/dist/button/index.d.ts

@@ -1,7 +1,6 @@
 import "./group.js";
 import { HostInstance, LayoutChangeEvent, PressableProps } from "react-native";
 import { Ref } from "react";
-//#region src/button/index.d.ts
 /**
  * A plain button, a link, or a toggle, of which a call site writes exactly
  * one. Each form names the props of the other two as `never`, so a toggle
@@ -86,6 +85,5 @@ type ButtonToggleForm = ButtonPending & {
 };
 /** The five control heights both pages give, by the names both props take. */
 type ControlSize = 'lg' | 'md' | 'xl' | 'xs' | 'xxl';
-//#endregion
 export type { ButtonLinkForm, ButtonPressForm, ButtonToggleForm, ControlSize };
 //# sourceMappingURL=index.d.ts.map

package/dist/button/index.js

@@ -7,7 +7,7 @@ import { c } from "react/compiler-runtime";
 import { Platform, Pressable, StyleSheet } from "react-native";
 import Animated, { Easing, useAnimatedStyle, useReducedMotion, useSharedValue, withTiming } from "react-native-reanimated";
 import { use, useState } from "react";
-//#region src/button/index.ts
+// src/button/index.ts
 const HEIGHTS = {
 	lg: "controlLg",
 	md: "controlSm",
@@ -230,7 +230,6 @@ function useSlotTrigger({ accessibilityHint, delayLongPress, href, onHoverIn, on
 		ref: trigger === void 0 && tooltip === void 0 ? ref : refsOf(trigger?.ref, tooltip?.ref, ref)
 	};
 }
-//#endregion
 export { AnimatedPressable, HEIGHTS, OUTLINE_WIDTHS, PRESSED_CORNERS, buttonStyles, pressThen, toggleState, useButtonAction, useCorner, useSlotTrigger };
 
 //# sourceMappingURL=index.js.map

package/dist/button/palettes.js

@@ -1,6 +1,6 @@
 import { themedStyles } from "../theme/styles.js";
 import { withOpacity } from "../theme/color.js";
-//#region src/button/palettes.ts
+// src/button/palettes.ts
 function palette(content, container = {}) {
 	return {
 		container,
@@ -41,7 +41,6 @@ const palettesOf = themedStyles(({ colors, stateLayerOpacity }) => {
 		tonalToggleSelected: palette(colors.onSecondary, { backgroundColor: colors.secondary })
 	};
 });
-//#endregion
 export { palettesOf };
 
 //# sourceMappingURL=palettes.js.map

package/dist/button/pending.js

@@ -5,7 +5,7 @@ import { c } from "react/compiler-runtime";
 import { AccessibilityInfo, Platform, StyleSheet, View } from "react-native";
 import { useEffect, useRef } from "react";
 import { jsx } from "react/jsx-runtime";
-//#region src/button/pending.tsx
+// src/button/pending.tsx
 const pendingStyles = StyleSheet.create({
 	hidden: { opacity: 0 },
 	ring: {
@@ -134,7 +134,6 @@ function usePending(isPending, pendingLabel) {
 	useEffect(t0, t1);
 	return label;
 }
-//#endregion
 export { BUSY, CONCEALED, PendingContent, PendingRing, pendingStyles, usePending };
 
 //# sourceMappingURL=pending.js.map

package/dist/button/slots.js

@@ -1,8 +1,7 @@
 import { createContext } from "react";
-//#region src/button/slots.ts
+// src/button/slots.ts
 const ButtonSlotContext = createContext(null);
 const ButtonTooltipContext = createContext(null);
-//#endregion
 export { ButtonSlotContext, ButtonTooltipContext };
 
 //# sourceMappingURL=slots.js.map

package/dist/calendar/index.js

@@ -15,7 +15,7 @@ import Animated, { Easing, useAnimatedStyle, useReducedMotion, useSharedValue, w
 import { createContext, use, useLayoutEffect, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { DateFormatter, endOfMonth, isSameDay, isSameMonth, isSameYear, isToday, startOfMonth, startOfWeek, toCalendarDate, today } from "@internationalized/date";
-//#region src/calendar/index.tsx
+// src/calendar/index.tsx
 /**
 * Where a calendar hands over the cell of the date it is on, the one held or
 * else the one it opened on, for a surface that sends a screen reader to that
@@ -1345,7 +1345,6 @@ function yearsOf(state, locale) {
 	};
 }
 const NONE = /* @__PURE__ */ new Set();
-//#endregion
 export { CalendarFocusContext, CalendarFrame, useRootStyle, visibleRangeOf };
 
 //# sourceMappingURL=index.js.map

package/dist/calendar/styles.js

@@ -1,7 +1,7 @@
 import { themedStyles } from "../theme/styles.js";
 import { withOpacity } from "../theme/color.js";
 import { StyleSheet } from "react-native";
-//#region src/calendar/styles.ts
+// src/calendar/styles.ts
 /**
 * The container's width for the months it holds side by side: the page's
 * 360dp for one, which is seven 48dp columns inside its padding, and for more
@@ -145,7 +145,6 @@ const stylesOf = themedStyles(({ colors, radii, sizing, spacing, stateLayerOpaci
 		}
 	});
 });
-//#endregion
 export { rootWidthOf, styles, stylesOf };
 
 //# sourceMappingURL=styles.js.map

package/dist/carousel/arrangement.d.ts

@@ -1,5 +1,3 @@
-//#region src/carousel/arrangement.d.ts
 type CarouselLayout = 'hero' | 'multi-browse' | 'uncontained';
-//#endregion
 export type { CarouselLayout };
 //# sourceMappingURL=arrangement.d.ts.map

package/dist/carousel/arrangement.js

@@ -117,7 +117,6 @@ function withSteps(sizes, count) {
 		steps: count - filled + turning
 	};
 }
-//#endregion
 export { arrange, placements };
 
 //# sourceMappingURL=arrangement.js.map

package/dist/chequer/index.js

@@ -5,7 +5,7 @@ import { StyleSheet } from "react-native";
 import { useId } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import Svg, { Defs, Pattern, Rect } from "react-native-svg";
-//#region src/chequer/index.tsx
+// src/chequer/index.tsx
 const TILE = 16;
 const HALF = TILE / 2;
 function Chequer() {
@@ -89,7 +89,6 @@ function Chequer() {
 	} else t6 = $[14];
 	return t6;
 }
-//#endregion
 export { Chequer };
 
 //# sourceMappingURL=index.js.map

package/dist/chip/index.js

@@ -9,7 +9,7 @@ import { c } from "react/compiler-runtime";
 import { View } from "react-native";
 import Animated, { Easing, useAnimatedStyle, useReducedMotion, withTiming } from "react-native-reanimated";
 import { jsx } from "react/jsx-runtime";
-//#region src/chip/index.tsx
+// src/chip/index.tsx
 const CHECK = /* @__PURE__ */ jsx(CheckGlyph, {});
 /**
 * What a chip draws before its label: the check while it is selected, its own
@@ -188,7 +188,6 @@ function useEasedColors(t0) {
 	} else t1 = $[2];
 	return t1;
 }
-//#endregion
 export { ChipGlyph, ChipLabel, measureThen, paintOf, targetOf, useEasedColors };
 
 //# sourceMappingURL=index.js.map

package/dist/chip/styles.js

@@ -30,7 +30,6 @@ const shadowsOf = themedStyles(({ shadows }) => StyleSheet.create({
 	elevation1: { boxShadow: shadows.elevation1 },
 	elevation2: { boxShadow: shadows.elevation2 }
 }));
-//#endregion
 export { shadowsOf, styles, stylesOf };
 
 //# sourceMappingURL=styles.js.map

package/dist/clipboard/index.js

@@ -1,5 +1,5 @@
 import { useSyncExternalStore } from "react";
-//#region src/clipboard/index.ts
+// src/clipboard/index.ts
 let clipboard;
 let loading;
 const listeners = /* @__PURE__ */ new Set();
@@ -52,7 +52,6 @@ async function writeClipboard(text) {
 	if (settled === null) throw new Error("expo-clipboard is not installed");
 	if (!await settled.setStringAsync(text)) throw new Error("The clipboard refused the write");
 }
-//#endregion
 export { useClipboardAvailable, writeClipboard };
 
 //# sourceMappingURL=index.js.map

package/dist/collection/index.d.ts

@@ -3,7 +3,6 @@ import { ReactElement, ReactNode, Ref } from "react";
 import "react-stately/useListState";
 import { Key, Selection, SelectionMode } from "react-stately";
 import "react-stately/useTreeState";
-//#region src/collection/index.d.ts
 type CollectionLoadMoreProps = {
   /**
    * Draws the ring in a row of its own while more items are being fetched.
@@ -152,6 +151,5 @@ declare function sectionNode(props: CollectionSectionProps): Generator<{
   rendered: ReactNode;
   type: string;
 }, void, unknown>;
-//#endregion
 export { type CollectionLoadMoreProps, type CollectionProps, type CollectionRowProps, type CollectionSectionProps, loaderNode, rowNode, sectionNode };
 //# sourceMappingURL=index.d.ts.map

package/dist/collection/index.js

@@ -18,7 +18,7 @@ import { AccessibilityInfo, FlatList, Platform, Pressable, StyleSheet, Text, Vie
 import { Children, createContext, use, useEffect, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { useListState } from "react-stately/useListState";
-//#region src/collection/index.tsx
+// src/collection/index.tsx
 const BOX_SLOT = 24;
 const LOADING_DIAMETER = "24px";
 const LOAD_OFFSET = 1;
@@ -1352,7 +1352,6 @@ function withBox(box, leading, style) {
 		children: [box, leading]
 	}) : box;
 }
-//#endregion
 export { Collection, CollectionView, LoadingRow, ResultsStatus, SelectBox, Status, accessibilityActionOf, childElementsOf, focusKeyOf, loadMoreOf, loaderNode, nestedRowNode, noop, pressThen, rowCountOf, rowNode, sectionNode };
 
 //# sourceMappingURL=index.js.map

package/dist/color-thumb/index.js

@@ -3,7 +3,7 @@ import { composeStyles, themedStyles } from "../theme/styles.js";
 import { c } from "react/compiler-runtime";
 import { StyleSheet, View } from "react-native";
 import { jsx } from "react/jsx-runtime";
-//#region src/color-thumb/index.tsx
+// src/color-thumb/index.tsx
 const RING = 2;
 const HAIRLINE = 1;
 const stylesOf = themedStyles(({ colors, radii, shadows }) => StyleSheet.create({
@@ -50,7 +50,6 @@ function ColorThumb(t0) {
 	} else t4 = $[6];
 	return t4;
 }
-//#endregion
 export { ColorThumb };
 
 //# sourceMappingURL=index.js.map

package/dist/components/app-bar/index.d.ts

@@ -1,6 +1,5 @@
 import { View, ViewProps } from "react-native";
 import { ComponentRef, ReactNode, Ref } from "react";
-//#region src/components/app-bar/index.d.ts
 type AppBarProps = Omit<ViewProps, 'children'> & {
   /**
    * Which of Material Design's alignments the text takes. `center` is the
@@ -106,6 +105,5 @@ type AppBarSize = 'lg' | 'md' | 'sm';
  * `useAppBarScroll` sets both from the screen's scroll view.
  */
 declare function AppBar({ align, collapsed, contentInset, contentMaxInlineSize, headline, leading, pinned, scrolled, size, style, subtitle, trailing, ...props }: AppBarProps): import("react").JSX.Element;
-//#endregion
 export { AppBar, type AppBarProps };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/app-bar/index.js

@@ -8,7 +8,7 @@ import { StyleSheet, View } from "react-native";
 import Animated, { Easing, useAnimatedStyle, useReducedMotion, withTiming } from "react-native-reanimated";
 import { SafeAreaView } from "react-native-safe-area-context";
 import { jsx, jsxs } from "react/jsx-runtime";
-//#region src/components/app-bar/index.tsx
+// src/components/app-bar/index.tsx
 const ICON_SIZE = 24;
 const GLYPH_INSET = 12;
 const HEIGHTS = {
@@ -335,7 +335,6 @@ function useFill(scrolled) {
 		return { backgroundColor: reduceMotion ? fill : withTiming(fill, timing) };
 	});
 }
-//#endregion
 export { AppBar };
 
 //# sourceMappingURL=index.js.map

package/dist/components/autocomplete/index.d.ts

@@ -1,6 +1,5 @@
 import { ReactNode } from "react";
 import { Node } from "react-stately";
-//#region src/components/autocomplete/index.d.ts
 /**
  * Whether a search keeps a row: handed the row's text, what has been typed
  * and the row's entry in the collection, as React Aria's is.
@@ -44,6 +43,5 @@ type AutocompleteProps<T extends object = object> = {
  * screen reader.
  */
 declare function Autocomplete<T extends object = object>({ children, defaultInputValue, filter, inputValue, onInputChange }: AutocompleteProps<T>): import("react").JSX.Element;
-//#endregion
 export { Autocomplete, type AutocompleteFilter, type AutocompleteProps };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/autocomplete/index.js

@@ -3,7 +3,7 @@ import { useLocaleOf } from "../../i18n/provider.js";
 import { c } from "react/compiler-runtime";
 import { useState } from "react";
 import { jsx } from "react/jsx-runtime";
-//#region src/components/autocomplete/index.tsx
+// src/components/autocomplete/index.tsx
 /**
 * A search field that filters the list under it. What has been typed is the
 * autocomplete's: pass `inputValue` with `onInputChange` to control it, or
@@ -83,7 +83,6 @@ function setterOf(setOwn, onInputChange) {
 		onInputChange?.(value);
 	};
 }
-//#endregion
 export { Autocomplete };
 
 //# sourceMappingURL=index.js.map

package/dist/components/avatar/index.d.ts

@@ -1,7 +1,6 @@
 import { MarkImageProps } from "../../mark/index.js";
 import { StyleProp, View, ViewProps, ViewStyle } from "react-native";
 import { ComponentRef, Ref } from "react";
-//#region src/components/avatar/index.d.ts
 type AvatarProps = Omit<ViewProps, 'children' | 'style'> & {
   /**
    * Hides the avatar from screen readers, for one beside the person's name,
@@ -77,6 +76,5 @@ type AvatarProps = Omit<ViewProps, 'children' | 'style'> & {
  * outside one. `style`, `ref` and `testID` land on the disc.
  */
 declare function Avatar({ size, tone, ...props }: AvatarProps): import("react").JSX.Element;
-//#endregion
 export { Avatar, type AvatarProps };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/avatar/index.js

@@ -1,7 +1,7 @@
 import { Mark } from "../../mark/index.js";
 import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";
-//#region src/components/avatar/index.tsx
+// src/components/avatar/index.tsx
 /**
 * A person, as a disc holding their photo or, until it loads or when there
 * is none, their initials. `name` is both where the initials come from and
@@ -56,7 +56,6 @@ function Avatar(t0) {
 	} else t3 = $[7];
 	return t3;
 }
-//#endregion
 export { Avatar };
 
 //# sourceMappingURL=index.js.map

package/dist/components/badge/index.d.ts

@@ -1,6 +1,5 @@
 import { View, ViewProps } from "react-native";
 import { ComponentRef, ReactNode, Ref } from "react";
-//#region src/components/badge/index.d.ts
 type BadgeProps = Omit<ViewProps, 'children'> & {
   /**
    * What the badge is drawn on, usually an icon at 24dp. Left out, the badge
@@ -43,6 +42,5 @@ type BadgeProps = Omit<ViewProps, 'children'> & {
  * to the column's edge, so a call site placing one there sets `alignSelf`.
  */
 declare function Badge({ children, count, max, style, ...props }: BadgeProps): import("react").JSX.Element;
-//#endregion
 export { Badge, type BadgeProps };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/badge/index.js

@@ -9,7 +9,7 @@ import { c } from "react/compiler-runtime";
 import { Text, View } from "react-native";
 import { use } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-//#region src/components/badge/index.tsx
+// src/components/badge/index.tsx
 /**
 * A badge on the top trailing corner of what it wraps, usually an icon: the
 * small dot, or with `count` the large badge holding a number. The mark is
@@ -116,7 +116,6 @@ function Badge(t0) {
 function countOf(count, max, locale) {
 	return count > max ? `${formatCount(max, locale)}+` : formatCount(count, locale);
 }
-//#endregion
 export { Badge };
 
 //# sourceMappingURL=index.js.map

package/dist/components/badge/styles.js

@@ -1,6 +1,6 @@
 import { themedStyles } from "../../theme/styles.js";
 import { StyleSheet } from "react-native";
-//#region src/components/badge/styles.ts
+// src/components/badge/styles.ts
 const SMALL_SIZE = 6;
 const LARGE_SIZE = 16;
 const styles = StyleSheet.create({
@@ -49,7 +49,6 @@ const stylesOf = themedStyles(({ colors, radii, spacing }) => StyleSheet.create(
 		pointerEvents: "none"
 	}
 }));
-//#endregion
 export { styles, stylesOf };
 
 //# sourceMappingURL=styles.js.map

package/dist/components/breadcrumbs/index.d.ts

@@ -1,7 +1,6 @@
 import { StyleProp, View, ViewProps, ViewStyle } from "react-native";
 import { ComponentRef, ReactNode, Ref } from "react";
 import { Key } from "react-stately";
-//#region src/components/breadcrumbs/index.d.ts
 type BreadcrumbsItemProps = Omit<ViewProps, 'children' | 'id' | 'style'> & {
   /** The item's label. */
   readonly children?: ReactNode;
@@ -61,6 +60,5 @@ declare namespace Breadcrumbs {
  * chevron after it.
  */
 declare function BreadcrumbsItem({ children, href, id, style, ...props }: BreadcrumbsItemProps): import("react").JSX.Element;
-//#endregion
 export { Breadcrumbs, BreadcrumbsItem, type BreadcrumbsItemProps, type BreadcrumbsProps };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/breadcrumbs/index.js

@@ -7,7 +7,7 @@ import { c } from "react/compiler-runtime";
 import { Platform, StyleSheet, Text, View } from "react-native";
 import { Children, Fragment, createContext, isValidElement, use } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-//#region src/components/breadcrumbs/index.tsx
+// src/components/breadcrumbs/index.tsx
 const ItemContext = createContext({
 	isCurrent: false,
 	isDisabled: false,
@@ -279,7 +279,6 @@ function positionsOf(items, isDisabled, onAction) {
 	}));
 }
 Breadcrumbs.Item = BreadcrumbsItem;
-//#endregion
 export { Breadcrumbs, BreadcrumbsItem };
 
 //# sourceMappingURL=index.js.map

package/dist/components/button/index.d.ts

@@ -1,7 +1,6 @@
 import { ButtonLinkForm, ButtonPressForm, ButtonToggleForm } from "../../button/index.js";
 import { PressableProps, StyleProp, View, ViewStyle } from "react-native";
 import { ComponentRef, ReactNode, Ref } from "react";
-//#region src/components/button/index.d.ts
 type ButtonForm = ButtonLinkForm | ButtonPressForm | (ButtonToggleForm & {
   /**
    * A toggle takes any variant but `text`, which the page gives no
@@ -84,6 +83,5 @@ type ButtonVariant = 'elevated' | 'filled' | 'outlined' | 'text' | 'tonal';
  * `style`, `ref` and `testID` land on the `Pressable`.
  */
 declare function Button({ accessibilityHint, children, defaultSelected, delayLongPress, disableRipple, hitSlop: ownHitSlop, href, icon, id, isDisabled: ownDisabled, isPending, isSelected, onBlur, onChange, onFocus, onHoverIn, onHoverOut, onLayout, onLongPress, onPress, onPressIn, onPressOut, pendingLabel, ref, shape, size: ownSize, slot, style, type, variant, ...props }: ButtonProps): import("react").JSX.Element;
-//#endregion
 export { Button, type ButtonProps, type ButtonShape, type ButtonSize, type ButtonVariant };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/button/index.js

@@ -12,7 +12,7 @@ import { StyleSheet, Text, useWindowDimensions } from "react-native";
 import Animated, { useSharedValue } from "react-native-reanimated";
 import { use } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-//#region src/components/button/index.tsx
+// src/components/button/index.tsx
 const DISABLED = {
 	elevated: "filledDisabled",
 	filled: "filledDisabled",
@@ -504,7 +504,6 @@ function shadowOf(variant, { hovered, pressed }, isDisabled, theme) {
 	if (variant === "elevated") return shadowsOf(theme)[lifted ? "elevation2" : "elevation1"];
 	return (variant === "filled" || variant === "tonal") && lifted ? shadowsOf(theme).elevation1 : void 0;
 }
-//#endregion
 export { Button };
 
 //# sourceMappingURL=index.js.map

package/dist/components/button-group/index.d.ts

@@ -3,7 +3,6 @@ import { ButtonShape } from "../button/index.js";
 import { StyleProp, View, ViewProps, ViewStyle } from "react-native";
 import { ComponentRef, ReactNode, Ref } from "react";
 import { Key } from "react-stately";
-//#region src/components/button-group/index.d.ts
 type ButtonGroupNaming = {
   readonly 'aria-label': string;
   readonly 'aria-labelledby'?: string;
@@ -82,6 +81,5 @@ type ButtonGroupVariant = 'connected' | 'standard';
  * `style`, `ref` and `testID` land on the row.
  */
 declare function ButtonGroup({ children, defaultSelectedKeys, disallowEmptySelection, isDisabled, onSelectionChange, selectedKeys, selectionMode, shape, size, style, variant, ...props }: ButtonGroupProps): import("react").JSX.Element;
-//#endregion
 export { ButtonGroup, type ButtonGroupProps, type ButtonGroupVariant };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/button-group/index.js

@@ -7,7 +7,7 @@ import { StyleSheet, View } from "react-native";
 import { Children, Fragment, isValidElement, useState } from "react";
 import { jsx } from "react/jsx-runtime";
 import { useToggleGroupState } from "react-stately/useToggleGroupState";
-//#region src/components/button-group/index.tsx
+// src/components/button-group/index.tsx
 const EXPANDED_RATIO = .15;
 const XS_GAP = 18;
 const styles = StyleSheet.create({ group: {
@@ -269,7 +269,6 @@ function shiftFor(index, count, press) {
 	if (Math.abs(index - press.index) !== 1) return 0;
 	return -(press.index === 0 || press.index === count - 1 ? press.delta : press.delta / 2);
 }
-//#endregion
 export { ButtonGroup };
 
 //# sourceMappingURL=index.js.map

package/dist/components/calendar/index.d.ts

@@ -2,7 +2,6 @@ import { StyleProp, View, ViewStyle } from "react-native";
 import { ComponentRef, Ref } from "react";
 import { DateDuration } from "@internationalized/date";
 import { CalendarProps, DateValue } from "react-stately/useCalendarState";
-//#region src/components/calendar/index.d.ts
 type CalendarProps$1<T extends DateValue = DateValue> = Pick<CalendarProps<T>, 'defaultFocusedValue' | 'defaultValue' | 'firstDayOfWeek' | 'focusedValue' | 'isDateUnavailable' | 'isDisabled' | 'isReadOnly' | 'maxValue' | 'minValue' | 'onChange' | 'onFocusChange' | 'value'> & {
   /**
    * The calendar's name. The month shown, or the months, is added to it, as
@@ -54,6 +53,5 @@ type CalendarProps$1<T extends DateValue = DateValue> = Pick<CalendarProps<T>, '
  * `style`, `ref` and `testID` land on the container.
  */
 declare function Calendar<T extends DateValue = DateValue>({ 'aria-label': ariaLabel, locale, ref, showMonthYearMenus, style, testID, visibleDuration, ...props }: CalendarProps$1<T>): import("react").JSX.Element;
-//#endregion
 export { Calendar, type CalendarProps$1 as CalendarProps };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/calendar/index.js

@@ -6,7 +6,7 @@ import { View } from "react-native";
 import { jsx } from "react/jsx-runtime";
 import { createCalendar } from "@internationalized/date";
 import { useCalendarState } from "react-stately/useCalendarState";
-//#region src/components/calendar/index.tsx
+// src/components/calendar/index.tsx
 /**
 * A month calendar for picking a date. The value is an
 * `@internationalized/date` value, as on web: pass `value` with `onChange` to
@@ -130,7 +130,6 @@ function Calendar(t0) {
 	} else t8 = $[32];
 	return t8;
 }
-//#endregion
 export { Calendar };
 
 //# sourceMappingURL=index.js.map

package/dist/components/card/index.d.ts

@@ -1,6 +1,5 @@
 import { PressableProps, StyleProp, View, ViewProps, ViewStyle } from "react-native";
 import { ComponentRef, ReactNode, Ref } from "react";
-//#region src/components/card/index.d.ts
 type CardBaseProps = {
   readonly children?: ReactNode;
   /**
@@ -73,6 +72,5 @@ type StaticCardForm = Omit<ViewProps, 'children' | 'style'> & {
  * does. `style`, `ref` and `testID` land on the card's own view.
  */
 declare function Card(props: CardProps): import("react").JSX.Element;
-//#endregion
 export { Card, type CardProps, type CardVariant };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/card/index.js

@@ -6,7 +6,7 @@ import { useLinkPress } from "../../router/index.js";
 import { c } from "react/compiler-runtime";
 import { Pressable, StyleSheet, View } from "react-native";
 import { jsx, jsxs } from "react/jsx-runtime";
-//#region src/components/card/index.tsx
+// src/components/card/index.tsx
 const paddings = themedStyles(({ spacing }) => StyleSheet.create({
 	default: { padding: spacing.lg },
 	none: { padding: 0 }
@@ -309,7 +309,6 @@ function StaticCard(t0) {
 	} else t5 = $[16];
 	return t5;
 }
-//#endregion
 export { Card };
 
 //# sourceMappingURL=index.js.map