@empathyco/x-components 3.0.0-alpha.148 → 3.0.0-alpha.150
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 +26 -0
- package/design-system/full-theme.css +64 -64
- package/docs/API-reference/api/x-components.baseidmodalclose.emitclosemodalevent.md +10 -1
- package/docs/API-reference/api/x-components.baseidmodalclose.md +3 -3
- package/docs/API-reference/api/x-components.baseidmodalclose.modalid.md +2 -0
- package/docs/API-reference/api/x-components.baseidmodalopen.emitopenmodalevent.md +24 -0
- package/docs/API-reference/api/x-components.baseidmodalopen.md +8 -3
- package/docs/API-reference/api/x-components.baseidmodalopen.modalid.md +2 -0
- package/docs/API-reference/api/x-components.md +2 -2
- package/docs/API-reference/components/common/modals/x-components.base-id-modal-close.md +13 -13
- package/docs/API-reference/components/common/modals/x-components.base-id-modal-open.md +47 -15
- package/js/components/modals/base-id-modal-close.vue.js +1 -1
- package/js/components/modals/base-id-modal-close.vue.js.map +1 -1
- package/js/components/modals/base-id-modal-close.vue_rollup-plugin-vue_script.vue.js +11 -6
- package/js/components/modals/base-id-modal-close.vue_rollup-plugin-vue_script.vue.js.map +1 -1
- package/js/components/modals/base-id-modal-open.vue.js +21 -9
- package/js/components/modals/base-id-modal-open.vue.js.map +1 -1
- package/js/components/modals/base-id-modal-open.vue_rollup-plugin-vue_script.vue.js +13 -6
- package/js/components/modals/base-id-modal-open.vue_rollup-plugin-vue_script.vue.js.map +1 -1
- package/js/x-modules/facets/entities/single-select.modifier.js +2 -2
- package/js/x-modules/facets/entities/single-select.modifier.js.map +1 -1
- package/package.json +2 -2
- package/report/x-components.api.json +50 -28
- package/report/x-components.api.md +2 -6
- package/types/components/modals/base-id-modal-close.vue.d.ts +14 -3
- package/types/components/modals/base-id-modal-close.vue.d.ts.map +1 -1
- package/types/components/modals/base-id-modal-open.vue.d.ts +15 -4
- package/types/components/modals/base-id-modal-open.vue.d.ts.map +1 -1
- package/types/x-modules/facets/entities/single-select.modifier.d.ts.map +1 -1
- package/docs/API-reference/api/x-components.baseidmodalopen.events.md +0 -11
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,32 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file. See
|
|
4
4
|
[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [3.0.0-alpha.150](https://github.com/empathyco/x/compare/@empathyco/x-components@3.0.0-alpha.149...@empathyco/x-components@3.0.0-alpha.150) (2022-08-08)
|
|
7
|
+
|
|
8
|
+
### Features
|
|
9
|
+
|
|
10
|
+
- **components:** make `BaseIdModalOpen` rendering configurable (#637)
|
|
11
|
+
([77cb564](https://github.com/empathyco/x/commit/77cb5646b1e43c8b7aa428db4102dc6aca8affdf)),
|
|
12
|
+
closes [EX-6751](https://searchbroker.atlassian.net/browse/EX-6751)
|
|
13
|
+
|
|
14
|
+
# Change Log
|
|
15
|
+
|
|
16
|
+
All notable changes to this project will be documented in this file. See
|
|
17
|
+
[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
18
|
+
|
|
19
|
+
## [3.0.0-alpha.149](https://github.com/empathyco/x/compare/@empathyco/x-components@3.0.0-alpha.148...@empathyco/x-components@3.0.0-alpha.149) (2022-08-08)
|
|
20
|
+
|
|
21
|
+
### Bug Fixes
|
|
22
|
+
|
|
23
|
+
- **facets:** fix `SingleSelectModifier` handling for selecting hierar… (#643)
|
|
24
|
+
([d9a18e0](https://github.com/empathyco/x/commit/d9a18e06c5241c5b6db9b93ba67c1d9018360160)),
|
|
25
|
+
closes [EX-6810](https://searchbroker.atlassian.net/browse/EX-6810)
|
|
26
|
+
|
|
27
|
+
# Change Log
|
|
28
|
+
|
|
29
|
+
All notable changes to this project will be documented in this file. See
|
|
30
|
+
[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
31
|
+
|
|
6
32
|
## [3.0.0-alpha.148](https://github.com/empathyco/x/compare/@empathyco/x-components@3.0.0-alpha.147...@empathyco/x-components@3.0.0-alpha.148) (2022-08-04)
|
|
7
33
|
|
|
8
34
|
### Features
|
|
@@ -114,13 +114,6 @@
|
|
|
114
114
|
--x-size-border-radius-bottom-left-button-card
|
|
115
115
|
);
|
|
116
116
|
}
|
|
117
|
-
:root {
|
|
118
|
-
--x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
|
|
119
|
-
--x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
|
|
120
|
-
--x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
|
|
121
|
-
--x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
|
|
122
|
-
--x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
|
|
123
|
-
}
|
|
124
117
|
[dir="ltr"] .x-button {
|
|
125
118
|
padding-right: var(--x-size-padding-right-button-default);
|
|
126
119
|
}
|
|
@@ -1445,6 +1438,64 @@
|
|
|
1445
1438
|
--x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
|
|
1446
1439
|
--x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
|
|
1447
1440
|
}
|
|
1441
|
+
[dir="ltr"] .x-input {
|
|
1442
|
+
padding-left: var(--x-size-padding-left-input-default);
|
|
1443
|
+
}
|
|
1444
|
+
[dir="rtl"] .x-input {
|
|
1445
|
+
padding-right: var(--x-size-padding-left-input-default);
|
|
1446
|
+
}
|
|
1447
|
+
[dir="ltr"] .x-input {
|
|
1448
|
+
padding-right: var(--x-size-padding-right-input-default);
|
|
1449
|
+
}
|
|
1450
|
+
[dir="rtl"] .x-input {
|
|
1451
|
+
padding-left: var(--x-size-padding-right-input-default);
|
|
1452
|
+
}
|
|
1453
|
+
[dir="ltr"] .x-input {
|
|
1454
|
+
border-right-width: var(--x-size-border-width-right-input-default);
|
|
1455
|
+
}
|
|
1456
|
+
[dir="rtl"] .x-input {
|
|
1457
|
+
border-left-width: var(--x-size-border-width-right-input-default);
|
|
1458
|
+
}
|
|
1459
|
+
[dir="ltr"] .x-input {
|
|
1460
|
+
border-left-width: var(--x-size-border-width-left-input-default);
|
|
1461
|
+
}
|
|
1462
|
+
[dir="rtl"] .x-input {
|
|
1463
|
+
border-right-width: var(--x-size-border-width-left-input-default);
|
|
1464
|
+
}
|
|
1465
|
+
.x-input {
|
|
1466
|
+
box-sizing: border-box;
|
|
1467
|
+
margin: 0;
|
|
1468
|
+
min-width: 0;
|
|
1469
|
+
height: var(--x-size-height-input-default);
|
|
1470
|
+
padding-top: 0;
|
|
1471
|
+
padding-bottom: 0;
|
|
1472
|
+
background-color: var(--x-color-background-input-default);
|
|
1473
|
+
border-color: var(--x-color-border-input-default);
|
|
1474
|
+
color: var(--x-color-text-input-default);
|
|
1475
|
+
border-top-width: var(--x-size-border-width-top-input-default);
|
|
1476
|
+
border-bottom-width: var(--x-size-border-width-bottom-input-default);
|
|
1477
|
+
border-radius: var(--x-size-border-radius-top-left-input-default) var(--x-size-border-radius-top-right-input-default) var(--x-size-border-radius-bottom-right-input-default) var(--x-size-border-radius-bottom-left-input-default);
|
|
1478
|
+
border-style: solid;
|
|
1479
|
+
font-family: var(--x-font-family-input-default);
|
|
1480
|
+
font-size: var(--x-size-font-input-default);
|
|
1481
|
+
font-weight: var(--x-number-font-weight-input-default);
|
|
1482
|
+
line-height: var(--x-size-line-height-input-default);
|
|
1483
|
+
}
|
|
1484
|
+
@media not all and (min-resolution: 0.001dpcm) {
|
|
1485
|
+
.x-input {
|
|
1486
|
+
-webkit-appearance: none;
|
|
1487
|
+
}
|
|
1488
|
+
}
|
|
1489
|
+
.x-input:focus {
|
|
1490
|
+
border-color: var(--x-color-border-input-default-focus);
|
|
1491
|
+
}
|
|
1492
|
+
.x-input::placeholder {
|
|
1493
|
+
color: var(--x-color-text-input-placeholder-default);
|
|
1494
|
+
font-family: var(--x-font-family-input-placeholder-default);
|
|
1495
|
+
font-size: var(--x-size-font-input-placeholder-default);
|
|
1496
|
+
font-weight: var(--x-number-font-weight-input-placeholder-default);
|
|
1497
|
+
line-height: var(--x-size-line-height-input-placeholder-default);
|
|
1498
|
+
}
|
|
1448
1499
|
:root {
|
|
1449
1500
|
--x-color-background-input-default: var(--x-color-base-neutral-100);
|
|
1450
1501
|
--x-color-border-input-default: var(--x-color-base-neutral-70);
|
|
@@ -7536,61 +7587,10 @@
|
|
|
7536
7587
|
text-transform: none;
|
|
7537
7588
|
}
|
|
7538
7589
|
|
|
7539
|
-
|
|
7540
|
-
|
|
7541
|
-
|
|
7542
|
-
|
|
7543
|
-
|
|
7544
|
-
|
|
7545
|
-
[dir="ltr"] .x-input {
|
|
7546
|
-
padding-right: var(--x-size-padding-right-input-default);
|
|
7547
|
-
}
|
|
7548
|
-
[dir="rtl"] .x-input {
|
|
7549
|
-
padding-left: var(--x-size-padding-right-input-default);
|
|
7550
|
-
}
|
|
7551
|
-
[dir="ltr"] .x-input {
|
|
7552
|
-
border-right-width: var(--x-size-border-width-right-input-default);
|
|
7553
|
-
}
|
|
7554
|
-
[dir="rtl"] .x-input {
|
|
7555
|
-
border-left-width: var(--x-size-border-width-right-input-default);
|
|
7556
|
-
}
|
|
7557
|
-
[dir="ltr"] .x-input {
|
|
7558
|
-
border-left-width: var(--x-size-border-width-left-input-default);
|
|
7559
|
-
}
|
|
7560
|
-
[dir="rtl"] .x-input {
|
|
7561
|
-
border-right-width: var(--x-size-border-width-left-input-default);
|
|
7562
|
-
}
|
|
7563
|
-
.x-input {
|
|
7564
|
-
box-sizing: border-box;
|
|
7565
|
-
margin: 0;
|
|
7566
|
-
min-width: 0;
|
|
7567
|
-
height: var(--x-size-height-input-default);
|
|
7568
|
-
padding-top: 0;
|
|
7569
|
-
padding-bottom: 0;
|
|
7570
|
-
background-color: var(--x-color-background-input-default);
|
|
7571
|
-
border-color: var(--x-color-border-input-default);
|
|
7572
|
-
color: var(--x-color-text-input-default);
|
|
7573
|
-
border-top-width: var(--x-size-border-width-top-input-default);
|
|
7574
|
-
border-bottom-width: var(--x-size-border-width-bottom-input-default);
|
|
7575
|
-
border-radius: var(--x-size-border-radius-top-left-input-default) var(--x-size-border-radius-top-right-input-default) var(--x-size-border-radius-bottom-right-input-default) var(--x-size-border-radius-bottom-left-input-default);
|
|
7576
|
-
border-style: solid;
|
|
7577
|
-
font-family: var(--x-font-family-input-default);
|
|
7578
|
-
font-size: var(--x-size-font-input-default);
|
|
7579
|
-
font-weight: var(--x-number-font-weight-input-default);
|
|
7580
|
-
line-height: var(--x-size-line-height-input-default);
|
|
7581
|
-
}
|
|
7582
|
-
@media not all and (min-resolution: 0.001dpcm) {
|
|
7583
|
-
.x-input {
|
|
7584
|
-
-webkit-appearance: none;
|
|
7585
|
-
}
|
|
7586
|
-
}
|
|
7587
|
-
.x-input:focus {
|
|
7588
|
-
border-color: var(--x-color-border-input-default-focus);
|
|
7589
|
-
}
|
|
7590
|
-
.x-input::placeholder {
|
|
7591
|
-
color: var(--x-color-text-input-placeholder-default);
|
|
7592
|
-
font-family: var(--x-font-family-input-placeholder-default);
|
|
7593
|
-
font-size: var(--x-size-font-input-placeholder-default);
|
|
7594
|
-
font-weight: var(--x-number-font-weight-input-placeholder-default);
|
|
7595
|
-
line-height: var(--x-size-line-height-input-placeholder-default);
|
|
7590
|
+
:root {
|
|
7591
|
+
--x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
|
|
7592
|
+
--x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
|
|
7593
|
+
--x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
|
|
7594
|
+
--x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
|
|
7595
|
+
--x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
|
|
7596
7596
|
}
|
|
@@ -4,11 +4,20 @@
|
|
|
4
4
|
|
|
5
5
|
## BaseIdModalClose.emitCloseModalEvent() method
|
|
6
6
|
|
|
7
|
+
Emits the [XEventsTypes.UserClickedCloseModal](./x-components.xeventstypes.userclickedclosemodal.md) event with the modalId as payload.
|
|
8
|
+
|
|
7
9
|
<b>Signature:</b>
|
|
8
10
|
|
|
9
11
|
```typescript
|
|
10
|
-
protected emitCloseModalEvent(): void;
|
|
12
|
+
protected emitCloseModalEvent({ target }: Event): void;
|
|
11
13
|
```
|
|
14
|
+
|
|
15
|
+
## Parameters
|
|
16
|
+
|
|
17
|
+
| Parameter | Type | Description |
|
|
18
|
+
| --- | --- | --- |
|
|
19
|
+
| { target } | Event | |
|
|
20
|
+
|
|
12
21
|
<b>Returns:</b>
|
|
13
22
|
|
|
14
23
|
void
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
## BaseIdModalClose class
|
|
6
6
|
|
|
7
|
-
Component that allows to close a modal by emitting [XEventsTypes.UserClickedCloseModal](./x-components.xeventstypes.userclickedclosemodal.md)<!-- -->. It
|
|
7
|
+
Component that allows to close a modal by emitting [XEventsTypes.UserClickedCloseModal](./x-components.xeventstypes.userclickedclosemodal.md)<!-- -->. It allows full customization with the 'closing-element' slot and exposes the 'closeModal' function.
|
|
8
8
|
|
|
9
9
|
<b>Signature:</b>
|
|
10
10
|
|
|
@@ -17,11 +17,11 @@ export default class BaseIdModalClose extends Vue
|
|
|
17
17
|
|
|
18
18
|
| Property | Modifiers | Type | Description |
|
|
19
19
|
| --- | --- | --- | --- |
|
|
20
|
-
| [modalId](./x-components.baseidmodalclose.modalid.md) | | string |
|
|
20
|
+
| [modalId](./x-components.baseidmodalclose.modalid.md) | | string | The modalId of the modal that will be closed. |
|
|
21
21
|
|
|
22
22
|
## Methods
|
|
23
23
|
|
|
24
24
|
| Method | Modifiers | Description |
|
|
25
25
|
| --- | --- | --- |
|
|
26
|
-
| [emitCloseModalEvent()](./x-components.baseidmodalclose.emitclosemodalevent.md) | |
|
|
26
|
+
| [emitCloseModalEvent({ target })](./x-components.baseidmodalclose.emitclosemodalevent.md) | | Emits the [XEventsTypes.UserClickedCloseModal](./x-components.xeventstypes.userclickedclosemodal.md) event with the modalId as payload. |
|
|
27
27
|
|
|
@@ -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) > [BaseIdModalOpen](./x-components.baseidmodalopen.md) > [emitOpenModalEvent](./x-components.baseidmodalopen.emitopenmodalevent.md)
|
|
4
|
+
|
|
5
|
+
## BaseIdModalOpen.emitOpenModalEvent() method
|
|
6
|
+
|
|
7
|
+
Emits the [XEventsTypes.UserClickedOpenModal](./x-components.xeventstypes.userclickedopenmodal.md) event with the modalId as payload.
|
|
8
|
+
|
|
9
|
+
<b>Signature:</b>
|
|
10
|
+
|
|
11
|
+
```typescript
|
|
12
|
+
protected emitOpenModalEvent({ target }: Event): void;
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
## Parameters
|
|
16
|
+
|
|
17
|
+
| Parameter | Type | Description |
|
|
18
|
+
| --- | --- | --- |
|
|
19
|
+
| { target } | Event | |
|
|
20
|
+
|
|
21
|
+
<b>Returns:</b>
|
|
22
|
+
|
|
23
|
+
void
|
|
24
|
+
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
## BaseIdModalOpen class
|
|
6
6
|
|
|
7
|
-
Component
|
|
7
|
+
Component that allows to open a modal by emitting [XEventsTypes.UserClickedOpenModal](./x-components.xeventstypes.userclickedopenmodal.md) with the modalId as payload. It allows full customization with the 'opening-element' slot and exposes the 'openModal' function.
|
|
8
8
|
|
|
9
9
|
<b>Signature:</b>
|
|
10
10
|
|
|
@@ -17,6 +17,11 @@ export default class BaseIdModalOpen extends Vue
|
|
|
17
17
|
|
|
18
18
|
| Property | Modifiers | Type | Description |
|
|
19
19
|
| --- | --- | --- | --- |
|
|
20
|
-
| [
|
|
21
|
-
|
|
20
|
+
| [modalId](./x-components.baseidmodalopen.modalid.md) | | string | The modalId of the modal that will be opened. |
|
|
21
|
+
|
|
22
|
+
## Methods
|
|
23
|
+
|
|
24
|
+
| Method | Modifiers | Description |
|
|
25
|
+
| --- | --- | --- |
|
|
26
|
+
| [emitOpenModalEvent({ target })](./x-components.baseidmodalopen.emitopenmodalevent.md) | | Emits the [XEventsTypes.UserClickedOpenModal](./x-components.xeventstypes.userclickedopenmodal.md) event with the modalId as payload. |
|
|
22
27
|
|
|
@@ -28,8 +28,8 @@ X-Components is a library usable everywhere not only for search experiences.
|
|
|
28
28
|
| [BaseGrid](./x-components.basegrid.md) | Grid component that is able to render different items based on their modelName value. In order to achieve this, it exposes a scopedSlot for each different modelName. In case the items used do not have modelName property, the default slot is used instead. It has a required property: the <code>items</code> to render; and an optional one: the number <code>columns</code> the grid is divided in. If the number of columns is not specified, the grid automatically fills the rows with as many columns as it can fit. |
|
|
29
29
|
| [BaseHeaderTogglePanel](./x-components.baseheadertogglepanel.md) | Toggle panel which uses the base toggle panel, adds a header and manage the open / close state of the panel. |
|
|
30
30
|
| [BaseIdModal](./x-components.baseidmodal.md) | Component containing a modal expecting a required prop, named <code>modalId</code>. It reacts to <code>UserClickedOpenModal</code>, <code>UserClickedCloseModal</code> and <code>UserClickedOutOfModal</code> events, when their payload matches the component's 'modalId' prop, to handle its open/close state. The default slot offers the possibility to customise the modal content. |
|
|
31
|
-
| [BaseIdModalClose](./x-components.baseidmodalclose.md) | Component that allows to close a modal by emitting [XEventsTypes.UserClickedCloseModal](./x-components.xeventstypes.userclickedclosemodal.md)<!-- -->. It
|
|
32
|
-
| [BaseIdModalOpen](./x-components.baseidmodalopen.md) | Component
|
|
31
|
+
| [BaseIdModalClose](./x-components.baseidmodalclose.md) | Component that allows to close a modal by emitting [XEventsTypes.UserClickedCloseModal](./x-components.xeventstypes.userclickedclosemodal.md)<!-- -->. It allows full customization with the 'closing-element' slot and exposes the 'closeModal' function. |
|
|
32
|
+
| [BaseIdModalOpen](./x-components.baseidmodalopen.md) | Component that allows to open a modal by emitting [XEventsTypes.UserClickedOpenModal](./x-components.xeventstypes.userclickedopenmodal.md) with the modalId as payload. It allows full customization with the 'opening-element' slot and exposes the 'openModal' function. |
|
|
33
33
|
| [BaseIdTogglePanel](./x-components.baseidtogglepanel.md) | Simple panel that could receives its initial open state via prop, if not the default is opens and a required prop, named <code>panelId</code>, which are responsible of rendering default slot inside a configurable transition.<!-- -->It reacts to <code>UserClickedPanelToggleButton</code> event, when their payload matches the component's 'panelId' prop, to handle its open/close state.<!-- -->The default slot offers the possibility to customise the modal content. |
|
|
34
34
|
| [BaseIdTogglePanelButton](./x-components.baseidtogglepanelbutton.md) | Component containing an event button that emits [XEventsTypes.UserClickedPanelToggleButton](./x-components.xeventstypes.userclickedpaneltogglebutton.md) when clicked with the panelId as payload.<!-- -->It has a default slot to customize its contents. |
|
|
35
35
|
| [BaseKeyboardNavigation](./x-components.basekeyboardnavigation.md) | Base component to handle keyboard navigation for elements inside it. It has a required slot to include the navigable elements. |
|
|
@@ -7,21 +7,28 @@ title: BaseIdModalClose
|
|
|
7
7
|
# BaseIdModalClose
|
|
8
8
|
|
|
9
9
|
Component that allows to close a modal by emitting {@link XEventsTypes.UserClickedCloseModal}.
|
|
10
|
-
It
|
|
11
|
-
|
|
10
|
+
It allows full customization with the 'closing-element' slot and exposes the 'closeModal'
|
|
11
|
+
function.
|
|
12
12
|
|
|
13
13
|
## Props
|
|
14
14
|
|
|
15
|
-
| Name | Description
|
|
16
|
-
| -------------------- |
|
|
17
|
-
| <code>modalId</code> |
|
|
15
|
+
| Name | Description | Type | Default |
|
|
16
|
+
| -------------------- | --------------------------------------------- | ------------------- | ------------- |
|
|
17
|
+
| <code>modalId</code> | The modalId of the modal that will be closed. | <code>string</code> | <code></code> |
|
|
18
18
|
|
|
19
19
|
## Slots
|
|
20
20
|
|
|
21
21
|
| Name | Description | Bindings<br />(name - type - description) |
|
|
22
22
|
| ---------------------------- | ----------------------------------------------------------------------------- | ----------------------------------------------------------------------- |
|
|
23
23
|
| <code>closing-element</code> | closing-element. It's the element that will trigger the modal closing. It's a | **closeModal** <code>Function</code> - The function to close the modal. |
|
|
24
|
-
| <code>default</code> |
|
|
24
|
+
| <code>default</code> | (Required) Button content with a text, an icon or both | None |
|
|
25
|
+
|
|
26
|
+
## Events
|
|
27
|
+
|
|
28
|
+
A list of events that the component will emit:
|
|
29
|
+
|
|
30
|
+
- `UserClickedCloseModal`: the event is emitted after the user clicks the button. The event payload
|
|
31
|
+
is the id of the modal that is going to be closed.
|
|
25
32
|
|
|
26
33
|
## Examples
|
|
27
34
|
|
|
@@ -81,10 +88,3 @@ export default {
|
|
|
81
88
|
};
|
|
82
89
|
</script>
|
|
83
90
|
```
|
|
84
|
-
|
|
85
|
-
## Events
|
|
86
|
-
|
|
87
|
-
A list of events that the component will emit:
|
|
88
|
-
|
|
89
|
-
- `UserClickedCloseModal`: the event is emitted after the user clicks the button. The event payload
|
|
90
|
-
is the id of the modal that is going to be closed.
|
|
@@ -6,30 +6,40 @@ title: BaseIdModalOpen
|
|
|
6
6
|
|
|
7
7
|
# BaseIdModalOpen
|
|
8
8
|
|
|
9
|
-
Component
|
|
10
|
-
|
|
9
|
+
Component that allows to open a modal by emitting {@link XEventsTypes.UserClickedOpenModal}
|
|
10
|
+
with the modalId as payload. It allows full customization with the 'opening-element' slot and
|
|
11
|
+
exposes the 'openModal' function.
|
|
11
12
|
|
|
12
13
|
## Props
|
|
13
14
|
|
|
14
|
-
| Name | Description
|
|
15
|
-
| -------------------- |
|
|
16
|
-
| <code>modalId</code> |
|
|
15
|
+
| Name | Description | Type | Default |
|
|
16
|
+
| -------------------- | --------------------------------------------- | ------------------- | ------------- |
|
|
17
|
+
| <code>modalId</code> | The modalId of the modal that will be opened. | <code>string</code> | <code></code> |
|
|
17
18
|
|
|
18
19
|
## Slots
|
|
19
20
|
|
|
20
|
-
| Name
|
|
21
|
-
|
|
|
22
|
-
| <code>
|
|
21
|
+
| Name | Description | Bindings<br />(name - type - description) |
|
|
22
|
+
| ---------------------------- | ----------------------------------------------------------------------------- | --------------------------------------------------------------------- |
|
|
23
|
+
| <code>opening-element</code> | opening-element. It's the element that will trigger the modal opening. It's a | **openModal** <code>Function</code> - The function to open the modal. |
|
|
24
|
+
| <code>default</code> | (Required) Button content with a text, an icon or both | None |
|
|
25
|
+
|
|
26
|
+
## Events
|
|
27
|
+
|
|
28
|
+
A list of events that the component will emit:
|
|
29
|
+
|
|
30
|
+
- `UserClickedOpenModal`: the event is emitted after the user clicks the button. The event payload
|
|
31
|
+
is the id of the modal that is going to be opened.
|
|
23
32
|
|
|
24
33
|
## Examples
|
|
25
34
|
|
|
26
35
|
Component containing an event button that emits `UserClickedOpenModal` when it is clicked with the
|
|
27
|
-
modalId as payload. It has a default slot to customize its contents
|
|
36
|
+
modalId as payload. It has a default slot to customize its contents and can also be fully
|
|
37
|
+
customized, replacing the default button with any other element.
|
|
28
38
|
|
|
29
39
|
### Basic example
|
|
30
40
|
|
|
31
|
-
The component rendering content passed to the default slot and opening the modal
|
|
32
|
-
`my-modal`.
|
|
41
|
+
The component rendering content passed to the default slot inside the button and opening the modal
|
|
42
|
+
with modalId `my-modal`.
|
|
33
43
|
|
|
34
44
|
```vue
|
|
35
45
|
<template>
|
|
@@ -51,9 +61,31 @@ export default {
|
|
|
51
61
|
</script>
|
|
52
62
|
```
|
|
53
63
|
|
|
54
|
-
|
|
64
|
+
### Replacing the default button
|
|
55
65
|
|
|
56
|
-
|
|
66
|
+
The component renders whatever element is passed, replacing the default button and exposing the
|
|
67
|
+
function to open the modal with modalId `my-modal`.
|
|
57
68
|
|
|
58
|
-
|
|
59
|
-
|
|
69
|
+
```vue
|
|
70
|
+
<template>
|
|
71
|
+
<BaseIdModalOpen modalId="my-modal">
|
|
72
|
+
<template #opening-element="{ openModal }">
|
|
73
|
+
<ul>
|
|
74
|
+
<li @click="openModal">Open here</li>
|
|
75
|
+
<li>Not here</li>
|
|
76
|
+
</ul>
|
|
77
|
+
</template>
|
|
78
|
+
</BaseIdModalOpen>
|
|
79
|
+
</template>
|
|
80
|
+
|
|
81
|
+
<script>
|
|
82
|
+
import { BaseIdModalOpen } from "@empathyco/x-components";
|
|
83
|
+
|
|
84
|
+
export default {
|
|
85
|
+
name: "BaseIdModalOpenTest",
|
|
86
|
+
components: {
|
|
87
|
+
BaseIdModalOpen
|
|
88
|
+
}
|
|
89
|
+
};
|
|
90
|
+
</script>
|
|
91
|
+
```
|
|
@@ -11,7 +11,6 @@ var __vue_render__ = function () {
|
|
|
11
11
|
var _c = _vm._self._c || _h;
|
|
12
12
|
return _c(
|
|
13
13
|
"NoElement",
|
|
14
|
-
_vm._g({ attrs: { "data-test": "close-modal-id" } }, _vm.$listeners),
|
|
15
14
|
[
|
|
16
15
|
_vm._t(
|
|
17
16
|
"closing-element",
|
|
@@ -21,6 +20,7 @@ var __vue_render__ = function () {
|
|
|
21
20
|
"button",
|
|
22
21
|
{
|
|
23
22
|
staticClass: "x-button x-events-modal-id-close-button",
|
|
23
|
+
attrs: { "data-test": "close-modal-id" },
|
|
24
24
|
on: { click: _vm.emitCloseModalEvent },
|
|
25
25
|
},
|
|
26
26
|
[_vm._t("default")],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"base-id-modal-close.vue.js","sources":["../../../../src/components/modals/base-id-modal-close.vue"],"sourcesContent":["<template>\n <NoElement
|
|
1
|
+
{"version":3,"file":"base-id-modal-close.vue.js","sources":["../../../../src/components/modals/base-id-modal-close.vue"],"sourcesContent":["<template>\n <NoElement>\n <!--\n @slot closing-element. It's the element that will trigger the modal closing. It's a\n button by default.\n @binding {Function} closeModal - The function to close the modal.\n -->\n <slot :closeModal=\"emitCloseModalEvent\" name=\"closing-element\">\n <button\n @click=\"emitCloseModalEvent\"\n class=\"x-button x-events-modal-id-close-button\"\n data-test=\"close-modal-id\"\n >\n <!-- @slot (Required) Button content with a text, an icon or both -->\n <slot />\n </button>\n </slot>\n </NoElement>\n</template>\n\n<script lang=\"ts\">\n import Vue from 'vue';\n import { Component, Prop } from 'vue-property-decorator';\n import { NoElement } from '../no-element';\n\n /**\n * Component that allows to close a modal by emitting {@link XEventsTypes.UserClickedCloseModal}.\n * It allows full customization with the 'closing-element' slot and exposes the 'closeModal'\n * function.\n *\n * @public\n */\n @Component({\n components: { NoElement }\n })\n export default class BaseIdModalClose extends Vue {\n /**\n * The modalId of the modal that will be closed.\n *\n * @public\n */\n @Prop({ required: true })\n protected modalId!: string;\n\n /**\n * Emits the {@link XEventsTypes.UserClickedCloseModal} event with the modalId as payload.\n *\n * @param event - The event triggering the function.\n * @public\n */\n protected emitCloseModalEvent({ target }: Event): void {\n this.$x.emit('UserClickedCloseModal', this.modalId, { target: target as HTMLElement });\n }\n }\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\nA list of events that the component will emit:\n\n- `UserClickedCloseModal`: the event is emitted after the user clicks the button. The event payload\n is the id of the modal that is going to be closed.\n\n## Examples\n\nComponent containing an event button that emits `UserClickedCloseModal` when clicked with the\nmodalId as payload. It has a default slot to customize its contents and can also be fully\ncustomized, replacing the default button with any other element.\n\n### Basic example\n\nThe component renders whatever is passed to it in the default slot inside the button and closes the\nmodal with modalId `my-modal`.\n\n```vue\n<template>\n <BaseIdModalClose modalId=\"my-modal\">\n <img src=\"./close-button-icon.svg\" />\n </BaseIdModalClose>\n</template>\n\n<script>\n import { BaseIdModalClose } from '@empathyco/x-components';\n\n export default {\n name: 'BaseIdModalCloseTest',\n components: {\n BaseIdModalClose\n }\n };\n</script>\n```\n\n### Replacing the default button\n\nThe component renders whatever element is passed, replacing the default button and exposing the\nfunction to close the modal with modalId `my-modal`.\n\n```vue\n<template>\n <BaseIdModalClose modalId=\"my-modal\">\n <template #closing-element=\"{ closeModal }\">\n <ul>\n <li @click=\"closeModal\">Close here</li>\n <li>Not here</li>\n </ul>\n </template>\n </BaseIdModalClose>\n</template>\n\n<script>\n import { BaseIdModalClose } from '@empathyco/x-components';\n\n export default {\n name: 'BaseIdModalCloseTest',\n components: {\n BaseIdModalClose\n }\n };\n</script>\n```\n</docs>\n"],"names":[],"mappings":";;;;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,19 +1,24 @@
|
|
|
1
1
|
import { __decorate } from 'tslib';
|
|
2
2
|
import Vue from 'vue';
|
|
3
3
|
import { Prop, Component } from 'vue-property-decorator';
|
|
4
|
-
import __vue_component__ from '../base-event-button.vue.js';
|
|
5
4
|
import { NoElement } from '../no-element.js';
|
|
6
5
|
|
|
7
6
|
/**
|
|
8
7
|
* Component that allows to close a modal by emitting {@link XEventsTypes.UserClickedCloseModal}.
|
|
9
|
-
* It
|
|
10
|
-
*
|
|
8
|
+
* It allows full customization with the 'closing-element' slot and exposes the 'closeModal'
|
|
9
|
+
* function.
|
|
11
10
|
*
|
|
12
11
|
* @public
|
|
13
12
|
*/
|
|
14
13
|
let BaseIdModalClose = class BaseIdModalClose extends Vue {
|
|
15
|
-
|
|
16
|
-
|
|
14
|
+
/**
|
|
15
|
+
* Emits the {@link XEventsTypes.UserClickedCloseModal} event with the modalId as payload.
|
|
16
|
+
*
|
|
17
|
+
* @param event - The event triggering the function.
|
|
18
|
+
* @public
|
|
19
|
+
*/
|
|
20
|
+
emitCloseModalEvent({ target }) {
|
|
21
|
+
this.$x.emit('UserClickedCloseModal', this.modalId, { target: target });
|
|
17
22
|
}
|
|
18
23
|
};
|
|
19
24
|
__decorate([
|
|
@@ -21,7 +26,7 @@ __decorate([
|
|
|
21
26
|
], BaseIdModalClose.prototype, "modalId", void 0);
|
|
22
27
|
BaseIdModalClose = __decorate([
|
|
23
28
|
Component({
|
|
24
|
-
components: {
|
|
29
|
+
components: { NoElement }
|
|
25
30
|
})
|
|
26
31
|
], BaseIdModalClose);
|
|
27
32
|
var script = BaseIdModalClose;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"base-id-modal-close.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../src/components/modals/base-id-modal-close.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport
|
|
1
|
+
{"version":3,"file":"base-id-modal-close.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../src/components/modals/base-id-modal-close.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { NoElement } from '../no-element';\n\n/**\n * Component that allows to close a modal by emitting {@link XEventsTypes.UserClickedCloseModal}.\n * It allows full customization with the 'closing-element' slot and exposes the 'closeModal'\n * function.\n *\n * @public\n */\n@Component({\n components: { NoElement }\n})\nexport default class BaseIdModalClose extends Vue {\n /**\n * The modalId of the modal that will be closed.\n *\n * @public\n */\n @Prop({ required: true })\n protected modalId!: string;\n\n /**\n * Emits the {@link XEventsTypes.UserClickedCloseModal} event with the modalId as payload.\n *\n * @param event - The event triggering the function.\n * @public\n */\n protected emitCloseModalEvent({ target }: Event): void {\n this.$x.emit('UserClickedCloseModal', this.modalId, { target: target as HTMLElement });\n }\n}\n"],"names":[],"mappings":";;;;;AAyBA;;;;;;;AAUA,IAAqB,gBAAgB,GAArC,MAAqB,gBAAiB,SAAQ,GAAG;;;;;;;IAerC,mBAAmB,CAAC,EAAE,MAAM,EAAS;QAC7C,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,uBAAuB,EAAE,IAAI,CAAC,OAAO,EAAE,EAAE,MAAM,EAAE,MAAqB,EAAE,CAAC,CAAC;KACxF;CACF,CAAA;AAXC;IADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;iDACE;AAPR,gBAAgB;IAHpC,SAAS,CAAC;QACT,UAAU,EAAE,EAAE,SAAS,EAAE;KAC1B,CAAC;GACmB,gBAAgB,CAkBpC;aAlBoB,gBAAgB;;;;"}
|
|
@@ -10,15 +10,27 @@ var __vue_render__ = function () {
|
|
|
10
10
|
var _h = _vm.$createElement;
|
|
11
11
|
var _c = _vm._self._c || _h;
|
|
12
12
|
return _c(
|
|
13
|
-
"
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
13
|
+
"NoElement",
|
|
14
|
+
[
|
|
15
|
+
_vm._t(
|
|
16
|
+
"opening-element",
|
|
17
|
+
function () {
|
|
18
|
+
return [
|
|
19
|
+
_c(
|
|
20
|
+
"button",
|
|
21
|
+
{
|
|
22
|
+
staticClass: "x-button x-events-modal-id-open-button",
|
|
23
|
+
attrs: { "data-test": "open-modal-id" },
|
|
24
|
+
on: { click: _vm.emitOpenModalEvent },
|
|
25
|
+
},
|
|
26
|
+
[_vm._t("default")],
|
|
27
|
+
2
|
|
28
|
+
),
|
|
29
|
+
]
|
|
30
|
+
},
|
|
31
|
+
{ openModal: _vm.emitOpenModalEvent }
|
|
32
|
+
),
|
|
33
|
+
],
|
|
22
34
|
2
|
|
23
35
|
)
|
|
24
36
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"base-id-modal-open.vue.js","sources":["../../../../src/components/modals/base-id-modal-open.vue"],"sourcesContent":["<template>\n <
|
|
1
|
+
{"version":3,"file":"base-id-modal-open.vue.js","sources":["../../../../src/components/modals/base-id-modal-open.vue"],"sourcesContent":["<template>\n <NoElement>\n <!--\n @slot opening-element. It's the element that will trigger the modal opening. It's a\n button by default.\n @binding {Function} openModal - The function to open the modal.\n -->\n <slot :openModal=\"emitOpenModalEvent\" name=\"opening-element\">\n <button\n @click=\"emitOpenModalEvent\"\n class=\"x-button x-events-modal-id-open-button\"\n data-test=\"open-modal-id\"\n >\n <!-- @slot (Required) Button content with a text, an icon or both -->\n <slot />\n </button>\n </slot>\n </NoElement>\n</template>\n\n<script lang=\"ts\">\n import Vue from 'vue';\n import { Component, Prop } from 'vue-property-decorator';\n import { NoElement } from '../no-element';\n\n /**\n * Component that allows to open a modal by emitting {@link XEventsTypes.UserClickedOpenModal}\n * with the modalId as payload. It allows full customization with the 'opening-element' slot and\n * exposes the 'openModal' function.\n *\n * @public\n */\n @Component({\n components: { NoElement }\n })\n export default class BaseIdModalOpen extends Vue {\n /**\n * The modalId of the modal that will be opened.\n *\n * @public\n */\n @Prop({ required: true })\n protected modalId!: string;\n\n /**\n * Emits the {@link XEventsTypes.UserClickedOpenModal} event with the modalId as payload.\n *\n * @param event - The event triggering the function.\n * @public\n */\n protected emitOpenModalEvent({ target }: Event): void {\n this.$x.emit('UserClickedOpenModal', this.modalId, { target: target as HTMLElement });\n }\n }\n</script>\n\n<docs lang=\"mdx\">\n## Events\n\nA list of events that the component will emit:\n\n- `UserClickedOpenModal`: the event is emitted after the user clicks the button. The event payload\n is the id of the modal that is going to be opened.\n\n## Examples\n\nComponent containing an event button that emits `UserClickedOpenModal` when it is clicked with the\nmodalId as payload. It has a default slot to customize its contents and can also be fully\ncustomized, replacing the default button with any other element.\n\n### Basic example\n\nThe component rendering content passed to the default slot inside the button and opening the modal\nwith modalId `my-modal`.\n\n```vue\n<template>\n <BaseIdModalOpen modalId=\"my-modal\">\n <img src=\"./open-button-icon.svg\" />\n <span>Open</span>\n </BaseIdModalOpen>\n</template>\n\n<script>\n import { BaseIdModalOpen } from '@empathyco/x-components';\n\n export default {\n name: 'BaseIdModalOpenTest',\n components: {\n BaseIdModalOpen\n }\n };\n</script>\n```\n\n### Replacing the default button\n\nThe component renders whatever element is passed, replacing the default button and exposing the\nfunction to open the modal with modalId `my-modal`.\n\n```vue\n<template>\n <BaseIdModalOpen modalId=\"my-modal\">\n <template #opening-element=\"{ openModal }\">\n <ul>\n <li @click=\"openModal\">Open here</li>\n <li>Not here</li>\n </ul>\n </template>\n </BaseIdModalOpen>\n</template>\n\n<script>\n import { BaseIdModalOpen } from '@empathyco/x-components';\n\n export default {\n name: 'BaseIdModalOpenTest',\n components: {\n BaseIdModalOpen\n }\n };\n</script>\n```\n</docs>\n"],"names":[],"mappings":";;;;AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,17 +1,24 @@
|
|
|
1
1
|
import { __decorate } from 'tslib';
|
|
2
2
|
import Vue from 'vue';
|
|
3
3
|
import { Prop, Component } from 'vue-property-decorator';
|
|
4
|
-
import
|
|
4
|
+
import { NoElement } from '../no-element.js';
|
|
5
5
|
|
|
6
6
|
/**
|
|
7
|
-
* Component
|
|
8
|
-
*
|
|
7
|
+
* Component that allows to open a modal by emitting {@link XEventsTypes.UserClickedOpenModal}
|
|
8
|
+
* with the modalId as payload. It allows full customization with the 'opening-element' slot and
|
|
9
|
+
* exposes the 'openModal' function.
|
|
9
10
|
*
|
|
10
11
|
* @public
|
|
11
12
|
*/
|
|
12
13
|
let BaseIdModalOpen = class BaseIdModalOpen extends Vue {
|
|
13
|
-
|
|
14
|
-
|
|
14
|
+
/**
|
|
15
|
+
* Emits the {@link XEventsTypes.UserClickedOpenModal} event with the modalId as payload.
|
|
16
|
+
*
|
|
17
|
+
* @param event - The event triggering the function.
|
|
18
|
+
* @public
|
|
19
|
+
*/
|
|
20
|
+
emitOpenModalEvent({ target }) {
|
|
21
|
+
this.$x.emit('UserClickedOpenModal', this.modalId, { target: target });
|
|
15
22
|
}
|
|
16
23
|
};
|
|
17
24
|
__decorate([
|
|
@@ -19,7 +26,7 @@ __decorate([
|
|
|
19
26
|
], BaseIdModalOpen.prototype, "modalId", void 0);
|
|
20
27
|
BaseIdModalOpen = __decorate([
|
|
21
28
|
Component({
|
|
22
|
-
components: {
|
|
29
|
+
components: { NoElement }
|
|
23
30
|
})
|
|
24
31
|
], BaseIdModalOpen);
|
|
25
32
|
var script = BaseIdModalOpen;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"base-id-modal-open.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../src/components/modals/base-id-modal-open.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\n\n\n\n\n\n\n\n\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport {
|
|
1
|
+
{"version":3,"file":"base-id-modal-open.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../src/components/modals/base-id-modal-open.vue?rollup-plugin-vue=script.ts"],"sourcesContent":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nimport Vue from 'vue';\nimport { Component, Prop } from 'vue-property-decorator';\nimport { NoElement } from '../no-element';\n\n/**\n * Component that allows to open a modal by emitting {@link XEventsTypes.UserClickedOpenModal}\n * with the modalId as payload. It allows full customization with the 'opening-element' slot and\n * exposes the 'openModal' function.\n *\n * @public\n */\n@Component({\n components: { NoElement }\n})\nexport default class BaseIdModalOpen extends Vue {\n /**\n * The modalId of the modal that will be opened.\n *\n * @public\n */\n @Prop({ required: true })\n protected modalId!: string;\n\n /**\n * Emits the {@link XEventsTypes.UserClickedOpenModal} event with the modalId as payload.\n *\n * @param event - The event triggering the function.\n * @public\n */\n protected emitOpenModalEvent({ target }: Event): void {\n this.$x.emit('UserClickedOpenModal', this.modalId, { target: target as HTMLElement });\n }\n}\n"],"names":[],"mappings":";;;;;AAyBA;;;;;;;AAUA,IAAqB,eAAe,GAApC,MAAqB,eAAgB,SAAQ,GAAG;;;;;;;IAepC,kBAAkB,CAAC,EAAE,MAAM,EAAS;QAC5C,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,sBAAsB,EAAE,IAAI,CAAC,OAAO,EAAE,EAAE,MAAM,EAAE,MAAqB,EAAE,CAAC,CAAC;KACvF;CACF,CAAA;AAXC;IADC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;gDACE;AAPR,eAAe;IAHnC,SAAS,CAAC;QACT,UAAU,EAAE,EAAE,SAAS,EAAE;KAC1B,CAAC;GACmB,eAAe,CAkBnC;aAlBoB,eAAe;;;;"}
|
|
@@ -67,8 +67,8 @@ class SingleSelectModifier extends BaseFilterEntityModifier {
|
|
|
67
67
|
* @internal
|
|
68
68
|
*/
|
|
69
69
|
getDescendantsIds(filter, ids = [filter.id]) {
|
|
70
|
-
return filter?.children
|
|
71
|
-
? filter?.children.
|
|
70
|
+
return filter?.children?.length
|
|
71
|
+
? filter?.children.reduce((descendantIdsList, descendant) => this.getDescendantsIds(descendant, [descendant.id, ...descendantIdsList]), ids)
|
|
72
72
|
: ids;
|
|
73
73
|
}
|
|
74
74
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"single-select.modifier.js","sources":["../../../../../src/x-modules/facets/entities/single-select.modifier.ts"],"sourcesContent":["import {\n isFacetFilter,\n isHierarchicalFilter,\n FacetFilter,\n Facet,\n Filter,\n HierarchicalFilter\n} from '@empathyco/x-types';\nimport { BaseFilterEntityModifier } from './types';\n\n/**\n * Allows only to select only one filter from the same facet at the same time.\n *\n * @internal\n */\nexport class SingleSelectModifier extends BaseFilterEntityModifier {\n /**\n * Selects the passed filter, and then deselects any other filter of the same facet.\n *\n * @param filter - The filter to select.\n */\n select(filter: FacetFilter): void {\n this.getOtherFilters(filter).forEach(this.deselect.bind(this));\n this.entity.select(filter);\n }\n\n /**\n * Retrieves the rest of selected filters of the same facet than the one given.\n *\n * @param filter - The filter to find its relatives.\n * @returns A list of selected filters that belong to the same facet than the filter passed.\n * @remarks It takes into account if the passed filter is an\n * {@link @empathyco/x-types#HierarchicalFilter | HierarchicalFilter} to exclude the ancestors and\n * descendants.\n *\n * @internal\n */\n protected getOtherFilters(filter: FacetFilter): FacetFilter[] {\n /* This check seems dumb, but when you instantiate this modifier using the factory, the types\n `FacetFilter` parameter type is lost, so we should check it to avoid unexpected crashes\n due to a wrong configuration. */\n if (isHierarchicalFilter(filter)) {\n const ancestorsIds = this.getAncestorsIds(filter);\n const descendantsIds = this.getDescendantsIds(filter);\n return this.getFacetFilters(filter.facetId).filter(\n storeFilter =>\n !ancestorsIds.includes(storeFilter.id) && !descendantsIds.includes(storeFilter.id)\n );\n } else if (isFacetFilter(filter)) {\n return this.getFacetFilters(filter.facetId).filter(\n storeFilter => storeFilter.id !== filter.id && storeFilter.selected\n );\n } else {\n // TODO Add a warning in case a non facet filter is passed here.\n return [];\n }\n }\n\n /**\n * Returns the ancestors Filters Ids of the passed filter.\n *\n * @param filter - The {@link @empathyco/x-types#Filter | Filter} which obtain the ancestors from.\n * @param ids - (Optional) an Array with the Ids used to execute the method recursively.\n * @returns An Array with the ancestors ids.\n * @internal\n */\n protected getAncestorsIds(\n filter: HierarchicalFilter,\n ids: Array<Filter['id']> = [filter.id]\n ): Array<Filter['id']> {\n return filter?.parentId\n ? this.getAncestorsIds(\n this.store.state.x.facets.filters[filter.parentId] as HierarchicalFilter,\n [filter.parentId, ...ids]\n )\n : ids;\n }\n\n /**\n * Returns the descendants Filters Ids of the passed filter.\n *\n * @param filter - The {@link @empathyco/x-types#Filter | Filter} which obtain the descendants\n * from.\n * @param ids - (Optional) an Array with the Ids used to execute the method recursively.\n * @returns An Array with the descendants ids.\n * @internal\n */\n protected getDescendantsIds(\n filter: HierarchicalFilter,\n ids: Array<Filter['id']> = [filter.id]\n ): Array<Filter['id']> {\n return filter?.children\n ? filter?.children.
|
|
1
|
+
{"version":3,"file":"single-select.modifier.js","sources":["../../../../../src/x-modules/facets/entities/single-select.modifier.ts"],"sourcesContent":["import {\n isFacetFilter,\n isHierarchicalFilter,\n FacetFilter,\n Facet,\n Filter,\n HierarchicalFilter\n} from '@empathyco/x-types';\nimport { BaseFilterEntityModifier } from './types';\n\n/**\n * Allows only to select only one filter from the same facet at the same time.\n *\n * @internal\n */\nexport class SingleSelectModifier extends BaseFilterEntityModifier {\n /**\n * Selects the passed filter, and then deselects any other filter of the same facet.\n *\n * @param filter - The filter to select.\n */\n select(filter: FacetFilter): void {\n this.getOtherFilters(filter).forEach(this.deselect.bind(this));\n this.entity.select(filter);\n }\n\n /**\n * Retrieves the rest of selected filters of the same facet than the one given.\n *\n * @param filter - The filter to find its relatives.\n * @returns A list of selected filters that belong to the same facet than the filter passed.\n * @remarks It takes into account if the passed filter is an\n * {@link @empathyco/x-types#HierarchicalFilter | HierarchicalFilter} to exclude the ancestors and\n * descendants.\n *\n * @internal\n */\n protected getOtherFilters(filter: FacetFilter): FacetFilter[] {\n /* This check seems dumb, but when you instantiate this modifier using the factory, the types\n `FacetFilter` parameter type is lost, so we should check it to avoid unexpected crashes\n due to a wrong configuration. */\n if (isHierarchicalFilter(filter)) {\n const ancestorsIds = this.getAncestorsIds(filter);\n const descendantsIds = this.getDescendantsIds(filter);\n return this.getFacetFilters(filter.facetId).filter(\n storeFilter =>\n !ancestorsIds.includes(storeFilter.id) && !descendantsIds.includes(storeFilter.id)\n );\n } else if (isFacetFilter(filter)) {\n return this.getFacetFilters(filter.facetId).filter(\n storeFilter => storeFilter.id !== filter.id && storeFilter.selected\n );\n } else {\n // TODO Add a warning in case a non facet filter is passed here.\n return [];\n }\n }\n\n /**\n * Returns the ancestors Filters Ids of the passed filter.\n *\n * @param filter - The {@link @empathyco/x-types#Filter | Filter} which obtain the ancestors from.\n * @param ids - (Optional) an Array with the Ids used to execute the method recursively.\n * @returns An Array with the ancestors ids.\n * @internal\n */\n protected getAncestorsIds(\n filter: HierarchicalFilter,\n ids: Array<Filter['id']> = [filter.id]\n ): Array<Filter['id']> {\n return filter?.parentId\n ? this.getAncestorsIds(\n this.store.state.x.facets.filters[filter.parentId] as HierarchicalFilter,\n [filter.parentId, ...ids]\n )\n : ids;\n }\n\n /**\n * Returns the descendants Filters Ids of the passed filter.\n *\n * @param filter - The {@link @empathyco/x-types#Filter | Filter} which obtain the descendants\n * from.\n * @param ids - (Optional) an Array with the Ids used to execute the method recursively.\n * @returns An Array with the descendants ids.\n * @internal\n */\n protected getDescendantsIds(\n filter: HierarchicalFilter,\n ids: Array<Filter['id']> = [filter.id]\n ): Array<Filter['id']> {\n return filter?.children?.length\n ? filter?.children.reduce(\n (descendantIdsList, descendant) =>\n this.getDescendantsIds(descendant, [descendant.id, ...descendantIdsList]),\n ids\n )\n : ids;\n }\n\n /**\n * Retrieves All the filters from the given facet.\n *\n * @param facetId - The facet id to retrieve its filters.\n * @returns The filters from the given facet.\n * @internal\n */\n protected getFacetFilters(facetId: Facet['id']): FacetFilter[] {\n return (\n ((this.store.getters['x/facets/facets'] as Record<Facet['id'], Facet>)[facetId]\n ?.filters as FacetFilter[]) ?? []\n );\n }\n}\n"],"names":[],"mappings":";;;AAUA;;;;;MAKa,oBAAqB,SAAQ,wBAAwB;;;;;;IAMhE,MAAM,CAAC,MAAmB;QACxB,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QAC/D,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;KAC5B;;;;;;;;;;;;IAaS,eAAe,CAAC,MAAmB;;;;QAI3C,IAAI,oBAAoB,CAAC,MAAM,CAAC,EAAE;YAChC,MAAM,YAAY,GAAG,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;YAClD,MAAM,cAAc,GAAG,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC;YACtD,OAAO,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,MAAM,CAChD,WAAW,IACT,CAAC,YAAY,CAAC,QAAQ,CAAC,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC,WAAW,CAAC,EAAE,CAAC,CACrF,CAAC;SACH;aAAM,IAAI,aAAa,CAAC,MAAM,CAAC,EAAE;YAChC,OAAO,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,MAAM,CAChD,WAAW,IAAI,WAAW,CAAC,EAAE,KAAK,MAAM,CAAC,EAAE,IAAI,WAAW,CAAC,QAAQ,CACpE,CAAC;SACH;aAAM;;YAEL,OAAO,EAAE,CAAC;SACX;KACF;;;;;;;;;IAUS,eAAe,CACvB,MAA0B,EAC1B,MAA2B,CAAC,MAAM,CAAC,EAAE,CAAC;QAEtC,OAAO,MAAM,EAAE,QAAQ;cACnB,IAAI,CAAC,eAAe,CAClB,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAuB,EACxE,CAAC,MAAM,CAAC,QAAQ,EAAE,GAAG,GAAG,CAAC,CAC1B;cACD,GAAG,CAAC;KACT;;;;;;;;;;IAWS,iBAAiB,CACzB,MAA0B,EAC1B,MAA2B,CAAC,MAAM,CAAC,EAAE,CAAC;QAEtC,OAAO,MAAM,EAAE,QAAQ,EAAE,MAAM;cAC3B,MAAM,EAAE,QAAQ,CAAC,MAAM,CACrB,CAAC,iBAAiB,EAAE,UAAU,KAC5B,IAAI,CAAC,iBAAiB,CAAC,UAAU,EAAE,CAAC,UAAU,CAAC,EAAE,EAAE,GAAG,iBAAiB,CAAC,CAAC,EAC3E,GAAG,CACJ;cACD,GAAG,CAAC;KACT;;;;;;;;IASS,eAAe,CAAC,OAAoB;QAC5C,QACI,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAAgC,CAAC,OAAO,CAAC;cAC3E,OAAyB,IAAI,EAAE,EACnC;KACH;;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@empathyco/x-components",
|
|
3
|
-
"version": "3.0.0-alpha.
|
|
3
|
+
"version": "3.0.0-alpha.150",
|
|
4
4
|
"description": "Empathy X Components",
|
|
5
5
|
"author": "Empathy Systems Corporation S.L.",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -125,5 +125,5 @@
|
|
|
125
125
|
"access": "public",
|
|
126
126
|
"directory": "dist"
|
|
127
127
|
},
|
|
128
|
-
"gitHead": "
|
|
128
|
+
"gitHead": "1fc14893fef9ae25e2711f30513144055ebe13af"
|
|
129
129
|
}
|
|
@@ -3702,7 +3702,7 @@
|
|
|
3702
3702
|
{
|
|
3703
3703
|
"kind": "Class",
|
|
3704
3704
|
"canonicalReference": "@empathyco/x-components!BaseIdModalClose:class",
|
|
3705
|
-
"docComment": "/**\n * Component that allows to close a modal by emitting {@link XEventsTypes.UserClickedCloseModal}. It
|
|
3705
|
+
"docComment": "/**\n * Component that allows to close a modal by emitting {@link XEventsTypes.UserClickedCloseModal}. It allows full customization with the 'closing-element' slot and exposes the 'closeModal' function.\n *\n * @public\n */\n",
|
|
3706
3706
|
"excerptTokens": [
|
|
3707
3707
|
{
|
|
3708
3708
|
"kind": "Content",
|
|
@@ -3724,11 +3724,20 @@
|
|
|
3724
3724
|
{
|
|
3725
3725
|
"kind": "Method",
|
|
3726
3726
|
"canonicalReference": "@empathyco/x-components!BaseIdModalClose#emitCloseModalEvent:member(1)",
|
|
3727
|
-
"docComment": "",
|
|
3727
|
+
"docComment": "/**\n * Emits the {@link XEventsTypes.UserClickedCloseModal} event with the modalId as payload.\n *\n * @param event - The event triggering the function.\n *\n * @public\n */\n",
|
|
3728
3728
|
"excerptTokens": [
|
|
3729
3729
|
{
|
|
3730
3730
|
"kind": "Content",
|
|
3731
|
-
"text": "protected emitCloseModalEvent(
|
|
3731
|
+
"text": "protected emitCloseModalEvent({ target }: "
|
|
3732
|
+
},
|
|
3733
|
+
{
|
|
3734
|
+
"kind": "Reference",
|
|
3735
|
+
"text": "Event",
|
|
3736
|
+
"canonicalReference": "!Event:interface"
|
|
3737
|
+
},
|
|
3738
|
+
{
|
|
3739
|
+
"kind": "Content",
|
|
3740
|
+
"text": "): "
|
|
3732
3741
|
},
|
|
3733
3742
|
{
|
|
3734
3743
|
"kind": "Content",
|
|
@@ -3742,18 +3751,26 @@
|
|
|
3742
3751
|
"isOptional": false,
|
|
3743
3752
|
"isStatic": false,
|
|
3744
3753
|
"returnTypeTokenRange": {
|
|
3745
|
-
"startIndex":
|
|
3746
|
-
"endIndex":
|
|
3754
|
+
"startIndex": 3,
|
|
3755
|
+
"endIndex": 4
|
|
3747
3756
|
},
|
|
3748
3757
|
"releaseTag": "Public",
|
|
3749
3758
|
"overloadIndex": 1,
|
|
3750
|
-
"parameters": [
|
|
3759
|
+
"parameters": [
|
|
3760
|
+
{
|
|
3761
|
+
"parameterName": "{ target }",
|
|
3762
|
+
"parameterTypeTokenRange": {
|
|
3763
|
+
"startIndex": 1,
|
|
3764
|
+
"endIndex": 2
|
|
3765
|
+
}
|
|
3766
|
+
}
|
|
3767
|
+
],
|
|
3751
3768
|
"name": "emitCloseModalEvent"
|
|
3752
3769
|
},
|
|
3753
3770
|
{
|
|
3754
3771
|
"kind": "Property",
|
|
3755
3772
|
"canonicalReference": "@empathyco/x-components!BaseIdModalClose#modalId:member",
|
|
3756
|
-
"docComment": "",
|
|
3773
|
+
"docComment": "/**\n * The modalId of the modal that will be closed.\n *\n * @public\n */\n",
|
|
3757
3774
|
"excerptTokens": [
|
|
3758
3775
|
{
|
|
3759
3776
|
"kind": "Content",
|
|
@@ -3787,7 +3804,7 @@
|
|
|
3787
3804
|
{
|
|
3788
3805
|
"kind": "Class",
|
|
3789
3806
|
"canonicalReference": "@empathyco/x-components!BaseIdModalOpen:class",
|
|
3790
|
-
"docComment": "/**\n * Component
|
|
3807
|
+
"docComment": "/**\n * Component that allows to open a modal by emitting {@link XEventsTypes.UserClickedOpenModal} with the modalId as payload. It allows full customization with the 'opening-element' slot and exposes the 'openModal' function.\n *\n * @public\n */\n",
|
|
3791
3808
|
"excerptTokens": [
|
|
3792
3809
|
{
|
|
3793
3810
|
"kind": "Content",
|
|
@@ -3807,31 +3824,26 @@
|
|
|
3807
3824
|
"name": "BaseIdModalOpen",
|
|
3808
3825
|
"members": [
|
|
3809
3826
|
{
|
|
3810
|
-
"kind": "
|
|
3811
|
-
"canonicalReference": "@empathyco/x-components!BaseIdModalOpen#
|
|
3812
|
-
"docComment": "",
|
|
3827
|
+
"kind": "Method",
|
|
3828
|
+
"canonicalReference": "@empathyco/x-components!BaseIdModalOpen#emitOpenModalEvent:member(1)",
|
|
3829
|
+
"docComment": "/**\n * Emits the {@link XEventsTypes.UserClickedOpenModal} event with the modalId as payload.\n *\n * @param event - The event triggering the function.\n *\n * @public\n */\n",
|
|
3813
3830
|
"excerptTokens": [
|
|
3814
3831
|
{
|
|
3815
3832
|
"kind": "Content",
|
|
3816
|
-
"text": "protected
|
|
3833
|
+
"text": "protected emitOpenModalEvent({ target }: "
|
|
3817
3834
|
},
|
|
3818
3835
|
{
|
|
3819
3836
|
"kind": "Reference",
|
|
3820
|
-
"text": "
|
|
3821
|
-
"canonicalReference": "!
|
|
3837
|
+
"text": "Event",
|
|
3838
|
+
"canonicalReference": "!Event:interface"
|
|
3822
3839
|
},
|
|
3823
3840
|
{
|
|
3824
3841
|
"kind": "Content",
|
|
3825
|
-
"text": "
|
|
3826
|
-
},
|
|
3827
|
-
{
|
|
3828
|
-
"kind": "Reference",
|
|
3829
|
-
"text": "XEventsTypes",
|
|
3830
|
-
"canonicalReference": "@empathyco/x-components!XEventsTypes:interface"
|
|
3842
|
+
"text": "): "
|
|
3831
3843
|
},
|
|
3832
3844
|
{
|
|
3833
3845
|
"kind": "Content",
|
|
3834
|
-
"text": "
|
|
3846
|
+
"text": "void"
|
|
3835
3847
|
},
|
|
3836
3848
|
{
|
|
3837
3849
|
"kind": "Content",
|
|
@@ -3839,18 +3851,28 @@
|
|
|
3839
3851
|
}
|
|
3840
3852
|
],
|
|
3841
3853
|
"isOptional": false,
|
|
3842
|
-
"
|
|
3843
|
-
"
|
|
3844
|
-
|
|
3845
|
-
"
|
|
3846
|
-
"endIndex": 5
|
|
3854
|
+
"isStatic": false,
|
|
3855
|
+
"returnTypeTokenRange": {
|
|
3856
|
+
"startIndex": 3,
|
|
3857
|
+
"endIndex": 4
|
|
3847
3858
|
},
|
|
3848
|
-
"
|
|
3859
|
+
"releaseTag": "Public",
|
|
3860
|
+
"overloadIndex": 1,
|
|
3861
|
+
"parameters": [
|
|
3862
|
+
{
|
|
3863
|
+
"parameterName": "{ target }",
|
|
3864
|
+
"parameterTypeTokenRange": {
|
|
3865
|
+
"startIndex": 1,
|
|
3866
|
+
"endIndex": 2
|
|
3867
|
+
}
|
|
3868
|
+
}
|
|
3869
|
+
],
|
|
3870
|
+
"name": "emitOpenModalEvent"
|
|
3849
3871
|
},
|
|
3850
3872
|
{
|
|
3851
3873
|
"kind": "Property",
|
|
3852
3874
|
"canonicalReference": "@empathyco/x-components!BaseIdModalOpen#modalId:member",
|
|
3853
|
-
"docComment": "",
|
|
3875
|
+
"docComment": "/**\n * The modalId of the modal that will be opened.\n *\n * @public\n */\n",
|
|
3854
3876
|
"excerptTokens": [
|
|
3855
3877
|
{
|
|
3856
3878
|
"kind": "Content",
|
|
@@ -384,17 +384,13 @@ export class BaseIdModal extends Vue_2 {
|
|
|
384
384
|
|
|
385
385
|
// @public
|
|
386
386
|
export class BaseIdModalClose extends Vue_2 {
|
|
387
|
-
|
|
388
|
-
protected emitCloseModalEvent(): void;
|
|
389
|
-
// (undocumented)
|
|
387
|
+
protected emitCloseModalEvent({ target }: Event): void;
|
|
390
388
|
protected modalId: string;
|
|
391
389
|
}
|
|
392
390
|
|
|
393
391
|
// @public
|
|
394
392
|
export class BaseIdModalOpen extends Vue_2 {
|
|
395
|
-
|
|
396
|
-
protected get events(): Partial<XEventsTypes>;
|
|
397
|
-
// (undocumented)
|
|
393
|
+
protected emitOpenModalEvent({ target }: Event): void;
|
|
398
394
|
protected modalId: string;
|
|
399
395
|
}
|
|
400
396
|
|
|
@@ -1,13 +1,24 @@
|
|
|
1
1
|
import Vue from 'vue';
|
|
2
2
|
/**
|
|
3
3
|
* Component that allows to close a modal by emitting {@link XEventsTypes.UserClickedCloseModal}.
|
|
4
|
-
* It
|
|
5
|
-
*
|
|
4
|
+
* It allows full customization with the 'closing-element' slot and exposes the 'closeModal'
|
|
5
|
+
* function.
|
|
6
6
|
*
|
|
7
7
|
* @public
|
|
8
8
|
*/
|
|
9
9
|
export default class BaseIdModalClose extends Vue {
|
|
10
|
+
/**
|
|
11
|
+
* The modalId of the modal that will be closed.
|
|
12
|
+
*
|
|
13
|
+
* @public
|
|
14
|
+
*/
|
|
10
15
|
protected modalId: string;
|
|
11
|
-
|
|
16
|
+
/**
|
|
17
|
+
* Emits the {@link XEventsTypes.UserClickedCloseModal} event with the modalId as payload.
|
|
18
|
+
*
|
|
19
|
+
* @param event - The event triggering the function.
|
|
20
|
+
* @public
|
|
21
|
+
*/
|
|
22
|
+
protected emitCloseModalEvent({ target }: Event): void;
|
|
12
23
|
}
|
|
13
24
|
//# sourceMappingURL=base-id-modal-close.vue?rollup-plugin-vue=script.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"base-id-modal-close.vue?rollup-plugin-vue=script.d.ts","sourceRoot":"","sources":["../../../../src/components/modals/base-id-modal-close.vue?rollup-plugin-vue=script.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"base-id-modal-close.vue?rollup-plugin-vue=script.d.ts","sourceRoot":"","sources":["../../../../src/components/modals/base-id-modal-close.vue?rollup-plugin-vue=script.ts"],"names":[],"mappings":"AAqBA,OAAO,GAAG,MAAM,KAAK,CAAC;AAItB;;;;;;GAMG;AAIH,MAAM,CAAC,OAAO,OAAO,gBAAiB,SAAQ,GAAG;IAC/C;;;;OAIG;IAEH,SAAS,CAAC,OAAO,EAAG,MAAM,CAAC;IAE3B;;;;;OAKG;IACH,SAAS,CAAC,mBAAmB,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK,GAAG,IAAI;CAGvD"}
|
|
@@ -1,13 +1,24 @@
|
|
|
1
1
|
import Vue from 'vue';
|
|
2
|
-
import { XEventsTypes } from '../../wiring/events.types';
|
|
3
2
|
/**
|
|
4
|
-
* Component
|
|
5
|
-
*
|
|
3
|
+
* Component that allows to open a modal by emitting {@link XEventsTypes.UserClickedOpenModal}
|
|
4
|
+
* with the modalId as payload. It allows full customization with the 'opening-element' slot and
|
|
5
|
+
* exposes the 'openModal' function.
|
|
6
6
|
*
|
|
7
7
|
* @public
|
|
8
8
|
*/
|
|
9
9
|
export default class BaseIdModalOpen extends Vue {
|
|
10
|
+
/**
|
|
11
|
+
* The modalId of the modal that will be opened.
|
|
12
|
+
*
|
|
13
|
+
* @public
|
|
14
|
+
*/
|
|
10
15
|
protected modalId: string;
|
|
11
|
-
|
|
16
|
+
/**
|
|
17
|
+
* Emits the {@link XEventsTypes.UserClickedOpenModal} event with the modalId as payload.
|
|
18
|
+
*
|
|
19
|
+
* @param event - The event triggering the function.
|
|
20
|
+
* @public
|
|
21
|
+
*/
|
|
22
|
+
protected emitOpenModalEvent({ target }: Event): void;
|
|
12
23
|
}
|
|
13
24
|
//# sourceMappingURL=base-id-modal-open.vue?rollup-plugin-vue=script.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"base-id-modal-open.vue?rollup-plugin-vue=script.d.ts","sourceRoot":"","sources":["../../../../src/components/modals/base-id-modal-open.vue?rollup-plugin-vue=script.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"base-id-modal-open.vue?rollup-plugin-vue=script.d.ts","sourceRoot":"","sources":["../../../../src/components/modals/base-id-modal-open.vue?rollup-plugin-vue=script.ts"],"names":[],"mappings":"AAqBA,OAAO,GAAG,MAAM,KAAK,CAAC;AAItB;;;;;;GAMG;AAIH,MAAM,CAAC,OAAO,OAAO,eAAgB,SAAQ,GAAG;IAC9C;;;;OAIG;IAEH,SAAS,CAAC,OAAO,EAAG,MAAM,CAAC;IAE3B;;;;;OAKG;IACH,SAAS,CAAC,kBAAkB,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK,GAAG,IAAI;CAGtD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"single-select.modifier.d.ts","sourceRoot":"","sources":["../../../../../src/x-modules/facets/entities/single-select.modifier.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,WAAW,EACX,KAAK,EACL,MAAM,EACN,kBAAkB,EACnB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAC;AAEnD;;;;GAIG;AACH,qBAAa,oBAAqB,SAAQ,wBAAwB;IAChE;;;;OAIG;IACH,MAAM,CAAC,MAAM,EAAE,WAAW,GAAG,IAAI;IAKjC;;;;;;;;;;OAUG;IACH,SAAS,CAAC,eAAe,CAAC,MAAM,EAAE,WAAW,GAAG,WAAW,EAAE;IAqB7D;;;;;;;OAOG;IACH,SAAS,CAAC,eAAe,CACvB,MAAM,EAAE,kBAAkB,EAC1B,GAAG,GAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAe,GACrC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAStB;;;;;;;;OAQG;IACH,SAAS,CAAC,iBAAiB,CACzB,MAAM,EAAE,kBAAkB,EAC1B,GAAG,GAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAe,GACrC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"single-select.modifier.d.ts","sourceRoot":"","sources":["../../../../../src/x-modules/facets/entities/single-select.modifier.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,WAAW,EACX,KAAK,EACL,MAAM,EACN,kBAAkB,EACnB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,wBAAwB,EAAE,MAAM,SAAS,CAAC;AAEnD;;;;GAIG;AACH,qBAAa,oBAAqB,SAAQ,wBAAwB;IAChE;;;;OAIG;IACH,MAAM,CAAC,MAAM,EAAE,WAAW,GAAG,IAAI;IAKjC;;;;;;;;;;OAUG;IACH,SAAS,CAAC,eAAe,CAAC,MAAM,EAAE,WAAW,GAAG,WAAW,EAAE;IAqB7D;;;;;;;OAOG;IACH,SAAS,CAAC,eAAe,CACvB,MAAM,EAAE,kBAAkB,EAC1B,GAAG,GAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAe,GACrC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAStB;;;;;;;;OAQG;IACH,SAAS,CAAC,iBAAiB,CACzB,MAAM,EAAE,kBAAkB,EAC1B,GAAG,GAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAe,GACrC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAUtB;;;;;;OAMG;IACH,SAAS,CAAC,eAAe,CAAC,OAAO,EAAE,KAAK,CAAC,IAAI,CAAC,GAAG,WAAW,EAAE;CAM/D"}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
<!-- Do not edit this file. It is automatically generated by API Documenter. -->
|
|
2
|
-
|
|
3
|
-
[Home](./index.md) > [@empathyco/x-components](./x-components.md) > [BaseIdModalOpen](./x-components.baseidmodalopen.md) > [events](./x-components.baseidmodalopen.events.md)
|
|
4
|
-
|
|
5
|
-
## BaseIdModalOpen.events property
|
|
6
|
-
|
|
7
|
-
<b>Signature:</b>
|
|
8
|
-
|
|
9
|
-
```typescript
|
|
10
|
-
protected get events(): Partial<XEventsTypes>;
|
|
11
|
-
```
|