@platform-blocks/ui 0.3.1 → 0.4.0

package/lib/components/Accordion/hooks/useAccordionItemAnimation.d.ts

@@ -1,17 +1,15 @@
-import { View } from 'react-native';
+import type { AccordionAnimationProp } from '../types';
 export interface UseAccordionItemAnimationOptions {
     expanded: boolean;
-    animated: boolean | {
-        duration?: number;
-        easing?: (t: number) => number;
-    };
+    animated: AccordionAnimationProp;
+}
+export interface AccordionCollapseConfig {
+    shouldAnimate: boolean;
+    duration: number;
+    easing?: (t: number) => number;
 }
 export interface UseAccordionItemAnimationResult {
-    contentRef: React.RefObject<View | null>;
-    onContentLayout: (e: any) => void;
-    animatedHeightStyle: any;
     animatedChevronStyle: any;
-    isLayoutComplete: boolean;
-    contentHeight: number;
+    CollapseConfig: AccordionCollapseConfig;
 }
 export declare function useAccordionItemAnimation(opts: UseAccordionItemAnimationOptions): UseAccordionItemAnimationResult;

package/lib/components/Avatar/types.d.ts

@@ -2,14 +2,23 @@ import React from 'react';
 import { ViewStyle } from 'react-native';
 import type { ComponentSizeValue } from '../../core/theme/componentSize';
 export interface AvatarProps {
+    /** Size of the avatar */
     size?: ComponentSizeValue;
+    /** Image source URL for the avatar */
     src?: string;
+    /** Initials to show as fallback when no image is provided */
     fallback?: string;
+    /** Background color for the fallback initials */
     backgroundColor?: string;
+    /** Text color for the fallback initials */
     textColor?: string;
+    /** Whether to show online status indicator */
     online?: boolean;
+    /** Accessibility label for the avatar badge */
     badgeColor?: string;
+    /** Accessibility label for the avatar badge */
     style?: ViewStyle;
+    /** Accessibility label for the avatar image */
     accessibilityLabel?: string;
     /** Primary label displayed to the right of the avatar (string or custom React node) */
     label?: React.ReactNode;

package/lib/components/Calendar/types.d.ts

@@ -1,10 +1,11 @@
 import React from 'react';
 import { ViewStyle } from 'react-native';
 import { SizeValue } from '../../core/theme/types';
+import type { DisclaimerSupport } from '../_internal/Disclaimer';
 export type CalendarLevel = 'month' | 'year' | 'decade';
 export type CalendarType = 'single' | 'multiple' | 'range';
 export type CalendarValue = Date | Date[] | [Date | null, Date | null] | null;
-export interface CalendarProps {
+export interface CalendarProps extends DisclaimerSupport {
     level?: CalendarLevel;
     defaultLevel?: CalendarLevel;
     onLevelChange?: (level: CalendarLevel) => void;

package/lib/components/Can/types.d.ts

@@ -7,7 +7,9 @@ export type Action = string;
 /**
  * Subject type - can be string, class, or object
  */
-export type Subject = string | Function | object;
+type SubjectClass = abstract new (...args: any[]) => unknown;
+type SubjectObject = Record<string, unknown> | object;
+export type Subject = string | SubjectClass | SubjectObject;
 /**
  * Field within a subject
  */
@@ -89,13 +91,12 @@ export interface CanProps {
  */
 export interface CanWithConditionsProps extends Omit<CanProps, 'a'> {
     /** Subject instance with data for condition checking */
-    this: object;
+    this: Subject;
 }
 /**
  * Cannot component props (inverse of Can)
  */
-export interface CannotProps extends CanProps {
-}
+export type CannotProps = CanProps;
 /**
  * Permission gate props for route-level protection
  */
@@ -226,3 +227,4 @@ export interface PermissionRuleBuilder {
     /** Finish building this rule */
     build(): PermissionRule;
 }
+export {};

package/lib/components/CodeBlock/CodeBlock.d.ts

@@ -1,16 +1,4 @@
 import React from 'react';
 import type { CodeBlockProps } from './types';
-/**
- * CodeBlock component for displaying formatted code with syntax highlighting.
- *
- * @example
- * ```tsx
- * <CodeBlock title="React Component" language="tsx">
- *   {`const App = () => {
- *   return <Text>Hello World</Text>;
- * };`}
- * </CodeBlock>
- * ```
- */
 export declare const CodeBlock: React.FC<CodeBlockProps>;
 export default CodeBlock;

package/lib/components/CodeBlock/types.d.ts

@@ -1,6 +1,21 @@
 import React from 'react';
 import { ViewStyle, TextStyle } from 'react-native';
 import { SpacingProps } from '../../core/utils';
+export type CodeBlockToken = 'keyword' | 'string' | 'comment' | 'number' | 'function' | 'operator' | 'punctuation' | 'tag' | 'attribute' | 'className';
+export type CodeBlockTextPalette = string | string[] | Partial<Record<CodeBlockToken, string>>;
+export interface CodeBlockColorOverrides {
+    /** Background color (hex, rgb, or theme token like `primary.6`) */
+    background?: string;
+    /** Border/accent color (hex/rgb/theme token) */
+    border?: string;
+    /** Override text/token colors. Accepts a single color, an array, or a token map. */
+    text?: CodeBlockTextPalette;
+    /** Highlight colors for emphasized lines */
+    highlight?: {
+        background?: string;
+        accent?: string;
+    };
+}
 export interface CodeBlockProps extends SpacingProps {
     /** Optional language for syntax highlighting */
     language?: string;
@@ -41,4 +56,8 @@ export interface CodeBlockProps extends SpacingProps {
     githubUrl?: string;
     /** Force a distinct file header bar (even without title) showing the filename */
     fileHeader?: boolean;
+    /** Override base colors (background, text, highlights) */
+    colors?: CodeBlockColorOverrides;
+    /** Control whether long lines wrap (defaults to true). Set to false to enable horizontal scrolling instead. */
+    wrap?: boolean;
 }

package/lib/components/CodeBlock/utils.d.ts

@@ -1,4 +1,5 @@
 import type { PlatformBlocksTheme } from '../../core/theme/types';
+import type { CodeBlockToken } from './types';
 /**
  * Normalizes language identifiers to standard values for syntax highlighting
  */
@@ -10,18 +11,8 @@ export declare function parseHighlightLines(specs: string[] | undefined, total:
 /**
  * Color schemes for different code block variants
  */
-export declare function getSyntaxColors(theme: PlatformBlocksTheme, isDark: boolean, variant?: 'code' | 'terminal' | 'hacker'): {
-    keyword: string;
-    string: string;
-    comment: string;
-    number: string;
-    function: string;
-    operator: string;
-    punctuation: string;
-    tag: string;
-    attribute: string;
-    className: string;
-};
+export type SyntaxColorMap = Record<CodeBlockToken, string>;
+export declare function getSyntaxColors(theme: PlatformBlocksTheme, isDark: boolean, variant?: 'code' | 'terminal' | 'hacker', overrides?: Partial<Record<CodeBlockToken, string>>): SyntaxColorMap;
 /**
  * Regex patterns for syntax highlighting
  */
@@ -32,7 +23,7 @@ export declare function getSyntaxPatterns(colors: ReturnType<typeof getSyntaxCol
 /**
  * Creates a simple syntax highlighter for React Native that returns colored tokens
  */
-export declare function createNativeHighlighter(theme: PlatformBlocksTheme, isDark: boolean, variant?: 'code' | 'terminal' | 'hacker'): (code: string) => Array<Array<{
+export declare function createNativeHighlighter(theme: PlatformBlocksTheme, isDark: boolean, variant?: 'code' | 'terminal' | 'hacker', overrides?: Partial<Record<CodeBlockToken, string>>): (code: string) => Array<Array<{
     text: string;
     color: string;
 }>>;

package/lib/components/Collapse/Collapse.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import type { CollapseProps } from './types';
+declare const Collapse: React.FC<CollapseProps>;
+export default Collapse;

package/lib/components/Collapse/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Collapse } from './Collapse';
+export type { CollapseProps } from './types';

package/lib/components/{Reveal → Collapse}/types.d.ts

@@ -1,10 +1,10 @@
 import type { ReactNode } from 'react';
-import type { ViewStyle } from 'react-native';
-export interface RevealProps {
+import type { StyleProp, ViewStyle } from 'react-native';
+export interface CollapseProps {
     /**
      * Whether the content is revealed/expanded
      */
-    isRevealed: boolean;
+    isCollapsed: boolean;
     /**
      * Content to show/hide
      */
@@ -22,11 +22,11 @@ export interface RevealProps {
     /**
      * Style for the container
      */
-    style?: ViewStyle;
+    style?: StyleProp<ViewStyle>;
     /**
      * Style for the content wrapper
      */
-    contentStyle?: ViewStyle;
+    contentStyle?: StyleProp<ViewStyle>;
     /**
      * Callback fired when animation starts
      */
@@ -35,6 +35,10 @@ export interface RevealProps {
      * Callback fired when animation completes
      */
     onAnimationEnd?: () => void;
+    /**
+     * Custom easing function overriding the timing preset
+     */
+    easing?: (value: number) => number;
     /**
      * Whether to animate on initial mount
      * @default false

package/lib/components/ColorPicker/styles.d.ts

@@ -21,6 +21,7 @@ export declare function useColorPickerStyles(metrics: ColorPickerSizeMetrics): {
     inputFocused: ViewStyle;
     inputDisabled: ViewStyle;
     inputError: ViewStyle;
+    previewWrapper: ViewStyle;
     preview: ViewStyle;
     textInput: TextStyle;
     dropdownIcon: TextStyle;

package/lib/components/GradientText/GradientText.d.ts

@@ -5,7 +5,7 @@ import { GradientTextProps } from './types';
  * GradientText Component
  *
  * Renders text with a gradient color effect using linear gradients.
- * Supports animated gradients that can move from left to right.
+ * Displays text using a linear gradient fill across the glyphs.
  *
  * **Note**: For native platforms (iOS/Android), gradient animation is currently
  * supported on web only. Native platforms show static gradients.
@@ -17,15 +17,6 @@ import { GradientTextProps } from './types';
  *   Hello World
  * </GradientText>
  *
- * // Animated gradient (web only)
- * <GradientText
- *   colors={['#FF0080', '#7928CA', '#4F46E5']}
- *   animate
- *   animationDuration={3000}
- * >
- *   Animated Text
- * </GradientText>
- *
  * // Custom gradient direction
  * <GradientText
  *   colors={['red', 'blue']}

package/lib/components/GradientText/types.d.ts

@@ -10,16 +10,8 @@ export interface GradientTextProps extends Omit<TextProps, 'color' | 'colorVaria
     start?: [number, number];
     /** End point [x, y] (0-1). Overrides angle if provided */
     end?: [number, number];
-    /** Gradient position offset (0-1). Animates the gradient from start to end of the line */
+    /** Gradient position offset (0-1). Moves the gradient along the line */
     position?: number;
-    /** Whether to animate the gradient position automatically */
-    animate?: boolean;
-    /** Animation duration in milliseconds (default: 2000) */
-    animationDuration?: number;
-    /** Animation loop behavior: 'loop', 'reverse', or 'once' (default: 'loop') */
-    animationLoop?: 'loop' | 'reverse' | 'once';
-    /** Delay before animation starts in milliseconds (default: 0) */
-    animationDelay?: number;
     /** Custom testID for testing */
     testID?: string;
 }

package/lib/components/Input/styles.d.ts

@@ -35,7 +35,7 @@ export declare const createInputStyles: (theme: PlatformBlocksTheme, isRTL?: boo
             fontWeight: "600";
             marginBottom: number;
         };
-        leftSection: {
+        startSection: {
             paddingLeft: number;
         } | {
             paddingRight: number;
@@ -43,7 +43,7 @@ export declare const createInputStyles: (theme: PlatformBlocksTheme, isRTL?: boo
         required: {
             color: string;
         };
-        rightSection: {
+        endSection: {
             alignItems: "center";
             flexDirection: "row";
             paddingRight: number;

package/lib/components/Input/types.d.ts

@@ -4,6 +4,7 @@ import { SpacingProps } from '../../core/theme/types';
 import { LayoutProps } from '../../core/utils';
 import { BorderRadiusProps } from '../../core/theme/radius';
 import { SizeValue } from '../../core/theme/types';
+import type { DisclaimerSupport } from '../_internal/Disclaimer';
 export interface ValidationRule {
     type: 'required' | 'minLength' | 'maxLength' | 'pattern' | 'custom' | 'passwordStrength';
     value?: any;
@@ -20,7 +21,7 @@ export interface PasswordStrengthRule extends Omit<ValidationRule, 'type'> {
         requireSymbols?: boolean;
     };
 }
-export interface BaseInputProps extends SpacingProps, LayoutProps, BorderRadiusProps {
+export interface BaseInputProps extends SpacingProps, LayoutProps, BorderRadiusProps, DisclaimerSupport {
     /** Input value */
     value?: string;
     /** Change handler */
@@ -46,9 +47,9 @@ export interface BaseInputProps extends SpacingProps, LayoutProps, BorderRadiusP
     /** Input name for form integration */
     name?: string;
     /** Left section content */
-    leftSection?: React.ReactNode;
+    startSection?: React.ReactNode;
     /** Right section content */
-    rightSection?: React.ReactNode;
+    endSection?: React.ReactNode;
     /** Additional styling */
     style?: any;
     /** Accessibility label */

package/lib/components/Knob/Knob.d.ts

@@ -1,6 +1,25 @@
-import { View } from 'react-native';
-import type { KnobProps } from './types';
-export declare const Knob: import("../../core/factory").PlatformBlocksComponent<{
+import React from 'react';
+import type { View } from 'react-native';
+import type { KnobProps, KnobAppearance, KnobRootProps, KnobFillPartProps, KnobRingPartProps, KnobProgressPartProps, KnobTickLayerPartProps, KnobPointerPartProps, KnobThumbPartProps, KnobValueLabelPartProps, KnobPartEntry } from './types';
+declare const KnobBase: import("../../core/factory").PlatformBlocksComponent<{
     props: KnobProps;
     ref: View;
 }>;
+type PartEntry = KnobPartEntry;
+type KnobCompoundComponent = typeof KnobBase & {
+    Root: React.FC<KnobRootProps>;
+    Fill: React.FC<KnobFillPartProps>;
+    Ring: React.FC<KnobRingPartProps>;
+    Progress: React.FC<KnobProgressPartProps>;
+    TickLayer: React.FC<KnobTickLayerPartProps>;
+    Pointer: React.FC<KnobPointerPartProps>;
+    Thumb: React.FC<KnobThumbPartProps>;
+    ValueLabel: React.FC<KnobValueLabelPartProps>;
+};
+export declare const Knob: KnobCompoundComponent;
+export declare const __KnobInternals: {
+    buildAppearanceFromParts: (baseAppearance: KnobAppearance | undefined, parts: PartEntry[]) => KnobAppearance | undefined;
+    buildValueLabelFromParts: (baseValueLabel: KnobProps["valueLabel"], parts: PartEntry[]) => KnobProps["valueLabel"];
+    getGestureDegreeSpan: (isEndless: boolean, sweepAngle: number) => number;
+};
+export type { KnobPartEntry } from './types';

package/lib/components/Knob/appearance.d.ts

@@ -0,0 +1,56 @@
+import type { PlatformBlocksTheme } from '../../core/theme/types';
+import type { KnobAppearance, KnobRingShadow, KnobPointerStyle, KnobTickLayer, KnobThumbShape, KnobThumbStyle, KnobVariant, KnobPanningConfig } from './types';
+export type ResolvedRingStyle = {
+    thickness: number;
+    color: string;
+    trailColor: string;
+    backgroundColor: string;
+    cap: 'butt' | 'round';
+    radiusOffset: number;
+    shadow?: KnobRingShadow;
+};
+export type ResolvedFillStyle = {
+    color: string;
+    borderWidth: number;
+    borderColor: string;
+    radiusOffset: number;
+};
+export type ResolvedThumbStyle = {
+    size: number;
+    color: string;
+    shape: KnobThumbShape;
+    strokeWidth: number;
+    strokeColor: string;
+    offset: number;
+    glow?: KnobThumbStyle['glow'];
+    style?: KnobThumbStyle['style'];
+    renderThumb?: KnobThumbStyle['renderThumb'];
+};
+export type ResolvedProgressStyle = {
+    mode: 'none' | 'contiguous' | 'split';
+    color: string;
+    trailColor: string;
+    roundedCaps: boolean;
+    thickness: number;
+};
+export type ResolvedKnobAppearance = {
+    ring: ResolvedRingStyle;
+    fill: ResolvedFillStyle | null;
+    thumb: ResolvedThumbStyle | null;
+    progress: ResolvedProgressStyle | null;
+    pointer: (KnobPointerStyle & {
+        visible: boolean;
+    }) | null;
+    ticks: KnobTickLayer[];
+    panning: KnobPanningConfig | null;
+};
+export interface ResolveAppearanceOptions {
+    appearance?: KnobAppearance;
+    theme: PlatformBlocksTheme;
+    variant: KnobVariant;
+    disabled: boolean;
+    size: number;
+    thumbSize?: number;
+    accentColor?: string;
+}
+export declare const resolveKnobAppearance: ({ appearance, theme, variant, disabled, size, thumbSize, accentColor, }: ResolveAppearanceOptions) => ResolvedKnobAppearance;

package/lib/components/Knob/arc.d.ts

@@ -0,0 +1,21 @@
+import type { KnobArcConfig } from './types';
+export type NormalizedArcConfig = {
+    startAngle: number;
+    sweepAngle: number;
+    direction: 'cw' | 'ccw';
+    clampInput: boolean;
+    wrap: boolean;
+};
+export declare const normalizeDegrees: (deg: number) => number;
+export declare const normalizeArcConfig: (arc?: KnobArcConfig, options?: {
+    isEndless?: boolean;
+}) => NormalizedArcConfig;
+export declare const getArcAngleFromRatio: (arc: NormalizedArcConfig, ratio: number) => number;
+export declare const getArcRatioFromAngle: (arc: NormalizedArcConfig, angle: number, options?: {
+    clamp?: boolean;
+}) => number;
+export declare const buildArcPathBetweenAngles: (cx: number, cy: number, radius: number, startAngle: number, endAngle: number) => string;
+export declare const buildArcPathForSweep: (arc: NormalizedArcConfig, radius: number, ratio: number, center: {
+    cx: number;
+    cy: number;
+}) => string;

package/lib/components/Knob/components/KnobSurface.d.ts

@@ -0,0 +1,30 @@
+import React from 'react';
+import { View, ViewProps, PanResponderInstance, LayoutChangeEvent } from 'react-native';
+import { type SurfaceLayersProps } from './SurfaceLayers';
+import { type TickLayersProps } from './TickLayers';
+import { type PointerLayerProps } from './PointerLayer';
+import { type ThumbLayerProps } from './ThumbLayer';
+/**
+ * Encapsulates the interactive host view for the Knob plus its visual layers so the
+ * root component can stay focused on state/logic.
+ */
+export type KnobSurfaceProps = Omit<ViewProps, 'onLayout' | 'children'> & {
+    size: number;
+    disabled: boolean;
+    trackColor: string;
+    accessibilityLabel?: string;
+    accessibilityMin: number;
+    accessibilityMax: number;
+    accessibilityNow: number;
+    setHostRef: (node: View | null) => void;
+    panHandlers?: PanResponderInstance['panHandlers'];
+    handleLayout?: (event: LayoutChangeEvent) => void;
+    keyboardHandlers?: Partial<ViewProps>;
+    surfaceLayersProps: SurfaceLayersProps;
+    tickLayersProps: TickLayersProps;
+    pointerLayerProps: PointerLayerProps;
+    thumbLayerProps: ThumbLayerProps;
+    centerSlot?: React.ReactNode;
+    onLayout?: ViewProps['onLayout'];
+};
+export declare const KnobSurface: React.FC<KnobSurfaceProps>;

package/lib/components/Knob/components/PointerLayer.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import type { KnobPointerStyle } from '../types';
+import type { LayoutState } from '../hooks/useKnobGeometry';
+export type PointerLayerProps = {
+    pointerConfig?: KnobPointerStyle | false | null;
+    labelColor: string;
+    displayAngle: number;
+    layoutState: LayoutState;
+    size: number;
+    thumbSize: number;
+    ringRadius: number;
+};
+export declare const PointerLayer: React.FC<PointerLayerProps>;

package/lib/components/Knob/components/SurfaceLayers.d.ts

@@ -0,0 +1,38 @@
+import React from 'react';
+import { ViewStyle } from 'react-native';
+import type { KnobFillStyle } from '../types';
+import type { LayoutState } from '../hooks/useKnobGeometry';
+export type SurfaceLayersProps = {
+    layoutState: LayoutState;
+    fillConfig?: KnobFillStyle | null;
+    fillRadius: number;
+    fillDiameter: number;
+    ringBaseDiameter: number;
+    ringSvgCenter: number;
+    ringBackgroundColor?: string;
+    ringBaseStroke: string;
+    ringPath: string;
+    ringThickness: number;
+    ringCap: 'butt' | 'round';
+    ringShadowStyle: ViewStyle | null;
+    trackStyle?: ViewStyle;
+    showContiguousProgress: boolean;
+    progressPath: string;
+    progressStrokeColor: string;
+    progressThickness: number;
+    progressStrokeCap: 'butt' | 'round';
+    showSplitProgress: boolean;
+    splitPositivePath?: string;
+    splitNegativePath?: string;
+    splitPositiveColor: string;
+    splitNegativeColor: string;
+    showZeroIndicator: boolean;
+    zeroIndicatorPoints?: {
+        x1: number;
+        y1: number;
+        x2: number;
+        y2: number;
+    } | null;
+    zeroIndicatorColor: string;
+};
+export declare const SurfaceLayers: React.FC<SurfaceLayersProps>;

package/lib/components/Knob/components/ThumbLayer.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+import type { KnobAppearance } from '../types';
+export type ThumbLayerProps = {
+    thumbConfig?: KnobAppearance['thumb'] | null;
+    thumbSize: number;
+    thumbColor: string;
+    disabled: boolean;
+    thumbAnimatedStyle: StyleProp<ViewStyle>;
+    thumbStyle?: ViewStyle;
+    displayValue: number;
+    displayAngle: number;
+};
+export declare const ThumbLayer: React.FC<ThumbLayerProps>;

package/lib/components/Knob/components/TickLayers.d.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import type { TextStyle } from 'react-native';
+import type { KnobAppearance, KnobMark } from '../types';
+import type { LayoutState } from '../hooks/useKnobGeometry';
+export type TickLayersProps = {
+    appearanceTicks?: KnobAppearance['ticks'];
+    marksNormalized: KnobMark[];
+    min: number;
+    max: number;
+    step: number;
+    isEndless: boolean;
+    valueToAngle: (value: number) => number;
+    layoutState: LayoutState;
+    ringRadius: number;
+    ringThickness: number;
+    theme: any;
+    boundedRatio: number;
+    size: number;
+    thumbSize: number;
+    resolvedVariant: string;
+    displayValue: number;
+    activeMark?: KnobMark | null;
+    disabled: boolean;
+    markLabelStyle?: TextStyle;
+    labelColor: string;
+};
+export declare const TickLayers: React.FC<TickLayersProps>;

package/lib/components/Knob/components/ValueLabelLayout.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { ViewStyle } from 'react-native';
+import type { SpacingProps, LayoutProps } from '../../../core/utils';
+import type { KnobProps, KnobValueLabelPosition } from '../types';
+import type { ValueLabelSlots } from '../hooks/useKnobValueLabels';
+export type ValueLabelLayoutProps = {
+    knobElement: React.ReactNode;
+    valueLabelSlots: ValueLabelSlots;
+    spacingStyles?: ViewStyle;
+    layoutStyles?: ViewStyle;
+    spacingProps: SpacingProps;
+    layoutProps: LayoutProps;
+    hasLabelContent: boolean;
+    label?: KnobProps['label'];
+    description?: KnobProps['description'];
+    labelPosition: KnobValueLabelPosition;
+};
+export declare const ValueLabelLayout: React.FC<ValueLabelLayoutProps>;

package/lib/components/Knob/hooks/useKnobGeometry.d.ts

@@ -0,0 +1,16 @@
+import type { LayoutChangeEvent } from 'react-native';
+export type LayoutState = {
+    width: number;
+    height: number;
+    cx: number;
+    cy: number;
+    radius: number;
+};
+export declare const useKnobGeometry: (size: number) => {
+    layoutState: LayoutState;
+    handleLayout: (event: LayoutChangeEvent) => void;
+    centerX: import("react-native-reanimated").SharedValue<number>;
+    centerY: import("react-native-reanimated").SharedValue<number>;
+    radiusValue: import("react-native-reanimated").SharedValue<number>;
+    angle: import("react-native-reanimated").SharedValue<number>;
+};

package/lib/components/Knob/hooks/useKnobGestures.d.ts

@@ -0,0 +1,28 @@
+import { MutableRefObject } from 'react';
+import { type View } from 'react-native';
+import { type NormalizedArcConfig } from '../arc';
+import type { NormalizedInteractionConfig } from '../interactionConfig';
+import type { LayoutState } from './useKnobGeometry';
+export type UseKnobGesturesParams = {
+    disabled: boolean;
+    readOnly: boolean;
+    interactionConfig: NormalizedInteractionConfig;
+    isEndless: boolean;
+    min: number;
+    max: number;
+    arcConfig: NormalizedArcConfig;
+    gestureDegreeSpan: number;
+    layoutState: LayoutState;
+    handleValueUpdate: (value: number, final: boolean) => void;
+    onScrubStart?: () => void;
+    onScrubEnd?: () => void;
+    onChangeEnd?: (value: number) => void;
+    valueRef: MutableRefObject<number>;
+    hostRef: MutableRefObject<View | null>;
+    degreesToValueDelta: (degrees: number) => number;
+    valueToAngle: (value: number) => number;
+    isRTL: boolean;
+};
+export declare const useKnobGestures: ({ disabled, readOnly, interactionConfig, isEndless, min, max, arcConfig, gestureDegreeSpan, layoutState, handleValueUpdate, onScrubStart, onScrubEnd, onChangeEnd, valueRef, hostRef, degreesToValueDelta, valueToAngle, isRTL, }: UseKnobGesturesParams) => {
+    panHandlers: import("react-native").GestureResponderHandlers;
+};