@empathyco/x-components 3.0.0-alpha.72 → 3.0.0-alpha.75

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 (52) hide show
  1. package/CHANGELOG.md +25 -225
  2. package/design-system/full-theme.css +49 -48
  3. package/docs/API-reference/api/x-components.baseresultpreviousprice.format.md +2 -2
  4. package/docs/API-reference/api/x-components.baseresultpreviousprice.md +1 -1
  5. package/docs/API-reference/api/x-components.historyqueriesactions.md +1 -0
  6. package/docs/API-reference/api/x-components.historyqueriesactions.togglehistoryqueries.md +24 -0
  7. package/docs/API-reference/api/x-components.historyqueriesmutations.md +1 -0
  8. package/docs/API-reference/api/x-components.historyqueriesmutations.setisenabled.md +24 -0
  9. package/docs/API-reference/api/x-components.historyqueriesstate.isenabled.md +13 -0
  10. package/docs/API-reference/api/x-components.historyqueriesstate.md +1 -0
  11. package/docs/API-reference/api/x-components.historyqueriesxevents.md +1 -0
  12. package/docs/API-reference/api/x-components.historyqueriesxevents.usertoggledhistoryqueries.md +13 -0
  13. package/docs/API-reference/api/x-components.md +1 -0
  14. package/docs/API-reference/api/x-components.togglehistoryqueries.md +13 -0
  15. package/docs/API-reference/components/common/currency/x-components.base-currency.md +267 -28
  16. package/docs/API-reference/components/common/result/x-components.base-result-previous-price.md +36 -8
  17. package/history-queries/index.js +1 -1
  18. package/js/components/currency/base-currency.vue.js.map +1 -1
  19. package/js/components/currency/base-currency.vue_rollup-plugin-vue_script.vue.js +1 -5
  20. package/js/components/currency/base-currency.vue_rollup-plugin-vue_script.vue.js.map +1 -1
  21. package/js/components/result/base-result-previous-price.vue.js.map +1 -1
  22. package/js/components/result/base-result-previous-price.vue_rollup-plugin-vue_script.vue.js +1 -1
  23. package/js/components/result/base-result-previous-price.vue_rollup-plugin-vue_script.vue.js.map +1 -1
  24. package/js/index.js +1 -1
  25. package/js/x-modules/history-queries/store/actions/set-history-queries.action.js +6 -4
  26. package/js/x-modules/history-queries/store/actions/set-history-queries.action.js.map +1 -1
  27. package/js/x-modules/history-queries/store/actions/toggle-history-queries.action.js +13 -0
  28. package/js/x-modules/history-queries/store/actions/toggle-history-queries.action.js.map +1 -0
  29. package/js/x-modules/history-queries/store/constants.js +3 -2
  30. package/js/x-modules/history-queries/store/constants.js.map +1 -1
  31. package/js/x-modules/history-queries/store/module.js +11 -3
  32. package/js/x-modules/history-queries/store/module.js.map +1 -1
  33. package/js/x-modules/history-queries/wiring.js +10 -1
  34. package/js/x-modules/history-queries/wiring.js.map +1 -1
  35. package/package.json +7 -7
  36. package/report/x-components.api.json +173 -3
  37. package/report/x-components.api.md +11 -1
  38. package/types/components/currency/base-currency.vue.d.ts.map +1 -1
  39. package/types/components/result/base-result-previous-price.vue.d.ts +1 -2
  40. package/types/components/result/base-result-previous-price.vue.d.ts.map +1 -1
  41. package/types/x-modules/history-queries/events.types.d.ts +5 -0
  42. package/types/x-modules/history-queries/events.types.d.ts.map +1 -1
  43. package/types/x-modules/history-queries/store/actions/set-history-queries.action.d.ts.map +1 -1
  44. package/types/x-modules/history-queries/store/actions/toggle-history-queries.action.d.ts +3 -0
  45. package/types/x-modules/history-queries/store/actions/toggle-history-queries.action.d.ts.map +1 -0
  46. package/types/x-modules/history-queries/store/constants.d.ts +1 -0
  47. package/types/x-modules/history-queries/store/constants.d.ts.map +1 -1
  48. package/types/x-modules/history-queries/store/module.d.ts.map +1 -1
  49. package/types/x-modules/history-queries/store/types.d.ts +17 -0
  50. package/types/x-modules/history-queries/store/types.d.ts.map +1 -1
  51. package/types/x-modules/history-queries/wiring.d.ts +9 -0
  52. package/types/x-modules/history-queries/wiring.d.ts.map +1 -1
@@ -4,12 +4,12 @@
4
4
 
5
5
  ## BaseResultPreviousPrice.format property
6
6
 
7
- Format or mask to be defined as string. - Use 'i' to define integer numbers. - Use 'd' to define decimal numbers. You can define the length of the decimal part. If the doesn't include decimals, it is filled with zeros until reach the length defined with 'd's. - Integer separator must be defined between the 3rd and the 4th integer 'i' of a group. - Decimal separator must be defined between the last 'i' and the first 'd'. It can be more than one character. - Set whatever you need around the integers and decimals marks. - Default mask: 'i.iii,dd' which returns '1.345,67'.
7
+ Format or mask to be defined as string. - Use 'i' to define integer numbers. - Use 'd' to define decimal numbers. You can define the length of the decimal part. If the doesn't include decimals, it is filled with zeros until reach the length defined with 'd's. - Integer separator must be defined between the 3rd and the 4th integer 'i' of a group. - Decimal separator must be defined between the last 'i' and the first 'd'. It can be more than one character. - Set whatever you need around the integers and decimals marks.
8
8
 
9
9
  <b>Signature:</b>
10
10
 
11
11
  ```typescript
12
- protected format: string;
12
+ protected format?: string;
13
13
  ```
14
14
 
15
15
  ## Remarks
@@ -17,6 +17,6 @@ export default class BaseResultPreviousPrice extends Vue
17
17
 
18
18
  | Property | Modifiers | Type | Description |
19
19
  | --- | --- | --- | --- |
20
- | [format](./x-components.baseresultpreviousprice.format.md) | | string | Format or mask to be defined as string. - Use 'i' to define integer numbers. - Use 'd' to define decimal numbers. You can define the length of the decimal part. If the doesn't include decimals, it is filled with zeros until reach the length defined with 'd's. - Integer separator must be defined between the 3rd and the 4th integer 'i' of a group. - Decimal separator must be defined between the last 'i' and the first 'd'. It can be more than one character. - Set whatever you need around the integers and decimals marks. - Default mask: 'i.iii,dd' which returns '1.345,67'. |
20
+ | [format?](./x-components.baseresultpreviousprice.format.md) | | string | <i>(Optional)</i> Format or mask to be defined as string. - Use 'i' to define integer numbers. - Use 'd' to define decimal numbers. You can define the length of the decimal part. If the doesn't include decimals, it is filled with zeros until reach the length defined with 'd's. - Integer separator must be defined between the 3rd and the 4th integer 'i' of a group. - Decimal separator must be defined between the last 'i' and the first 'd'. It can be more than one character. - Set whatever you need around the integers and decimals marks. |
21
21
  | [result](./x-components.baseresultpreviousprice.result.md) | | Result | (Required) The [result](./x-types.result.md) information. |
22
22
 
@@ -22,4 +22,5 @@ export interface HistoryQueriesActions
22
22
  | [removeFromHistory(historyQuery)](./x-components.historyqueriesactions.removefromhistory.md) | Removes a single query from the history, synchronizing it with the browser storage. |
23
23
  | [setHistoryQueries(historyQueries)](./x-components.historyqueriesactions.sethistoryqueries.md) | Sets the history queries, synchronizing them with the browser storage. It also removes the oldest query if the history queries length is bigger than the [HistoryQueriesConfig.maxItemsToStore](./x-components.historyqueriesconfig.maxitemstostore.md)<!-- -->. |
24
24
  | [setUrlParams(urlParams)](./x-components.historyqueriesactions.seturlparams.md) | Checks if the url has a query on it and then updates the state with that value. |
25
+ | [toggleHistoryQueries(isEnabled)](./x-components.historyqueriesactions.togglehistoryqueries.md) | Toggles the history queries and stores the state in the browser storage. It also cleans the history queries when disabling them. |
25
26
 
@@ -0,0 +1,24 @@
1
+ <!-- Do not edit this file. It is automatically generated by API Documenter. -->
2
+
3
+ [Home](./index.md) &gt; [@empathyco/x-components](./x-components.md) &gt; [HistoryQueriesActions](./x-components.historyqueriesactions.md) &gt; [toggleHistoryQueries](./x-components.historyqueriesactions.togglehistoryqueries.md)
4
+
5
+ ## HistoryQueriesActions.toggleHistoryQueries() method
6
+
7
+ Toggles the history queries and stores the state in the browser storage. It also cleans the history queries when disabling them.
8
+
9
+ <b>Signature:</b>
10
+
11
+ ```typescript
12
+ toggleHistoryQueries(isEnabled: boolean): void;
13
+ ```
14
+
15
+ ## Parameters
16
+
17
+ | Parameter | Type | Description |
18
+ | --- | --- | --- |
19
+ | isEnabled | boolean | Whether to enable or disable the history queries. |
20
+
21
+ <b>Returns:</b>
22
+
23
+ void
24
+
@@ -18,6 +18,7 @@ export interface HistoryQueriesMutations extends QueryMutations
18
18
  | Method | Description |
19
19
  | --- | --- |
20
20
  | [setHistoryQueries(historyQueries)](./x-components.historyqueriesmutations.sethistoryqueries.md) | Sets the [HistoryQueriesState.historyQueries](./x-components.historyqueriesstate.historyqueries.md) property. |
21
+ | [setIsEnabled(isEnabled)](./x-components.historyqueriesmutations.setisenabled.md) | Sets the [HistoryQueriesState.isEnabled](./x-components.historyqueriesstate.isenabled.md) property. |
21
22
  | [setQuery(query)](./x-components.historyqueriesmutations.setquery.md) | Sets the [HistoryQueriesState.query](./x-components.historyqueriesstate.query.md) property. |
22
23
  | [setSessionTimeStamp(timeStamp)](./x-components.historyqueriesmutations.setsessiontimestamp.md) | Sets the [HistoryQueriesState.sessionTimeStampInMs](./x-components.historyqueriesstate.sessiontimestampinms.md) property. |
23
24
 
@@ -0,0 +1,24 @@
1
+ <!-- Do not edit this file. It is automatically generated by API Documenter. -->
2
+
3
+ [Home](./index.md) &gt; [@empathyco/x-components](./x-components.md) &gt; [HistoryQueriesMutations](./x-components.historyqueriesmutations.md) &gt; [setIsEnabled](./x-components.historyqueriesmutations.setisenabled.md)
4
+
5
+ ## HistoryQueriesMutations.setIsEnabled() method
6
+
7
+ Sets the [HistoryQueriesState.isEnabled](./x-components.historyqueriesstate.isenabled.md) property.
8
+
9
+ <b>Signature:</b>
10
+
11
+ ```typescript
12
+ setIsEnabled(isEnabled: boolean): void;
13
+ ```
14
+
15
+ ## Parameters
16
+
17
+ | Parameter | Type | Description |
18
+ | --- | --- | --- |
19
+ | isEnabled | boolean | The new [HistoryQueriesState.isEnabled](./x-components.historyqueriesstate.isenabled.md)<!-- -->. |
20
+
21
+ <b>Returns:</b>
22
+
23
+ void
24
+
@@ -0,0 +1,13 @@
1
+ <!-- Do not edit this file. It is automatically generated by API Documenter. -->
2
+
3
+ [Home](./index.md) &gt; [@empathyco/x-components](./x-components.md) &gt; [HistoryQueriesState](./x-components.historyqueriesstate.md) &gt; [isEnabled](./x-components.historyqueriesstate.isenabled.md)
4
+
5
+ ## HistoryQueriesState.isEnabled property
6
+
7
+ Whether the history queries are enabled or disabled.
8
+
9
+ <b>Signature:</b>
10
+
11
+ ```typescript
12
+ isEnabled: boolean;
13
+ ```
@@ -19,6 +19,7 @@ export interface HistoryQueriesState extends QueryState
19
19
  | --- | --- | --- |
20
20
  | [config](./x-components.historyqueriesstate.config.md) | [HistoryQueriesConfig](./x-components.historyqueriesconfig.md) | Configuration for the <code>HistoryQueries</code> module. |
21
21
  | [historyQueries](./x-components.historyqueriesstate.historyqueries.md) | HistoryQuery\[\] | The full list of queries made by the user. This list is persisted along different search sessions. |
22
+ | [isEnabled](./x-components.historyqueriesstate.isenabled.md) | boolean | Whether the history queries are enabled or disabled. |
22
23
  | [query](./x-components.historyqueriesstate.query.md) | string | The current query for searching into the [HistoryQueriesState.historyQueries](./x-components.historyqueriesstate.historyqueries.md)<!-- -->. |
23
24
  | [sessionTimeStampInMs](./x-components.historyqueriesstate.sessiontimestampinms.md) | number | Timestamp that indicates when the current search session has started. |
24
25
 
@@ -23,4 +23,5 @@ export interface HistoryQueriesXEvents
23
23
  | [UserPressedClearHistoryQueries](./x-components.historyqueriesxevents.userpressedclearhistoryqueries.md) | void | The user pressed the button for clearing all the history queries. \* Payload: none. |
24
24
  | [UserPressedRemoveHistoryQuery](./x-components.historyqueriesxevents.userpressedremovehistoryquery.md) | HistoryQuery | The user pressed the button for removing a single [history query](./x-types.historyquery.md)<!-- -->. \* Payload: The <code>HistoryQuery</code> to remove. |
25
25
  | [UserSelectedAHistoryQuery](./x-components.historyqueriesxevents.userselectedahistoryquery.md) | HistoryQuery | The user has selected a history-query. \* Payload: The [history query](./x-types.historyquery.md) selected. |
26
+ | [UserToggledHistoryQueries](./x-components.historyqueriesxevents.usertoggledhistoryqueries.md) | boolean | The user has toggled the history queries. \* Payload: whether it has been set to enable or disable. |
26
27
 
@@ -0,0 +1,13 @@
1
+ <!-- Do not edit this file. It is automatically generated by API Documenter. -->
2
+
3
+ [Home](./index.md) &gt; [@empathyco/x-components](./x-components.md) &gt; [HistoryQueriesXEvents](./x-components.historyqueriesxevents.md) &gt; [UserToggledHistoryQueries](./x-components.historyqueriesxevents.usertoggledhistoryqueries.md)
4
+
5
+ ## HistoryQueriesXEvents.UserToggledHistoryQueries property
6
+
7
+ The user has toggled the history queries. \* Payload: whether it has been set to enable or disable.
8
+
9
+ <b>Signature:</b>
10
+
11
+ ```typescript
12
+ UserToggledHistoryQueries: boolean;
13
+ ```
@@ -547,6 +547,7 @@ X-Components is a library usable everywhere not only for search experiences.
547
547
  | [taggingXModule](./x-components.taggingxmodule.md) | Tagging [XModule](./x-components.xmodule.md) implementation. This module is auto-registered as soon as you import any component from the <code>empathize</code> entry point. |
548
548
  | [TagIcon](./x-components.tagicon.md) | |
549
549
  | [throttleFunction](./x-components.throttlefunction.md) | Util function that returns a throttled version of the function passed as parameter. |
550
+ | [toggleHistoryQueries](./x-components.togglehistoryqueries.md) | Enables or disables history queries. |
550
551
  | [toggleRelatedTag](./x-components.togglerelatedtag.md) | Default implementation for the [RelatedTagsActions.toggleRelatedTag()](./x-components.relatedtagsactions.togglerelatedtag.md)<!-- -->. |
551
552
  | [toggleRelatedTagWire](./x-components.togglerelatedtagwire.md) | Sets the selected related tags. |
552
553
  | [track](./x-components.track.md) | Default implementation for the [TaggingActions.track()](./x-components.taggingactions.track.md)<!-- -->. |
@@ -0,0 +1,13 @@
1
+ <!-- Do not edit this file. It is automatically generated by API Documenter. -->
2
+
3
+ [Home](./index.md) &gt; [@empathyco/x-components](./x-components.md) &gt; [toggleHistoryQueries](./x-components.togglehistoryqueries.md)
4
+
5
+ ## toggleHistoryQueries variable
6
+
7
+ Enables or disables history queries.
8
+
9
+ <b>Signature:</b>
10
+
11
+ ```typescript
12
+ toggleHistoryQueries: import("../..").Wire<boolean>
13
+ ```
@@ -50,32 +50,271 @@ HTML element.
50
50
  ### Basic usage
51
51
 
52
52
  ```vue
53
- <BaseCurrency :value="12345678.87654321" format="i.iii,ddd? €" />
54
- <!-- output: '12.345.678,876 €' -->
55
- <BaseCurrency :value="12345678" format="i.iii,ddd? €" />
56
- <!-- output: '12.345.678 €' -->
57
- <BaseCurrency :value="12345678.87654321" format="$ i.iii,dd" />
58
- <!-- output: '$ 12.345.678,87' -->
59
- <BaseCurrency :value="12345678.87654321" format="$i.iii,dd" />
60
- <!-- output: '$12.345.678,87' -->
61
- <BaseCurrency :value="12345678.87654321" format="i.iii,dd €" />
62
- <!-- output: '12.345.678,87 €' -->
63
- <BaseCurrency :value="12345678.87654321" format="i.iii,dd€" />
64
- <!-- output: '12.345.678,87€' -->
65
- <BaseCurrency :value="12345678.87654321" format="i,iii.dd €" />
66
- <!-- output: '12,345,678.87 €' -->
67
- <BaseCurrency :value="12345678.87654321" format="i iii.dd €" />
68
- <!-- output: '12 345 678.87 €' -->
69
- <BaseCurrency :value="12345678.87654321" format="i iii - dd €" />
70
- <!-- output: '12 345 678 - 87 €' -->
71
- <BaseCurrency :value="12345678.87654321" format="i.iii,dddddd €" />
72
- <!-- output: '12.345.678,876543' -->
73
- <BaseCurrency :value="12345678.87" format="i.iii,dddddd" />
74
- <!-- output: '12.345.678,870000 €' -->
75
- <BaseCurrency :value="12345678" format="i.iii,dddddd €" />
76
- <!-- output: '12.345.678,000000 €' -->
77
- <BaseCurrency :value="12345678.87654321" format="i.iii,dd " />
78
- <!-- output: '12.345.678,87 €' -->
79
- <BaseCurrency :value="12345678.87654321" format="i.iii €" />
80
- <!-- output: '12.345.678 €' -->
53
+ <template>
54
+ <BaseCurrency :value="12345678.87654321" />
55
+ <!-- output: '12.345.678,87' -->
56
+ </template>
57
+
58
+ <script>
59
+ import { BaseCurrency } from "@empathyco/x-components";
60
+
61
+ export default {
62
+ name: "BaseCurrencyDemo",
63
+ components: {
64
+ BaseCurrency
65
+ }
66
+ };
67
+ </script>
68
+ ```
69
+
70
+ ```vue
71
+ <template>
72
+ <BaseCurrency :value="12345678.87654321" format="i.iii,ddd?" />
73
+ <!-- output: '12.345.678,876' -->
74
+ </template>
75
+
76
+ <script>
77
+ import { BaseCurrency } from "@empathyco/x-components";
78
+
79
+ export default {
80
+ name: "BaseCurrencyDemo",
81
+ components: {
82
+ BaseCurrency
83
+ }
84
+ };
85
+ </script>
86
+ ```
87
+
88
+ ```vue
89
+ <template>
90
+ <BaseCurrency :value="12345678" format="i.iii,ddd? €" />
91
+ <!-- output: '12.345.678 €' -->
92
+ </template>
93
+
94
+ <script>
95
+ import { BaseCurrency } from "@empathyco/x-components";
96
+
97
+ export default {
98
+ name: "BaseCurrencyDemo",
99
+ components: {
100
+ BaseCurrency
101
+ }
102
+ };
103
+ </script>
104
+ ```
105
+
106
+ ```vue
107
+ <template>
108
+ <BaseCurrency :value="12345678.87654321" format="$ i.iii,dd" />
109
+ <!-- output: '$ 12.345.678,87' -->
110
+ </template>
111
+
112
+ <script>
113
+ import { BaseCurrency } from "@empathyco/x-components";
114
+
115
+ export default {
116
+ name: "BaseCurrencyDemo",
117
+ components: {
118
+ BaseCurrency
119
+ }
120
+ };
121
+ </script>
122
+ ```
123
+
124
+ ```vue
125
+ <template>
126
+ <BaseCurrency :value="12345678.87654321" format="$i.iii,dd" />
127
+ <!-- output: '$12.345.678,87' -->
128
+ </template>
129
+
130
+ <script>
131
+ import { BaseCurrency } from "@empathyco/x-components";
132
+
133
+ export default {
134
+ name: "BaseCurrencyDemo",
135
+ components: {
136
+ BaseCurrency
137
+ }
138
+ };
139
+ </script>
140
+ ```
141
+
142
+ ```vue
143
+ <template>
144
+ <BaseCurrency :value="12345678.87654321" format="i.iii,dd €" />
145
+ <!-- output: '12.345.678,87 €' -->
146
+ </template>
147
+
148
+ <script>
149
+ import { BaseCurrency } from "@empathyco/x-components";
150
+
151
+ export default {
152
+ name: "BaseCurrencyDemo",
153
+ components: {
154
+ BaseCurrency
155
+ }
156
+ };
157
+ </script>
158
+ ```
159
+
160
+ ```vue
161
+ <template>
162
+ <BaseCurrency :value="12345678.87654321" format="i.iii,dd€" />
163
+ <!-- output: '12.345.678,87€' -->
164
+ </template>
165
+
166
+ <script>
167
+ import { BaseCurrency } from "@empathyco/x-components";
168
+
169
+ export default {
170
+ name: "BaseCurrencyDemo",
171
+ components: {
172
+ BaseCurrency
173
+ }
174
+ };
175
+ </script>
176
+ ```
177
+
178
+ ```vue
179
+ <template>
180
+ <BaseCurrency :value="12345678.87654321" format="i,iii.dd €" />
181
+ <!-- output: '12,345,678.87 €' -->
182
+ </template>
183
+
184
+ <script>
185
+ import { BaseCurrency } from "@empathyco/x-components";
186
+
187
+ export default {
188
+ name: "BaseCurrencyDemo",
189
+ components: {
190
+ BaseCurrency
191
+ }
192
+ };
193
+ </script>
194
+ ```
195
+
196
+ ```vue
197
+ <template>
198
+ <BaseCurrency :value="12345678.87654321" format="i iii.dd €" />
199
+ <!-- output: '12 345 678.87 €' -->
200
+ </template>
201
+
202
+ <script>
203
+ import { BaseCurrency } from "@empathyco/x-components";
204
+
205
+ export default {
206
+ name: "BaseCurrencyDemo",
207
+ components: {
208
+ BaseCurrency
209
+ }
210
+ };
211
+ </script>
212
+ ```
213
+
214
+ ```vue
215
+ <template>
216
+ <BaseCurrency :value="12345678.87654321" format="i iii - dd €" />
217
+ <!-- output: '12 345 678 - 87 €' -->
218
+ </template>
219
+
220
+ <script>
221
+ import { BaseCurrency } from "@empathyco/x-components";
222
+
223
+ export default {
224
+ name: "BaseCurrencyDemo",
225
+ components: {
226
+ BaseCurrency
227
+ }
228
+ };
229
+ </script>
230
+ ```
231
+
232
+ ```vue
233
+ <template>
234
+ <BaseCurrency :value="12345678.87654321" format="i.iii,dddddd €" />
235
+ <!-- output: '12.345.678,876543 €' -->
236
+ </template>
237
+
238
+ <script>
239
+ import { BaseCurrency } from "@empathyco/x-components";
240
+
241
+ export default {
242
+ name: "BaseCurrencyDemo",
243
+ components: {
244
+ BaseCurrency
245
+ }
246
+ };
247
+ </script>
248
+ ```
249
+
250
+ ```vue
251
+ <template>
252
+ <BaseCurrency :value="12345678.87" format="i.iii,dddddd €" />
253
+ <!-- output: '12.345.678,870000 €' -->
254
+ </template>
255
+
256
+ <script>
257
+ import { BaseCurrency } from "@empathyco/x-components";
258
+
259
+ export default {
260
+ name: "BaseCurrencyDemo",
261
+ components: {
262
+ BaseCurrency
263
+ }
264
+ };
265
+ </script>
266
+ ```
267
+
268
+ ```vue
269
+ <template>
270
+ <BaseCurrency :value="12345678" format="i.iii,dddddd €" />
271
+ <!-- output: '12.345.678,000000 €' -->
272
+ </template>
273
+
274
+ <script>
275
+ import { BaseCurrency } from "@empathyco/x-components";
276
+
277
+ export default {
278
+ name: "BaseCurrencyDemo",
279
+ components: {
280
+ BaseCurrency
281
+ }
282
+ };
283
+ </script>
284
+ ```
285
+
286
+ ```vue
287
+ <template>
288
+ <BaseCurrency :value="12345678.87654321" format="i.iii,dd €" />
289
+ <!-- output: '12.345.678,87 €' -->
290
+ </template>
291
+
292
+ <script>
293
+ import { BaseCurrency } from "@empathyco/x-components";
294
+
295
+ export default {
296
+ name: "BaseCurrencyDemo",
297
+ components: {
298
+ BaseCurrency
299
+ }
300
+ };
301
+ </script>
302
+ ```
303
+
304
+ ```vue
305
+ <template>
306
+ <BaseCurrency :value="12345678.87654321" format="i.iii €" />
307
+ <!-- output: '12.345.678 €' -->
308
+ </template>
309
+
310
+ <script>
311
+ import { BaseCurrency } from "@empathyco/x-components";
312
+
313
+ export default {
314
+ name: "BaseCurrencyDemo",
315
+ components: {
316
+ BaseCurrency
317
+ }
318
+ };
319
+ </script>
81
320
  ```
@@ -10,10 +10,10 @@ Component that renders the {@link @empathyco/x-types#Result | result} previous p
10
10
 
11
11
  ## Props
12
12
 
13
- | Name | Description | Type | Default |
14
- | ------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------- | ----------------------- |
15
- | <code>result</code> | (Required) The {@link @empathyco/x-types#Result \| result} information. | <code>Result</code> | <code></code> |
16
- | <code>format</code> | Format or mask to be defined as string.<br />- Use 'i' to define integer numbers.<br />- Use 'd' to define decimal numbers. You can define the length of the decimal part. If the<br />doesn't include decimals, it is filled with zeros until reach the length defined with 'd's.<br />- Integer separator must be defined between the 3rd and the 4th integer 'i' of a group.<br />- Decimal separator must be defined between the last 'i' and the first 'd'. It can be more<br />than one character.<br />- Set whatever you need around the integers and decimals marks.<br />- Default mask: 'i.iii,dd' which returns '1.345,67'. | <code>string</code> | <code>'i.iii,dd'</code> |
13
+ | Name | Description | Type | Default |
14
+ | ------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------- | ------------- |
15
+ | <code>result</code> | (Required) The {@link @empathyco/x-types#Result \| result} information. | <code>Result</code> | <code></code> |
16
+ | <code>format</code> | Format or mask to be defined as string.<br />- Use 'i' to define integer numbers.<br />- Use 'd' to define decimal numbers. You can define the length of the decimal part. If the<br />doesn't include decimals, it is filled with zeros until reach the length defined with 'd's.<br />- Integer separator must be defined between the 3rd and the 4th integer 'i' of a group.<br />- Decimal separator must be defined between the last 'i' and the first 'd'. It can be more<br />than one character.<br />- Set whatever you need around the integers and decimals marks. | <code>string</code> | <code></code> |
17
17
 
18
18
  ## Slots
19
19
 
@@ -29,13 +29,41 @@ This component shows the previous price formatted if it has discount. The compon
29
29
  props. `format` to select the currency format to be applied.
30
30
 
31
31
  ```vue
32
- <BaseResultPreviousPrice :value="result" :format="'i.iii,ddd €'" />
32
+ <template>
33
+ <BaseResultPreviousPrice :result="result" :format="'i.iii,ddd €'" />
34
+ </template>
35
+
36
+ <script>
37
+ import { BaseResultPreviousPrice } from "@empathyco/x-components";
38
+
39
+ export default {
40
+ name: "BaseResultPreviousPriceDemo",
41
+ components: {
42
+ BaseResultPreviousPrice
43
+ }
44
+ };
45
+ </script>
33
46
  ```
34
47
 
35
48
  ### Overriding default slot
36
49
 
37
50
  ```vue
38
- <BaseResultPreviousPrice :result="result">
39
- <span class="custom-base-result-previous-price">{{ result.price.originalValue }}</span>
40
- </BaseResultPreviousPrice>
51
+ <template>
52
+ <BaseResultPreviousPrice :result="result">
53
+ <span class="custom-base-result-previous-price">{{
54
+ result.price.originalValue
55
+ }}</span>
56
+ </BaseResultPreviousPrice>
57
+ </template>
58
+
59
+ <script>
60
+ import { BaseResultPreviousPrice } from "@empathyco/x-components";
61
+
62
+ export default {
63
+ name: "BaseResultPreviousPriceDemo",
64
+ components: {
65
+ BaseResultPreviousPrice
66
+ }
67
+ };
68
+ </script>
41
69
  ```
@@ -13,5 +13,5 @@ export { HistoryQueriesGetter, historyQueries } from '../js/x-modules/history-qu
13
13
  export { sessionHistoryQueries } from '../js/x-modules/history-queries/store/getters/session-history-queries.getter.js';
14
14
  export { storageKey } from '../js/x-modules/history-queries/store/getters/storage-key.getter.js';
15
15
  export { historyQueriesXStoreModule } from '../js/x-modules/history-queries/store/module.js';
16
- export { addQueryToHistoryQueries, clearHistoryQueries, clearHistoryQueriesQuery, historyQueriesWiring, loadHistoryQueriesFromBrowserStorageWire, refreshHistoryQueriesSession, removeHistoryQuery, setHistoryQueriesQuery } from '../js/x-modules/history-queries/wiring.js';
16
+ export { addQueryToHistoryQueries, clearHistoryQueries, clearHistoryQueriesQuery, historyQueriesWiring, loadHistoryQueriesFromBrowserStorageWire, refreshHistoryQueriesSession, removeHistoryQuery, setHistoryQueriesQuery, toggleHistoryQueries } from '../js/x-modules/history-queries/wiring.js';
17
17
  export { historyQueriesXModule } from '../js/x-modules/history-queries/x-module.js';
@@ -1 +1 @@
1
- {"version":3,"file":"base-currency.vue.js","sources":["../../../../src/components/currency/base-currency.vue"],"sourcesContent":["<template>\n <span v-if=\"value !== undefined\" class=\"x-currency\">{{ currency }}</span>\n</template>\n\n<script lang=\"ts\">\n import Vue from 'vue';\n import { Component, Prop } from 'vue-property-decorator';\n import { currencyFormatter } from '../../utils/currency-formatter';\n import { XInject } from '../decorators/injection.decorators';\n\n /**\n * Renders the value received as a property which always must be a JavaScript number, with the\n * proper format provided as a string property or by injection. The rendered tag is a span in\n * order to render a default inline HTML element.\n *\n * Regarding the format or mask to be defined as string:\n * - Use 'i' to define integer numbers.\n * - Use 'd' to define decimal numbers. You can define the length of the decimal part. If the\n * format doesn't include decimals, it is filled with zeros until reach the length defined with\n * 'd's.\n * - Integer separator must be defined between the 3rd and the 4th integer 'i' of a group.\n * - Decimal separator must be defined between the last 'i' and the first 'd'. It can be more\n * than one character.\n * - If you want to hide the decimal part if it's zero, you can add the `?` symbol after the\n * decimal characters (e.g. 'i.iii,dd?', for `1234` you would get `1.234` instead of `1.234,00`).\n * - Set whatever you need around the integers and decimals marks.\n * - Default mask: 'i.iii,dd' which returns '1.345,67'.\n *\n * @remarks The number of 'd', which is the maximum decimal length, MUST matches with the length\n * of decimals provided from the adapter. Otherwise, when the component truncate the decimal\n * part, it deletes significant digits.\n *\n * @example\n * Basic example:\n *\n * ```vue\n * <BaseCurrency\n * :value=\"123456.789\"\n * format=\"i.iiii,dddd €\"\n * />\n * ```\n *\n * It will render: `123.456,7890 €`.\n *\n * See docs below for more examples.\n *\n * @public\n */\n @Component\n export default class BaseCurrency extends Vue {\n /**\n * Numeric value to be formatted.\n *\n * @remarks Pass the value with 'v-bind:value' (or ':value' shortcut) instead of plain string.\n * @remarks Be careful using numbers under Number.MAX_SAFE_INTEGER to avoid unexpected errors.\n *\n * @public\n */\n @Prop({ required: true })\n protected value!: number;\n\n /**\n * The format as string.\n *\n * @public\n */\n @Prop()\n protected format?: string;\n\n /**\n * The injected format as string.\n *\n * @public\n */\n @XInject('currencyFormat')\n public injectedFormat!: string;\n\n /**\n * A format which can be passed through prop or injected.\n *\n * @returns A format as string.\n *\n * @internal\n */\n protected get renderedFormat(): string {\n return (\n this.format ??\n this.injectedFormat ??\n //TODO: add here logger\n //eslint-disable-next-line no-console\n console.warn('It is necessary to pass a prop or inject the format')\n );\n }\n\n /**\n * Returns the formatted result as string.\n *\n * @returns Formatted number.\n *\n * @internal\n */\n protected get currency(): string {\n return currencyFormatter(this.value, this.renderedFormat);\n }\n }\n</script>\n\n<docs lang=\"mdx\">\n## Example\n\nRenders the value received as a property, which always must be a JavaScript number, with the proper\nformat provided as string property. The rendered tag is a span in order to render a default inline\nHTML element.\n\n### Basic usage\n\n```vue\n<BaseCurrency :value=\"12345678.87654321\" format=\"i.iii,ddd? €\" />\n<!-- output: '12.345.678,876 €' -->\n<BaseCurrency :value=\"12345678\" format=\"i.iii,ddd? €\" />\n<!-- output: '12.345.678 €' -->\n<BaseCurrency :value=\"12345678.87654321\" format=\"$ i.iii,dd\" />\n<!-- output: '$ 12.345.678,87' -->\n<BaseCurrency :value=\"12345678.87654321\" format=\"$i.iii,dd\" />\n<!-- output: '$12.345.678,87' -->\n<BaseCurrency :value=\"12345678.87654321\" format=\"i.iii,dd €\" />\n<!-- output: '12.345.678,87 €' -->\n<BaseCurrency :value=\"12345678.87654321\" format=\"i.iii,dd€\" />\n<!-- output: '12.345.678,87€' -->\n<BaseCurrency :value=\"12345678.87654321\" format=\"i,iii.dd €\" />\n<!-- output: '12,345,678.87 €' -->\n<BaseCurrency :value=\"12345678.87654321\" format=\"i iii.dd €\" />\n<!-- output: '12 345 678.87 €' -->\n<BaseCurrency :value=\"12345678.87654321\" format=\"i iii - dd €\" />\n<!-- output: '12 345 678 - 87 €' -->\n<BaseCurrency :value=\"12345678.87654321\" format=\"i.iii,dddddd €\" />\n<!-- output: '12.345.678,876543 €' -->\n<BaseCurrency :value=\"12345678.87\" format=\"i.iii,dddddd €\" />\n<!-- output: '12.345.678,870000 €' -->\n<BaseCurrency :value=\"12345678\" format=\"i.iii,dddddd €\" />\n<!-- output: '12.345.678,000000 €' -->\n<BaseCurrency :value=\"12345678.87654321\" format=\"i.iii,dd €\" />\n<!-- output: '12.345.678,87 €' -->\n<BaseCurrency :value=\"12345678.87654321\" format=\"i.iii €\" />\n<!-- output: '12.345.678 €' -->\n```\n</docs>\n"],"names":[],"mappings":";;;;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"base-currency.vue.js","sources":["../../../../src/components/currency/base-currency.vue"],"sourcesContent":["<template>\n <span v-if=\"value !== undefined\" class=\"x-currency\">{{ currency }}</span>\n</template>\n\n<script lang=\"ts\">\n import Vue from 'vue';\n import { Component, Prop } from 'vue-property-decorator';\n import { currencyFormatter } from '../../utils/currency-formatter';\n import { XInject } from '../decorators/injection.decorators';\n\n /**\n * Renders the value received as a property which always must be a JavaScript number, with the\n * proper format provided as a string property or by injection. The rendered tag is a span in\n * order to render a default inline HTML element.\n *\n * Regarding the format or mask to be defined as string:\n * - Use 'i' to define integer numbers.\n * - Use 'd' to define decimal numbers. You can define the length of the decimal part. If the\n * format doesn't include decimals, it is filled with zeros until reach the length defined with\n * 'd's.\n * - Integer separator must be defined between the 3rd and the 4th integer 'i' of a group.\n * - Decimal separator must be defined between the last 'i' and the first 'd'. It can be more\n * than one character.\n * - If you want to hide the decimal part if it's zero, you can add the `?` symbol after the\n * decimal characters (e.g. 'i.iii,dd?', for `1234` you would get `1.234` instead of `1.234,00`).\n * - Set whatever you need around the integers and decimals marks.\n * - Default mask: 'i.iii,dd' which returns '1.345,67'.\n *\n * @remarks The number of 'd', which is the maximum decimal length, MUST matches with the length\n * of decimals provided from the adapter. Otherwise, when the component truncate the decimal\n * part, it deletes significant digits.\n *\n * @example\n * Basic example:\n *\n * ```vue\n * <BaseCurrency\n * :value=\"123456.789\"\n * format=\"i.iiii,dddd €\"\n * />\n * ```\n *\n * It will render: `123.456,7890 €`.\n *\n * See docs below for more examples.\n *\n * @public\n */\n @Component\n export default class BaseCurrency extends Vue {\n /**\n * Numeric value to be formatted.\n *\n * @remarks Pass the value with 'v-bind:value' (or ':value' shortcut) instead of plain string.\n * @remarks Be careful using numbers under Number.MAX_SAFE_INTEGER to avoid unexpected errors.\n *\n * @public\n */\n @Prop({ required: true })\n protected value!: number;\n\n /**\n * The format as string.\n *\n * @public\n */\n @Prop()\n protected format?: string;\n\n /**\n * The injected format as string.\n *\n * @public\n */\n @XInject('currencyFormat')\n public injectedFormat!: string;\n\n /**\n * A format which can be passed through prop or injected.\n *\n * @returns A format as string.\n *\n * @internal\n */\n protected get renderedFormat(): string {\n return this.format ?? this.injectedFormat ?? 'i.iii,dd';\n }\n\n /**\n * Returns the formatted result as string.\n *\n * @returns Formatted number.\n *\n * @internal\n */\n protected get currency(): string {\n return currencyFormatter(this.value, this.renderedFormat);\n }\n }\n</script>\n\n<docs lang=\"mdx\">\n## Example\n\nRenders the value received as a property, which always must be a JavaScript number, with the proper\nformat provided as string property. The rendered tag is a span in order to render a default inline\nHTML element.\n\n### Basic usage\n\n```vue\n<template>\n <BaseCurrency :value=\"12345678.87654321\" />\n <!-- output: '12.345.678,87' -->\n</template>\n\n<script>\n import { BaseCurrency } from '@empathyco/x-components';\n\n export default {\n name: 'BaseCurrencyDemo',\n components: {\n BaseCurrency\n }\n };\n</script>\n```\n\n```vue\n<template>\n <BaseCurrency :value=\"12345678.87654321\" format=\"i.iii,ddd? €\" />\n <!-- output: '12.345.678,876 €' -->\n</template>\n\n<script>\n import { BaseCurrency } from '@empathyco/x-components';\n\n export default {\n name: 'BaseCurrencyDemo',\n components: {\n BaseCurrency\n }\n };\n</script>\n```\n\n```vue\n<template>\n <BaseCurrency :value=\"12345678\" format=\"i.iii,ddd? €\" />\n <!-- output: '12.345.678 €' -->\n</template>\n\n<script>\n import { BaseCurrency } from '@empathyco/x-components';\n\n export default {\n name: 'BaseCurrencyDemo',\n components: {\n BaseCurrency\n }\n };\n</script>\n```\n\n```vue\n<template>\n <BaseCurrency :value=\"12345678.87654321\" format=\"$ i.iii,dd\" />\n <!-- output: '$ 12.345.678,87' -->\n</template>\n\n<script>\n import { BaseCurrency } from '@empathyco/x-components';\n\n export default {\n name: 'BaseCurrencyDemo',\n components: {\n BaseCurrency\n }\n };\n</script>\n```\n\n```vue\n<template>\n <BaseCurrency :value=\"12345678.87654321\" format=\"$i.iii,dd\" />\n <!-- output: '$12.345.678,87' -->\n</template>\n\n<script>\n import { BaseCurrency } from '@empathyco/x-components';\n\n export default {\n name: 'BaseCurrencyDemo',\n components: {\n BaseCurrency\n }\n };\n</script>\n```\n\n```vue\n<template>\n <BaseCurrency :value=\"12345678.87654321\" format=\"i.iii,dd €\" />\n <!-- output: '12.345.678,87 €' -->\n</template>\n\n<script>\n import { BaseCurrency } from '@empathyco/x-components';\n\n export default {\n name: 'BaseCurrencyDemo',\n components: {\n BaseCurrency\n }\n };\n</script>\n```\n\n```vue\n<template>\n <BaseCurrency :value=\"12345678.87654321\" format=\"i.iii,dd€\" />\n <!-- output: '12.345.678,87€' -->\n</template>\n\n<script>\n import { BaseCurrency } from '@empathyco/x-components';\n\n export default {\n name: 'BaseCurrencyDemo',\n components: {\n BaseCurrency\n }\n };\n</script>\n```\n\n```vue\n<template>\n <BaseCurrency :value=\"12345678.87654321\" format=\"i,iii.dd €\" />\n <!-- output: '12,345,678.87 €' -->\n</template>\n\n<script>\n import { BaseCurrency } from '@empathyco/x-components';\n\n export default {\n name: 'BaseCurrencyDemo',\n components: {\n BaseCurrency\n }\n };\n</script>\n```\n\n```vue\n<template>\n <BaseCurrency :value=\"12345678.87654321\" format=\"i iii.dd €\" />\n <!-- output: '12 345 678.87 €' -->\n</template>\n\n<script>\n import { BaseCurrency } from '@empathyco/x-components';\n\n export default {\n name: 'BaseCurrencyDemo',\n components: {\n BaseCurrency\n }\n };\n</script>\n```\n\n```vue\n<template>\n <BaseCurrency :value=\"12345678.87654321\" format=\"i iii - dd €\" />\n <!-- output: '12 345 678 - 87 €' -->\n</template>\n\n<script>\n import { BaseCurrency } from '@empathyco/x-components';\n\n export default {\n name: 'BaseCurrencyDemo',\n components: {\n BaseCurrency\n }\n };\n</script>\n```\n\n```vue\n<template>\n <BaseCurrency :value=\"12345678.87654321\" format=\"i.iii,dddddd €\" />\n <!-- output: '12.345.678,876543 €' -->\n</template>\n\n<script>\n import { BaseCurrency } from '@empathyco/x-components';\n\n export default {\n name: 'BaseCurrencyDemo',\n components: {\n BaseCurrency\n }\n };\n</script>\n```\n\n```vue\n<template>\n <BaseCurrency :value=\"12345678.87\" format=\"i.iii,dddddd €\" />\n <!-- output: '12.345.678,870000 €' -->\n</template>\n\n<script>\n import { BaseCurrency } from '@empathyco/x-components';\n\n export default {\n name: 'BaseCurrencyDemo',\n components: {\n BaseCurrency\n }\n };\n</script>\n```\n\n```vue\n<template>\n <BaseCurrency :value=\"12345678\" format=\"i.iii,dddddd €\" />\n <!-- output: '12.345.678,000000 €' -->\n</template>\n\n<script>\n import { BaseCurrency } from '@empathyco/x-components';\n\n export default {\n name: 'BaseCurrencyDemo',\n components: {\n BaseCurrency\n }\n };\n</script>\n```\n\n```vue\n<template>\n <BaseCurrency :value=\"12345678.87654321\" format=\"i.iii,dd €\" />\n <!-- output: '12.345.678,87 €' -->\n</template>\n\n<script>\n import { BaseCurrency } from '@empathyco/x-components';\n\n export default {\n name: 'BaseCurrencyDemo',\n components: {\n BaseCurrency\n }\n };\n</script>\n```\n\n```vue\n<template>\n <BaseCurrency :value=\"12345678.87654321\" format=\"i.iii €\" />\n <!-- output: '12.345.678 €' -->\n</template>\n\n<script>\n import { BaseCurrency } from '@empathyco/x-components';\n\n export default {\n name: 'BaseCurrencyDemo',\n components: {\n BaseCurrency\n }\n };\n</script>\n```\n</docs>\n"],"names":[],"mappings":";;;;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -51,11 +51,7 @@ let BaseCurrency = class BaseCurrency extends Vue {
51
51
  * @internal
52
52
  */
53
53
  get renderedFormat() {
54
- return (this.format ??
55
- this.injectedFormat ??
56
- //TODO: add here logger
57
- //eslint-disable-next-line no-console
58
- console.warn('It is necessary to pass a prop or inject the format'));
54
+ return this.format ?? this.injectedFormat ?? 'i.iii,dd';
59
55
  }
60
56
  /**
61
57
  * Returns the formatted result as string.
@@ -1 +1 @@
1
- {"version":3,"file":"base-currency.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../src/components/currency/base-currency.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { currencyFormatter } from '../../utils/currency-formatter';\nimport { XInject } from '../decorators/injection.decorators';\n\n/**\n * Renders the value received as a property which always must be a JavaScript number, with the\n * proper format provided as a string property or by injection. The rendered tag is a span in\n * order to render a default inline HTML element.\n *\n * Regarding the format or mask to be defined as string:\n * - Use 'i' to define integer numbers.\n * - Use 'd' to define decimal numbers. You can define the length of the decimal part. If the\n * format doesn't include decimals, it is filled with zeros until reach the length defined with\n * 'd's.\n * - Integer separator must be defined between the 3rd and the 4th integer 'i' of a group.\n * - Decimal separator must be defined between the last 'i' and the first 'd'. It can be more\n * than one character.\n * - If you want to hide the decimal part if it's zero, you can add the `?` symbol after the\n * decimal characters (e.g. 'i.iii,dd?', for `1234` you would get `1.234` instead of `1.234,00`).\n * - Set whatever you need around the integers and decimals marks.\n * - Default mask: 'i.iii,dd' which returns '1.345,67'.\n *\n * @remarks The number of 'd', which is the maximum decimal length, MUST matches with the length\n * of decimals provided from the adapter. Otherwise, when the component truncate the decimal\n * part, it deletes significant digits.\n *\n * @example\n * Basic example:\n *\n * ```vue\n * <BaseCurrency\n * :value=\"123456.789\"\n * format=\"i.iiii,dddd €\"\n * />\n * ```\n *\n * It will render: `123.456,7890 €`.\n *\n * See docs below for more examples.\n *\n * @public\n */\n@Component\nexport default class BaseCurrency extends Vue {\n /**\n * Numeric value to be formatted.\n *\n * @remarks Pass the value with 'v-bind:value' (or ':value' shortcut) instead of plain string.\n * @remarks Be careful using numbers under Number.MAX_SAFE_INTEGER to avoid unexpected errors.\n *\n * @public\n */\n @Prop({ required: true })\n protected value!: number;\n\n /**\n * The format as string.\n *\n * @public\n */\n @Prop()\n protected format?: string;\n\n /**\n * The injected format as string.\n *\n * @public\n */\n @XInject('currencyFormat')\n public injectedFormat!: string;\n\n /**\n * A format which can be passed through prop or injected.\n *\n * @returns A format as string.\n *\n * @internal\n */\n protected get renderedFormat(): string {\n return (\n this.format ??\n this.injectedFormat ??\n //TODO: add here logger\n //eslint-disable-next-line no-console\n console.warn('It is necessary to pass a prop or inject the format')\n );\n }\n\n /**\n * Returns the formatted result as string.\n *\n * @returns Formatted number.\n *\n * @internal\n */\n protected get currency(): string {\n return currencyFormatter(this.value, this.renderedFormat);\n }\n}\n"],"names":[],"mappings":";;;;;;AAUA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuCA,IAAqB,YAAY,GAAjC,MAAqB,YAAa,SAAQ,GAAG;;;;;;;;IAmC3C,IAAc,cAAc;QAC1B,QACE,IAAI,CAAC,MAAM;YACX,IAAI,CAAC,cAAc;;;YAGnB,OAAO,CAAC,IAAI,CAAC,qDAAqD,CAAC,EACnE;KACH;;;;;;;;IASD,IAAc,QAAQ;QACpB,OAAO,iBAAiB,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;KAC3D;CACF,CAAA;AA7CC;IADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;2CACA;AAQzB;IADC,IAAI,EAAE;4CACmB;AAQ1B;IADC,OAAO,CAAC,gBAAgB,CAAC;oDACK;AA1BZ,YAAY;IADhC,SAAS;GACW,YAAY,CAuDhC;aAvDoB,YAAY;;;;"}
1
+ {"version":3,"file":"base-currency.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../src/components/currency/base-currency.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { currencyFormatter } from '../../utils/currency-formatter';\nimport { XInject } from '../decorators/injection.decorators';\n\n/**\n * Renders the value received as a property which always must be a JavaScript number, with the\n * proper format provided as a string property or by injection. The rendered tag is a span in\n * order to render a default inline HTML element.\n *\n * Regarding the format or mask to be defined as string:\n * - Use 'i' to define integer numbers.\n * - Use 'd' to define decimal numbers. You can define the length of the decimal part. If the\n * format doesn't include decimals, it is filled with zeros until reach the length defined with\n * 'd's.\n * - Integer separator must be defined between the 3rd and the 4th integer 'i' of a group.\n * - Decimal separator must be defined between the last 'i' and the first 'd'. It can be more\n * than one character.\n * - If you want to hide the decimal part if it's zero, you can add the `?` symbol after the\n * decimal characters (e.g. 'i.iii,dd?', for `1234` you would get `1.234` instead of `1.234,00`).\n * - Set whatever you need around the integers and decimals marks.\n * - Default mask: 'i.iii,dd' which returns '1.345,67'.\n *\n * @remarks The number of 'd', which is the maximum decimal length, MUST matches with the length\n * of decimals provided from the adapter. Otherwise, when the component truncate the decimal\n * part, it deletes significant digits.\n *\n * @example\n * Basic example:\n *\n * ```vue\n * <BaseCurrency\n * :value=\"123456.789\"\n * format=\"i.iiii,dddd €\"\n * />\n * ```\n *\n * It will render: `123.456,7890 €`.\n *\n * See docs below for more examples.\n *\n * @public\n */\n@Component\nexport default class BaseCurrency extends Vue {\n /**\n * Numeric value to be formatted.\n *\n * @remarks Pass the value with 'v-bind:value' (or ':value' shortcut) instead of plain string.\n * @remarks Be careful using numbers under Number.MAX_SAFE_INTEGER to avoid unexpected errors.\n *\n * @public\n */\n @Prop({ required: true })\n protected value!: number;\n\n /**\n * The format as string.\n *\n * @public\n */\n @Prop()\n protected format?: string;\n\n /**\n * The injected format as string.\n *\n * @public\n */\n @XInject('currencyFormat')\n public injectedFormat!: string;\n\n /**\n * A format which can be passed through prop or injected.\n *\n * @returns A format as string.\n *\n * @internal\n */\n protected get renderedFormat(): string {\n return this.format ?? this.injectedFormat ?? 'i.iii,dd';\n }\n\n /**\n * Returns the formatted result as string.\n *\n * @returns Formatted number.\n *\n * @internal\n */\n protected get currency(): string {\n return currencyFormatter(this.value, this.renderedFormat);\n }\n}\n"],"names":[],"mappings":";;;;;;AAUA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuCA,IAAqB,YAAY,GAAjC,MAAqB,YAAa,SAAQ,GAAG;;;;;;;;IAmC3C,IAAc,cAAc;QAC1B,OAAO,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,cAAc,IAAI,UAAU,CAAC;KACzD;;;;;;;;IASD,IAAc,QAAQ;QACpB,OAAO,iBAAiB,CAAC,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;KAC3D;CACF,CAAA;AAvCC;IADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;2CACA;AAQzB;IADC,IAAI,EAAE;4CACmB;AAQ1B;IADC,OAAO,CAAC,gBAAgB,CAAC;oDACK;AA1BZ,YAAY;IADhC,SAAS;GACW,YAAY,CAiDhC;aAjDoB,YAAY;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"base-result-previous-price.vue.js","sources":["../../../../src/components/result/base-result-previous-price.vue"],"sourcesContent":["<template>\n <div\n v-if=\"result.price.hasDiscount\"\n class=\"x-result-previous-price\"\n data-test=\"result-previous-price\"\n >\n <!--\n @slot Base currency item\n @binding {result} result - Result data\n -->\n <slot :result=\"result\">\n <BaseCurrency :value=\"result.price.originalValue\" :format=\"format\" />\n </slot>\n </div>\n</template>\n\n<script lang=\"ts\">\n import { Result } from '@empathyco/x-types';\n import { Component, Prop } from 'vue-property-decorator';\n import Vue from 'vue';\n import BaseCurrency from '../currency/base-currency.vue';\n\n /**\n * Component that renders the {@link @empathyco/x-types#Result | result} previous price.\n *\n * @public\n */\n @Component({\n components: { BaseCurrency }\n })\n export default class BaseResultPreviousPrice extends Vue {\n /**\n * (Required) The {@link @empathyco/x-types#Result | result} information.\n *\n * @public\n */\n @Prop({ required: true })\n protected result!: Result;\n\n /**\n * Format or mask to be defined as string.\n * - Use 'i' to define integer numbers.\n * - Use 'd' to define decimal numbers. You can define the length of the decimal part. If the\n * doesn't include decimals, it is filled with zeros until reach the length defined with 'd's.\n * - Integer separator must be defined between the 3rd and the 4th integer 'i' of a group.\n * - Decimal separator must be defined between the last 'i' and the first 'd'. It can be more\n * than one character.\n * - Set whatever you need around the integers and decimals marks.\n * - Default mask: 'i.iii,dd' which returns '1.345,67'.\n *\n * @remarks The number of 'd', which is the maximum decimal length, MUST match with the length\n * of decimals provided from the adapter. Otherwise, when the component truncate the decimal\n * part, delete significant digits.\n *\n * @public\n */\n @Prop({ default: 'i.iii,dd' })\n protected format!: string;\n }\n</script>\n\n<docs lang=\"mdx\">\n## Examples\n\n### Basic example\n\nThis component shows the previous price formatted if it has discount. The component has two optional\nprops. `format` to select the currency format to be applied.\n\n```vue\n<BaseResultPreviousPrice :value=\"result\" :format=\"'i.iii,ddd €'\" />\n```\n\n### Overriding default slot\n\n```vue\n<BaseResultPreviousPrice :result=\"result\">\n <span class=\"custom-base-result-previous-price\">{{ result.price.originalValue }}</span>\n</BaseResultPreviousPrice>\n```\n</docs>\n"],"names":[],"mappings":";;;;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"base-result-previous-price.vue.js","sources":["../../../../src/components/result/base-result-previous-price.vue"],"sourcesContent":["<template>\n <div\n v-if=\"result.price.hasDiscount\"\n class=\"x-result-previous-price\"\n data-test=\"result-previous-price\"\n >\n <!--\n @slot Base currency item\n @binding {result} result - Result data\n -->\n <slot :result=\"result\">\n <BaseCurrency :value=\"result.price.originalValue\" :format=\"format\" />\n </slot>\n </div>\n</template>\n\n<script lang=\"ts\">\n import { Result } from '@empathyco/x-types';\n import { Component, Prop } from 'vue-property-decorator';\n import Vue from 'vue';\n import BaseCurrency from '../currency/base-currency.vue';\n\n /**\n * Component that renders the {@link @empathyco/x-types#Result | result} previous price.\n *\n * @public\n */\n @Component({\n components: { BaseCurrency }\n })\n export default class BaseResultPreviousPrice extends Vue {\n /**\n * (Required) The {@link @empathyco/x-types#Result | result} information.\n *\n * @public\n */\n @Prop({ required: true })\n protected result!: Result;\n\n /**\n * Format or mask to be defined as string.\n * - Use 'i' to define integer numbers.\n * - Use 'd' to define decimal numbers. You can define the length of the decimal part. If the\n * doesn't include decimals, it is filled with zeros until reach the length defined with 'd's.\n * - Integer separator must be defined between the 3rd and the 4th integer 'i' of a group.\n * - Decimal separator must be defined between the last 'i' and the first 'd'. It can be more\n * than one character.\n * - Set whatever you need around the integers and decimals marks.\n *\n * @remarks The number of 'd', which is the maximum decimal length, MUST match with the length\n * of decimals provided from the adapter. Otherwise, when the component truncate the decimal\n * part, delete significant digits.\n *\n * @public\n */\n @Prop()\n protected format?: string;\n }\n</script>\n\n<docs lang=\"mdx\">\n## Examples\n\n### Basic example\n\nThis component shows the previous price formatted if it has discount. The component has two optional\nprops. `format` to select the currency format to be applied.\n\n```vue\n<template>\n <BaseResultPreviousPrice :result=\"result\" :format=\"'i.iii,ddd €'\" />\n</template>\n\n<script>\n import { BaseResultPreviousPrice } from '@empathyco/x-components';\n\n export default {\n name: 'BaseResultPreviousPriceDemo',\n components: {\n BaseResultPreviousPrice\n }\n };\n</script>\n```\n\n### Overriding default slot\n\n```vue\n<template>\n <BaseResultPreviousPrice :result=\"result\">\n <span class=\"custom-base-result-previous-price\">{{ result.price.originalValue }}</span>\n </BaseResultPreviousPrice>\n</template>\n\n<script>\n import { BaseResultPreviousPrice } from '@empathyco/x-components';\n\n export default {\n name: 'BaseResultPreviousPriceDemo',\n components: {\n BaseResultPreviousPrice\n }\n };\n</script>\n```\n</docs>\n"],"names":[],"mappings":";;;;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}