@desource/phone-mask-react 0.3.0 → 1.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (37) hide show
  1. package/CHANGELOG.md +65 -0
  2. package/README.md +51 -23
  3. package/dist/esm/components/PhoneInput.d.ts +2 -9
  4. package/dist/esm/components/PhoneInput.d.ts.map +1 -1
  5. package/dist/esm/hooks/internal/useCopyAction.d.ts +14 -0
  6. package/dist/esm/hooks/internal/useCopyAction.d.ts.map +1 -0
  7. package/dist/esm/hooks/internal/useCountry.d.ts +21 -0
  8. package/dist/esm/hooks/internal/useCountry.d.ts.map +1 -0
  9. package/dist/esm/hooks/internal/useCountrySelector.d.ts +32 -0
  10. package/dist/esm/hooks/internal/useCountrySelector.d.ts.map +1 -0
  11. package/dist/esm/hooks/internal/useFormatter.d.ts +45 -0
  12. package/dist/esm/hooks/internal/useFormatter.d.ts.map +1 -0
  13. package/dist/esm/hooks/internal/useInputHandlers.d.ts +21 -0
  14. package/dist/esm/hooks/internal/useInputHandlers.d.ts.map +1 -0
  15. package/dist/esm/hooks/internal/useTheme.d.ts +9 -0
  16. package/dist/esm/hooks/internal/useTheme.d.ts.map +1 -0
  17. package/dist/esm/hooks/internal/useValidationHint.d.ts +6 -0
  18. package/dist/esm/hooks/internal/useValidationHint.d.ts.map +1 -0
  19. package/dist/esm/hooks/usePhoneMask.d.ts +2 -1
  20. package/dist/esm/hooks/usePhoneMask.d.ts.map +1 -1
  21. package/dist/esm/hooks/utility/useClipboard.d.ts +6 -0
  22. package/dist/esm/hooks/utility/useClipboard.d.ts.map +1 -0
  23. package/dist/esm/hooks/utility/useTimer.d.ts +9 -0
  24. package/dist/esm/hooks/utility/useTimer.d.ts.map +1 -0
  25. package/dist/esm/index.d.ts.map +1 -1
  26. package/dist/esm/index.js +751 -705
  27. package/dist/esm/index.js.map +1 -1
  28. package/dist/esm/types.d.ts +18 -20
  29. package/dist/esm/types.d.ts.map +1 -1
  30. package/dist/phone-mask-react.cjs +1 -1
  31. package/dist/phone-mask-react.cjs.map +1 -1
  32. package/dist/phone-mask-react.css +1 -1
  33. package/package.json +13 -11
  34. package/dist/esm/consts.d.ts +0 -4
  35. package/dist/esm/consts.d.ts.map +0 -1
  36. package/dist/esm/utils.d.ts +0 -16
  37. package/dist/esm/utils.d.ts.map +0 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,70 @@
1
1
  # @desource/phone-mask-react
2
2
 
3
+ ## 1.1.0
4
+
5
+ ### Minor Changes
6
+
7
+ - Svelte Upgrades:
8
+ - Added attachment `phoneMaskAttachment` for usage in native input (for Svelte 5.29+ versions)
9
+ - Added action `phoneMaskAction` for usage in native input (for Svelte 5.0+ versions)
10
+ - Improved keyboard country selection flow and active-descendant accessibility behavior
11
+ - Refined dropdown/key navigation handling and related focus behavior
12
+ - `usePhoneMask` now exposes `formatter` in the return object
13
+
14
+ - Vue Upgrades:
15
+ - Directive was refactored to align with Svelte action
16
+ - Improved keyboard country selection flow and active-descendant accessibility behavior
17
+ - Refined dropdown/key navigation handling and related focus behavior
18
+ - `usePhoneMask` now exposes `formatter` in the return object
19
+
20
+ - React Upgrades:
21
+ - Improved keyboard country selection flow and active-descendant accessibility behavior
22
+ - Refined dropdown/key navigation handling and related focus behavior
23
+ - `usePhoneMask` now exposes `formatter` in the return object
24
+
25
+ - Core Upgrades:
26
+ - Fixed edge cases in mask variant selection and improved input handler robustness
27
+ - Applied reliability-focused refactors in formatter/handlers and build script generation logic
28
+
29
+ ### Patch Changes
30
+
31
+ - Updated dependencies []:
32
+ - @desource/phone-mask@1.1.0
33
+
34
+ ## 1.0.0
35
+
36
+ ### Major Changes
37
+
38
+ - Core Upgrades:
39
+ - Refactored core architecture for better separation of concerns and reusability
40
+ - Added zero-config browser script support path
41
+ - Improved Intl.DisplayNames caching for performance
42
+ - Fixed various edge cases in formatting and event handling
43
+ - Added comprehensive unit tests for core utilities and handlers
44
+
45
+ - React Upgrades:
46
+ - Major internal refactor to a controlled pattern with consistent hooks
47
+ - Improved React 18/19 compatibility for ref behavior
48
+ - Added and expanded unit/e2e tests for React components and behavior
49
+
50
+ - Vue Upgrades:
51
+ - Refactored to align composable structure and reuse core utilities
52
+ - Fixed directive behavior for external value updates and dropdown close logic
53
+ - Added substantial unit/e2e test coverage for Vue composables and directive
54
+
55
+ - 🚀 Svelte Upgrades:
56
+ - Introduced Svelte version of phone-mask library
57
+
58
+ - Nuxt Upgrades:
59
+ - Added full test foundation with @nuxt/test-utils
60
+ - Added unit tests for module and runtime behavior
61
+ - Added e2e fixtures/tests and shared e2e utilities
62
+
63
+ ### Patch Changes
64
+
65
+ - Updated dependencies []:
66
+ - @desource/phone-mask@1.0.0
67
+
3
68
  ## 0.3.0
4
69
 
5
70
  ### Minor Changes
package/README.md CHANGED
@@ -6,7 +6,7 @@
6
6
  [![bundle size](https://img.shields.io/bundlephobia/minzip/@desource/phone-mask-react?label=gzip%20size&color=purple)](https://bundlephobia.com/package/@desource/phone-mask-react)
7
7
  [![license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/DeSource-Labs/phone-mask/blob/main/LICENSE)
8
8
 
9
- Beautiful, accessible, extreme small & tree-shackable React phone input with auto-formatting, country selector, and validation.
9
+ Beautiful, accessible, extreme small & tree-shakeable React phone input with auto-formatting, country selector, and validation.
10
10
 
11
11
  ## ✨ Features
12
12
 
@@ -37,12 +37,14 @@ pnpm add @desource/phone-mask-react
37
37
  ### Importing
38
38
 
39
39
  Component mode:
40
+
40
41
  ```tsx
41
42
  import { PhoneInput } from '@desource/phone-mask-react';
42
43
  import '@desource/phone-mask-react/assets/lib.css'; // Import styles
43
44
  ```
44
45
 
45
46
  Hook mode:
47
+
46
48
  ```tsx
47
49
  import { usePhoneMask } from '@desource/phone-mask-react';
48
50
  ```
@@ -60,12 +62,7 @@ function App() {
60
62
 
61
63
  return (
62
64
  <>
63
- <PhoneInput
64
- value={phone}
65
- onChange={setPhone}
66
- onValidationChange={setIsValid}
67
- country="US"
68
- />
65
+ <PhoneInput value={phone} onChange={setPhone} onValidationChange={setIsValid} country="US" />
69
66
 
70
67
  {isValid && <p>✓ Valid phone number</p>}
71
68
  </>
@@ -78,15 +75,17 @@ function App() {
78
75
  For custom input implementations:
79
76
 
80
77
  ```tsx
78
+ import { useState } from 'react';
81
79
  import { usePhoneMask } from '@desource/phone-mask-react';
82
80
 
83
81
  function CustomPhoneInput() {
82
+ const [value, setValue] = useState('');
83
+
84
84
  const { ref, digits, full, fullFormatted, isComplete, country, setCountry } = usePhoneMask({
85
+ value,
86
+ onChange: setValue,
85
87
  country: 'US',
86
- detect: true,
87
- onChange: (phone) => {
88
- console.log(phone.full, phone.digits);
89
- }
88
+ detect: true
90
89
  });
91
90
 
92
91
  return (
@@ -105,10 +104,12 @@ function CustomPhoneInput() {
105
104
 
106
105
  ### Props
107
106
 
107
+ > **Note:** The component requires controlled behavior. Both `value` and `onChange` props are required.
108
+
108
109
  ```ts
109
110
  interface PhoneInputProps {
110
- // Controlled value (digits only, without country code)
111
- value?: string;
111
+ // Controlled value (digits only, without country code) - REQUIRED
112
+ value: string;
112
113
 
113
114
  // Preselected country (ISO 3166-1 alpha-2)
114
115
  country?: CountryKey;
@@ -155,9 +156,9 @@ interface PhoneInputProps {
155
156
  // Disable default styles
156
157
  disableDefaultStyles?: boolean; // Default: false
157
158
 
158
- // Callback when the digits value changes.
159
+ // Callback when the digits value changes - REQUIRED
159
160
  // Returns only the digits without country code (e.g. '234567890')
160
- onChange?: (digits: string) => void;
161
+ onChange: (digits: string) => void;
161
162
 
162
163
  // Callback when the phone number changes.
163
164
  // Provides an object with:
@@ -218,8 +219,16 @@ phoneInputRef.current?.isComplete(); // Checks if the current phone number is co
218
219
 
219
220
  ### Options
220
221
 
222
+ > **Note:** The hook requires controlled behavior. Both `value` and `onChange` options are required.
223
+
221
224
  ```ts
222
225
  interface UsePhoneMaskOptions {
226
+ // Controlled value (digits only, without country code) - REQUIRED
227
+ value: string;
228
+
229
+ // Callback when the digits value changes - REQUIRED
230
+ onChange: (digits: string) => void;
231
+
223
232
  // Predefined country ISO code (e.g., 'US', 'DE', 'GB')
224
233
  country?: string;
225
234
 
@@ -229,8 +238,8 @@ interface UsePhoneMaskOptions {
229
238
  // Auto-detect country from IP/locale (default: false)
230
239
  detect?: boolean;
231
240
 
232
- // Value change callback
233
- onChange?: (phone: PhoneNumber) => void;
241
+ // Callback when the phone changes (full, fullFormatted, digits)
242
+ onPhoneChange?: (phone: PhoneNumber) => void;
234
243
 
235
244
  // Country change callback
236
245
  onCountryChange?: (country: MaskFull) => void;
@@ -241,15 +250,37 @@ interface UsePhoneMaskOptions {
241
250
 
242
251
  ```ts
243
252
  interface UsePhoneMaskReturn {
244
- ref: RefObject<HTMLInputElement>;
253
+ // Ref to attach to your input element
254
+ ref: RefObject<HTMLInputElement | null>;
255
+
256
+ // Raw digits without formatting (e.g., "1234567890")
245
257
  digits: string;
258
+
259
+ // Phone formatter instance
260
+ formatter: FormatterHelpers;
261
+
262
+ // Full phone number with country code (e.g., "+11234567890")
246
263
  full: string;
264
+
265
+ // Full phone number formatted (e.g., "+1 123-456-7890")
247
266
  fullFormatted: string;
267
+
268
+ // Whether the phone number is complete
248
269
  isComplete: boolean;
270
+
271
+ // Whether the input is empty
249
272
  isEmpty: boolean;
273
+
274
+ // Whether to show validation warning
250
275
  shouldShowWarn: boolean;
276
+
277
+ // Current country data
251
278
  country: MaskFull;
279
+
280
+ // Change country programmatically
252
281
  setCountry: (countryCode: string) => void;
282
+
283
+ // Clear the input
253
284
  clear: () => void;
254
285
  }
255
286
  ```
@@ -373,11 +404,7 @@ function Example() {
373
404
  name="phone"
374
405
  control={control}
375
406
  render={({ field }) => (
376
- <PhoneInput
377
- value={field.value}
378
- onChange={(digits) => field.onChange(digits)}
379
- onBlur={field.onBlur}
380
- />
407
+ <PhoneInput value={field.value} onChange={(digits) => field.onChange(digits)} onBlur={field.onBlur} />
381
408
  )}
382
409
  />
383
410
  );
@@ -439,6 +466,7 @@ function Example() {
439
466
  - [@desource/phone-mask](../phone-mask) — Core library
440
467
  - [@desource/phone-mask-nuxt](../phone-mask-nuxt) — Nuxt module
441
468
  - [@desource/phone-mask-vue](../phone-mask-vue) — Vue 3 bindings
469
+ - [@desource/phone-mask-svelte](../phone-mask-svelte) — Svelte bindings
442
470
 
443
471
  ## 📄 License
444
472
 
@@ -1,11 +1,4 @@
1
- import { type Ref } from 'react';
1
+ import React from 'react';
2
2
  import type { PhoneInputProps, PhoneInputRef } from '../types';
3
- type PhoneInputComponent = PhoneInputProps & {
4
- ref?: Ref<PhoneInputRef>;
5
- };
6
- export declare const PhoneInput: {
7
- ({ ref, ...props }: PhoneInputComponent): import("react/jsx-runtime").JSX.Element;
8
- displayName: string;
9
- };
10
- export {};
3
+ export declare const PhoneInput: React.ForwardRefExoticComponent<PhoneInputProps & React.RefAttributes<PhoneInputRef>>;
11
4
  //# sourceMappingURL=PhoneInput.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"PhoneInput.d.ts","sourceRoot":"","sources":["../../../src/components/PhoneInput.tsx"],"names":[],"mappings":"AAAA,OAAc,EAQZ,KAAK,GAAG,EACT,MAAM,OAAO,CAAC;AAYf,OAAO,KAAK,EAAE,eAAe,EAAE,aAAa,EAAe,MAAM,UAAU,CAAC;AAS5E,KAAK,mBAAmB,GAAG,eAAe,GAAG;IAAE,GAAG,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC,CAAA;CAAE,CAAC;AAE1E,eAAO,MAAM,UAAU;wBAAuB,mBAAmB;;CAuwBhE,CAAC"}
1
+ {"version":3,"file":"PhoneInput.d.ts","sourceRoot":"","sources":["../../../src/components/PhoneInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAQN,MAAM,OAAO,CAAC;AAUf,OAAO,KAAK,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAmX/D,eAAO,MAAM,UAAU,uFAA8D,CAAC"}
@@ -0,0 +1,14 @@
1
+ import { type RefObject } from 'react';
2
+ interface UseCopyActionOptions {
3
+ fullFormatted: string;
4
+ liveRef?: RefObject<HTMLElement | null>;
5
+ onCopy?: (value: string) => void;
6
+ }
7
+ export declare function useCopyAction({ liveRef, fullFormatted, onCopy }: UseCopyActionOptions): {
8
+ copied: boolean;
9
+ copyAriaLabel: string;
10
+ copyButtonTitle: string;
11
+ onCopyClick: () => Promise<void>;
12
+ };
13
+ export {};
14
+ //# sourceMappingURL=useCopyAction.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useCopyAction.d.ts","sourceRoot":"","sources":["../../../../src/hooks/internal/useCopyAction.ts"],"names":[],"mappings":"AAAA,OAAO,EAAwB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAI7D,UAAU,oBAAoB;IAC5B,aAAa,EAAE,MAAM,CAAC;IACtB,OAAO,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACxC,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAClC;AAID,wBAAgB,aAAa,CAAC,EAAE,OAAO,EAAE,aAAa,EAAE,MAAM,EAAE,EAAE,oBAAoB;;;;;EAiCrF"}
@@ -0,0 +1,21 @@
1
+ import { type MaskFull } from '@desource/phone-mask';
2
+ export interface UseCountryOptions {
3
+ /** Country ISO code (e.g., 'US', 'DE', 'GB') */
4
+ country?: string;
5
+ /** Locale for country names (default: navigator.language) */
6
+ locale?: string;
7
+ /** Auto-detect country from IP/locale (default: false) */
8
+ detect?: boolean;
9
+ /** Callback when country changes */
10
+ onCountryChange?: (country: MaskFull) => void;
11
+ }
12
+ export interface UseCountryReturn {
13
+ /** Current country data */
14
+ country: MaskFull;
15
+ /** Change country programmatically */
16
+ setCountry: (countryCode?: string | null) => boolean;
17
+ /** Computed locale value */
18
+ locale: string;
19
+ }
20
+ export declare function useCountry({ country: countryOption, locale: localeOption, detect, onCountryChange }: UseCountryOptions): UseCountryReturn;
21
+ //# sourceMappingURL=useCountry.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useCountry.d.ts","sourceRoot":"","sources":["../../../../src/hooks/internal/useCountry.ts"],"names":[],"mappings":"AACA,OAAO,EAML,KAAK,QAAQ,EACd,MAAM,sBAAsB,CAAC;AAE9B,MAAM,WAAW,iBAAiB;IAChC,gDAAgD;IAChD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,6DAA6D;IAC7D,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,0DAA0D;IAC1D,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,oCAAoC;IACpC,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,QAAQ,KAAK,IAAI,CAAC;CAC/C;AAED,MAAM,WAAW,gBAAgB;IAC/B,2BAA2B;IAC3B,OAAO,EAAE,QAAQ,CAAC;IAClB,sCAAsC;IACtC,UAAU,EAAE,CAAC,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,KAAK,OAAO,CAAC;IACrD,4BAA4B;IAC5B,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,UAAU,CAAC,EACzB,OAAO,EAAE,aAAa,EACtB,MAAM,EAAE,YAAY,EACpB,MAAM,EACN,eAAe,EAChB,EAAE,iBAAiB,GAAG,gBAAgB,CAiDtC"}
@@ -0,0 +1,32 @@
1
+ import React, { type RefObject } from 'react';
2
+ import { type CountryKey } from '@desource/phone-mask';
3
+ interface UseCountrySelectOptions {
4
+ rootRef: RefObject<HTMLDivElement | null>;
5
+ dropdownRef: RefObject<HTMLDivElement | null>;
6
+ searchRef: RefObject<HTMLInputElement | null>;
7
+ selectorRef: RefObject<HTMLDivElement | null>;
8
+ locale: string;
9
+ onSelectCountry: (code: CountryKey) => void;
10
+ countryOption?: string;
11
+ inactive?: boolean;
12
+ onAfterSelect?: () => void;
13
+ }
14
+ export declare function useCountrySelector({ rootRef, dropdownRef, searchRef, selectorRef, locale, countryOption, inactive, onSelectCountry, onAfterSelect }: UseCountrySelectOptions): {
15
+ dropdownOpen: boolean;
16
+ isClosing: boolean;
17
+ search: string;
18
+ focusedIndex: number;
19
+ dropdownStyle: React.CSSProperties;
20
+ filteredCountries: import("@desource/phone-mask").MaskFull[];
21
+ hasDropdown: boolean;
22
+ openDropdown: () => void;
23
+ closeDropdown: () => void;
24
+ toggleDropdown: () => void;
25
+ selectCountry: (code: CountryKey) => void;
26
+ setFocusedIndex: React.Dispatch<React.SetStateAction<number>>;
27
+ handleSearchChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
28
+ handleSearchKeydown: (e: React.KeyboardEvent) => void;
29
+ handleDropdownAnimationEnd: () => void;
30
+ };
31
+ export {};
32
+ //# sourceMappingURL=useCountrySelector.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useCountrySelector.d.ts","sourceRoot":"","sources":["../../../../src/hooks/internal/useCountrySelector.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA6C,KAAK,SAAS,EAAsB,MAAM,OAAO,CAAC;AAE7G,OAAO,EAA8B,KAAK,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAEnF,UAAU,uBAAuB;IAC/B,OAAO,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC1C,WAAW,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC9C,SAAS,EAAE,SAAS,CAAC,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC9C,WAAW,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC9C,MAAM,EAAE,MAAM,CAAC;IACf,eAAe,EAAE,CAAC,IAAI,EAAE,UAAU,KAAK,IAAI,CAAC;IAC5C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B;AAED,wBAAgB,kBAAkB,CAAC,EACjC,OAAO,EACP,WAAW,EACX,SAAS,EACT,WAAW,EACX,MAAM,EACN,aAAa,EACb,QAAQ,EACR,eAAe,EACf,aAAa,EACd,EAAE,uBAAuB;;;;;;;;;;;0BA6Cf,UAAU;;4BAUwB,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC;6BA0DxE,KAAK,CAAC,aAAa;;EAmE1B"}
@@ -0,0 +1,45 @@
1
+ import { type MaskFull, type FormatterHelpers } from '@desource/phone-mask';
2
+ import type { PhoneNumber } from '../../types';
3
+ /** Configuration options for the useFormatter hook */
4
+ export interface UseFormatterOptions {
5
+ /** Pre-resolved country data */
6
+ country: MaskFull;
7
+ /**
8
+ * Controlled value (digits only, without country code)
9
+ * The parent is responsible for managing state via onChange callback.
10
+ */
11
+ value: string;
12
+ /** Callback when the digits value changes. */
13
+ onChange: (digits: string) => void;
14
+ /** Callback when the phone number changes. */
15
+ onPhoneChange?: (value: PhoneNumber) => void;
16
+ /** Callback when validation state (isComplete) changes */
17
+ onValidationChange?: (isComplete: boolean) => void;
18
+ }
19
+ /** Return type for useFormatter hook */
20
+ export interface UseFormatterReturn {
21
+ /** Raw digits without formatting */
22
+ digits: string;
23
+ /** Phone formatter instance */
24
+ formatter: FormatterHelpers;
25
+ /** Placeholder from formatter */
26
+ displayPlaceholder: string;
27
+ /** Formatted display string */
28
+ displayValue: string;
29
+ /** Full phone number with country code */
30
+ full: string;
31
+ /** Full phone number formatted */
32
+ fullFormatted: string;
33
+ /** Whether the phone number is complete */
34
+ isComplete: boolean;
35
+ /** Whether the input is empty */
36
+ isEmpty: boolean;
37
+ /** Whether to show validation warning */
38
+ shouldShowWarn: boolean;
39
+ }
40
+ /**
41
+ * Hook for phone number formatting and derived computations.
42
+ * Receives pre-resolved country data; country management is handled by the caller.
43
+ */
44
+ export declare function useFormatter({ country, value, onChange, onPhoneChange, onValidationChange }: UseFormatterOptions): UseFormatterReturn;
45
+ //# sourceMappingURL=useFormatter.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useFormatter.d.ts","sourceRoot":"","sources":["../../../../src/hooks/internal/useFormatter.ts"],"names":[],"mappings":"AACA,OAAO,EAAuC,KAAK,QAAQ,EAAE,KAAK,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAEjH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE/C,sDAAsD;AACtD,MAAM,WAAW,mBAAmB;IAClC,gCAAgC;IAChC,OAAO,EAAE,QAAQ,CAAC;IAClB;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd,8CAA8C;IAC9C,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,8CAA8C;IAC9C,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAC;IAC7C,0DAA0D;IAC1D,kBAAkB,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;CACpD;AAED,wCAAwC;AACxC,MAAM,WAAW,kBAAkB;IACjC,oCAAoC;IACpC,MAAM,EAAE,MAAM,CAAC;IACf,+BAA+B;IAC/B,SAAS,EAAE,gBAAgB,CAAC;IAC5B,iCAAiC;IACjC,kBAAkB,EAAE,MAAM,CAAC;IAC3B,+BAA+B;IAC/B,YAAY,EAAE,MAAM,CAAC;IACrB,0CAA0C;IAC1C,IAAI,EAAE,MAAM,CAAC;IACb,kCAAkC;IAClC,aAAa,EAAE,MAAM,CAAC;IACtB,2CAA2C;IAC3C,UAAU,EAAE,OAAO,CAAC;IACpB,iCAAiC;IACjC,OAAO,EAAE,OAAO,CAAC;IACjB,yCAAyC;IACzC,cAAc,EAAE,OAAO,CAAC;CACzB;AAED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,EAC3B,OAAO,EACP,KAAK,EACL,QAAQ,EACR,aAAa,EACb,kBAAkB,EACnB,EAAE,mBAAmB,GAAG,kBAAkB,CA8C1C"}
@@ -0,0 +1,21 @@
1
+ import React from 'react';
2
+ import { type FormatterHelpers } from '@desource/phone-mask';
3
+ export interface UseInputHandlersOptions {
4
+ formatter: FormatterHelpers;
5
+ digits: string;
6
+ inactive?: boolean;
7
+ onChange?: (newDigits: string) => void;
8
+ scheduleValidationHint?: (delay: number) => void;
9
+ }
10
+ export interface UseInputHandlersReturn {
11
+ handleBeforeInput: (e: React.SyntheticEvent<HTMLInputElement> | InputEvent) => void;
12
+ handleInput: (e: React.SyntheticEvent<HTMLInputElement> | Event) => void;
13
+ handleKeydown: (e: React.KeyboardEvent<HTMLInputElement> | KeyboardEvent) => void;
14
+ handlePaste: (e: React.ClipboardEvent<HTMLInputElement> | ClipboardEvent) => void;
15
+ }
16
+ /**
17
+ * React hook that provides event handlers for phone input masking.
18
+ * Handlers are compatible with both native events and React synthetic events.
19
+ */
20
+ export declare function useInputHandlers(options: UseInputHandlersOptions): UseInputHandlersReturn;
21
+ //# sourceMappingURL=useInputHandlers.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useInputHandlers.d.ts","sourceRoot":"","sources":["../../../../src/hooks/internal/useInputHandlers.ts"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,EAML,KAAK,gBAAgB,EACtB,MAAM,sBAAsB,CAAC;AAE9B,MAAM,WAAW,uBAAuB;IACtC,SAAS,EAAE,gBAAgB,CAAC;IAC5B,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,sBAAsB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAClD;AAED,MAAM,WAAW,sBAAsB;IACrC,iBAAiB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,GAAG,UAAU,KAAK,IAAI,CAAC;IACpF,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,GAAG,KAAK,KAAK,IAAI,CAAC;IACzE,aAAa,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,GAAG,aAAa,KAAK,IAAI,CAAC;IAClF,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,gBAAgB,CAAC,GAAG,cAAc,KAAK,IAAI,CAAC;CACnF;AAUD;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,uBAAuB,GAAG,sBAAsB,CAyEzF"}
@@ -0,0 +1,9 @@
1
+ import type { Theme } from '../../types';
2
+ interface UseThemeOptions {
3
+ theme: Theme;
4
+ }
5
+ export declare function useTheme({ theme }: UseThemeOptions): {
6
+ themeClass: string;
7
+ };
8
+ export {};
9
+ //# sourceMappingURL=useTheme.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useTheme.d.ts","sourceRoot":"","sources":["../../../../src/hooks/internal/useTheme.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEzC,UAAU,eAAe;IACvB,KAAK,EAAE,KAAK,CAAC;CACd;AAED,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,EAAE,eAAe;;EA6BlD"}
@@ -0,0 +1,6 @@
1
+ export declare function useValidationHint(): {
2
+ showValidationHint: boolean;
3
+ clearValidationHint: (hideHint?: boolean) => void;
4
+ scheduleValidationHint: (delay: number) => void;
5
+ };
6
+ //# sourceMappingURL=useValidationHint.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useValidationHint.d.ts","sourceRoot":"","sources":["../../../../src/hooks/internal/useValidationHint.ts"],"names":[],"mappings":"AAGA,wBAAgB,iBAAiB;;;oCAcrB,MAAM;EAUjB"}
@@ -2,6 +2,7 @@ import type { UsePhoneMaskOptions, UsePhoneMaskReturn } from '../types';
2
2
  /**
3
3
  * React hook for phone number masking.
4
4
  * Provides low-level phone masking functionality for custom input implementations.
5
+ * Works in controlled mode — caller manages value state via onChange callback.
5
6
  */
6
- export declare function usePhoneMask(options?: UsePhoneMaskOptions): UsePhoneMaskReturn;
7
+ export declare function usePhoneMask(options: UsePhoneMaskOptions): UsePhoneMaskReturn;
7
8
  //# sourceMappingURL=usePhoneMask.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"usePhoneMask.d.ts","sourceRoot":"","sources":["../../../src/hooks/usePhoneMask.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,mBAAmB,EAAE,kBAAkB,EAAe,MAAM,UAAU,CAAC;AAyBrF;;;GAGG;AACH,wBAAgB,YAAY,CAAC,OAAO,GAAE,mBAAwB,GAAG,kBAAkB,CAwTlF"}
1
+ {"version":3,"file":"usePhoneMask.d.ts","sourceRoot":"","sources":["../../../src/hooks/usePhoneMask.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAExE;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,OAAO,EAAE,mBAAmB,GAAG,kBAAkB,CA4F7E"}
@@ -0,0 +1,6 @@
1
+ export declare function useClipboard(delay?: number): {
2
+ copied: boolean;
3
+ isCopying: boolean;
4
+ copy: (text: string) => Promise<boolean>;
5
+ };
6
+ //# sourceMappingURL=useClipboard.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useClipboard.d.ts","sourceRoot":"","sources":["../../../../src/hooks/utility/useClipboard.ts"],"names":[],"mappings":"AAGA,wBAAgB,YAAY,CAAC,KAAK,SAAQ;;;iBAMzB,MAAM;EAuBtB"}
@@ -0,0 +1,9 @@
1
+ /**
2
+ * Custom hook for managing timers with automatic cleanup
3
+ * @returns Object with set and clear methods for timer control
4
+ */
5
+ export declare function useTimer(): {
6
+ set: (callback: () => void, delay: number) => void;
7
+ clear: () => void;
8
+ };
9
+ //# sourceMappingURL=useTimer.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useTimer.d.ts","sourceRoot":"","sources":["../../../../src/hooks/utility/useTimer.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,wBAAgB,QAAQ;oBAWT,MAAM,IAAI,SAAS,MAAM;;EAavC"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EACjB,mBAAmB,EACnB,eAAe,EACf,uBAAuB,EACvB,OAAO,EACR,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,YAAY,EACV,eAAe,EACf,aAAa,EACb,WAAW,EACX,mBAAmB,EACnB,kBAAkB,EAClB,IAAI,IAAI,cAAc,EACtB,KAAK,IAAI,eAAe,EACzB,MAAM,SAAS,CAAC;AAEjB,YAAY,EACV,UAAU,IAAI,WAAW,EACzB,QAAQ,IAAI,SAAS,EACrB,WAAW,IAAI,YAAY,EAC3B,IAAI,IAAI,KAAK,EACb,OAAO,IAAI,QAAQ,EACnB,YAAY,IAAI,aAAa,EAC7B,eAAe,IAAI,gBAAgB,EACnC,QAAQ,IAAI,SAAS,EACrB,WAAW,IAAI,YAAY,EAC5B,MAAM,sBAAsB,CAAC;AAE9B,eAAO,MAAM,YAAY;;;;;;;CAOxB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EACjB,mBAAmB,EACnB,eAAe,EACf,uBAAuB,EACvB,OAAO,EACR,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAEpD,YAAY,EACV,eAAe,EACf,aAAa,EACb,WAAW,EACX,mBAAmB,EACnB,kBAAkB,EAClB,IAAI,IAAI,cAAc,EACtB,KAAK,IAAI,eAAe,EACzB,MAAM,SAAS,CAAC;AAEjB,YAAY,EACV,UAAU,IAAI,WAAW,EACzB,QAAQ,IAAI,SAAS,EACrB,WAAW,IAAI,YAAY,EAC3B,IAAI,IAAI,KAAK,EACb,OAAO,IAAI,QAAQ,EACnB,YAAY,IAAI,aAAa,EAC7B,eAAe,IAAI,gBAAgB,EACnC,QAAQ,IAAI,SAAS,EACrB,WAAW,IAAI,YAAY,EAC5B,MAAM,sBAAsB,CAAC;AAE9B,eAAO,MAAM,YAAY;;;;;;;CAOxB,CAAC"}