@tamagui/slider 1.0.1-beta.100

package/src/constants.tsx

@@ -0,0 +1,32 @@
+import { SizeTokens } from '@tamagui/core'
+import { createContextScope } from '@tamagui/create-context'
+
+import { Direction, SliderContextValue } from './types'
+
+export const SLIDER_NAME = 'Slider'
+
+export const [createSliderContext, createSliderScope] = createContextScope(SLIDER_NAME)
+
+export const [SliderProvider, useSliderContext] =
+  createSliderContext<SliderContextValue>(SLIDER_NAME)
+
+export const [SliderOrientationProvider, useSliderOrientationContext] = createSliderContext<{
+  startEdge: 'bottom' | 'left' | 'right'
+  endEdge: 'top' | 'right' | 'left'
+  sizeProp: 'width' | 'height'
+  size: number | SizeTokens
+  direction: number
+}>(SLIDER_NAME, {
+  startEdge: 'left',
+  endEdge: 'right',
+  sizeProp: 'width',
+  size: 0,
+  direction: 1,
+})
+
+export const PAGE_KEYS = ['PageUp', 'PageDown']
+export const ARROW_KEYS = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight']
+export const BACK_KEYS: Record<Direction, string[]> = {
+  ltr: ['ArrowDown', 'Home', 'ArrowLeft', 'PageDown'],
+  rtl: ['ArrowDown', 'Home', 'ArrowRight', 'PageDown'],
+}

package/src/helpers.tsx

@@ -0,0 +1,100 @@
+export function getNextSortedValues(prevValues: number[] = [], nextValue: number, atIndex: number) {
+  const nextValues = [...prevValues]
+  nextValues[atIndex] = nextValue
+  return nextValues.sort((a, b) => a - b)
+}
+
+export function convertValueToPercentage(value: number, min: number, max: number) {
+  const maxSteps = max - min
+  const percentPerStep = 100 / maxSteps
+  return percentPerStep * (value - min)
+}
+
+/**
+ * Returns a label for each thumb when there are two or more thumbs
+ */
+export function getLabel(index: number, totalValues: number) {
+  if (totalValues > 2) {
+    return `Value ${index + 1} of ${totalValues}`
+  } else if (totalValues === 2) {
+    return ['Minimum', 'Maximum'][index]
+  } else {
+    return undefined
+  }
+}
+
+/**
+ * Given a `values` array and a `nextValue`, determine which value in
+ * the array is closest to `nextValue` and return its index.
+ *
+ * @example
+ * // returns 1
+ * getClosestValueIndex([10, 30], 25);
+ */
+export function getClosestValueIndex(values: number[], nextValue: number) {
+  if (values.length === 1) return 0
+  const distances = values.map((value) => Math.abs(value - nextValue))
+  const closestDistance = Math.min(...distances)
+  return distances.indexOf(closestDistance)
+}
+
+/**
+ * Offsets the thumb centre point while sliding to ensure it remains
+ * within the bounds of the slider when reaching the edges
+ */
+export function getThumbInBoundsOffset(width: number, left: number, direction: number) {
+  const halfWidth = width / 2
+  const halfPercent = 50
+  const offset = linearScale([0, halfPercent], [0, halfWidth])
+  return (halfWidth - offset(left) * direction) * direction
+}
+
+/**
+ * Gets an array of steps between each value.
+ *
+ * @example
+ * // returns [1, 9]
+ * getStepsBetweenValues([10, 11, 20]);
+ */
+function getStepsBetweenValues(values: number[]) {
+  return values.slice(0, -1).map((value, index) => values[index + 1] - value)
+}
+
+/**
+ * Verifies the minimum steps between all values is greater than or equal
+ * to the expected minimum steps.
+ *
+ * @example
+ * // returns false
+ * hasMinStepsBetweenValues([1,2,3], 2);
+ *
+ * @example
+ * // returns true
+ * hasMinStepsBetweenValues([1,2,3], 1);
+ */
+export function hasMinStepsBetweenValues(values: number[], minStepsBetweenValues: number) {
+  if (minStepsBetweenValues > 0) {
+    const stepsBetweenValues = getStepsBetweenValues(values)
+    const actualMinStepsBetweenValues = Math.min(...stepsBetweenValues)
+    return actualMinStepsBetweenValues >= minStepsBetweenValues
+  }
+  return true
+}
+
+// https://github.com/tmcw-up-for-adoption/simple-linear-scale/blob/master/index.js
+export function linearScale(input: readonly [number, number], output: readonly [number, number]) {
+  return (value: number) => {
+    if (input[0] === input[1] || output[0] === output[1]) return output[0]
+    const ratio = (output[1] - output[0]) / (input[1] - input[0])
+    return output[0] + ratio * (value - input[0])
+  }
+}
+
+export function getDecimalCount(value: number) {
+  return (String(value).split('.')[1] || '').length
+}
+
+export function roundValue(value: number, decimalCount: number) {
+  const rounder = Math.pow(10, decimalCount)
+  return Math.round(value * rounder) / rounder
+}

package/src/index.ts

@@ -0,0 +1,9 @@
+export * from './Slider'
+// for static extract to find, must export
+export { SliderFrame, DirectionalYStack } from './SliderImpl'
+export type {
+  SliderProps,
+  SliderHorizontalProps,
+  SliderVerticalProps,
+  SliderTrackProps,
+} from './types'

package/src/types.ts

@@ -0,0 +1,75 @@
+import type { GestureReponderEvent, SizeTokens } from '@tamagui/core'
+import type { Scope } from '@tamagui/create-context'
+import type { SizableStackProps } from '@tamagui/stacks'
+
+export type ScopedProps<P> = P & { __scopeSlider?: Scope }
+
+export type Direction = 'ltr' | 'rtl'
+
+type SliderImplPrivateProps = {
+  onSlideStart(event: GestureReponderEvent, target: 'thumb' | 'track'): void
+  onSlideMove(event: GestureReponderEvent): void
+  onSlideEnd(event: GestureReponderEvent): void
+  onHomeKeyDown(event: React.KeyboardEvent): void
+  onEndKeyDown(event: React.KeyboardEvent): void
+  onStepKeyDown(event: React.KeyboardEvent): void
+}
+
+export interface SliderTrackProps extends SizableStackProps {}
+
+export interface SliderImplProps extends SliderTrackProps, SliderImplPrivateProps {
+  dir?: Direction
+  orientation: 'horizontal' | 'vertical'
+}
+
+type SliderOrientationPrivateProps = {
+  min: number
+  max: number
+  onSlideStart?(value: number, target: 'thumb' | 'track'): void
+  onSlideMove?(value: number): void
+  onHomeKeyDown(event: React.KeyboardEvent): void
+  onEndKeyDown(event: React.KeyboardEvent): void
+  onStepKeyDown(step: { event: React.KeyboardEvent; direction: number }): void
+}
+
+interface SliderOrientationProps
+  extends Omit<SliderImplProps, keyof SliderImplPrivateProps | 'orientation'>,
+    SliderOrientationPrivateProps {}
+
+export interface SliderHorizontalProps extends SliderOrientationProps {
+  dir?: Direction
+}
+
+export interface SliderVerticalProps extends SliderOrientationProps {
+  dir?: Direction
+}
+
+export interface SliderProps
+  extends Omit<
+    SliderHorizontalProps | SliderVerticalProps,
+    keyof SliderOrientationPrivateProps | 'defaultValue'
+  > {
+  size?: SizeTokens
+  name?: string
+  disabled?: boolean
+  orientation?: React.AriaAttributes['aria-orientation']
+  dir?: Direction
+  min?: number
+  max?: number
+  step?: number
+  minStepsBetweenThumbs?: number
+  value?: number[]
+  defaultValue?: number[]
+  onValueChange?(value: number[]): void
+}
+
+export type SliderContextValue = {
+  size?: SizeTokens | number | null
+  disabled?: boolean
+  min: number
+  max: number
+  values: number[]
+  valueIndexToChangeRef: React.MutableRefObject<number>
+  thumbs: Set<any>
+  orientation: SliderProps['orientation']
+}

package/types/Slider.d.ts

@@ -0,0 +1,357 @@
+import { GetProps, SizeTokens } from '@tamagui/core';
+import { SizableStackProps } from '@tamagui/stacks';
+import * as React from 'react';
+import { View } from 'react-native';
+import { SliderProps, SliderTrackProps } from './types';
+declare type SliderTrackElement = HTMLElement | View;
+export declare const SliderTrackFrame: import("@tamagui/core").TamaguiComponent<(Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}, "size"> & {
+    size?: any;
+} & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}, "size"> & {
+    size?: any;
+}>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}, "size"> & {
+    size?: any;
+}>>) | (Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+} & {
+    size?: any;
+}, string | number> & {
+    [x: string]: undefined;
+} & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+} & {
+    size?: any;
+}, string | number> & {
+    [x: string]: undefined;
+}>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+} & {
+    size?: any;
+}, string | number> & {
+    [x: string]: undefined;
+}>>), any, import("@tamagui/core").StackPropsBase, {
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+} & {
+    size?: any;
+} & ({} | {
+    [x: string]: undefined;
+})>;
+declare const SliderTrack: React.ForwardRefExoticComponent<SliderTrackProps & React.RefAttributes<SliderTrackElement>>;
+export declare const SliderTrackActiveFrame: import("@tamagui/core").TamaguiComponent<(Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}, "size"> & {
+    size?: any;
+} & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}, "size"> & {
+    size?: any;
+}>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}, "size"> & {
+    size?: any;
+}>>) | (Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+} & {
+    size?: any;
+}, string | number> & {
+    [x: string]: undefined;
+} & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+} & {
+    size?: any;
+}, string | number> & {
+    [x: string]: undefined;
+}>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+} & {
+    size?: any;
+}, string | number> & {
+    [x: string]: undefined;
+}>>), any, import("@tamagui/core").StackPropsBase, {
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+} & {
+    size?: any;
+} & ({} | {
+    [x: string]: undefined;
+})>;
+declare type SliderTrackActiveProps = GetProps<typeof SliderTrackActiveFrame>;
+declare const SliderTrackActive: React.ForwardRefExoticComponent<((Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}, "size"> & {
+    size?: any;
+} & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}, "size"> & {
+    size?: any;
+}>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}, "size"> & {
+    size?: any;
+}>>) | Pick<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+} & {
+    size?: any;
+}, string | number> & {
+    [x: string]: undefined;
+} & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+} & {
+    size?: any;
+}, string | number> & {
+    [x: string]: undefined;
+}>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+} & {
+    size?: any;
+}, string | number> & {
+    [x: string]: undefined;
+}>>, string | number>) & React.RefAttributes<View>>;
+export declare const SliderThumbFrame: import("@tamagui/core").TamaguiComponent<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    fontFamily?: unknown;
+    backgrounded?: boolean | undefined;
+    radiused?: boolean | undefined;
+    hoverTheme?: boolean | undefined;
+    pressTheme?: boolean | undefined;
+    focusTheme?: boolean | undefined;
+    circular?: boolean | undefined;
+    padded?: boolean | undefined;
+    elevate?: boolean | undefined;
+    bordered?: number | boolean | undefined;
+    transparent?: boolean | undefined;
+    chromeless?: boolean | undefined;
+}, "size"> & {
+    size?: SizeTokens | undefined;
+} & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    fontFamily?: unknown;
+    backgrounded?: boolean | undefined;
+    radiused?: boolean | undefined;
+    hoverTheme?: boolean | undefined;
+    pressTheme?: boolean | undefined;
+    focusTheme?: boolean | undefined;
+    circular?: boolean | undefined;
+    padded?: boolean | undefined;
+    elevate?: boolean | undefined;
+    bordered?: number | boolean | undefined;
+    transparent?: boolean | undefined;
+    chromeless?: boolean | undefined;
+}, "size"> & {
+    size?: SizeTokens | undefined;
+}>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    fontFamily?: unknown;
+    backgrounded?: boolean | undefined;
+    radiused?: boolean | undefined;
+    hoverTheme?: boolean | undefined;
+    pressTheme?: boolean | undefined;
+    focusTheme?: boolean | undefined;
+    circular?: boolean | undefined;
+    padded?: boolean | undefined;
+    elevate?: boolean | undefined;
+    bordered?: number | boolean | undefined;
+    transparent?: boolean | undefined;
+    chromeless?: boolean | undefined;
+}, "size"> & {
+    size?: SizeTokens | undefined;
+}>>, any, import("@tamagui/core").StackPropsBase, {
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    fontFamily?: unknown;
+    backgrounded?: boolean | undefined;
+    radiused?: boolean | undefined;
+    hoverTheme?: boolean | undefined;
+    pressTheme?: boolean | undefined;
+    focusTheme?: boolean | undefined;
+    circular?: boolean | undefined;
+    padded?: boolean | undefined;
+    elevate?: boolean | undefined;
+    bordered?: number | boolean | undefined;
+    transparent?: boolean | undefined;
+    chromeless?: boolean | undefined;
+} & {
+    size?: SizeTokens | undefined;
+}>;
+interface SliderThumbProps extends SizableStackProps {
+    index: number;
+}
+declare const SliderThumb: React.ForwardRefExoticComponent<SliderThumbProps & React.RefAttributes<View>>;
+declare const Slider: React.ForwardRefExoticComponent<SliderProps & React.RefAttributes<View>> & {
+    Track: React.ForwardRefExoticComponent<SliderTrackProps & React.RefAttributes<SliderTrackElement>>;
+    TrackActive: React.ForwardRefExoticComponent<((Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+        readonly fullscreen?: boolean | undefined;
+        readonly elevation?: SizeTokens | undefined;
+    } & {
+        orientation?: "horizontal" | "vertical" | undefined;
+    }, "size"> & {
+        size?: any;
+    } & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+        readonly fullscreen?: boolean | undefined;
+        readonly elevation?: SizeTokens | undefined;
+    } & {
+        orientation?: "horizontal" | "vertical" | undefined;
+    }, "size"> & {
+        size?: any;
+    }>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+        readonly fullscreen?: boolean | undefined;
+        readonly elevation?: SizeTokens | undefined;
+    } & {
+        orientation?: "horizontal" | "vertical" | undefined;
+    }, "size"> & {
+        size?: any;
+    }>>) | Pick<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+        readonly fullscreen?: boolean | undefined;
+        readonly elevation?: SizeTokens | undefined;
+    } & {
+        orientation?: "horizontal" | "vertical" | undefined;
+    } & {
+        size?: any;
+    }, string | number> & {
+        [x: string]: undefined;
+    } & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+        readonly fullscreen?: boolean | undefined;
+        readonly elevation?: SizeTokens | undefined;
+    } & {
+        orientation?: "horizontal" | "vertical" | undefined;
+    } & {
+        size?: any;
+    }, string | number> & {
+        [x: string]: undefined;
+    }>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+        readonly fullscreen?: boolean | undefined;
+        readonly elevation?: SizeTokens | undefined;
+    } & {
+        orientation?: "horizontal" | "vertical" | undefined;
+    } & {
+        size?: any;
+    }, string | number> & {
+        [x: string]: undefined;
+    }>>, string | number>) & React.RefAttributes<View>>;
+    Thumb: React.ForwardRefExoticComponent<SliderThumbProps & React.RefAttributes<View>>;
+};
+declare const Track: React.ForwardRefExoticComponent<SliderTrackProps & React.RefAttributes<SliderTrackElement>>;
+declare const Range: React.ForwardRefExoticComponent<((Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}, "size"> & {
+    size?: any;
+} & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}, "size"> & {
+    size?: any;
+}>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}, "size"> & {
+    size?: any;
+}>>) | Pick<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+} & {
+    size?: any;
+}, string | number> & {
+    [x: string]: undefined;
+} & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+} & {
+    size?: any;
+}, string | number> & {
+    [x: string]: undefined;
+}>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+} & {
+    size?: any;
+}, string | number> & {
+    [x: string]: undefined;
+}>>, string | number>) & React.RefAttributes<View>>;
+declare const Thumb: React.ForwardRefExoticComponent<SliderThumbProps & React.RefAttributes<View>>;
+export { Slider, SliderTrack, SliderTrackActive, SliderThumb, Track, Range, Thumb, };
+export type { SliderProps, SliderTrackProps, SliderTrackActiveProps, SliderThumbProps };
+//# sourceMappingURL=Slider.d.ts.map

package/types/Slider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../src/Slider.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,QAAQ,EACR,UAAU,EAMX,MAAM,eAAe,CAAA;AAEtB,OAAO,EAAE,iBAAiB,EAAkB,MAAM,iBAAiB,CAAA;AAGnE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAwBnC,OAAO,EAIL,WAAW,EACX,gBAAgB,EAEjB,MAAM,SAAS,CAAA;AAqIhB,aAAK,kBAAkB,GAAG,WAAW,GAAG,IAAI,CAAA;AAE5C,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAQ3B,CAAA;AAEF,QAAA,MAAM,WAAW,6FAehB,CAAA;AAUD,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAIjC,CAAA;AAEF,aAAK,sBAAsB,GAAG,QAAQ,CAAC,OAAO,sBAAsB,CAAC,CAAA;AAErE,QAAA,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mDAqCtB,CAAA;AAsBD,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiB3B,CAAA;AAEF,UAAU,gBAAiB,SAAQ,iBAAiB;IAClD,KAAK,EAAE,MAAM,CAAA;CACd;AAED,QAAA,MAAM,WAAW,+EAsFhB,CAAA;AAQD,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuIX,CAAA;AAuCD,QAAA,MAAM,KAAK,6FAAc,CAAA;AACzB,QAAA,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;mDAAoB,CAAA;AAC/B,QAAA,MAAM,KAAK,+EAAc,CAAA;AAEzB,OAAO,EACL,MAAM,EACN,WAAW,EACX,iBAAiB,EACjB,WAAW,EAEX,KAAK,EACL,KAAK,EACL,KAAK,GACN,CAAA;AAED,YAAY,EAAE,WAAW,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,gBAAgB,EAAE,CAAA"}

package/types/SliderImpl.d.ts

@@ -0,0 +1,55 @@
+import * as React from 'react';
+import { View } from 'react-native';
+import { SliderImplProps } from './types';
+export declare const DirectionalYStack: import("@tamagui/core").TamaguiComponent<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
+}, "orientation"> & {
+    orientation?: "horizontal" | "vertical" | undefined;
+} & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
+}, "orientation"> & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
+}, "orientation"> & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}>>, any, import("@tamagui/core").StackPropsBase, {
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}>;
+export declare const SliderFrame: import("@tamagui/core").TamaguiComponent<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}, "size"> & {
+    size?: any;
+} & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}, "size"> & {
+    size?: any;
+}>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+}, "size"> & {
+    size?: any;
+}>>, any, import("@tamagui/core").StackPropsBase, {
+    readonly fullscreen?: boolean | undefined;
+    readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
+} & {
+    orientation?: "horizontal" | "vertical" | undefined;
+} & {
+    size?: any;
+}>;
+export declare const SliderImpl: React.ForwardRefExoticComponent<SliderImplProps & React.RefAttributes<View>>;
+//# sourceMappingURL=SliderImpl.d.ts.map