intelliwaketssveltekitv25 0.1.79 → 0.1.81

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.
@@ -29,7 +29,7 @@ export declare const IsProd: () => boolean;
29
29
  *
30
30
  * @param el
31
31
  */
32
- export declare function autoFocus(el: HTMLElement | HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement): void;
32
+ export declare function autoFocus(el: HTMLElement | HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement | never): void;
33
33
  /**
34
34
  * A Svelte "Use Action" that scrolls the current component to the bottom when it is added to the DOM
35
35
  * Usage: <div use:scrollToBottom />
@@ -145,7 +145,7 @@ export declare const ErrorMessageStack: (e: any) => TErrorMessageStack;
145
145
  *
146
146
  * @param el
147
147
  */
148
- export declare function selectOnFocus(el: HTMLInputElement | HTMLTextAreaElement): {
148
+ export declare function selectOnFocus(el: HTMLInputElement | HTMLTextAreaElement | never): {
149
149
  destroy(): void;
150
150
  };
151
151
  /**
@@ -1,5 +1,6 @@
1
1
  <script lang="ts">
2
2
  import InputNumber from './InputNumber.svelte'
3
+ import type { ActionArray } from './useActions'
3
4
 
4
5
  let {
5
6
  value = $bindable(),
@@ -11,11 +12,13 @@
11
12
  title,
12
13
  onchange,
13
14
  decimals = 2,
15
+ decimalsMax,
14
16
  min = null,
15
17
  max = null,
16
18
  readonly,
17
19
  disabled,
18
- required
20
+ required,
21
+ use = []
19
22
  }: {
20
23
  value: number | null,
21
24
  class?: string,
@@ -26,11 +29,13 @@
26
29
  title?: string
27
30
  onchange?: (value: number | null) => void
28
31
  decimals?: number
32
+ decimalsMax?: number
29
33
  min?: number | null
30
34
  max?: number | null
31
35
  readonly?: boolean
32
36
  disabled?: boolean
33
37
  required?: boolean
38
+ use?: ActionArray
34
39
  } = $props()
35
40
 
36
41
  </script>
@@ -44,10 +49,12 @@
44
49
  {title}
45
50
  {onchange}
46
51
  {decimals}
52
+ {decimalsMax}
47
53
  {min}
48
54
  {max}
49
55
  {readonly}
50
56
  {disabled}
51
57
  {required}
58
+ {use}
52
59
  prefix="$"
53
60
  />
@@ -1,3 +1,4 @@
1
+ import type { ActionArray } from './useActions';
1
2
  type $$ComponentProps = {
2
3
  value: number | null;
3
4
  class?: string;
@@ -8,11 +9,13 @@ type $$ComponentProps = {
8
9
  title?: string;
9
10
  onchange?: (value: number | null) => void;
10
11
  decimals?: number;
12
+ decimalsMax?: number;
11
13
  min?: number | null;
12
14
  max?: number | null;
13
15
  readonly?: boolean;
14
16
  disabled?: boolean;
15
17
  required?: boolean;
18
+ use?: ActionArray;
16
19
  };
17
20
  declare const InputCurrency: import("svelte").Component<$$ComponentProps, {}, "value">;
18
21
  type InputCurrency = ReturnType<typeof InputCurrency>;
@@ -2,6 +2,7 @@
2
2
  import { CleanNumber, CleanNumberNull, CleanNumbers } from '@solidbasisventures/intelliwaketsfoundation'
3
3
  import { tick } from 'svelte'
4
4
  import { HandleKeyDownNumerics } from './Functions'
5
+ import { type ActionArray, useActions } from './useActions'
5
6
 
6
7
  let {
7
8
  value = $bindable(),
@@ -12,7 +13,8 @@
12
13
  placeholder,
13
14
  title,
14
15
  onchange,
15
- decimals = 0,
16
+ decimals,
17
+ decimalsMax,
16
18
  min = null,
17
19
  max = null,
18
20
  readonly,
@@ -20,7 +22,9 @@
20
22
  required,
21
23
  prefix,
22
24
  suffix,
23
- shiftDigits = 0
25
+ shiftDigits = 0,
26
+ /** Typical usage: use={[autoFocus, selectOnFocus]} */
27
+ use = []
24
28
  }: {
25
29
  value: number | null,
26
30
  class?: string,
@@ -31,6 +35,7 @@
31
35
  title?: string,
32
36
  onchange?: (value: number | null) => void
33
37
  decimals?: number
38
+ decimalsMax?: number
34
39
  min?: number | null
35
40
  max?: number | null
36
41
  readonly?: boolean
@@ -39,20 +44,23 @@
39
44
  prefix?: string
40
45
  suffix?: string
41
46
  shiftDigits?: number
47
+ use?: ActionArray
42
48
  } = $props()
43
49
 
44
50
  let displayValue = $state('')
45
51
  let isFocused = $state(false)
46
52
  let displayMultiplier = $derived(shiftDigits === 0 ? 1 : shiftDigits > 0 ? CleanNumber(`1${'0'.repeat(shiftDigits)}`) : CleanNumber(`.${'0'.repeat(Math.abs(shiftDigits) + 1)}1`))
47
- let useDecimals = $derived(!shiftDigits ? decimals : CleanNumbers(0, decimals, shiftDigits))
48
-
49
- $inspect('useDecimals', useDecimals)
53
+ let constrainDecimals = $derived(decimalsMax ?? decimals ?? 0)
54
+ let useDecimals = $derived(!shiftDigits ? constrainDecimals : CleanNumbers(0, constrainDecimals, shiftDigits))
50
55
 
51
56
  function refreshDisplayValue(useValue: number | null) {
52
57
  if (!isFocused) {
53
58
  tick()
54
59
  .then(() => {
55
- let newDisplayValue = useValue != null ? CleanNumber(useValue * displayMultiplier, decimals).toFixed(decimals) : !!required ? '0' : ''
60
+ let newDisplayValue = useValue != null ? CleanNumber(useValue * displayMultiplier, constrainDecimals).toFixed(constrainDecimals) : !!required ? '0' : ''
61
+ if (!!decimalsMax && newDisplayValue.includes('.')) {
62
+ newDisplayValue = newDisplayValue.replace(/\.?0+$/, '')
63
+ }
56
64
 
57
65
  if (displayValue !== newDisplayValue) {
58
66
  displayValue = newDisplayValue
@@ -69,7 +77,7 @@
69
77
 
70
78
  const cleanValue = newValue.replace(/[^\d.]/g, '')
71
79
 
72
- let numericValue = CleanNumberNull(cleanValue, decimals)
80
+ let numericValue = CleanNumberNull(cleanValue, constrainDecimals)
73
81
  if (numericValue === null) {
74
82
  value = !!required ? 0 : null
75
83
  if (onchange) onchange(numericValue)
@@ -92,8 +100,8 @@
92
100
  <div class="inputAddOn relative overflow-hidden h-fit {clazz}">
93
101
  <input
94
102
  type="text"
95
- inputmode={!!decimals ? "decimal" : "numeric"}
96
- pattern={!!decimals ? "[0-9]*[.,]?[0-9]+" : "[0-9]*"}
103
+ inputmode={!!constrainDecimals ? "decimal" : "numeric"}
104
+ pattern={!!constrainDecimals ? "[0-9]*[.,]?[0-9]+" : "[0-9]*"}
97
105
  class="text-right {inputClass}"
98
106
  style={inputStyle}
99
107
  {id}
@@ -105,9 +113,10 @@
105
113
  {required}
106
114
  value={displayValue}
107
115
  oninput={handleInput}
108
- onkeydown={e => HandleKeyDownNumerics(e, !!decimals)}
116
+ onkeydown={e => HandleKeyDownNumerics(e, !!constrainDecimals)}
109
117
  onblur={() => refreshDisplayValue(value)}
110
118
  bind:focused={isFocused}
119
+ use:useActions={use}
111
120
  />
112
121
  {#if prefix}
113
122
  <div class="absolute pointer-events-none left-1 top-1/2 -translate-y-1/2">{prefix}</div>
@@ -1,3 +1,4 @@
1
+ import { type ActionArray } from './useActions';
1
2
  type $$ComponentProps = {
2
3
  value: number | null;
3
4
  class?: string;
@@ -8,6 +9,7 @@ type $$ComponentProps = {
8
9
  title?: string;
9
10
  onchange?: (value: number | null) => void;
10
11
  decimals?: number;
12
+ decimalsMax?: number;
11
13
  min?: number | null;
12
14
  max?: number | null;
13
15
  readonly?: boolean;
@@ -16,6 +18,7 @@ type $$ComponentProps = {
16
18
  prefix?: string;
17
19
  suffix?: string;
18
20
  shiftDigits?: number;
21
+ use?: ActionArray;
19
22
  };
20
23
  declare const InputNumber: import("svelte").Component<$$ComponentProps, {}, "value">;
21
24
  type InputNumber = ReturnType<typeof InputNumber>;
@@ -1,5 +1,6 @@
1
1
  <script lang="ts">
2
2
  import InputNumber from './InputNumber.svelte'
3
+ import type { ActionArray } from './useActions'
3
4
 
4
5
  let {
5
6
  value = $bindable(),
@@ -11,11 +12,13 @@
11
12
  title,
12
13
  onchange,
13
14
  decimals = 0,
15
+ decimalsMax,
14
16
  min = null,
15
17
  max = null,
16
18
  readonly,
17
19
  disabled,
18
- required
20
+ required,
21
+ use = []
19
22
  }: {
20
23
  value: number | null,
21
24
  class?: string,
@@ -26,11 +29,13 @@
26
29
  title?: string
27
30
  onchange?: (value: number | null) => void
28
31
  decimals?: number
32
+ decimalsMax?: number
29
33
  min?: number | null
30
34
  max?: number | null
31
35
  readonly?: boolean
32
36
  disabled?: boolean
33
37
  required?: boolean
38
+ use?: ActionArray
34
39
  } = $props()
35
40
 
36
41
  </script>
@@ -44,11 +49,13 @@
44
49
  {title}
45
50
  {onchange}
46
51
  {decimals}
52
+ {decimalsMax}
47
53
  {min}
48
54
  {max}
49
55
  {readonly}
50
56
  {disabled}
51
57
  {required}
58
+ {use}
52
59
  shiftDigits={2}
53
60
  suffix="%"
54
61
  />
@@ -1,3 +1,4 @@
1
+ import type { ActionArray } from './useActions';
1
2
  type $$ComponentProps = {
2
3
  value: number | null;
3
4
  class?: string;
@@ -8,11 +9,13 @@ type $$ComponentProps = {
8
9
  title?: string;
9
10
  onchange?: (value: number | null) => void;
10
11
  decimals?: number;
12
+ decimalsMax?: number;
11
13
  min?: number | null;
12
14
  max?: number | null;
13
15
  readonly?: boolean;
14
16
  disabled?: boolean;
15
17
  required?: boolean;
18
+ use?: ActionArray;
16
19
  };
17
20
  declare const InputPercent: import("svelte").Component<$$ComponentProps, {}, "value">;
18
21
  type InputPercent = ReturnType<typeof InputPercent>;
@@ -8,7 +8,7 @@ export type HTMLActionArray = HTMLActionEntry[];
8
8
  export type SvelteSVGActionType<P> = (node: SVGElement, params?: P) => SvelteActionReturnType<P>;
9
9
  export type SVGActionEntry<P extends any = any> = SvelteSVGActionType<P> | [SvelteSVGActionType<P>, P];
10
10
  export type SVGActionArray = SVGActionEntry[];
11
- export type ActionArray = HTMLActionArray | SVGActionArray;
11
+ export type ActionArray = HTMLActionArray | SVGActionArray | unknown[];
12
12
  export declare function useActions(node: HTMLElement | SVGElement, actions: ActionArray): {
13
13
  update(actions: ActionArray): void;
14
14
  destroy(): void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "intelliwaketssveltekitv25",
3
- "version": "0.1.79",
3
+ "version": "0.1.81",
4
4
  "exports": {
5
5
  ".": {
6
6
  "types": "./dist/index.d.ts",