intelliwaketssveltekitv25 0.1.81 → 0.1.82

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.
@@ -1,3 +1,5 @@
1
+ import type { HTMLInputAttributes } from 'svelte/elements';
2
+ import type { ActionArray } from './useActions';
1
3
  export declare const KEY_UP_ARROW = 38;
2
4
  export declare const KEY_DOWN_ARROW = 40;
3
5
  export declare const KEY_LEFT_ARROW = 37;
@@ -190,3 +192,16 @@ export declare function IsMobileOrTablet(): boolean;
190
192
  */
191
193
  export declare function DownloadString(filename: string, text: string): void;
192
194
  export declare function HandleKeyDownNumerics(event: KeyboardEvent, allowDecimals?: boolean): void;
195
+ export type TInputNumberAttributes = HTMLInputAttributes & {
196
+ value: number | null;
197
+ onchange?: (value: number | null) => void;
198
+ inputClass?: string;
199
+ decimals?: number;
200
+ decimalsMax?: number;
201
+ min?: number | null;
202
+ max?: number | null;
203
+ prefix?: string;
204
+ suffix?: string;
205
+ shiftDigits?: number;
206
+ use?: ActionArray;
207
+ };
@@ -1,60 +1,17 @@
1
1
  <script lang="ts">
2
2
  import InputNumber from './InputNumber.svelte'
3
- import type { ActionArray } from './useActions'
3
+ import type { TInputNumberAttributes } from './Functions'
4
4
 
5
5
  let {
6
6
  value = $bindable(),
7
- class: clazz = '',
8
- inputClass = '',
9
- id,
10
- name,
11
- placeholder,
12
- title,
13
- onchange,
14
7
  decimals = 2,
15
- decimalsMax,
16
- min = null,
17
- max = null,
18
- readonly,
19
- disabled,
20
- required,
21
- use = []
22
- }: {
23
- value: number | null,
24
- class?: string,
25
- inputClass?: string,
26
- id?: string,
27
- name?: string
28
- placeholder?: string
29
- title?: string
30
- onchange?: (value: number | null) => void
31
- decimals?: number
32
- decimalsMax?: number
33
- min?: number | null
34
- max?: number | null
35
- readonly?: boolean
36
- disabled?: boolean
37
- required?: boolean
38
- use?: ActionArray
39
- } = $props()
8
+ ...otherProps
9
+ }: TInputNumberAttributes = $props()
40
10
 
41
11
  </script>
42
12
 
43
13
  <InputNumber bind:value
44
- class={clazz}
45
- {inputClass}
46
- {id}
47
- {name}
48
- {placeholder}
49
- {title}
50
- {onchange}
51
14
  {decimals}
52
- {decimalsMax}
53
- {min}
54
- {max}
55
- {readonly}
56
- {disabled}
57
- {required}
58
- {use}
15
+ {...otherProps}
59
16
  prefix="$"
60
17
  />
@@ -1,22 +1,4 @@
1
- import type { ActionArray } from './useActions';
2
- type $$ComponentProps = {
3
- value: number | null;
4
- class?: string;
5
- inputClass?: string;
6
- id?: string;
7
- name?: string;
8
- placeholder?: string;
9
- title?: string;
10
- onchange?: (value: number | null) => void;
11
- decimals?: number;
12
- decimalsMax?: number;
13
- min?: number | null;
14
- max?: number | null;
15
- readonly?: boolean;
16
- disabled?: boolean;
17
- required?: boolean;
18
- use?: ActionArray;
19
- };
20
- declare const InputCurrency: import("svelte").Component<$$ComponentProps, {}, "value">;
1
+ import type { TInputNumberAttributes } from './Functions';
2
+ declare const InputCurrency: import("svelte").Component<TInputNumberAttributes, {}, "value">;
21
3
  type InputCurrency = ReturnType<typeof InputCurrency>;
22
4
  export default InputCurrency;
@@ -1,51 +1,22 @@
1
1
  <script lang="ts">
2
2
  import { CleanNumber, CleanNumberNull, CleanNumbers } from '@solidbasisventures/intelliwaketsfoundation'
3
3
  import { tick } from 'svelte'
4
- import { HandleKeyDownNumerics } from './Functions'
5
- import { type ActionArray, useActions } from './useActions'
4
+ import { HandleKeyDownNumerics, type TInputNumberAttributes } from './Functions'
6
5
 
7
6
  let {
8
7
  value = $bindable(),
9
8
  class: clazz = '',
10
9
  inputClass = '',
11
- id,
12
- name,
13
- placeholder,
14
- title,
15
10
  onchange,
16
11
  decimals,
17
12
  decimalsMax,
18
13
  min = null,
19
14
  max = null,
20
- readonly,
21
- disabled,
22
- required,
23
15
  prefix,
24
16
  suffix,
25
17
  shiftDigits = 0,
26
- /** Typical usage: use={[autoFocus, selectOnFocus]} */
27
- use = []
28
- }: {
29
- value: number | null,
30
- class?: string,
31
- inputClass?: string,
32
- id?: string,
33
- name?: string
34
- placeholder?: string,
35
- title?: string,
36
- onchange?: (value: number | null) => void
37
- decimals?: number
38
- decimalsMax?: number
39
- min?: number | null
40
- max?: number | null
41
- readonly?: boolean
42
- disabled?: boolean
43
- required?: boolean
44
- prefix?: string
45
- suffix?: string
46
- shiftDigits?: number
47
- use?: ActionArray
48
- } = $props()
18
+ ...otherProps
19
+ }: TInputNumberAttributes = $props()
49
20
 
50
21
  let displayValue = $state('')
51
22
  let isFocused = $state(false)
@@ -57,7 +28,7 @@
57
28
  if (!isFocused) {
58
29
  tick()
59
30
  .then(() => {
60
- let newDisplayValue = useValue != null ? CleanNumber(useValue * displayMultiplier, constrainDecimals).toFixed(constrainDecimals) : !!required ? '0' : ''
31
+ let newDisplayValue = useValue != null ? CleanNumber(useValue * displayMultiplier, constrainDecimals).toFixed(constrainDecimals) : !!otherProps.required ? '0' : ''
61
32
  if (!!decimalsMax && newDisplayValue.includes('.')) {
62
33
  newDisplayValue = newDisplayValue.replace(/\.?0+$/, '')
63
34
  }
@@ -79,7 +50,7 @@
79
50
 
80
51
  let numericValue = CleanNumberNull(cleanValue, constrainDecimals)
81
52
  if (numericValue === null) {
82
- value = !!required ? 0 : null
53
+ value = !!otherProps.required ? 0 : null
83
54
  if (onchange) onchange(numericValue)
84
55
  } else if (!isNaN(numericValue)) {
85
56
  numericValue /= displayMultiplier
@@ -102,21 +73,23 @@
102
73
  type="text"
103
74
  inputmode={!!constrainDecimals ? "decimal" : "numeric"}
104
75
  pattern={!!constrainDecimals ? "[0-9]*[.,]?[0-9]+" : "[0-9]*"}
105
- class="text-right {inputClass}"
106
76
  style={inputStyle}
107
- {id}
108
- {name}
109
- {placeholder}
110
- {title}
111
- {readonly}
112
- {disabled}
113
- {required}
77
+ {...otherProps}
78
+ class="text-right {inputClass}"
114
79
  value={displayValue}
115
- oninput={handleInput}
116
- onkeydown={e => HandleKeyDownNumerics(e, !!constrainDecimals)}
117
- onblur={() => refreshDisplayValue(value)}
80
+ oninput={e => {
81
+ handleInput(e)
82
+ if (otherProps.oninput) otherProps.oninput(e)
83
+ }}
84
+ onkeydown={e => {
85
+ HandleKeyDownNumerics(e, !!constrainDecimals)
86
+ if (otherProps.onkeydown) otherProps.onkeydown(e)
87
+ }}
88
+ onblur={e => {
89
+ refreshDisplayValue(value)
90
+ if (otherProps.onblur) otherProps.onblur(e)
91
+ }}
118
92
  bind:focused={isFocused}
119
- use:useActions={use}
120
93
  />
121
94
  {#if prefix}
122
95
  <div class="absolute pointer-events-none left-1 top-1/2 -translate-y-1/2">{prefix}</div>
@@ -1,25 +1,4 @@
1
- import { type ActionArray } from './useActions';
2
- type $$ComponentProps = {
3
- value: number | null;
4
- class?: string;
5
- inputClass?: string;
6
- id?: string;
7
- name?: string;
8
- placeholder?: string;
9
- title?: string;
10
- onchange?: (value: number | null) => void;
11
- decimals?: number;
12
- decimalsMax?: number;
13
- min?: number | null;
14
- max?: number | null;
15
- readonly?: boolean;
16
- disabled?: boolean;
17
- required?: boolean;
18
- prefix?: string;
19
- suffix?: string;
20
- shiftDigits?: number;
21
- use?: ActionArray;
22
- };
23
- declare const InputNumber: import("svelte").Component<$$ComponentProps, {}, "value">;
1
+ import { type TInputNumberAttributes } from './Functions';
2
+ declare const InputNumber: import("svelte").Component<TInputNumberAttributes, {}, "value">;
24
3
  type InputNumber = ReturnType<typeof InputNumber>;
25
4
  export default InputNumber;
@@ -1,61 +1,18 @@
1
1
  <script lang="ts">
2
2
  import InputNumber from './InputNumber.svelte'
3
- import type { ActionArray } from './useActions'
3
+ import type { TInputNumberAttributes } from './Functions'
4
4
 
5
5
  let {
6
6
  value = $bindable(),
7
- class: clazz = '',
8
- inputClass = '',
9
- id,
10
- name,
11
- placeholder,
12
- title,
13
- onchange,
14
7
  decimals = 0,
15
- decimalsMax,
16
- min = null,
17
- max = null,
18
- readonly,
19
- disabled,
20
- required,
21
- use = []
22
- }: {
23
- value: number | null,
24
- class?: string,
25
- inputClass?: string,
26
- id?: string,
27
- name?: string
28
- placeholder?: string
29
- title?: string
30
- onchange?: (value: number | null) => void
31
- decimals?: number
32
- decimalsMax?: number
33
- min?: number | null
34
- max?: number | null
35
- readonly?: boolean
36
- disabled?: boolean
37
- required?: boolean
38
- use?: ActionArray
39
- } = $props()
8
+ ...otherProps
9
+ }: TInputNumberAttributes = $props()
40
10
 
41
11
  </script>
42
12
 
43
13
  <InputNumber bind:value
44
- class={clazz}
45
- {inputClass}
46
- {id}
47
- {name}
48
- {placeholder}
49
- {title}
50
- {onchange}
51
14
  {decimals}
52
- {decimalsMax}
53
- {min}
54
- {max}
55
- {readonly}
56
- {disabled}
57
- {required}
58
- {use}
15
+ {...otherProps}
59
16
  shiftDigits={2}
60
17
  suffix="%"
61
18
  />
@@ -1,22 +1,4 @@
1
- import type { ActionArray } from './useActions';
2
- type $$ComponentProps = {
3
- value: number | null;
4
- class?: string;
5
- inputClass?: string;
6
- id?: string;
7
- name?: string;
8
- placeholder?: string;
9
- title?: string;
10
- onchange?: (value: number | null) => void;
11
- decimals?: number;
12
- decimalsMax?: number;
13
- min?: number | null;
14
- max?: number | null;
15
- readonly?: boolean;
16
- disabled?: boolean;
17
- required?: boolean;
18
- use?: ActionArray;
19
- };
20
- declare const InputPercent: import("svelte").Component<$$ComponentProps, {}, "value">;
1
+ import type { TInputNumberAttributes } from './Functions';
2
+ declare const InputPercent: import("svelte").Component<TInputNumberAttributes, {}, "value">;
21
3
  type InputPercent = ReturnType<typeof InputPercent>;
22
4
  export default InputPercent;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "intelliwaketssveltekitv25",
3
- "version": "0.1.81",
3
+ "version": "0.1.82",
4
4
  "exports": {
5
5
  ".": {
6
6
  "types": "./dist/index.d.ts",