panelui-native 0.5.3 → 0.6.0

package/lib/module/hooks/use-previous.js

@@ -0,0 +1,25 @@
+"use strict";
+
+import { useEffect, useRef } from 'react';
+
+/**
+ * The value from the previous render, or `undefined` on the first.
+ *
+ * Useful for reacting to a transition rather than a state — firing only when
+ * something *became* true.
+ *
+ * ```tsx
+ * const wasOpen = usePrevious(isOpen);
+ * useEffect(() => {
+ *   if (isOpen && !wasOpen) track('sheet_opened');
+ * }, [isOpen, wasOpen]);
+ * ```
+ */
+export function usePrevious(value) {
+  const ref = useRef(undefined);
+  useEffect(() => {
+    ref.current = value;
+  }, [value]);
+  return ref.current;
+}
+//# sourceMappingURL=use-previous.js.map

package/lib/module/hooks/use-previous.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useEffect","useRef","usePrevious","value","ref","undefined","current"],"sourceRoot":"../../../src","sources":["hooks/use-previous.ts"],"mappings":";;AAAA,SAASA,SAAS,EAAEC,MAAM,QAAQ,OAAO;;AAEzC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,WAAWA,CAAIC,KAAQ,EAAiB;EACtD,MAAMC,GAAG,GAAGH,MAAM,CAAgBI,SAAS,CAAC;EAE5CL,SAAS,CAAC,MAAM;IACdI,GAAG,CAACE,OAAO,GAAGH,KAAK;EACrB,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAEX,OAAOC,GAAG,CAACE,OAAO;AACpB","ignoreList":[]}

package/lib/module/index.js

@@ -31,9 +31,12 @@ export { InputGroup } from "./components/input-group/index.js";
 export { Label } from "./components/label/index.js";
 export { Progress } from "./components/progress/index.js";
 export { RadioGroup } from "./components/radio-group/index.js";
+export { ScrollFade } from "./components/scroll-fade/index.js";
+export { Shimmer } from "./components/shimmer/index.js";
 export { Skeleton } from "./components/skeleton/index.js";
 export { Spinner } from "./components/spinner/index.js";
 export { Steps } from "./components/steps/index.js";
+export { Surface } from "./components/surface/index.js";
 export { Switch } from "./components/switch/index.js";
 export { Timeline } from "./components/timeline/index.js";
 export { Toast, ToastViewport, toast, useToast } from "./components/toast/index.js";
@@ -42,6 +45,9 @@ export { Typography } from "./components/typography/index.js";
 // Icons
 export { AlertTriangleIcon, AppleIcon, ArrowUpRightIcon, BellIcon, CardIcon, CheckCircleIcon, CheckIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, FacebookIcon, GoogleIcon, IconColorProvider, InfoIcon, MoonIcon, PackageIcon, PlusSquareIcon, ReceiptIcon, SearchIcon, SendIcon, ShareNodesIcon, ShieldAlertIcon, ShieldCheckIcon, SunIcon, XIcon, useIconColor } from "./icons/index.js";
 
+// Hooks
+export * from "./hooks/index.js";
+
 // Utils
 export { cn } from "./utils/cn.js";
 //# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["PanelUIProvider","useTheme","useThemeMode","PANEL_THEMES","PANEL_THEME_NAMES","PANEL_EXTRA_THEMES","Portal","PortalHost","PortalProvider","Text","AnimatedPressable","Accordion","Alert","Avatar","Badge","BottomSheet","Button","Dialog","Frame","InlineSelect","Select","Tabs","Card","Checkbox","EmptyState","Input","InputGroup","Label","Progress","RadioGroup","Skeleton","Spinner","Steps","Switch","Timeline","Toast","ToastViewport","toast","useToast","Typography","AlertTriangleIcon","AppleIcon","ArrowUpRightIcon","BellIcon","CardIcon","CheckCircleIcon","CheckIcon","ChevronDownIcon","ChevronLeftIcon","ChevronRightIcon","FacebookIcon","GoogleIcon","IconColorProvider","InfoIcon","MoonIcon","PackageIcon","PlusSquareIcon","ReceiptIcon","SearchIcon","SendIcon","ShareNodesIcon","ShieldAlertIcon","ShieldCheckIcon","SunIcon","XIcon","useIconColor","cn"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;AAAA;AACA,SAASA,eAAe,QAAmC,kCAA+B;;AAE1F;AACA,SACEC,QAAQ,EACRC,YAAY,EACZC,YAAY,EACZC,iBAAiB,EACjBC,kBAAkB,QAKb,sBAAmB;;AAE1B;AACA,SAASC,MAAM,EAAEC,UAAU,EAAEC,cAAc,QAAQ,wBAAqB;AACxE,SAASC,IAAI,QAAwB,sBAAmB;AACxD,SACEC,iBAAiB,QAEZ,oCAAiC;;AAExC;AACA,SACEC,SAAS,QAQJ,iCAAwB;AAC/B,SACEC,KAAK,QAGA,6BAAoB;AAC3B,SACEC,MAAM,QAGD,8BAAqB;AAC5B,SAASC,KAAK,QAAyB,6BAAoB;AAC3D,SACEC,WAAW,QAGN,oCAA2B;AAClC,SAASC,MAAM,QAA0B,8BAAqB;AAC9D,SACEC,MAAM,QAGD,8BAAqB;AAC5B,SAASC,KAAK,QAAyB,6BAAoB;AAC3D,SACEC,YAAY,QAGP,qCAA4B;AACnC,SAASC,MAAM,QAAgD,8BAAqB;AACpF,SACEC,IAAI,QAKC,4BAAmB;AAC1B,SAASC,IAAI,QAAwB,4BAAmB;AACxD,SAASC,QAAQ,QAA4B,gCAAuB;AACpE,SACEC,UAAU,QAGL,mCAA0B;AACjC,SAASC,KAAK,QAAyB,6BAAoB;AAC3D,SACEC,UAAU,QAIL,mCAA0B;AACjC,SAASC,KAAK,QAA8C,6BAAoB;AAChF,SAASC,QAAQ,QAA4B,gCAAuB;AACpE,SACEC,UAAU,QAGL,mCAA0B;AACjC,SAASC,QAAQ,QAA4B,gCAAuB;AACpE,SAASC,OAAO,QAA2B,+BAAsB;AACjE,SACEC,KAAK,QAQA,6BAAoB;AAC3B,SAASC,MAAM,QAA0B,8BAAqB;AAC9D,SACEC,QAAQ,QAOH,gCAAuB;AAC9B,SACEC,KAAK,EACLC,aAAa,EACbC,KAAK,EACLC,QAAQ,QASH,6BAAoB;AAC3B,SACEC,UAAU,QAML,kCAAyB;;AAEhC;AACA,SACEC,iBAAiB,EACjBC,SAAS,EACTC,gBAAgB,EAChBC,QAAQ,EACRC,QAAQ,EACRC,eAAe,EACfC,SAAS,EACTC,eAAe,EACfC,eAAe,EACfC,gBAAgB,EAChBC,YAAY,EACZC,UAAU,EACVC,iBAAiB,EACjBC,QAAQ,EACRC,QAAQ,EACRC,WAAW,EACXC,cAAc,EACdC,WAAW,EACXC,UAAU,EACVC,QAAQ,EACRC,cAAc,EACdC,eAAe,EACfC,eAAe,EACfC,OAAO,EACPC,KAAK,EACLC,YAAY,QAEP,kBAAS;;AAEhB;AACA,SAASC,EAAE,QAAQ,eAAY","ignoreList":[]}
+{"version":3,"names":["PanelUIProvider","useTheme","useThemeMode","PANEL_THEMES","PANEL_THEME_NAMES","PANEL_EXTRA_THEMES","Portal","PortalHost","PortalProvider","Text","AnimatedPressable","Accordion","Alert","Avatar","Badge","BottomSheet","Button","Dialog","Frame","InlineSelect","Select","Tabs","Card","Checkbox","EmptyState","Input","InputGroup","Label","Progress","RadioGroup","ScrollFade","Shimmer","Skeleton","Spinner","Steps","Surface","Switch","Timeline","Toast","ToastViewport","toast","useToast","Typography","AlertTriangleIcon","AppleIcon","ArrowUpRightIcon","BellIcon","CardIcon","CheckCircleIcon","CheckIcon","ChevronDownIcon","ChevronLeftIcon","ChevronRightIcon","FacebookIcon","GoogleIcon","IconColorProvider","InfoIcon","MoonIcon","PackageIcon","PlusSquareIcon","ReceiptIcon","SearchIcon","SendIcon","ShareNodesIcon","ShieldAlertIcon","ShieldCheckIcon","SunIcon","XIcon","useIconColor","cn"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;AAAA;AACA,SAASA,eAAe,QAAmC,kCAA+B;;AAE1F;AACA,SACEC,QAAQ,EACRC,YAAY,EACZC,YAAY,EACZC,iBAAiB,EACjBC,kBAAkB,QAKb,sBAAmB;;AAE1B;AACA,SAASC,MAAM,EAAEC,UAAU,EAAEC,cAAc,QAAQ,wBAAqB;AACxE,SAASC,IAAI,QAAwB,sBAAmB;AACxD,SACEC,iBAAiB,QAEZ,oCAAiC;;AAExC;AACA,SACEC,SAAS,QAQJ,iCAAwB;AAC/B,SACEC,KAAK,QAGA,6BAAoB;AAC3B,SACEC,MAAM,QAGD,8BAAqB;AAC5B,SAASC,KAAK,QAAyB,6BAAoB;AAC3D,SACEC,WAAW,QAGN,oCAA2B;AAClC,SAASC,MAAM,QAA0B,8BAAqB;AAC9D,SACEC,MAAM,QAGD,8BAAqB;AAC5B,SAASC,KAAK,QAAyB,6BAAoB;AAC3D,SACEC,YAAY,QAGP,qCAA4B;AACnC,SAASC,MAAM,QAAgD,8BAAqB;AACpF,SACEC,IAAI,QAKC,4BAAmB;AAC1B,SAASC,IAAI,QAAwB,4BAAmB;AACxD,SAASC,QAAQ,QAA4B,gCAAuB;AACpE,SACEC,UAAU,QAGL,mCAA0B;AACjC,SAASC,KAAK,QAAyB,6BAAoB;AAC3D,SACEC,UAAU,QAIL,mCAA0B;AACjC,SAASC,KAAK,QAA8C,6BAAoB;AAChF,SAASC,QAAQ,QAA4B,gCAAuB;AACpE,SACEC,UAAU,QAGL,mCAA0B;AACjC,SACEC,UAAU,QAEL,mCAA0B;AACjC,SAASC,OAAO,QAA2B,+BAAsB;AACjE,SAASC,QAAQ,QAA4B,gCAAuB;AACpE,SAASC,OAAO,QAA2B,+BAAsB;AACjE,SACEC,KAAK,QAQA,6BAAoB;AAC3B,SAASC,OAAO,QAA2B,+BAAsB;AACjE,SAASC,MAAM,QAA0B,8BAAqB;AAC9D,SACEC,QAAQ,QAOH,gCAAuB;AAC9B,SACEC,KAAK,EACLC,aAAa,EACbC,KAAK,EACLC,QAAQ,QASH,6BAAoB;AAC3B,SACEC,UAAU,QAML,kCAAyB;;AAEhC;AACA,SACEC,iBAAiB,EACjBC,SAAS,EACTC,gBAAgB,EAChBC,QAAQ,EACRC,QAAQ,EACRC,eAAe,EACfC,SAAS,EACTC,eAAe,EACfC,eAAe,EACfC,gBAAgB,EAChBC,YAAY,EACZC,UAAU,EACVC,iBAAiB,EACjBC,QAAQ,EACRC,QAAQ,EACRC,WAAW,EACXC,cAAc,EACdC,WAAW,EACXC,UAAU,EACVC,QAAQ,EACRC,cAAc,EACdC,eAAe,EACfC,eAAe,EACfC,OAAO,EACPC,KAAK,EACLC,YAAY,QAEP,kBAAS;;AAEhB;AACA,cAAc,kBAAS;;AAEvB;AACA,SAASC,EAAE,QAAQ,eAAY","ignoreList":[]}

package/lib/typescript/src/components/scroll-fade/index.d.ts

@@ -0,0 +1,38 @@
+/**
+ * ScrollFade — fades the edges of a scroll container.
+ *
+ * The React Native equivalent of shadcn-ui/ui's `scroll-fade` utility
+ * (https://ui.shadcn.com/docs/utils/scroll-fade), which is CSS `mask-image`
+ * driven by a scroll timeline. React Native has neither masks nor scroll
+ * timelines, so the fades are SVG gradients overlaid on each edge, with their
+ * opacity following the scroll position.
+ *
+ * Composition follows heroui-native's ScrollShadow: wrap the scrollable and
+ * let the orientation be inferred from its `horizontal` prop.
+ *
+ * ```tsx
+ * <ScrollFade>
+ *   <ScrollView horizontal>…</ScrollView>
+ * </ScrollFade>
+ * ```
+ */
+import { type ReactNode } from 'react';
+import { type ViewProps } from 'react-native';
+export interface ScrollFadeProps extends ViewProps {
+    className?: string;
+    /** Depth of the fade in pixels. */
+    size?: number;
+    /** Which edges fade. */
+    edges?: 'both' | 'start' | 'end';
+    /**
+     * Colour the fade resolves to — normally whatever sits behind the
+     * scrollable. Defaults to the theme's background.
+     */
+    color?: string;
+    children?: ReactNode;
+}
+export declare function ScrollFade({ className, size, edges, color, children, ...props }: ScrollFadeProps): import("react").JSX.Element;
+export declare namespace ScrollFade {
+    var displayName: string;
+}
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/components/scroll-fade/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/scroll-fade/index.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AACH,OAAO,EAML,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,EAIL,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAOtB,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mCAAmC;IACnC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,wBAAwB;IACxB,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,KAAK,CAAC;IACjC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAQD,wBAAgB,UAAU,CAAC,EACzB,SAAS,EACT,IAAS,EACT,KAAc,EACd,KAAK,EACL,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,eAAe,+BA4DjB;yBAnEe,UAAU"}

package/lib/typescript/src/components/shimmer/index.d.ts

@@ -0,0 +1,42 @@
+/**
+ * Shimmer — an animated highlight sweeping across content.
+ *
+ * The React Native equivalent of shadcn-ui/ui's `shimmer` utility
+ * (https://ui.shadcn.com/docs/utils/shimmer). That one is CSS:
+ * `background-clip: text` with a `color-mix()` highlight. React Native has
+ * neither, so the highlight is drawn as an SVG gradient band swept across an
+ * overlay by Reanimated, on the UI thread.
+ *
+ * The visible difference: the band passes *over* the content rather than
+ * being clipped to glyph shapes. On body-sized text the two read the same; on
+ * very large text the web version is crisper.
+ *
+ * ```tsx
+ * <Shimmer>
+ *   <Text muted>Generating response…</Text>
+ * </Shimmer>
+ * ```
+ */
+import { type ReactNode } from 'react';
+import { type ViewProps } from 'react-native';
+export interface ShimmerProps extends ViewProps {
+    className?: string;
+    /** Milliseconds for one sweep. */
+    duration?: number;
+    /** Sweep once instead of looping. */
+    once?: boolean;
+    /** Sweep right-to-left. */
+    reverse?: boolean;
+    /** Width of the highlight band, as a fraction of the content width. */
+    spread?: number;
+    /** Highlight colour. Defaults to the theme's foreground. */
+    color?: string;
+    /** Peak opacity of the highlight. */
+    intensity?: number;
+    children?: ReactNode;
+}
+export declare function Shimmer({ className, duration, once, reverse, spread, color, intensity, children, ...props }: ShimmerProps): import("react").JSX.Element;
+export declare namespace Shimmer {
+    var displayName: string;
+}
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/components/shimmer/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/shimmer/index.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AACH,OAAO,EAAuB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC5D,OAAO,EAAgC,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAc5E,MAAM,WAAW,YAAa,SAAQ,SAAS;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qCAAqC;IACrC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,2BAA2B;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,uEAAuE;IACvE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,4DAA4D;IAC5D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qCAAqC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,OAAO,CAAC,EACtB,SAAS,EACT,QAAe,EACf,IAAY,EACZ,OAAe,EACf,MAAY,EACZ,KAAK,EACL,SAAgB,EAChB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,YAAY,+BAuEd;yBAjFe,OAAO"}

package/lib/typescript/src/components/surface/index.d.ts

@@ -0,0 +1,30 @@
+import { View, type ViewProps } from 'react-native';
+import { type VariantProps } from 'tailwind-variants';
+declare const surfaceVariants: import("tailwind-variants").TVReturnType<{
+    variant: {
+        default: string;
+        secondary: string;
+        tertiary: string;
+        transparent: string;
+    };
+}, undefined, "overflow-hidden rounded-3xl p-4", {
+    variant: {
+        default: string;
+        secondary: string;
+        tertiary: string;
+        transparent: string;
+    };
+}, undefined, import("tailwind-variants").TVReturnType<{
+    variant: {
+        default: string;
+        secondary: string;
+        tertiary: string;
+        transparent: string;
+    };
+}, undefined, "overflow-hidden rounded-3xl p-4", unknown, unknown, undefined>>;
+export interface SurfaceProps extends ViewProps, VariantProps<typeof surfaceVariants> {
+    className?: string;
+}
+export declare const Surface: import("react").ForwardRefExoticComponent<SurfaceProps & import("react").RefAttributes<View>>;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/components/surface/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/surface/index.tsx"],"names":[],"mappings":"AAoBA,OAAO,EAAc,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAChE,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAE1D,QAAA,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;8EAanB,CAAC;AAEH,MAAM,WAAW,YACf,SAAQ,SAAS,EACf,YAAY,CAAC,OAAO,eAAe,CAAC;IACtC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,OAAO,+FAYnB,CAAC"}

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

@@ -0,0 +1,7 @@
+export { useCopyToClipboard, type UseCopyToClipboardOptions, type UseCopyToClipboardResult, } from './use-copy-to-clipboard.js';
+export { useDisclosure, type UseDisclosureOptions, type UseDisclosureResult, } from './use-disclosure.js';
+export { useBreakpoint, BREAKPOINTS, type Breakpoint, type UseBreakpointResult, } from './use-breakpoint.js';
+export { useKeyboard, type UseKeyboardResult } from './use-keyboard.js';
+export { useDebouncedValue } from './use-debounced-value.js';
+export { usePrevious } from './use-previous.js';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,kBAAkB,EAClB,KAAK,yBAAyB,EAC9B,KAAK,wBAAwB,GAC9B,MAAM,4BAAyB,CAAC;AACjC,OAAO,EACL,aAAa,EACb,KAAK,oBAAoB,EACzB,KAAK,mBAAmB,GACzB,MAAM,qBAAkB,CAAC;AAC1B,OAAO,EACL,aAAa,EACb,WAAW,EACX,KAAK,UAAU,EACf,KAAK,mBAAmB,GACzB,MAAM,qBAAkB,CAAC;AAC1B,OAAO,EAAE,WAAW,EAAE,KAAK,iBAAiB,EAAE,MAAM,mBAAgB,CAAC;AACrE,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAAuB,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAgB,CAAC"}

package/lib/typescript/src/hooks/use-breakpoint.d.ts

@@ -0,0 +1,32 @@
+/** Tailwind's breakpoints, minus the ones no phone or tablet reaches. */
+export declare const BREAKPOINTS: {
+    readonly sm: 640;
+    readonly md: 768;
+    readonly lg: 1024;
+    readonly xl: 1280;
+};
+export type Breakpoint = keyof typeof BREAKPOINTS;
+export interface UseBreakpointResult {
+    /** Largest breakpoint the window currently satisfies, or `base`. */
+    current: Breakpoint | 'base';
+    /** True when the window is at least this wide. */
+    isAtLeast: (breakpoint: Breakpoint) => boolean;
+    width: number;
+    height: number;
+    isLandscape: boolean;
+}
+/**
+ * Responsive state from the window size — the React Native answer to
+ * coss.com/ui's `useMediaQuery`, which has no equivalent here.
+ *
+ * For styling, prefer Uniwind's responsive class prefixes (`md:flex-row`).
+ * Reach for this when the *behaviour* changes, not just the look — rendering
+ * a sheet on a phone and a dialog on a tablet, say.
+ *
+ * ```tsx
+ * const { isAtLeast } = useBreakpoint();
+ * return isAtLeast('md') ? <Dialog …/> : <BottomSheet …/>;
+ * ```
+ */
+export declare function useBreakpoint(): UseBreakpointResult;
+//# sourceMappingURL=use-breakpoint.d.ts.map

package/lib/typescript/src/hooks/use-breakpoint.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-breakpoint.d.ts","sourceRoot":"","sources":["../../../../src/hooks/use-breakpoint.ts"],"names":[],"mappings":"AAEA,yEAAyE;AACzE,eAAO,MAAM,WAAW;;;;;CAAoD,CAAC;AAE7E,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,WAAW,CAAC;AAElD,MAAM,WAAW,mBAAmB;IAClC,oEAAoE;IACpE,OAAO,EAAE,UAAU,GAAG,MAAM,CAAC;IAC7B,kDAAkD;IAClD,SAAS,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK,OAAO,CAAC;IAC/C,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,OAAO,CAAC;CACtB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,aAAa,IAAI,mBAAmB,CAqBnD"}

package/lib/typescript/src/hooks/use-copy-to-clipboard.d.ts

@@ -0,0 +1,30 @@
+export interface UseCopyToClipboardOptions {
+    /** Milliseconds before `copied` flips back. */
+    timeout?: number;
+    onCopy?: () => void;
+}
+export interface UseCopyToClipboardResult {
+    /** Writes `value` to the clipboard and sets `copied`. */
+    copy: (value: string) => Promise<void>;
+    copied: boolean;
+}
+/**
+ * Copy text to the clipboard, with a temporary "copied" state.
+ *
+ * Mirrors coss.com/ui's `useCopyToClipboard`.
+ *
+ * Requires `expo-clipboard`, which is an optional peer dependency — React
+ * Native removed `Clipboard` from core, and pulling in a required native
+ * module for one hook would cost every consumer who never calls it:
+ *
+ * ```sh
+ * npx expo install expo-clipboard
+ * ```
+ *
+ * ```tsx
+ * const { copy, copied } = useCopyToClipboard();
+ * <Button onPress={() => copy(url)}>{copied ? 'Copied' : 'Copy link'}</Button>
+ * ```
+ */
+export declare function useCopyToClipboard({ timeout, onCopy, }?: UseCopyToClipboardOptions): UseCopyToClipboardResult;
+//# sourceMappingURL=use-copy-to-clipboard.d.ts.map

package/lib/typescript/src/hooks/use-copy-to-clipboard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-copy-to-clipboard.d.ts","sourceRoot":"","sources":["../../../../src/hooks/use-copy-to-clipboard.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,yBAAyB;IACxC,+CAA+C;IAC/C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,MAAM,WAAW,wBAAwB;IACvC,yDAAyD;IACzD,IAAI,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACvC,MAAM,EAAE,OAAO,CAAC;CACjB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,OAAc,EACd,MAAM,GACP,GAAE,yBAA8B,GAAG,wBAAwB,CA6B3D"}

package/lib/typescript/src/hooks/use-debounced-value.d.ts

@@ -0,0 +1,13 @@
+/**
+ * A copy of `value` that only updates once it has stopped changing for
+ * `delay` ms — for search fields, where you want the typed value on screen
+ * immediately but the query fired once.
+ *
+ * ```tsx
+ * const [query, setQuery] = useState('');
+ * const debounced = useDebouncedValue(query, 300);
+ * useEffect(() => { search(debounced); }, [debounced]);
+ * ```
+ */
+export declare function useDebouncedValue<T>(value: T, delay?: number): T;
+//# sourceMappingURL=use-debounced-value.d.ts.map

package/lib/typescript/src/hooks/use-debounced-value.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-debounced-value.d.ts","sourceRoot":"","sources":["../../../../src/hooks/use-debounced-value.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;GAUG;AACH,wBAAgB,iBAAiB,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,SAAM,GAAG,CAAC,CAS7D"}

package/lib/typescript/src/hooks/use-disclosure.d.ts

@@ -0,0 +1,32 @@
+export interface UseDisclosureOptions {
+    defaultOpen?: boolean;
+    /** Controlled open state. Pass this to drive it from outside. */
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}
+export interface UseDisclosureResult {
+    isOpen: boolean;
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+    /** Spread onto Dialog, BottomSheet or Select. */
+    props: {
+        open: boolean;
+        onOpenChange: (open: boolean) => void;
+    };
+}
+/**
+ * Open/closed state for an overlay.
+ *
+ * The same controlled-or-uncontrolled pattern Dialog, BottomSheet and Select
+ * implement internally, lifted out for when you need to drive one from
+ * elsewhere — closing a sheet after a request settles, say.
+ *
+ * ```tsx
+ * const sheet = useDisclosure();
+ * <Button onPress={sheet.open}>Share</Button>
+ * <BottomSheet {...sheet.props}>…</BottomSheet>
+ * ```
+ */
+export declare function useDisclosure({ defaultOpen, open: controlledOpen, onOpenChange, }?: UseDisclosureOptions): UseDisclosureResult;
+//# sourceMappingURL=use-disclosure.d.ts.map

package/lib/typescript/src/hooks/use-disclosure.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-disclosure.d.ts","sourceRoot":"","sources":["../../../../src/hooks/use-disclosure.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,oBAAoB;IACnC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,iEAAiE;IACjE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CACxC;AAED,MAAM,WAAW,mBAAmB;IAClC,MAAM,EAAE,OAAO,CAAC;IAChB,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,iDAAiD;IACjD,KAAK,EAAE;QAAE,IAAI,EAAE,OAAO,CAAC;QAAC,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;KAAE,CAAC;CACjE;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,aAAa,CAAC,EAC5B,WAAmB,EACnB,IAAI,EAAE,cAAc,EACpB,YAAY,GACb,GAAE,oBAAyB,GAAG,mBAAmB,CAqBjD"}

package/lib/typescript/src/hooks/use-keyboard.d.ts

@@ -0,0 +1,20 @@
+export interface UseKeyboardResult {
+    /** Height of the keyboard in px, or 0 when hidden. */
+    height: number;
+    isVisible: boolean;
+}
+/**
+ * Keyboard height and visibility, on the JS thread.
+ *
+ * Use this when the value drives rendering — showing a hint, swapping a
+ * layout. For *animating* against the keyboard, use Reanimated's
+ * `useAnimatedKeyboard` instead: it runs on the UI thread and tracks the
+ * keyboard frame-for-frame, where this fires once per show/hide.
+ *
+ * ```tsx
+ * const { isVisible } = useKeyboard();
+ * {isVisible ? null : <Footer />}
+ * ```
+ */
+export declare function useKeyboard(): UseKeyboardResult;
+//# sourceMappingURL=use-keyboard.d.ts.map

package/lib/typescript/src/hooks/use-keyboard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-keyboard.d.ts","sourceRoot":"","sources":["../../../../src/hooks/use-keyboard.ts"],"names":[],"mappings":"AAGA,MAAM,WAAW,iBAAiB;IAChC,sDAAsD;IACtD,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,WAAW,IAAI,iBAAiB,CAoB/C"}

package/lib/typescript/src/hooks/use-previous.d.ts

@@ -0,0 +1,15 @@
+/**
+ * The value from the previous render, or `undefined` on the first.
+ *
+ * Useful for reacting to a transition rather than a state — firing only when
+ * something *became* true.
+ *
+ * ```tsx
+ * const wasOpen = usePrevious(isOpen);
+ * useEffect(() => {
+ *   if (isOpen && !wasOpen) track('sheet_opened');
+ * }, [isOpen, wasOpen]);
+ * ```
+ */
+export declare function usePrevious<T>(value: T): T | undefined;
+//# sourceMappingURL=use-previous.d.ts.map

package/lib/typescript/src/hooks/use-previous.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-previous.d.ts","sourceRoot":"","sources":["../../../../src/hooks/use-previous.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;GAYG;AACH,wBAAgB,WAAW,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,GAAG,CAAC,GAAG,SAAS,CAQtD"}

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

@@ -22,13 +22,17 @@ export { InputGroup, type InputGroupProps, type InputGroupInputProps, type Input
 export { Label, type LabelProps, type LabelTextProps } from './components/label/index.js';
 export { Progress, type ProgressProps } from './components/progress/index.js';
 export { RadioGroup, type RadioGroupProps, type RadioGroupItemProps, } from './components/radio-group/index.js';
+export { ScrollFade, type ScrollFadeProps, } from './components/scroll-fade/index.js';
+export { Shimmer, type ShimmerProps } from './components/shimmer/index.js';
 export { Skeleton, type SkeletonProps } from './components/skeleton/index.js';
 export { Spinner, type SpinnerProps } from './components/spinner/index.js';
 export { Steps, type StepsProps, type StepsItemProps, type StepsTriggerProps, type StepsIndicatorProps, type StepsSeparatorProps, type StepState, type StepsOrientation, } from './components/steps/index.js';
+export { Surface, type SurfaceProps } from './components/surface/index.js';
 export { Switch, type SwitchProps } from './components/switch/index.js';
 export { Timeline, type TimelineProps, type TimelineItemProps, type TimelineIndicatorProps, type TimelineStatProps, type TimelineVariant, type TimelineTone, } from './components/timeline/index.js';
 export { Toast, ToastViewport, toast, useToast, type ToastProps, type ToastOptions, type ToastItem, type ToastVariant, type ToastPlacement, type ToastHandle, type ToastIndicatorProps, type ToastCloseProps, } from './components/toast/index.js';
 export { Typography, type TypographyProps, type TypographyType, type TypographyHeadingProps, type TypographyParagraphProps, type TypographyCodeProps, } from './components/typography/index.js';
 export { AlertTriangleIcon, AppleIcon, ArrowUpRightIcon, BellIcon, CardIcon, CheckCircleIcon, CheckIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, FacebookIcon, GoogleIcon, IconColorProvider, InfoIcon, MoonIcon, PackageIcon, PlusSquareIcon, ReceiptIcon, SearchIcon, SendIcon, ShareNodesIcon, ShieldAlertIcon, ShieldCheckIcon, SunIcon, XIcon, useIconColor, type IconProps, } from './icons/index.js';
+export * from './hooks/index.js';
 export { cn } from './utils/cn.js';
 //# sourceMappingURL=index.d.ts.map

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

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "panelui-native",
-  "version": "0.5.3",
+  "version": "0.6.0",
   "description": "High-performance React Native UI components for Expo. Coss UI design language, powered by Uniwind (Tailwind v4) and Reanimated.",
   "main": "./lib/module/index.js",
   "module": "./lib/module/index.js",
@@ -64,11 +64,13 @@
   "license": "MIT",
   "homepage": "https://github.com/panel-ui/PanelUI#readme",
   "peerDependencies": {
+    "expo-clipboard": ">=7.0.0",
     "react": "*",
     "react-native": "*",
     "react-native-gesture-handler": ">=2.0.0",
     "react-native-reanimated": ">=3.0.0",
     "react-native-safe-area-context": ">=4.0.0",
+    "react-native-svg": ">=15.0.0",
     "tailwindcss": ">=4.0.0",
     "uniwind": ">=1.0.0"
   },
@@ -92,5 +94,10 @@
       ],
       "typescript"
     ]
+  },
+  "peerDependenciesMeta": {
+    "expo-clipboard": {
+      "optional": true
+    }
   }
 }

package/src/components/scroll-fade/index.tsx

@@ -0,0 +1,168 @@
+/**
+ * ScrollFade — fades the edges of a scroll container.
+ *
+ * The React Native equivalent of shadcn-ui/ui's `scroll-fade` utility
+ * (https://ui.shadcn.com/docs/utils/scroll-fade), which is CSS `mask-image`
+ * driven by a scroll timeline. React Native has neither masks nor scroll
+ * timelines, so the fades are SVG gradients overlaid on each edge, with their
+ * opacity following the scroll position.
+ *
+ * Composition follows heroui-native's ScrollShadow: wrap the scrollable and
+ * let the orientation be inferred from its `horizontal` prop.
+ *
+ * ```tsx
+ * <ScrollFade>
+ *   <ScrollView horizontal>…</ScrollView>
+ * </ScrollFade>
+ * ```
+ */
+import {
+  Children,
+  cloneElement,
+  isValidElement,
+  useState,
+  type ReactElement,
+  type ReactNode,
+} from 'react';
+import {
+  View,
+  type NativeScrollEvent,
+  type NativeSyntheticEvent,
+  type ViewProps,
+} from 'react-native';
+import Svg, { Defs, LinearGradient, Rect, Stop } from 'react-native-svg';
+import { useCSSVariable } from 'uniwind';
+
+/** Past this many pixels from an edge, that edge's fade is fully shown. */
+const FADE_IN_DISTANCE = 24;
+
+export interface ScrollFadeProps extends ViewProps {
+  className?: string;
+  /** Depth of the fade in pixels. */
+  size?: number;
+  /** Which edges fade. */
+  edges?: 'both' | 'start' | 'end';
+  /**
+   * Colour the fade resolves to — normally whatever sits behind the
+   * scrollable. Defaults to the theme's background.
+   */
+  color?: string;
+  children?: ReactNode;
+}
+
+interface ScrollableProps {
+  horizontal?: boolean;
+  onScroll?: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;
+  scrollEventThrottle?: number;
+}
+
+export function ScrollFade({
+  className,
+  size = 48,
+  edges = 'both',
+  color,
+  children,
+  ...props
+}: ScrollFadeProps) {
+  const [startOpacity, setStartOpacity] = useState(0);
+  const [endOpacity, setEndOpacity] = useState(0);
+
+  const themeBackground = useCSSVariable('--color-background');
+  const fadeColor =
+    color ?? (typeof themeBackground === 'string' ? themeBackground : '#000000');
+
+  const child = Children.only(children) as ReactElement<ScrollableProps>;
+  const horizontal = isValidElement(child) ? !!child.props.horizontal : false;
+
+  const handleScroll = (event: NativeSyntheticEvent<NativeScrollEvent>) => {
+    const { contentOffset, contentSize, layoutMeasurement } = event.nativeEvent;
+    const offset = horizontal ? contentOffset.x : contentOffset.y;
+    const total = horizontal ? contentSize.width : contentSize.height;
+    const visible = horizontal ? layoutMeasurement.width : layoutMeasurement.height;
+    const remaining = total - visible - offset;
+
+    // Each edge fades in over the first FADE_IN_DISTANCE px of travel, so an
+    // edge with nothing past it shows nothing.
+    setStartOpacity(Math.min(offset / FADE_IN_DISTANCE, 1));
+    setEndOpacity(Math.min(Math.max(remaining, 0) / FADE_IN_DISTANCE, 1));
+
+    child.props.onScroll?.(event);
+  };
+
+  const scrollable = isValidElement(child)
+    ? cloneElement(child, {
+        onScroll: handleScroll,
+        scrollEventThrottle: child.props.scrollEventThrottle ?? 16,
+      })
+    : child;
+
+  const showStart = edges !== 'end';
+  const showEnd = edges !== 'start';
+
+  return (
+    <View {...props} className={className}>
+      {scrollable}
+
+      {showStart ? (
+        <Fade
+          color={fadeColor}
+          size={size}
+          horizontal={horizontal}
+          opacity={startOpacity}
+          edge="start"
+        />
+      ) : null}
+      {showEnd ? (
+        <Fade
+          color={fadeColor}
+          size={size}
+          horizontal={horizontal}
+          opacity={endOpacity}
+          edge="end"
+        />
+      ) : null}
+    </View>
+  );
+}
+
+ScrollFade.displayName = 'ScrollFade';
+
+/** One edge's gradient, opaque at the edge and clear inwards. */
+function Fade({
+  color,
+  size,
+  horizontal,
+  opacity,
+  edge,
+}: {
+  color: string;
+  size: number;
+  horizontal: boolean;
+  opacity: number;
+  edge: 'start' | 'end';
+}) {
+  const isStart = edge === 'start';
+  const id = `scroll-fade-${edge}-${horizontal ? 'x' : 'y'}`;
+
+  const position = horizontal
+    ? { top: 0, bottom: 0, width: size, ...(isStart ? { left: 0 } : { right: 0 }) }
+    : { left: 0, right: 0, height: size, ...(isStart ? { top: 0 } : { bottom: 0 }) };
+
+  // The gradient runs from the screen edge inwards, so it is reversed on the
+  // end edge.
+  const [x2, y2] = horizontal ? [1, 0] : [0, 1];
+
+  return (
+    <View pointerEvents="none" style={{ position: 'absolute', opacity, ...position }}>
+      <Svg width="100%" height="100%">
+        <Defs>
+          <LinearGradient id={id} x1="0" y1="0" x2={String(x2)} y2={String(y2)}>
+            <Stop offset="0" stopColor={color} stopOpacity={isStart ? 1 : 0} />
+            <Stop offset="1" stopColor={color} stopOpacity={isStart ? 0 : 1} />
+          </LinearGradient>
+        </Defs>
+        <Rect x="0" y="0" width="100%" height="100%" fill={`url(#${id})`} />
+      </Svg>
+    </View>
+  );
+}