@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.
- package/CHANGELOG.md +25 -225
- package/design-system/full-theme.css +49 -48
- package/docs/API-reference/api/x-components.baseresultpreviousprice.format.md +2 -2
- package/docs/API-reference/api/x-components.baseresultpreviousprice.md +1 -1
- package/docs/API-reference/api/x-components.historyqueriesactions.md +1 -0
- package/docs/API-reference/api/x-components.historyqueriesactions.togglehistoryqueries.md +24 -0
- package/docs/API-reference/api/x-components.historyqueriesmutations.md +1 -0
- package/docs/API-reference/api/x-components.historyqueriesmutations.setisenabled.md +24 -0
- package/docs/API-reference/api/x-components.historyqueriesstate.isenabled.md +13 -0
- package/docs/API-reference/api/x-components.historyqueriesstate.md +1 -0
- package/docs/API-reference/api/x-components.historyqueriesxevents.md +1 -0
- package/docs/API-reference/api/x-components.historyqueriesxevents.usertoggledhistoryqueries.md +13 -0
- package/docs/API-reference/api/x-components.md +1 -0
- package/docs/API-reference/api/x-components.togglehistoryqueries.md +13 -0
- package/docs/API-reference/components/common/currency/x-components.base-currency.md +267 -28
- package/docs/API-reference/components/common/result/x-components.base-result-previous-price.md +36 -8
- package/history-queries/index.js +1 -1
- package/js/components/currency/base-currency.vue.js.map +1 -1
- package/js/components/currency/base-currency.vue_rollup-plugin-vue_script.vue.js +1 -5
- package/js/components/currency/base-currency.vue_rollup-plugin-vue_script.vue.js.map +1 -1
- package/js/components/result/base-result-previous-price.vue.js.map +1 -1
- package/js/components/result/base-result-previous-price.vue_rollup-plugin-vue_script.vue.js +1 -1
- package/js/components/result/base-result-previous-price.vue_rollup-plugin-vue_script.vue.js.map +1 -1
- package/js/index.js +1 -1
- package/js/x-modules/history-queries/store/actions/set-history-queries.action.js +6 -4
- package/js/x-modules/history-queries/store/actions/set-history-queries.action.js.map +1 -1
- package/js/x-modules/history-queries/store/actions/toggle-history-queries.action.js +13 -0
- package/js/x-modules/history-queries/store/actions/toggle-history-queries.action.js.map +1 -0
- package/js/x-modules/history-queries/store/constants.js +3 -2
- package/js/x-modules/history-queries/store/constants.js.map +1 -1
- package/js/x-modules/history-queries/store/module.js +11 -3
- package/js/x-modules/history-queries/store/module.js.map +1 -1
- package/js/x-modules/history-queries/wiring.js +10 -1
- package/js/x-modules/history-queries/wiring.js.map +1 -1
- package/package.json +7 -7
- package/report/x-components.api.json +173 -3
- package/report/x-components.api.md +11 -1
- package/types/components/currency/base-currency.vue.d.ts.map +1 -1
- package/types/components/result/base-result-previous-price.vue.d.ts +1 -2
- package/types/components/result/base-result-previous-price.vue.d.ts.map +1 -1
- package/types/x-modules/history-queries/events.types.d.ts +5 -0
- package/types/x-modules/history-queries/events.types.d.ts.map +1 -1
- package/types/x-modules/history-queries/store/actions/set-history-queries.action.d.ts.map +1 -1
- package/types/x-modules/history-queries/store/actions/toggle-history-queries.action.d.ts +3 -0
- package/types/x-modules/history-queries/store/actions/toggle-history-queries.action.d.ts.map +1 -0
- package/types/x-modules/history-queries/store/constants.d.ts +1 -0
- package/types/x-modules/history-queries/store/constants.d.ts.map +1 -1
- package/types/x-modules/history-queries/store/module.d.ts.map +1 -1
- package/types/x-modules/history-queries/store/types.d.ts +17 -0
- package/types/x-modules/history-queries/store/types.d.ts.map +1 -1
- package/types/x-modules/history-queries/wiring.d.ts +9 -0
- 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.
|
|
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
|
|
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.
|
|
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) > [@empathyco/x-components](./x-components.md) > [HistoryQueriesActions](./x-components.historyqueriesactions.md) > [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) > [@empathyco/x-components](./x-components.md) > [HistoryQueriesMutations](./x-components.historyqueriesmutations.md) > [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) > [@empathyco/x-components](./x-components.md) > [HistoryQueriesState](./x-components.historyqueriesstate.md) > [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
|
|
package/docs/API-reference/api/x-components.historyqueriesxevents.usertoggledhistoryqueries.md
ADDED
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
<!-- Do not edit this file. It is automatically generated by API Documenter. -->
|
|
2
|
+
|
|
3
|
+
[Home](./index.md) > [@empathyco/x-components](./x-components.md) > [HistoryQueriesXEvents](./x-components.historyqueriesxevents.md) > [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) > [@empathyco/x-components](./x-components.md) > [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
|
-
<
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
<
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
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
|
```
|
package/docs/API-reference/components/common/result/x-components.base-result-previous-price.md
CHANGED
|
@@ -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
|
|
14
|
-
| ------------------- |
|
|
15
|
-
| <code>result</code> | (Required) The {@link @empathyco/x-types#Result \| result} information.
|
|
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
|
|
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
|
-
<
|
|
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
|
-
<
|
|
39
|
-
<
|
|
40
|
-
|
|
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
|
```
|
package/history-queries/index.js
CHANGED
|
@@ -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
|
|
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
|
|
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
|
|
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
|
|
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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|