routie dev init since i didn't adhere to any proper guidance up until now
This commit is contained in:
+285
@@ -0,0 +1,285 @@
|
||||
import type { ExtractPropTypes, InjectionKey, PropType, Ref } from 'vue';
|
||||
import type { VSliderTrack } from './VSliderTrack.js';
|
||||
export type Tick = {
|
||||
value: number;
|
||||
position: number;
|
||||
label?: string;
|
||||
};
|
||||
type SliderProvide = {
|
||||
activeThumbRef: Ref<HTMLElement | undefined>;
|
||||
color: Ref<string | undefined>;
|
||||
decimals: Ref<number>;
|
||||
direction: Ref<'vertical' | 'horizontal'>;
|
||||
disabled: Ref<boolean>;
|
||||
elevation: Ref<number | string | undefined>;
|
||||
min: Ref<number>;
|
||||
max: Ref<number>;
|
||||
mousePressed: Ref<boolean>;
|
||||
noKeyboard: Ref<boolean>;
|
||||
numTicks: Ref<number>;
|
||||
onSliderMousedown: (e: MouseEvent) => void;
|
||||
onSliderTouchstart: (e: TouchEvent) => void;
|
||||
parseMouseMove: (e: MouseEvent | TouchEvent) => number | void;
|
||||
position: (val: number) => number;
|
||||
readonly: Ref<boolean>;
|
||||
rounded: Ref<boolean | number | string | undefined>;
|
||||
roundValue: (value: number) => number;
|
||||
thumbLabel: Ref<boolean | string | undefined>;
|
||||
showTicks: Ref<boolean | 'always'>;
|
||||
startOffset: Ref<number>;
|
||||
step: Ref<number>;
|
||||
thumbSize: Ref<number>;
|
||||
thumbColor: Ref<string | undefined>;
|
||||
thumbLabelColor: Ref<string | undefined>;
|
||||
trackColor: Ref<string | undefined>;
|
||||
trackFillColor: Ref<string | undefined>;
|
||||
trackSize: Ref<number>;
|
||||
ticks: Ref<readonly number[] | Record<string, string> | undefined>;
|
||||
tickSize: Ref<number>;
|
||||
trackContainerRef: Ref<VSliderTrack | undefined>;
|
||||
vertical: Ref<boolean>;
|
||||
parsedTicks: Ref<Tick[]>;
|
||||
hasLabels: Ref<boolean>;
|
||||
isReversed: Ref<boolean>;
|
||||
indexFromEnd: Ref<boolean>;
|
||||
};
|
||||
export declare const VSliderSymbol: InjectionKey<SliderProvide>;
|
||||
export declare function getOffset(e: MouseEvent | TouchEvent, el: HTMLElement, direction: string): number;
|
||||
export declare const makeSliderProps: <Defaults extends {
|
||||
elevation?: unknown;
|
||||
rounded?: unknown;
|
||||
tile?: unknown;
|
||||
disabled?: unknown;
|
||||
error?: unknown;
|
||||
readonly?: unknown;
|
||||
max?: unknown;
|
||||
min?: unknown;
|
||||
step?: unknown;
|
||||
thumbColor?: unknown;
|
||||
thumbLabel?: unknown;
|
||||
thumbSize?: unknown;
|
||||
showTicks?: unknown;
|
||||
ticks?: unknown;
|
||||
tickSize?: unknown;
|
||||
color?: unknown;
|
||||
trackColor?: unknown;
|
||||
trackFillColor?: unknown;
|
||||
trackSize?: unknown;
|
||||
direction?: unknown;
|
||||
reverse?: unknown;
|
||||
noKeyboard?: unknown;
|
||||
ripple?: unknown;
|
||||
} = {}>(defaults?: Defaults | undefined) => {
|
||||
elevation: unknown extends Defaults["elevation"] ? Omit<{
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
validator: (value: string | number) => boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<string | number>;
|
||||
default: NonNullable<string | number>;
|
||||
} : Omit<Omit<{
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
validator: (value: string | number) => boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<string | number>;
|
||||
default: NonNullable<string | number>;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["elevation"] ? string | number : string | number | Defaults["elevation"]>;
|
||||
default: unknown extends Defaults["elevation"] ? string | number : Defaults["elevation"] | NonNullable<string | number>;
|
||||
};
|
||||
rounded: unknown extends Defaults["rounded"] ? {
|
||||
type: (BooleanConstructor | NumberConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
} : Omit<{
|
||||
type: (BooleanConstructor | NumberConstructor | StringConstructor)[];
|
||||
default: undefined;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["rounded"] ? string | number | boolean : string | number | boolean | Defaults["rounded"]>;
|
||||
default: unknown extends Defaults["rounded"] ? string | number | boolean : Defaults["rounded"] | NonNullable<string | number | boolean>;
|
||||
};
|
||||
tile: unknown extends Defaults["tile"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["tile"] ? boolean : boolean | Defaults["tile"]>;
|
||||
default: unknown extends Defaults["tile"] ? boolean : boolean | Defaults["tile"];
|
||||
};
|
||||
disabled: unknown extends Defaults["disabled"] ? {
|
||||
type: PropType<boolean | null>;
|
||||
default: null;
|
||||
} : Omit<{
|
||||
type: PropType<boolean | null>;
|
||||
default: null;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["disabled"] ? boolean | null : boolean | Defaults["disabled"] | null>;
|
||||
default: unknown extends Defaults["disabled"] ? boolean | null : Defaults["disabled"] | NonNullable<boolean | null>;
|
||||
};
|
||||
error: unknown extends Defaults["error"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["error"] ? boolean : boolean | Defaults["error"]>;
|
||||
default: unknown extends Defaults["error"] ? boolean : boolean | Defaults["error"];
|
||||
};
|
||||
readonly: unknown extends Defaults["readonly"] ? {
|
||||
type: PropType<boolean | null>;
|
||||
default: null;
|
||||
} : Omit<{
|
||||
type: PropType<boolean | null>;
|
||||
default: null;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["readonly"] ? boolean | null : boolean | Defaults["readonly"] | null>;
|
||||
default: unknown extends Defaults["readonly"] ? boolean | null : Defaults["readonly"] | NonNullable<boolean | null>;
|
||||
};
|
||||
max: unknown extends Defaults["max"] ? {
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
} : Omit<{
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["max"] ? string | number : string | number | Defaults["max"]>;
|
||||
default: unknown extends Defaults["max"] ? string | number : Defaults["max"] | NonNullable<string | number>;
|
||||
};
|
||||
min: unknown extends Defaults["min"] ? {
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
} : Omit<{
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["min"] ? string | number : string | number | Defaults["min"]>;
|
||||
default: unknown extends Defaults["min"] ? string | number : Defaults["min"] | NonNullable<string | number>;
|
||||
};
|
||||
step: unknown extends Defaults["step"] ? {
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
} : Omit<{
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["step"] ? string | number : string | number | Defaults["step"]>;
|
||||
default: unknown extends Defaults["step"] ? string | number : Defaults["step"] | NonNullable<string | number>;
|
||||
};
|
||||
thumbColor: unknown extends Defaults["thumbColor"] ? StringConstructor : {
|
||||
type: PropType<unknown extends Defaults["thumbColor"] ? string : string | Defaults["thumbColor"]>;
|
||||
default: unknown extends Defaults["thumbColor"] ? string : string | Defaults["thumbColor"];
|
||||
};
|
||||
thumbLabel: unknown extends Defaults["thumbLabel"] ? {
|
||||
type: PropType<boolean | 'always' | 'hover' | undefined>;
|
||||
default: undefined;
|
||||
validator: (v: any) => boolean;
|
||||
} : Omit<{
|
||||
type: PropType<boolean | 'always' | 'hover' | undefined>;
|
||||
default: undefined;
|
||||
validator: (v: any) => boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["thumbLabel"] ? "always" | "hover" | boolean | undefined : "always" | "hover" | boolean | Defaults["thumbLabel"] | undefined>;
|
||||
default: unknown extends Defaults["thumbLabel"] ? "always" | "hover" | boolean | undefined : Defaults["thumbLabel"] | NonNullable<"always" | "hover" | boolean | undefined>;
|
||||
};
|
||||
thumbSize: unknown extends Defaults["thumbSize"] ? {
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
} : Omit<{
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["thumbSize"] ? string | number : string | number | Defaults["thumbSize"]>;
|
||||
default: unknown extends Defaults["thumbSize"] ? string | number : Defaults["thumbSize"] | NonNullable<string | number>;
|
||||
};
|
||||
showTicks: unknown extends Defaults["showTicks"] ? {
|
||||
type: PropType<boolean | 'always'>;
|
||||
default: boolean;
|
||||
validator: (v: any) => boolean;
|
||||
} : Omit<{
|
||||
type: PropType<boolean | 'always'>;
|
||||
default: boolean;
|
||||
validator: (v: any) => boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["showTicks"] ? "always" | boolean : "always" | boolean | Defaults["showTicks"]>;
|
||||
default: unknown extends Defaults["showTicks"] ? "always" | boolean : Defaults["showTicks"] | NonNullable<"always" | boolean>;
|
||||
};
|
||||
ticks: unknown extends Defaults["ticks"] ? {
|
||||
type: PropType<readonly number[] | Record<number, string>>;
|
||||
} : Omit<{
|
||||
type: PropType<readonly number[] | Record<number, string>>;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["ticks"] ? readonly number[] | Record<number, string> : readonly number[] | Record<number, string> | Defaults["ticks"]>;
|
||||
default: unknown extends Defaults["ticks"] ? readonly number[] | Record<number, string> : Defaults["ticks"] | NonNullable<readonly number[] | Record<number, string>>;
|
||||
};
|
||||
tickSize: unknown extends Defaults["tickSize"] ? {
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
} : Omit<{
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["tickSize"] ? string | number : string | number | Defaults["tickSize"]>;
|
||||
default: unknown extends Defaults["tickSize"] ? string | number : Defaults["tickSize"] | NonNullable<string | number>;
|
||||
};
|
||||
color: unknown extends Defaults["color"] ? StringConstructor : {
|
||||
type: PropType<unknown extends Defaults["color"] ? string : string | Defaults["color"]>;
|
||||
default: unknown extends Defaults["color"] ? string : string | Defaults["color"];
|
||||
};
|
||||
trackColor: unknown extends Defaults["trackColor"] ? StringConstructor : {
|
||||
type: PropType<unknown extends Defaults["trackColor"] ? string : string | Defaults["trackColor"]>;
|
||||
default: unknown extends Defaults["trackColor"] ? string : string | Defaults["trackColor"];
|
||||
};
|
||||
trackFillColor: unknown extends Defaults["trackFillColor"] ? StringConstructor : {
|
||||
type: PropType<unknown extends Defaults["trackFillColor"] ? string : string | Defaults["trackFillColor"]>;
|
||||
default: unknown extends Defaults["trackFillColor"] ? string : string | Defaults["trackFillColor"];
|
||||
};
|
||||
trackSize: unknown extends Defaults["trackSize"] ? {
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
} : Omit<{
|
||||
type: (NumberConstructor | StringConstructor)[];
|
||||
default: number;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["trackSize"] ? string | number : string | number | Defaults["trackSize"]>;
|
||||
default: unknown extends Defaults["trackSize"] ? string | number : Defaults["trackSize"] | NonNullable<string | number>;
|
||||
};
|
||||
direction: unknown extends Defaults["direction"] ? {
|
||||
type: PropType<'horizontal' | 'vertical'>;
|
||||
default: string;
|
||||
validator: (v: any) => boolean;
|
||||
} : Omit<{
|
||||
type: PropType<'horizontal' | 'vertical'>;
|
||||
default: string;
|
||||
validator: (v: any) => boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["direction"] ? "horizontal" | "vertical" : "horizontal" | "vertical" | Defaults["direction"]>;
|
||||
default: unknown extends Defaults["direction"] ? "horizontal" | "vertical" : Defaults["direction"] | NonNullable<"horizontal" | "vertical">;
|
||||
};
|
||||
reverse: unknown extends Defaults["reverse"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["reverse"] ? boolean : boolean | Defaults["reverse"]>;
|
||||
default: unknown extends Defaults["reverse"] ? boolean : boolean | Defaults["reverse"];
|
||||
};
|
||||
noKeyboard: unknown extends Defaults["noKeyboard"] ? BooleanConstructor : {
|
||||
type: PropType<unknown extends Defaults["noKeyboard"] ? boolean : boolean | Defaults["noKeyboard"]>;
|
||||
default: unknown extends Defaults["noKeyboard"] ? boolean : boolean | Defaults["noKeyboard"];
|
||||
};
|
||||
ripple: unknown extends Defaults["ripple"] ? {
|
||||
type: BooleanConstructor;
|
||||
default: boolean;
|
||||
} : Omit<{
|
||||
type: BooleanConstructor;
|
||||
default: boolean;
|
||||
}, "default" | "type"> & {
|
||||
type: PropType<unknown extends Defaults["ripple"] ? boolean : boolean | Defaults["ripple"]>;
|
||||
default: unknown extends Defaults["ripple"] ? boolean : boolean | Defaults["ripple"];
|
||||
};
|
||||
};
|
||||
type SliderProps = ExtractPropTypes<ReturnType<typeof makeSliderProps>>;
|
||||
type SliderData = {
|
||||
value: number;
|
||||
};
|
||||
export declare const useSteps: (props: SliderProps) => {
|
||||
min: import("vue").ComputedRef<number>;
|
||||
max: import("vue").ComputedRef<number>;
|
||||
step: import("vue").ComputedRef<number>;
|
||||
decimals: import("vue").ComputedRef<number>;
|
||||
roundValue: (value: string | number) => number;
|
||||
};
|
||||
export declare const useSlider: ({ props, steps, onSliderStart, onSliderMove, onSliderEnd, getActiveThumb, }: {
|
||||
props: SliderProps;
|
||||
steps: ReturnType<typeof useSteps>;
|
||||
onSliderEnd: (data: SliderData) => void;
|
||||
onSliderStart: (data: SliderData) => void;
|
||||
onSliderMove: (data: SliderData) => void;
|
||||
getActiveThumb: (e: MouseEvent | TouchEvent) => HTMLElement;
|
||||
}) => SliderProvide;
|
||||
|
||||
Reference in New Issue
Block a user