robonen/tools
1
0
Fork 0
mirror of https://github.com/robonen/tools.git synced 2026-03-20 10:54:44 +00:00
Code Releases Activity

feat(packages/vue): update useCounter composable to include additional functionality

Browse Source
This commit is contained in:
Andrew Robonen
2024-05-31 01:17:35 +07:00
parent d9973af2ed
commit 93065d46ca
2 changed files with 16 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/vue/src/composables/useCounter/index.test.ts
View File

@@ -1,6 +1,6 @@
import { it, expect, describe } from 'vitest'; import { it, expect, describe } from 'vitest';
import { useCounter } from '.';
import { ref } from 'vue'; import { ref } from 'vue';
import { useCounter } from '.';
describe('useCounter', () => { describe('useCounter', () => {
it('initialize count with the provided initial value', () => { it('initialize count with the provided initial value', () => {

17
packages/vue/src/composables/useCounter/index.ts
View File

@@ -1,4 +1,4 @@
import { ref, unref, type MaybeRef } from 'vue'; import { ref, unref, type MaybeRef, type Ref } from 'vue';
import { clamp } from '@robonen/stdlib'; import { clamp } from '@robonen/stdlib';
export interface UseCounterOptions { export interface UseCounterOptions {
@@ -6,6 +6,15 @@ export interface UseCounterOptions {
max?: number; max?: number;
} }
export interface UseConterReturn {
count: Ref<number>;
increment: (delta?: number) => void;
decrement: (delta?: number) => void;
set: (value: number) => void;
get: () => number;
reset: (value?: number) => void;
}
/** /**
* @name useCounter * @name useCounter
* @category Utilities * @category Utilities
@@ -15,6 +24,7 @@ export interface UseCounterOptions {
* @param {UseCounterOptions} [options={}] The options for the counter * @param {UseCounterOptions} [options={}] The options for the counter
* @param {number} [options.min=Number.MIN_SAFE_INTEGER] The minimum value of the counter * @param {number} [options.min=Number.MIN_SAFE_INTEGER] The minimum value of the counter
* @param {number} [options.max=Number.MAX_SAFE_INTEGER] The maximum value of the counter * @param {number} [options.max=Number.MAX_SAFE_INTEGER] The maximum value of the counter
* @returns {UseConterReturn} The counter object
* *
* @example * @example
* const { count, increment } = useCounter(0); * const { count, increment } = useCounter(0);
@@ -22,7 +32,10 @@ export interface UseCounterOptions {
* @example * @example
* const { count, increment, decrement, set, get, reset } = useCounter(0, { min: 0, max: 10 }); * const { count, increment, decrement, set, get, reset } = useCounter(0, { min: 0, max: 10 });
*/ */
export function useCounter(initialValue: MaybeRef<number> = 0, options: UseCounterOptions = {}) { export function useCounter(
initialValue: MaybeRef<number> = 0,
options: UseCounterOptions = {},
): UseConterReturn {
let _initialValue = unref(initialValue); let _initialValue = unref(initialValue);
const count = ref(initialValue); const count = ref(initialValue);