@fiscozen/input 0.1.17 → 1.0.0-next.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 (35) hide show
  1. package/README.md +718 -1
  2. package/coverage/FzCurrencyInput.vue.html +640 -0
  3. package/coverage/FzInput.vue.html +709 -0
  4. package/coverage/base.css +224 -0
  5. package/coverage/block-navigation.js +87 -0
  6. package/coverage/clover.xml +494 -0
  7. package/coverage/coverage-final.json +4 -0
  8. package/coverage/favicon.png +0 -0
  9. package/coverage/index.html +146 -0
  10. package/coverage/prettify.css +1 -0
  11. package/coverage/prettify.js +2 -0
  12. package/coverage/sort-arrow-sprite.png +0 -0
  13. package/coverage/sorter.js +196 -0
  14. package/coverage/useInputStyle.ts.html +343 -0
  15. package/dist/input.js +5282 -2948
  16. package/dist/input.umd.cjs +15 -10
  17. package/dist/src/FzCurrencyInput.vue.d.ts +82 -46
  18. package/dist/src/FzInput.vue.d.ts +141 -42
  19. package/dist/src/index.d.ts +1 -0
  20. package/dist/src/types.d.ts +172 -36
  21. package/dist/src/useInputStyle.d.ts +23 -8
  22. package/dist/src/utils.d.ts +21 -0
  23. package/dist/style.css +1 -0
  24. package/package.json +6 -6
  25. package/src/FzCurrencyInput.vue +746 -106
  26. package/src/FzInput.vue +467 -97
  27. package/src/__tests__/FzCurrencyInput.test.ts +1528 -0
  28. package/src/__tests__/FzInput.test.ts +1005 -0
  29. package/src/index.ts +3 -0
  30. package/src/types.ts +171 -46
  31. package/src/useInputStyle.ts +96 -38
  32. package/src/utils.ts +64 -0
  33. package/tsconfig.tsbuildinfo +1 -1
  34. package/src/__tests__/FzCurrencyInput.spec.ts +0 -204
  35. package/src/__tests__/FzInput.spec.ts +0 -181
package/coverage/FzCurrencyInput.vue.html ADDED
@@ -0,0 +1,640 @@
1
+
2
+ <!doctype html>
3
+ <html lang="en">
4
+
5
+ <head>
6
+ <title>Code coverage report for FzCurrencyInput.vue</title>
7
+ <meta charset="utf-8" />
8
+ <link rel="stylesheet" href="prettify.css" />
9
+ <link rel="stylesheet" href="base.css" />
10
+ <link rel="shortcut icon" type="image/x-icon" href="favicon.png" />
11
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
12
+ <style type='text/css'>
13
+ .coverage-summary .sorter {
14
+ background-image: url(sort-arrow-sprite.png);
15
+ }
16
+ </style>
17
+ </head>
18
+
19
+ <body>
20
+ <div class='wrapper'>
21
+ <div class='pad1'>
22
+ <h1><a href="index.html">All files</a> FzCurrencyInput.vue</h1>
23
+ <div class='clearfix'>
24
+
25
+ <div class='fl pad1y space-right2'>
26
+ <span class="strong">96.21% </span>
27
+ <span class="quiet">Statements</span>
28
+ <span class='fraction'>178/185</span>
29
+ </div>
30
+
31
+
32
+ <div class='fl pad1y space-right2'>
33
+ <span class="strong">73.91% </span>
34
+ <span class="quiet">Branches</span>
35
+ <span class='fraction'>17/23</span>
36
+ </div>
37
+
38
+
39
+ <div class='fl pad1y space-right2'>
40
+ <span class="strong">100% </span>
41
+ <span class="quiet">Functions</span>
42
+ <span class='fraction'>4/4</span>
43
+ </div>
44
+
45
+
46
+ <div class='fl pad1y space-right2'>
47
+ <span class="strong">96.21% </span>
48
+ <span class="quiet">Lines</span>
49
+ <span class='fraction'>178/185</span>
50
+ </div>
51
+
52
+
53
+ </div>
54
+ <p class="quiet">
55
+ Press <em>n</em> or <em>j</em> to go to the next uncovered block, <em>b</em>, <em>p</em> or <em>k</em> for the previous block.
56
+ </p>
57
+ <template id="filterTemplate">
58
+ <div class="quiet">
59
+ Filter:
60
+ <input type="search" id="fileSearch">
61
+ </div>
62
+ </template>
63
+ </div>
64
+ <div class='status-line high'></div>
65
+ <pre><table class="coverage">
66
+ <tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a>
67
+ <a name='L2'></a><a href='#L2'>2</a>
68
+ <a name='L3'></a><a href='#L3'>3</a>
69
+ <a name='L4'></a><a href='#L4'>4</a>
70
+ <a name='L5'></a><a href='#L5'>5</a>
71
+ <a name='L6'></a><a href='#L6'>6</a>
72
+ <a name='L7'></a><a href='#L7'>7</a>
73
+ <a name='L8'></a><a href='#L8'>8</a>
74
+ <a name='L9'></a><a href='#L9'>9</a>
75
+ <a name='L10'></a><a href='#L10'>10</a>
76
+ <a name='L11'></a><a href='#L11'>11</a>
77
+ <a name='L12'></a><a href='#L12'>12</a>
78
+ <a name='L13'></a><a href='#L13'>13</a>
79
+ <a name='L14'></a><a href='#L14'>14</a>
80
+ <a name='L15'></a><a href='#L15'>15</a>
81
+ <a name='L16'></a><a href='#L16'>16</a>
82
+ <a name='L17'></a><a href='#L17'>17</a>
83
+ <a name='L18'></a><a href='#L18'>18</a>
84
+ <a name='L19'></a><a href='#L19'>19</a>
85
+ <a name='L20'></a><a href='#L20'>20</a>
86
+ <a name='L21'></a><a href='#L21'>21</a>
87
+ <a name='L22'></a><a href='#L22'>22</a>
88
+ <a name='L23'></a><a href='#L23'>23</a>
89
+ <a name='L24'></a><a href='#L24'>24</a>
90
+ <a name='L25'></a><a href='#L25'>25</a>
91
+ <a name='L26'></a><a href='#L26'>26</a>
92
+ <a name='L27'></a><a href='#L27'>27</a>
93
+ <a name='L28'></a><a href='#L28'>28</a>
94
+ <a name='L29'></a><a href='#L29'>29</a>
95
+ <a name='L30'></a><a href='#L30'>30</a>
96
+ <a name='L31'></a><a href='#L31'>31</a>
97
+ <a name='L32'></a><a href='#L32'>32</a>
98
+ <a name='L33'></a><a href='#L33'>33</a>
99
+ <a name='L34'></a><a href='#L34'>34</a>
100
+ <a name='L35'></a><a href='#L35'>35</a>
101
+ <a name='L36'></a><a href='#L36'>36</a>
102
+ <a name='L37'></a><a href='#L37'>37</a>
103
+ <a name='L38'></a><a href='#L38'>38</a>
104
+ <a name='L39'></a><a href='#L39'>39</a>
105
+ <a name='L40'></a><a href='#L40'>40</a>
106
+ <a name='L41'></a><a href='#L41'>41</a>
107
+ <a name='L42'></a><a href='#L42'>42</a>
108
+ <a name='L43'></a><a href='#L43'>43</a>
109
+ <a name='L44'></a><a href='#L44'>44</a>
110
+ <a name='L45'></a><a href='#L45'>45</a>
111
+ <a name='L46'></a><a href='#L46'>46</a>
112
+ <a name='L47'></a><a href='#L47'>47</a>
113
+ <a name='L48'></a><a href='#L48'>48</a>
114
+ <a name='L49'></a><a href='#L49'>49</a>
115
+ <a name='L50'></a><a href='#L50'>50</a>
116
+ <a name='L51'></a><a href='#L51'>51</a>
117
+ <a name='L52'></a><a href='#L52'>52</a>
118
+ <a name='L53'></a><a href='#L53'>53</a>
119
+ <a name='L54'></a><a href='#L54'>54</a>
120
+ <a name='L55'></a><a href='#L55'>55</a>
121
+ <a name='L56'></a><a href='#L56'>56</a>
122
+ <a name='L57'></a><a href='#L57'>57</a>
123
+ <a name='L58'></a><a href='#L58'>58</a>
124
+ <a name='L59'></a><a href='#L59'>59</a>
125
+ <a name='L60'></a><a href='#L60'>60</a>
126
+ <a name='L61'></a><a href='#L61'>61</a>
127
+ <a name='L62'></a><a href='#L62'>62</a>
128
+ <a name='L63'></a><a href='#L63'>63</a>
129
+ <a name='L64'></a><a href='#L64'>64</a>
130
+ <a name='L65'></a><a href='#L65'>65</a>
131
+ <a name='L66'></a><a href='#L66'>66</a>
132
+ <a name='L67'></a><a href='#L67'>67</a>
133
+ <a name='L68'></a><a href='#L68'>68</a>
134
+ <a name='L69'></a><a href='#L69'>69</a>
135
+ <a name='L70'></a><a href='#L70'>70</a>
136
+ <a name='L71'></a><a href='#L71'>71</a>
137
+ <a name='L72'></a><a href='#L72'>72</a>
138
+ <a name='L73'></a><a href='#L73'>73</a>
139
+ <a name='L74'></a><a href='#L74'>74</a>
140
+ <a name='L75'></a><a href='#L75'>75</a>
141
+ <a name='L76'></a><a href='#L76'>76</a>
142
+ <a name='L77'></a><a href='#L77'>77</a>
143
+ <a name='L78'></a><a href='#L78'>78</a>
144
+ <a name='L79'></a><a href='#L79'>79</a>
145
+ <a name='L80'></a><a href='#L80'>80</a>
146
+ <a name='L81'></a><a href='#L81'>81</a>
147
+ <a name='L82'></a><a href='#L82'>82</a>
148
+ <a name='L83'></a><a href='#L83'>83</a>
149
+ <a name='L84'></a><a href='#L84'>84</a>
150
+ <a name='L85'></a><a href='#L85'>85</a>
151
+ <a name='L86'></a><a href='#L86'>86</a>
152
+ <a name='L87'></a><a href='#L87'>87</a>
153
+ <a name='L88'></a><a href='#L88'>88</a>
154
+ <a name='L89'></a><a href='#L89'>89</a>
155
+ <a name='L90'></a><a href='#L90'>90</a>
156
+ <a name='L91'></a><a href='#L91'>91</a>
157
+ <a name='L92'></a><a href='#L92'>92</a>
158
+ <a name='L93'></a><a href='#L93'>93</a>
159
+ <a name='L94'></a><a href='#L94'>94</a>
160
+ <a name='L95'></a><a href='#L95'>95</a>
161
+ <a name='L96'></a><a href='#L96'>96</a>
162
+ <a name='L97'></a><a href='#L97'>97</a>
163
+ <a name='L98'></a><a href='#L98'>98</a>
164
+ <a name='L99'></a><a href='#L99'>99</a>
165
+ <a name='L100'></a><a href='#L100'>100</a>
166
+ <a name='L101'></a><a href='#L101'>101</a>
167
+ <a name='L102'></a><a href='#L102'>102</a>
168
+ <a name='L103'></a><a href='#L103'>103</a>
169
+ <a name='L104'></a><a href='#L104'>104</a>
170
+ <a name='L105'></a><a href='#L105'>105</a>
171
+ <a name='L106'></a><a href='#L106'>106</a>
172
+ <a name='L107'></a><a href='#L107'>107</a>
173
+ <a name='L108'></a><a href='#L108'>108</a>
174
+ <a name='L109'></a><a href='#L109'>109</a>
175
+ <a name='L110'></a><a href='#L110'>110</a>
176
+ <a name='L111'></a><a href='#L111'>111</a>
177
+ <a name='L112'></a><a href='#L112'>112</a>
178
+ <a name='L113'></a><a href='#L113'>113</a>
179
+ <a name='L114'></a><a href='#L114'>114</a>
180
+ <a name='L115'></a><a href='#L115'>115</a>
181
+ <a name='L116'></a><a href='#L116'>116</a>
182
+ <a name='L117'></a><a href='#L117'>117</a>
183
+ <a name='L118'></a><a href='#L118'>118</a>
184
+ <a name='L119'></a><a href='#L119'>119</a>
185
+ <a name='L120'></a><a href='#L120'>120</a>
186
+ <a name='L121'></a><a href='#L121'>121</a>
187
+ <a name='L122'></a><a href='#L122'>122</a>
188
+ <a name='L123'></a><a href='#L123'>123</a>
189
+ <a name='L124'></a><a href='#L124'>124</a>
190
+ <a name='L125'></a><a href='#L125'>125</a>
191
+ <a name='L126'></a><a href='#L126'>126</a>
192
+ <a name='L127'></a><a href='#L127'>127</a>
193
+ <a name='L128'></a><a href='#L128'>128</a>
194
+ <a name='L129'></a><a href='#L129'>129</a>
195
+ <a name='L130'></a><a href='#L130'>130</a>
196
+ <a name='L131'></a><a href='#L131'>131</a>
197
+ <a name='L132'></a><a href='#L132'>132</a>
198
+ <a name='L133'></a><a href='#L133'>133</a>
199
+ <a name='L134'></a><a href='#L134'>134</a>
200
+ <a name='L135'></a><a href='#L135'>135</a>
201
+ <a name='L136'></a><a href='#L136'>136</a>
202
+ <a name='L137'></a><a href='#L137'>137</a>
203
+ <a name='L138'></a><a href='#L138'>138</a>
204
+ <a name='L139'></a><a href='#L139'>139</a>
205
+ <a name='L140'></a><a href='#L140'>140</a>
206
+ <a name='L141'></a><a href='#L141'>141</a>
207
+ <a name='L142'></a><a href='#L142'>142</a>
208
+ <a name='L143'></a><a href='#L143'>143</a>
209
+ <a name='L144'></a><a href='#L144'>144</a>
210
+ <a name='L145'></a><a href='#L145'>145</a>
211
+ <a name='L146'></a><a href='#L146'>146</a>
212
+ <a name='L147'></a><a href='#L147'>147</a>
213
+ <a name='L148'></a><a href='#L148'>148</a>
214
+ <a name='L149'></a><a href='#L149'>149</a>
215
+ <a name='L150'></a><a href='#L150'>150</a>
216
+ <a name='L151'></a><a href='#L151'>151</a>
217
+ <a name='L152'></a><a href='#L152'>152</a>
218
+ <a name='L153'></a><a href='#L153'>153</a>
219
+ <a name='L154'></a><a href='#L154'>154</a>
220
+ <a name='L155'></a><a href='#L155'>155</a>
221
+ <a name='L156'></a><a href='#L156'>156</a>
222
+ <a name='L157'></a><a href='#L157'>157</a>
223
+ <a name='L158'></a><a href='#L158'>158</a>
224
+ <a name='L159'></a><a href='#L159'>159</a>
225
+ <a name='L160'></a><a href='#L160'>160</a>
226
+ <a name='L161'></a><a href='#L161'>161</a>
227
+ <a name='L162'></a><a href='#L162'>162</a>
228
+ <a name='L163'></a><a href='#L163'>163</a>
229
+ <a name='L164'></a><a href='#L164'>164</a>
230
+ <a name='L165'></a><a href='#L165'>165</a>
231
+ <a name='L166'></a><a href='#L166'>166</a>
232
+ <a name='L167'></a><a href='#L167'>167</a>
233
+ <a name='L168'></a><a href='#L168'>168</a>
234
+ <a name='L169'></a><a href='#L169'>169</a>
235
+ <a name='L170'></a><a href='#L170'>170</a>
236
+ <a name='L171'></a><a href='#L171'>171</a>
237
+ <a name='L172'></a><a href='#L172'>172</a>
238
+ <a name='L173'></a><a href='#L173'>173</a>
239
+ <a name='L174'></a><a href='#L174'>174</a>
240
+ <a name='L175'></a><a href='#L175'>175</a>
241
+ <a name='L176'></a><a href='#L176'>176</a>
242
+ <a name='L177'></a><a href='#L177'>177</a>
243
+ <a name='L178'></a><a href='#L178'>178</a>
244
+ <a name='L179'></a><a href='#L179'>179</a>
245
+ <a name='L180'></a><a href='#L180'>180</a>
246
+ <a name='L181'></a><a href='#L181'>181</a>
247
+ <a name='L182'></a><a href='#L182'>182</a>
248
+ <a name='L183'></a><a href='#L183'>183</a>
249
+ <a name='L184'></a><a href='#L184'>184</a>
250
+ <a name='L185'></a><a href='#L185'>185</a>
251
+ <a name='L186'></a><a href='#L186'>186</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">21x</span>
252
+ <span class="cline-any cline-yes">1x</span>
253
+ <span class="cline-any cline-yes">1x</span>
254
+ <span class="cline-any cline-yes">1x</span>
255
+ <span class="cline-any cline-yes">1x</span>
256
+ <span class="cline-any cline-yes">1x</span>
257
+ <span class="cline-any cline-yes">1x</span>
258
+ <span class="cline-any cline-yes">1x</span>
259
+ <span class="cline-any cline-yes">1x</span>
260
+ <span class="cline-any cline-yes">1x</span>
261
+ <span class="cline-any cline-yes">1x</span>
262
+ <span class="cline-any cline-yes">1x</span>
263
+ <span class="cline-any cline-yes">1x</span>
264
+ <span class="cline-any cline-yes">1x</span>
265
+ <span class="cline-any cline-yes">1x</span>
266
+ <span class="cline-any cline-yes">1x</span>
267
+ <span class="cline-any cline-yes">1x</span>
268
+ <span class="cline-any cline-yes">1x</span>
269
+ <span class="cline-any cline-yes">1x</span>
270
+ <span class="cline-any cline-yes">1x</span>
271
+ <span class="cline-any cline-yes">1x</span>
272
+ <span class="cline-any cline-yes">1x</span>
273
+ <span class="cline-any cline-yes">1x</span>
274
+ <span class="cline-any cline-yes">1x</span>
275
+ <span class="cline-any cline-yes">1x</span>
276
+ <span class="cline-any cline-yes">1x</span>
277
+ <span class="cline-any cline-yes">1x</span>
278
+ <span class="cline-any cline-yes">1x</span>
279
+ <span class="cline-any cline-yes">1x</span>
280
+ <span class="cline-any cline-yes">1x</span>
281
+ <span class="cline-any cline-yes">1x</span>
282
+ <span class="cline-any cline-yes">1x</span>
283
+ <span class="cline-any cline-yes">1x</span>
284
+ <span class="cline-any cline-yes">1x</span>
285
+ <span class="cline-any cline-yes">1x</span>
286
+ <span class="cline-any cline-yes">1x</span>
287
+ <span class="cline-any cline-yes">1x</span>
288
+ <span class="cline-any cline-yes">1x</span>
289
+ <span class="cline-any cline-yes">1x</span>
290
+ <span class="cline-any cline-yes">1x</span>
291
+ <span class="cline-any cline-yes">1x</span>
292
+ <span class="cline-any cline-yes">1x</span>
293
+ <span class="cline-any cline-yes">1x</span>
294
+ <span class="cline-any cline-yes">1x</span>
295
+ <span class="cline-any cline-yes">1x</span>
296
+ <span class="cline-any cline-yes">1x</span>
297
+ <span class="cline-any cline-yes">1x</span>
298
+ <span class="cline-any cline-yes">1x</span>
299
+ <span class="cline-any cline-yes">1x</span>
300
+ <span class="cline-any cline-yes">1x</span>
301
+ <span class="cline-any cline-yes">1x</span>
302
+ <span class="cline-any cline-yes">1x</span>
303
+ <span class="cline-any cline-yes">1x</span>
304
+ <span class="cline-any cline-yes">1x</span>
305
+ <span class="cline-any cline-yes">1x</span>
306
+ <span class="cline-any cline-yes">6x</span>
307
+ <span class="cline-any cline-yes">6x</span>
308
+ <span class="cline-any cline-yes">6x</span>
309
+ <span class="cline-any cline-no">&nbsp;</span>
310
+ <span class="cline-any cline-no">&nbsp;</span>
311
+ <span class="cline-any cline-yes">6x</span>
312
+ <span class="cline-any cline-yes">6x</span>
313
+ <span class="cline-any cline-yes">6x</span>
314
+ <span class="cline-any cline-yes">6x</span>
315
+ <span class="cline-any cline-yes">6x</span>
316
+ <span class="cline-any cline-no">&nbsp;</span>
317
+ <span class="cline-any cline-no">&nbsp;</span>
318
+ <span class="cline-any cline-yes">6x</span>
319
+ <span class="cline-any cline-yes">6x</span>
320
+ <span class="cline-any cline-yes">6x</span>
321
+ <span class="cline-any cline-yes">6x</span>
322
+ <span class="cline-any cline-no">&nbsp;</span>
323
+ <span class="cline-any cline-yes">6x</span>
324
+ <span class="cline-any cline-yes">6x</span>
325
+ <span class="cline-any cline-yes">6x</span>
326
+ <span class="cline-any cline-yes">6x</span>
327
+ <span class="cline-any cline-yes">6x</span>
328
+ <span class="cline-any cline-yes">6x</span>
329
+ <span class="cline-any cline-yes">6x</span>
330
+ <span class="cline-any cline-yes">6x</span>
331
+ <span class="cline-any cline-yes">6x</span>
332
+ <span class="cline-any cline-yes">6x</span>
333
+ <span class="cline-any cline-yes">6x</span>
334
+ <span class="cline-any cline-yes">6x</span>
335
+ <span class="cline-any cline-yes">6x</span>
336
+ <span class="cline-any cline-yes">6x</span>
337
+ <span class="cline-any cline-yes">6x</span>
338
+ <span class="cline-any cline-yes">6x</span>
339
+ <span class="cline-any cline-yes">6x</span>
340
+ <span class="cline-any cline-yes">1x</span>
341
+ <span class="cline-any cline-yes">1x</span>
342
+ <span class="cline-any cline-yes">1x</span>
343
+ <span class="cline-any cline-yes">6x</span>
344
+ <span class="cline-any cline-yes">6x</span>
345
+ <span class="cline-any cline-yes">6x</span>
346
+ <span class="cline-any cline-yes">5x</span>
347
+ <span class="cline-any cline-yes">1x</span>
348
+ <span class="cline-any cline-yes">1x</span>
349
+ <span class="cline-any cline-yes">5x</span>
350
+ <span class="cline-any cline-yes">5x</span>
351
+ <span class="cline-any cline-yes">5x</span>
352
+ <span class="cline-any cline-yes">5x</span>
353
+ <span class="cline-any cline-yes">5x</span>
354
+ <span class="cline-any cline-yes">5x</span>
355
+ <span class="cline-any cline-yes">3x</span>
356
+ <span class="cline-any cline-yes">3x</span>
357
+ <span class="cline-any cline-yes">5x</span>
358
+ <span class="cline-any cline-yes">6x</span>
359
+ <span class="cline-any cline-yes">6x</span>
360
+ <span class="cline-any cline-yes">6x</span>
361
+ <span class="cline-any cline-yes">6x</span>
362
+ <span class="cline-any cline-yes">6x</span>
363
+ <span class="cline-any cline-yes">6x</span>
364
+ <span class="cline-any cline-yes">6x</span>
365
+ <span class="cline-any cline-yes">6x</span>
366
+ <span class="cline-any cline-yes">6x</span>
367
+ <span class="cline-any cline-yes">6x</span>
368
+ <span class="cline-any cline-yes">6x</span>
369
+ <span class="cline-any cline-yes">6x</span>
370
+ <span class="cline-any cline-yes">1x</span>
371
+ <span class="cline-any cline-yes">1x</span>
372
+ <span class="cline-any cline-yes">7x</span>
373
+ <span class="cline-any cline-yes">7x</span>
374
+ <span class="cline-any cline-yes">7x</span>
375
+ <span class="cline-any cline-yes">7x</span>
376
+ <span class="cline-any cline-yes">1x</span>
377
+ <span class="cline-any cline-yes">1x</span>
378
+ <span class="cline-any cline-yes">1x</span>
379
+ <span class="cline-any cline-yes">1x</span>
380
+ <span class="cline-any cline-yes">1x</span>
381
+ <span class="cline-any cline-yes">1x</span>
382
+ <span class="cline-any cline-yes">1x</span>
383
+ <span class="cline-any cline-yes">1x</span>
384
+ <span class="cline-any cline-yes">1x</span>
385
+ <span class="cline-any cline-yes">1x</span>
386
+ <span class="cline-any cline-yes">3x</span>
387
+ <span class="cline-any cline-no">&nbsp;</span>
388
+ <span class="cline-any cline-no">&nbsp;</span>
389
+ <span class="cline-any cline-yes">3x</span>
390
+ <span class="cline-any cline-yes">3x</span>
391
+ <span class="cline-any cline-yes">3x</span>
392
+ <span class="cline-any cline-yes">3x</span>
393
+ <span class="cline-any cline-yes">3x</span>
394
+ <span class="cline-any cline-yes">3x</span>
395
+ <span class="cline-any cline-yes">3x</span>
396
+ <span class="cline-any cline-yes">1x</span>
397
+ <span class="cline-any cline-yes">1x</span>
398
+ <span class="cline-any cline-yes">18x</span>
399
+ <span class="cline-any cline-yes">1x</span>
400
+ <span class="cline-any cline-yes">1x</span>
401
+ <span class="cline-any cline-yes">1x</span>
402
+ <span class="cline-any cline-yes">1x</span>
403
+ <span class="cline-any cline-yes">1x</span>
404
+ <span class="cline-any cline-yes">1x</span>
405
+ <span class="cline-any cline-yes">1x</span>
406
+ <span class="cline-any cline-yes">1x</span>
407
+ <span class="cline-any cline-yes">1x</span>
408
+ <span class="cline-any cline-yes">1x</span>
409
+ <span class="cline-any cline-yes">1x</span>
410
+ <span class="cline-any cline-yes">1x</span>
411
+ <span class="cline-any cline-yes">1x</span>
412
+ <span class="cline-any cline-yes">1x</span>
413
+ <span class="cline-any cline-yes">1x</span>
414
+ <span class="cline-any cline-yes">1x</span>
415
+ <span class="cline-any cline-yes">1x</span>
416
+ <span class="cline-any cline-yes">1x</span>
417
+ <span class="cline-any cline-yes">1x</span>
418
+ <span class="cline-any cline-yes">1x</span>
419
+ <span class="cline-any cline-yes">1x</span>
420
+ <span class="cline-any cline-yes">1x</span>
421
+ <span class="cline-any cline-yes">1x</span>
422
+ <span class="cline-any cline-yes">1x</span>
423
+ <span class="cline-any cline-yes">1x</span>
424
+ <span class="cline-any cline-yes">1x</span>
425
+ <span class="cline-any cline-yes">1x</span>
426
+ <span class="cline-any cline-yes">1x</span>
427
+ <span class="cline-any cline-yes">1x</span>
428
+ <span class="cline-any cline-yes">1x</span>
429
+ <span class="cline-any cline-yes">1x</span>
430
+ <span class="cline-any cline-yes">1x</span>
431
+ <span class="cline-any cline-yes">1x</span>
432
+ <span class="cline-any cline-yes">1x</span>
433
+ <span class="cline-any cline-yes">1x</span>
434
+ <span class="cline-any cline-yes">1x</span>
435
+ <span class="cline-any cline-yes">1x</span>
436
+ <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">&lt;script setup lang="ts"&gt;
437
+ /**
438
+ * FzCurrencyInput Component
439
+ *
440
+ * Specialized currency input built on FzInput with number formatting, validation,
441
+ * and step controls. Formats values using Intl.NumberFormat with locale-aware separators.
442
+ * Supports min/max constraints, step quantization, and intelligent paste parsing
443
+ * that detects decimal/thousand separators automatically.
444
+ *
445
+ * @component
446
+ * @example
447
+ * &lt;FzCurrencyInput label="Amount" v-model:amount="value" :min="0" :max="1000" /&gt;
448
+ */
449
+ import { computed, nextTick, onMounted, ref, watch } from "vue";
450
+ import FzInput from "./FzInput.vue";
451
+ import { FzCurrencyInputProps } from "./types";
452
+ import { roundTo, useCurrency } from "@fiscozen/composables";
453
+ import { FzIcon } from "@fiscozen/icons";
454
+ &nbsp;
455
+ const fzInputRef = ref&lt;InstanceType&lt;typeof FzInput&gt;&gt;();
456
+ const fzInputModel = ref();
457
+ const containerRef = computed(() =&gt; fzInputRef.value?.containerRef);
458
+ const inputRef = computed(() =&gt; fzInputRef.value?.inputRef);
459
+ const props = withDefaults(defineProps&lt;FzCurrencyInputProps&gt;(), {
460
+ minimumFractionDigits: 2,
461
+ maximumFractionDigits: 2,
462
+ });
463
+ const {
464
+ inputRef: currencyInputRef,
465
+ setValue,
466
+ emitAmount,
467
+ parse,
468
+ format,
469
+ } = useCurrency({
470
+ minimumFractionDigits: props.minimumFractionDigits,
471
+ maximumFractionDigits: props.maximumFractionDigits,
472
+ min: props.min,
473
+ max: props.max,
474
+ step: props.step,
475
+ });
476
+ &nbsp;
477
+ defineEmits(["update:amount"]);
478
+ &nbsp;
479
+ /**
480
+ * Handles paste events with intelligent separator detection
481
+ *
482
+ * Parses pasted text by detecting decimal and thousand separators using heuristics:
483
+ * - Multiple different separators: rightmost is decimal
484
+ * - Multiple same separators: thousand separator
485
+ * - Single separator with &lt;3 digits after: decimal separator
486
+ * - Single separator with 3+ digits after: ambiguous, uses default formatting
487
+ *
488
+ * Normalizes to dot decimal separator before parsing, then formats using locale settings.
489
+ */
490
+ const onPaste = (e: ClipboardEvent) =&gt; {
491
+ e.preventDefault();
492
+ &nbsp;
493
+ if (props.readonly) <span class="branch-0 cbranch-no" title="branch not covered" >{</span>
494
+ <span class="cstat-no" title="statement not covered" > return;</span>
495
+ <span class="cstat-no" title="statement not covered" > }</span>
496
+ &nbsp;
497
+ let rawPastedText;
498
+ if (e.clipboardData &amp;&amp; e.clipboardData.getData) {
499
+ rawPastedText = e.clipboardData.getData("text/plain");
500
+ <span class="branch-0 cbranch-no" title="branch not covered" > } else {</span>
501
+ <span class="cstat-no" title="statement not covered" > throw "invalid paste value";</span>
502
+ <span class="cstat-no" title="statement not covered" > }</span>
503
+ &nbsp;
504
+ // Fix for firefox paste handling on `contenteditable` elements where `e.target` is the text node, not the element
505
+ let eventTarget;
506
+ if ((!e.target as any)?.tagName) <span class="branch-0 cbranch-no" title="branch not covered" >{</span>
507
+ <span class="cstat-no" title="statement not covered" > eventTarget = (e as any).explicitOriginalTarget;</span>
508
+ } else {
509
+ eventTarget = e.target;
510
+ }
511
+ &nbsp;
512
+ let isNegative = rawPastedText.slice(0, 1) === "-";
513
+ const separatorRegex = /[,.]/g;
514
+ const separators: string[] = [...rawPastedText.matchAll(separatorRegex)].map(
515
+ (regexRes) =&gt; regexRes[0]
516
+ );
517
+ &nbsp;
518
+ const uniqueSeparators = new Set(separators);
519
+ let decimalSeparator = ".";
520
+ let thousandSeparator = "";
521
+ let unknownSeparator;
522
+ &nbsp;
523
+ // case 1: there are 2 different separators pasted, therefore we can assume the rightmost is the decimal separator
524
+ if (uniqueSeparators.size &gt; 1) {
525
+ decimalSeparator = separators[separators.length - 1];
526
+ thousandSeparator = separators[0];
527
+ }
528
+ &nbsp;
529
+ // case 2: there are multiple instances of the same separator, therefore it must be the thousand separator
530
+ if (uniqueSeparators.size === 1) {
531
+ if (separators.length &gt; 1) {
532
+ thousandSeparator = separators[0];
533
+ }
534
+ &nbsp;
535
+ // case 3: there is only one instance of a separator with &lt; 3 digits afterwards (must be decimal separator)
536
+ unknownSeparator = separators[0];
537
+ const splitted = rawPastedText.split(unknownSeparator);
538
+ &nbsp;
539
+ if (splitted[1].length !== 3) {
540
+ decimalSeparator = unknownSeparator;
541
+ }
542
+ }
543
+ &nbsp;
544
+ // case 3: there is only one instance of a separator with 3 digits afterwards. Here we cannot make assumptions
545
+ // we will format based on settings
546
+ //@ts-ignore
547
+ let safeText = rawPastedText.replaceAll(thousandSeparator, "").trim();
548
+ safeText = safeText.replaceAll(decimalSeparator, ".").trim();
549
+ &nbsp;
550
+ const safeNum = parse(safeText);
551
+ safeText = format(safeNum);
552
+ setValue(safeText);
553
+ emitAmount(safeNum);
554
+ };
555
+ &nbsp;
556
+ onMounted(() =&gt; {
557
+ currencyInputRef.value = inputRef.value;
558
+ nextTick(() =&gt; {
559
+ fzInputModel.value = inputRef.value?.value;
560
+ });
561
+ });
562
+ const model = defineModel&lt;number&gt;("amount");
563
+ &nbsp;
564
+ /**
565
+ * Increments or decrements value by step amount
566
+ *
567
+ * When forceStep is true, rounds current value to nearest step before applying increment.
568
+ * Formats result using locale settings and updates both display and model value.
569
+ */
570
+ const stepUpDown = (amount: number) =&gt; {
571
+ if (!props.step) <span class="branch-0 cbranch-no" title="branch not covered" >{</span>
572
+ <span class="cstat-no" title="statement not covered" > return;</span>
573
+ <span class="cstat-no" title="statement not covered" > }</span>
574
+ const value = model.<span class="branch-0 cbranch-no" title="branch not covered" >value || 0;</span>
575
+ let stepVal = props.<span class="branch-0 cbranch-no" title="branch not covered" >forceStep ? roundTo(props.step, value) : v</span>alue;
576
+ stepVal += amount;
577
+ const safeText = format(stepVal);
578
+ setValue(safeText);
579
+ emitAmount(stepVal);
580
+ };
581
+ &nbsp;
582
+ watch(model, (newVal) =&gt; {
583
+ fzInputModel.value = newVal;
584
+ });
585
+ &nbsp;
586
+ defineExpose({
587
+ inputRef,
588
+ containerRef,
589
+ });
590
+ &lt;/script&gt;
591
+ &nbsp;
592
+ &lt;template&gt;
593
+ &lt;FzInput
594
+ ref="fzInputRef"
595
+ v-bind="props"
596
+ :modelValue="fzInputModel"
597
+ type="text"
598
+ @paste="onPaste"
599
+ &gt;
600
+ &lt;template #right-icon v-if="step"&gt;
601
+ &lt;div class="flex flex-col justify-between items-center"&gt;
602
+ &lt;FzIcon
603
+ name="angle-up"
604
+ size="xs"
605
+ class="fz__currencyinput__arrowup cursor-pointer"
606
+ @click="stepUpDown(step)"
607
+ &gt;&lt;/FzIcon&gt;
608
+ &lt;FzIcon
609
+ name="angle-down"
610
+ size="xs"
611
+ class="fz__currencyinput__arrowdown cursor-pointer"
612
+ @click="stepUpDown(-step)"
613
+ &gt;&lt;/FzIcon&gt;
614
+ &lt;/div&gt;
615
+ &lt;/template&gt;
616
+ &lt;template #label&gt;
617
+ &lt;slot name="label"&gt;&lt;/slot&gt;
618
+ &lt;/template&gt;
619
+ &lt;/FzInput&gt;
620
+ &lt;/template&gt;
621
+ &nbsp;</pre></td></tr></table></pre>
622
+
623
+ <div class='push'></div><!-- for sticky footer -->
624
+ </div><!-- /wrapper -->
625
+ <div class='footer quiet pad2 space-top1 center small'>
626
+ Code coverage generated by
627
+ <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
628
+ at 2025-11-20T15:03:04.348Z
629
+ </div>
630
+ <script src="prettify.js"></script>
631
+ <script>
632
+ window.onload = function () {
633
+ prettyPrint();
634
+ };
635
+ </script>
636
+ <script src="sorter.js"></script>
637
+ <script src="block-navigation.js"></script>
638
+ </body>
639
+ </html>
640
+