@alfalab/core-components-popover 8.0.0 → 8.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/esm/index.css +25 -25
  2. package/esm/index.module.css.js +1 -1
  3. package/esm/index.module.css.js.map +1 -1
  4. package/index.css +25 -25
  5. package/index.module.css.js +1 -1
  6. package/index.module.css.js.map +1 -1
  7. package/modern/index.css +25 -25
  8. package/modern/index.module.css.js +1 -1
  9. package/modern/index.module.css.js.map +1 -1
  10. package/package.json +6 -6
package/esm/index.css CHANGED
@@ -13,11 +13,11 @@
13
13
  :root {
14
14
  --popover-border-color: transparent;
15
15
  }
16
- .popover__component_1ml4d {
16
+ .popover__component_397e {
17
17
  background-color: transparent;
18
18
  color: var(--color-light-text-primary);
19
19
  }
20
- .popover__inner_1ml4d {
20
+ .popover__inner_397e {
21
21
  position: relative;
22
22
  background-color: var(--color-light-modal-bg-primary);
23
23
  box-shadow: var(--shadow-m);
@@ -25,15 +25,15 @@
25
25
  box-sizing: border-box;
26
26
  will-change: transform;
27
27
  }
28
- .popover__scrollableContent_1ml4d {
28
+ .popover__scrollableContent_397e {
29
29
  position: relative;
30
30
  z-index: 2;
31
31
  overflow-y: auto;
32
32
  }
33
- .popover__arrow_1ml4d {
33
+ .popover__arrow_397e {
34
34
  z-index: 1;
35
35
  }
36
- .popover__arrow_1ml4d:after {
36
+ .popover__arrow_397e:after {
37
37
  content: '';
38
38
  display: block;
39
39
  position: absolute;
@@ -44,62 +44,62 @@
44
44
  box-sizing: border-box;
45
45
  transform: rotate(45deg);
46
46
  }
47
- .popover__component_1ml4d[data-popper-placement='left'] .popover__arrow_1ml4d,
48
- .popover__component_1ml4d[data-popper-placement='left-start'] .popover__arrow_1ml4d,
49
- .popover__component_1ml4d[data-popper-placement='left-end'] .popover__arrow_1ml4d {
47
+ .popover__component_397e[data-popper-placement='left'] .popover__arrow_397e,
48
+ .popover__component_397e[data-popper-placement='left-start'] .popover__arrow_397e,
49
+ .popover__component_397e[data-popper-placement='left-end'] .popover__arrow_397e {
50
50
  right: 5px;
51
51
  }
52
- .popover__component_1ml4d[data-popper-placement='left'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='left-start'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='left-end'] .popover__arrow_1ml4d:after {
52
+ .popover__component_397e[data-popper-placement='left'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='left-start'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='left-end'] .popover__arrow_397e:after {
53
53
  top: var(--gap-6-neg);
54
54
  border-bottom: none;
55
55
  border-left: none;
56
56
  }
57
- .popover__component_1ml4d[data-popper-placement='right'] .popover__arrow_1ml4d,
58
- .popover__component_1ml4d[data-popper-placement='right-start'] .popover__arrow_1ml4d,
59
- .popover__component_1ml4d[data-popper-placement='right-end'] .popover__arrow_1ml4d {
57
+ .popover__component_397e[data-popper-placement='right'] .popover__arrow_397e,
58
+ .popover__component_397e[data-popper-placement='right-start'] .popover__arrow_397e,
59
+ .popover__component_397e[data-popper-placement='right-end'] .popover__arrow_397e {
60
60
  left: -7px;
61
61
  }
62
- .popover__component_1ml4d[data-popper-placement='right'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='right-start'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='right-end'] .popover__arrow_1ml4d:after {
62
+ .popover__component_397e[data-popper-placement='right'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='right-start'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='right-end'] .popover__arrow_397e:after {
63
63
  top: var(--gap-6-neg);
64
64
  border-top: none;
65
65
  border-right: none;
66
66
  }
67
- .popover__component_1ml4d[data-popper-placement='top'] .popover__arrow_1ml4d,
68
- .popover__component_1ml4d[data-popper-placement='top-start'] .popover__arrow_1ml4d,
69
- .popover__component_1ml4d[data-popper-placement='top-end'] .popover__arrow_1ml4d {
67
+ .popover__component_397e[data-popper-placement='top'] .popover__arrow_397e,
68
+ .popover__component_397e[data-popper-placement='top-start'] .popover__arrow_397e,
69
+ .popover__component_397e[data-popper-placement='top-end'] .popover__arrow_397e {
70
70
  bottom: 5px;
71
71
  }
72
- .popover__component_1ml4d[data-popper-placement='top'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='top-start'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='top-end'] .popover__arrow_1ml4d:after {
72
+ .popover__component_397e[data-popper-placement='top'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='top-start'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='top-end'] .popover__arrow_397e:after {
73
73
  left: var(--gap-6-neg);
74
74
  border-top: none;
75
75
  border-left: none;
76
76
  }
77
- .popover__component_1ml4d[data-popper-placement='bottom'] .popover__arrow_1ml4d,
78
- .popover__component_1ml4d[data-popper-placement='bottom-start'] .popover__arrow_1ml4d,
79
- .popover__component_1ml4d[data-popper-placement='bottom-end'] .popover__arrow_1ml4d {
77
+ .popover__component_397e[data-popper-placement='bottom'] .popover__arrow_397e,
78
+ .popover__component_397e[data-popper-placement='bottom-start'] .popover__arrow_397e,
79
+ .popover__component_397e[data-popper-placement='bottom-end'] .popover__arrow_397e {
80
80
  top: -7px;
81
81
  }
82
- .popover__component_1ml4d[data-popper-placement='bottom'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='bottom-start'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='bottom-end'] .popover__arrow_1ml4d:after {
82
+ .popover__component_397e[data-popper-placement='bottom'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='bottom-start'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='bottom-end'] .popover__arrow_397e:after {
83
83
  left: var(--gap-6-neg);
84
84
  border-bottom: none;
85
85
  border-right: none;
86
86
  }
87
- .popover__enter_1ml4d .popover__inner_1ml4d {
87
+ .popover__enter_397e .popover__inner_397e {
88
88
  opacity: 0;
89
89
  transform: scale(0.98);
90
90
  }
91
- .popover__enterActive_1ml4d .popover__inner_1ml4d {
91
+ .popover__enterActive_397e .popover__inner_397e {
92
92
  opacity: 1;
93
93
  transform: scale(1);
94
94
  transition-property: opacity, transform;
95
95
  transition-timing-function: ease-in-out;
96
96
  transition-duration: 150ms;
97
97
  }
98
- .popover__exit_1ml4d .popover__inner_1ml4d {
98
+ .popover__exit_397e .popover__inner_397e {
99
99
  opacity: 1;
100
100
  transform: scale(1);
101
101
  }
102
- .popover__exitActive_1ml4d .popover__inner_1ml4d {
102
+ .popover__exitActive_397e .popover__inner_397e {
103
103
  opacity: 0;
104
104
  transform: scale(0.98);
105
105
  transition-property: opacity, transform;
package/esm/index.module.css.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- var styles = {"component":"popover__component_1ml4d","inner":"popover__inner_1ml4d","scrollableContent":"popover__scrollableContent_1ml4d","arrow":"popover__arrow_1ml4d","enter":"popover__enter_1ml4d","enterActive":"popover__enterActive_1ml4d","exit":"popover__exit_1ml4d","exitActive":"popover__exitActive_1ml4d"};
3
+ var styles = {"component":"popover__component_397e","inner":"popover__inner_397e","scrollableContent":"popover__scrollableContent_397e","arrow":"popover__arrow_397e","enter":"popover__enter_397e","enterActive":"popover__enterActive_397e","exit":"popover__exit_397e","exitActive":"popover__exitActive_397e"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
package/esm/index.module.css.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n\n:root {\n --popover-border-color: transparent;\n}\n\n.component {\n background-color: transparent;\n color: var(--color-light-text-primary);\n}\n\n.inner {\n position: relative;\n background-color: var(--color-light-modal-bg-primary);\n box-shadow: var(--shadow-m);\n border: 1px solid var(--popover-border-color);\n box-sizing: border-box;\n will-change: transform;\n}\n\n.scrollableContent {\n position: relative;\n z-index: 2;\n overflow-y: auto;\n}\n\n.arrow {\n z-index: 1;\n}\n\n.arrow:after {\n content: '';\n display: block;\n position: absolute;\n width: 12px;\n height: 12px;\n background-color: var(--color-light-modal-bg-primary);\n border: 1px solid var(--popover-border-color);\n box-sizing: border-box;\n transform: rotate(45deg);\n}\n\n.component[data-popper-placement='left'] .arrow,\n.component[data-popper-placement='left-start'] .arrow,\n.component[data-popper-placement='left-end'] .arrow {\n right: 5px;\n\n &:after {\n top: var(--gap-6-neg);\n border-bottom: none;\n border-left: none;\n }\n}\n\n.component[data-popper-placement='right'] .arrow,\n.component[data-popper-placement='right-start'] .arrow,\n.component[data-popper-placement='right-end'] .arrow {\n left: -7px;\n\n &:after {\n top: var(--gap-6-neg);\n border-top: none;\n border-right: none;\n }\n}\n\n.component[data-popper-placement='top'] .arrow,\n.component[data-popper-placement='top-start'] .arrow,\n.component[data-popper-placement='top-end'] .arrow {\n bottom: 5px;\n\n &:after {\n left: var(--gap-6-neg);\n border-top: none;\n border-left: none;\n }\n}\n\n.component[data-popper-placement='bottom'] .arrow,\n.component[data-popper-placement='bottom-start'] .arrow,\n.component[data-popper-placement='bottom-end'] .arrow {\n top: -7px;\n\n &:after {\n left: var(--gap-6-neg);\n border-bottom: none;\n border-right: none;\n }\n}\n\n.enter .inner {\n opacity: 0;\n transform: scale(0.98);\n}\n\n.enterActive .inner {\n opacity: 1;\n transform: scale(1);\n transition-property: opacity, transform;\n transition-timing-function: ease-in-out;\n transition-duration: 150ms;\n}\n\n.exit .inner {\n opacity: 1;\n transform: scale(1);\n}\n\n.exitActive .inner {\n opacity: 0;\n transform: scale(0.98);\n transition-property: opacity, transform;\n transition-timing-function: ease-in-out;\n transition-duration: 150ms;\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,OAAO,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,kCAAkC,CAAC,OAAO,CAAC,sBAAsB,CAAC,OAAO,CAAC,sBAAsB,CAAC,aAAa,CAAC,4BAA4B,CAAC,MAAM,CAAC,qBAAqB,CAAC,YAAY,CAAC,2BAA2B,CAAC;;;;"}
1
+ {"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n\n:root {\n --popover-border-color: transparent;\n}\n\n.component {\n background-color: transparent;\n color: var(--color-light-text-primary);\n}\n\n.inner {\n position: relative;\n background-color: var(--color-light-modal-bg-primary);\n box-shadow: var(--shadow-m);\n border: 1px solid var(--popover-border-color);\n box-sizing: border-box;\n will-change: transform;\n}\n\n.scrollableContent {\n position: relative;\n z-index: 2;\n overflow-y: auto;\n}\n\n.arrow {\n z-index: 1;\n}\n\n.arrow:after {\n content: '';\n display: block;\n position: absolute;\n width: 12px;\n height: 12px;\n background-color: var(--color-light-modal-bg-primary);\n border: 1px solid var(--popover-border-color);\n box-sizing: border-box;\n transform: rotate(45deg);\n}\n\n.component[data-popper-placement='left'] .arrow,\n.component[data-popper-placement='left-start'] .arrow,\n.component[data-popper-placement='left-end'] .arrow {\n right: 5px;\n\n &:after {\n top: var(--gap-6-neg);\n border-bottom: none;\n border-left: none;\n }\n}\n\n.component[data-popper-placement='right'] .arrow,\n.component[data-popper-placement='right-start'] .arrow,\n.component[data-popper-placement='right-end'] .arrow {\n left: -7px;\n\n &:after {\n top: var(--gap-6-neg);\n border-top: none;\n border-right: none;\n }\n}\n\n.component[data-popper-placement='top'] .arrow,\n.component[data-popper-placement='top-start'] .arrow,\n.component[data-popper-placement='top-end'] .arrow {\n bottom: 5px;\n\n &:after {\n left: var(--gap-6-neg);\n border-top: none;\n border-left: none;\n }\n}\n\n.component[data-popper-placement='bottom'] .arrow,\n.component[data-popper-placement='bottom-start'] .arrow,\n.component[data-popper-placement='bottom-end'] .arrow {\n top: -7px;\n\n &:after {\n left: var(--gap-6-neg);\n border-bottom: none;\n border-right: none;\n }\n}\n\n.enter .inner {\n opacity: 0;\n transform: scale(0.98);\n}\n\n.enterActive .inner {\n opacity: 1;\n transform: scale(1);\n transition-property: opacity, transform;\n transition-timing-function: ease-in-out;\n transition-duration: 150ms;\n}\n\n.exit .inner {\n opacity: 1;\n transform: scale(1);\n}\n\n.exitActive .inner {\n opacity: 0;\n transform: scale(0.98);\n transition-property: opacity, transform;\n transition-timing-function: ease-in-out;\n transition-duration: 150ms;\n}\n"],"names":[],"mappings":";;AAEgB,aAAe,CAAC,WAAW,CAAC,yBAAyB,CAAC,OAAO,CAAC,qBAAqB,CAAC,mBAAmB,CAAC,iCAAiC,CAAC,OAAO,CAAC,qBAAqB,CAAC,OAAO,CAAC,qBAAqB,CAAC,aAAa,CAAC,2BAA2B,CAAC,MAAM,CAAC,oBAAoB,CAAC,YAAY,CAAC,0BAA0B,CAAC;;;;"}
package/index.css CHANGED
@@ -13,11 +13,11 @@
13
13
  :root {
14
14
  --popover-border-color: transparent;
15
15
  }
16
- .popover__component_1ml4d {
16
+ .popover__component_397e {
17
17
  background-color: transparent;
18
18
  color: var(--color-light-text-primary);
19
19
  }
20
- .popover__inner_1ml4d {
20
+ .popover__inner_397e {
21
21
  position: relative;
22
22
  background-color: var(--color-light-modal-bg-primary);
23
23
  box-shadow: var(--shadow-m);
@@ -25,15 +25,15 @@
25
25
  box-sizing: border-box;
26
26
  will-change: transform;
27
27
  }
28
- .popover__scrollableContent_1ml4d {
28
+ .popover__scrollableContent_397e {
29
29
  position: relative;
30
30
  z-index: 2;
31
31
  overflow-y: auto;
32
32
  }
33
- .popover__arrow_1ml4d {
33
+ .popover__arrow_397e {
34
34
  z-index: 1;
35
35
  }
36
- .popover__arrow_1ml4d:after {
36
+ .popover__arrow_397e:after {
37
37
  content: '';
38
38
  display: block;
39
39
  position: absolute;
@@ -44,62 +44,62 @@
44
44
  box-sizing: border-box;
45
45
  transform: rotate(45deg);
46
46
  }
47
- .popover__component_1ml4d[data-popper-placement='left'] .popover__arrow_1ml4d,
48
- .popover__component_1ml4d[data-popper-placement='left-start'] .popover__arrow_1ml4d,
49
- .popover__component_1ml4d[data-popper-placement='left-end'] .popover__arrow_1ml4d {
47
+ .popover__component_397e[data-popper-placement='left'] .popover__arrow_397e,
48
+ .popover__component_397e[data-popper-placement='left-start'] .popover__arrow_397e,
49
+ .popover__component_397e[data-popper-placement='left-end'] .popover__arrow_397e {
50
50
  right: 5px;
51
51
  }
52
- .popover__component_1ml4d[data-popper-placement='left'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='left-start'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='left-end'] .popover__arrow_1ml4d:after {
52
+ .popover__component_397e[data-popper-placement='left'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='left-start'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='left-end'] .popover__arrow_397e:after {
53
53
  top: var(--gap-6-neg);
54
54
  border-bottom: none;
55
55
  border-left: none;
56
56
  }
57
- .popover__component_1ml4d[data-popper-placement='right'] .popover__arrow_1ml4d,
58
- .popover__component_1ml4d[data-popper-placement='right-start'] .popover__arrow_1ml4d,
59
- .popover__component_1ml4d[data-popper-placement='right-end'] .popover__arrow_1ml4d {
57
+ .popover__component_397e[data-popper-placement='right'] .popover__arrow_397e,
58
+ .popover__component_397e[data-popper-placement='right-start'] .popover__arrow_397e,
59
+ .popover__component_397e[data-popper-placement='right-end'] .popover__arrow_397e {
60
60
  left: -7px;
61
61
  }
62
- .popover__component_1ml4d[data-popper-placement='right'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='right-start'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='right-end'] .popover__arrow_1ml4d:after {
62
+ .popover__component_397e[data-popper-placement='right'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='right-start'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='right-end'] .popover__arrow_397e:after {
63
63
  top: var(--gap-6-neg);
64
64
  border-top: none;
65
65
  border-right: none;
66
66
  }
67
- .popover__component_1ml4d[data-popper-placement='top'] .popover__arrow_1ml4d,
68
- .popover__component_1ml4d[data-popper-placement='top-start'] .popover__arrow_1ml4d,
69
- .popover__component_1ml4d[data-popper-placement='top-end'] .popover__arrow_1ml4d {
67
+ .popover__component_397e[data-popper-placement='top'] .popover__arrow_397e,
68
+ .popover__component_397e[data-popper-placement='top-start'] .popover__arrow_397e,
69
+ .popover__component_397e[data-popper-placement='top-end'] .popover__arrow_397e {
70
70
  bottom: 5px;
71
71
  }
72
- .popover__component_1ml4d[data-popper-placement='top'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='top-start'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='top-end'] .popover__arrow_1ml4d:after {
72
+ .popover__component_397e[data-popper-placement='top'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='top-start'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='top-end'] .popover__arrow_397e:after {
73
73
  left: var(--gap-6-neg);
74
74
  border-top: none;
75
75
  border-left: none;
76
76
  }
77
- .popover__component_1ml4d[data-popper-placement='bottom'] .popover__arrow_1ml4d,
78
- .popover__component_1ml4d[data-popper-placement='bottom-start'] .popover__arrow_1ml4d,
79
- .popover__component_1ml4d[data-popper-placement='bottom-end'] .popover__arrow_1ml4d {
77
+ .popover__component_397e[data-popper-placement='bottom'] .popover__arrow_397e,
78
+ .popover__component_397e[data-popper-placement='bottom-start'] .popover__arrow_397e,
79
+ .popover__component_397e[data-popper-placement='bottom-end'] .popover__arrow_397e {
80
80
  top: -7px;
81
81
  }
82
- .popover__component_1ml4d[data-popper-placement='bottom'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='bottom-start'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='bottom-end'] .popover__arrow_1ml4d:after {
82
+ .popover__component_397e[data-popper-placement='bottom'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='bottom-start'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='bottom-end'] .popover__arrow_397e:after {
83
83
  left: var(--gap-6-neg);
84
84
  border-bottom: none;
85
85
  border-right: none;
86
86
  }
87
- .popover__enter_1ml4d .popover__inner_1ml4d {
87
+ .popover__enter_397e .popover__inner_397e {
88
88
  opacity: 0;
89
89
  transform: scale(0.98);
90
90
  }
91
- .popover__enterActive_1ml4d .popover__inner_1ml4d {
91
+ .popover__enterActive_397e .popover__inner_397e {
92
92
  opacity: 1;
93
93
  transform: scale(1);
94
94
  transition-property: opacity, transform;
95
95
  transition-timing-function: ease-in-out;
96
96
  transition-duration: 150ms;
97
97
  }
98
- .popover__exit_1ml4d .popover__inner_1ml4d {
98
+ .popover__exit_397e .popover__inner_397e {
99
99
  opacity: 1;
100
100
  transform: scale(1);
101
101
  }
102
- .popover__exitActive_1ml4d .popover__inner_1ml4d {
102
+ .popover__exitActive_397e .popover__inner_397e {
103
103
  opacity: 0;
104
104
  transform: scale(0.98);
105
105
  transition-property: opacity, transform;
package/index.module.css.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  require('./index.css');
4
4
 
5
- var styles = {"component":"popover__component_1ml4d","inner":"popover__inner_1ml4d","scrollableContent":"popover__scrollableContent_1ml4d","arrow":"popover__arrow_1ml4d","enter":"popover__enter_1ml4d","enterActive":"popover__enterActive_1ml4d","exit":"popover__exit_1ml4d","exitActive":"popover__exitActive_1ml4d"};
5
+ var styles = {"component":"popover__component_397e","inner":"popover__inner_397e","scrollableContent":"popover__scrollableContent_397e","arrow":"popover__arrow_397e","enter":"popover__enter_397e","enterActive":"popover__enterActive_397e","exit":"popover__exit_397e","exitActive":"popover__exitActive_397e"};
6
6
 
7
7
  module.exports = styles;
8
8
  //# sourceMappingURL=index.module.css.js.map
package/index.module.css.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n\n:root {\n --popover-border-color: transparent;\n}\n\n.component {\n background-color: transparent;\n color: var(--color-light-text-primary);\n}\n\n.inner {\n position: relative;\n background-color: var(--color-light-modal-bg-primary);\n box-shadow: var(--shadow-m);\n border: 1px solid var(--popover-border-color);\n box-sizing: border-box;\n will-change: transform;\n}\n\n.scrollableContent {\n position: relative;\n z-index: 2;\n overflow-y: auto;\n}\n\n.arrow {\n z-index: 1;\n}\n\n.arrow:after {\n content: '';\n display: block;\n position: absolute;\n width: 12px;\n height: 12px;\n background-color: var(--color-light-modal-bg-primary);\n border: 1px solid var(--popover-border-color);\n box-sizing: border-box;\n transform: rotate(45deg);\n}\n\n.component[data-popper-placement='left'] .arrow,\n.component[data-popper-placement='left-start'] .arrow,\n.component[data-popper-placement='left-end'] .arrow {\n right: 5px;\n\n &:after {\n top: var(--gap-6-neg);\n border-bottom: none;\n border-left: none;\n }\n}\n\n.component[data-popper-placement='right'] .arrow,\n.component[data-popper-placement='right-start'] .arrow,\n.component[data-popper-placement='right-end'] .arrow {\n left: -7px;\n\n &:after {\n top: var(--gap-6-neg);\n border-top: none;\n border-right: none;\n }\n}\n\n.component[data-popper-placement='top'] .arrow,\n.component[data-popper-placement='top-start'] .arrow,\n.component[data-popper-placement='top-end'] .arrow {\n bottom: 5px;\n\n &:after {\n left: var(--gap-6-neg);\n border-top: none;\n border-left: none;\n }\n}\n\n.component[data-popper-placement='bottom'] .arrow,\n.component[data-popper-placement='bottom-start'] .arrow,\n.component[data-popper-placement='bottom-end'] .arrow {\n top: -7px;\n\n &:after {\n left: var(--gap-6-neg);\n border-bottom: none;\n border-right: none;\n }\n}\n\n.enter .inner {\n opacity: 0;\n transform: scale(0.98);\n}\n\n.enterActive .inner {\n opacity: 1;\n transform: scale(1);\n transition-property: opacity, transform;\n transition-timing-function: ease-in-out;\n transition-duration: 150ms;\n}\n\n.exit .inner {\n opacity: 1;\n transform: scale(1);\n}\n\n.exitActive .inner {\n opacity: 0;\n transform: scale(0.98);\n transition-property: opacity, transform;\n transition-timing-function: ease-in-out;\n transition-duration: 150ms;\n}\n"],"names":[],"mappings":";;;;AAEgB,aAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,OAAO,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,kCAAkC,CAAC,OAAO,CAAC,sBAAsB,CAAC,OAAO,CAAC,sBAAsB,CAAC,aAAa,CAAC,4BAA4B,CAAC,MAAM,CAAC,qBAAqB,CAAC,YAAY,CAAC,2BAA2B,CAAC;;;;"}
1
+ {"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n\n:root {\n --popover-border-color: transparent;\n}\n\n.component {\n background-color: transparent;\n color: var(--color-light-text-primary);\n}\n\n.inner {\n position: relative;\n background-color: var(--color-light-modal-bg-primary);\n box-shadow: var(--shadow-m);\n border: 1px solid var(--popover-border-color);\n box-sizing: border-box;\n will-change: transform;\n}\n\n.scrollableContent {\n position: relative;\n z-index: 2;\n overflow-y: auto;\n}\n\n.arrow {\n z-index: 1;\n}\n\n.arrow:after {\n content: '';\n display: block;\n position: absolute;\n width: 12px;\n height: 12px;\n background-color: var(--color-light-modal-bg-primary);\n border: 1px solid var(--popover-border-color);\n box-sizing: border-box;\n transform: rotate(45deg);\n}\n\n.component[data-popper-placement='left'] .arrow,\n.component[data-popper-placement='left-start'] .arrow,\n.component[data-popper-placement='left-end'] .arrow {\n right: 5px;\n\n &:after {\n top: var(--gap-6-neg);\n border-bottom: none;\n border-left: none;\n }\n}\n\n.component[data-popper-placement='right'] .arrow,\n.component[data-popper-placement='right-start'] .arrow,\n.component[data-popper-placement='right-end'] .arrow {\n left: -7px;\n\n &:after {\n top: var(--gap-6-neg);\n border-top: none;\n border-right: none;\n }\n}\n\n.component[data-popper-placement='top'] .arrow,\n.component[data-popper-placement='top-start'] .arrow,\n.component[data-popper-placement='top-end'] .arrow {\n bottom: 5px;\n\n &:after {\n left: var(--gap-6-neg);\n border-top: none;\n border-left: none;\n }\n}\n\n.component[data-popper-placement='bottom'] .arrow,\n.component[data-popper-placement='bottom-start'] .arrow,\n.component[data-popper-placement='bottom-end'] .arrow {\n top: -7px;\n\n &:after {\n left: var(--gap-6-neg);\n border-bottom: none;\n border-right: none;\n }\n}\n\n.enter .inner {\n opacity: 0;\n transform: scale(0.98);\n}\n\n.enterActive .inner {\n opacity: 1;\n transform: scale(1);\n transition-property: opacity, transform;\n transition-timing-function: ease-in-out;\n transition-duration: 150ms;\n}\n\n.exit .inner {\n opacity: 1;\n transform: scale(1);\n}\n\n.exitActive .inner {\n opacity: 0;\n transform: scale(0.98);\n transition-property: opacity, transform;\n transition-timing-function: ease-in-out;\n transition-duration: 150ms;\n}\n"],"names":[],"mappings":";;;;AAEgB,aAAe,CAAC,WAAW,CAAC,yBAAyB,CAAC,OAAO,CAAC,qBAAqB,CAAC,mBAAmB,CAAC,iCAAiC,CAAC,OAAO,CAAC,qBAAqB,CAAC,OAAO,CAAC,qBAAqB,CAAC,aAAa,CAAC,2BAA2B,CAAC,MAAM,CAAC,oBAAoB,CAAC,YAAY,CAAC,0BAA0B,CAAC;;;;"}
package/modern/index.css CHANGED
@@ -13,11 +13,11 @@
13
13
  :root {
14
14
  --popover-border-color: transparent;
15
15
  }
16
- .popover__component_1ml4d {
16
+ .popover__component_397e {
17
17
  background-color: transparent;
18
18
  color: var(--color-light-text-primary);
19
19
  }
20
- .popover__inner_1ml4d {
20
+ .popover__inner_397e {
21
21
  position: relative;
22
22
  background-color: var(--color-light-modal-bg-primary);
23
23
  box-shadow: var(--shadow-m);
@@ -25,15 +25,15 @@
25
25
  box-sizing: border-box;
26
26
  will-change: transform;
27
27
  }
28
- .popover__scrollableContent_1ml4d {
28
+ .popover__scrollableContent_397e {
29
29
  position: relative;
30
30
  z-index: 2;
31
31
  overflow-y: auto;
32
32
  }
33
- .popover__arrow_1ml4d {
33
+ .popover__arrow_397e {
34
34
  z-index: 1;
35
35
  }
36
- .popover__arrow_1ml4d:after {
36
+ .popover__arrow_397e:after {
37
37
  content: '';
38
38
  display: block;
39
39
  position: absolute;
@@ -44,62 +44,62 @@
44
44
  box-sizing: border-box;
45
45
  transform: rotate(45deg);
46
46
  }
47
- .popover__component_1ml4d[data-popper-placement='left'] .popover__arrow_1ml4d,
48
- .popover__component_1ml4d[data-popper-placement='left-start'] .popover__arrow_1ml4d,
49
- .popover__component_1ml4d[data-popper-placement='left-end'] .popover__arrow_1ml4d {
47
+ .popover__component_397e[data-popper-placement='left'] .popover__arrow_397e,
48
+ .popover__component_397e[data-popper-placement='left-start'] .popover__arrow_397e,
49
+ .popover__component_397e[data-popper-placement='left-end'] .popover__arrow_397e {
50
50
  right: 5px;
51
51
  }
52
- .popover__component_1ml4d[data-popper-placement='left'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='left-start'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='left-end'] .popover__arrow_1ml4d:after {
52
+ .popover__component_397e[data-popper-placement='left'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='left-start'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='left-end'] .popover__arrow_397e:after {
53
53
  top: var(--gap-6-neg);
54
54
  border-bottom: none;
55
55
  border-left: none;
56
56
  }
57
- .popover__component_1ml4d[data-popper-placement='right'] .popover__arrow_1ml4d,
58
- .popover__component_1ml4d[data-popper-placement='right-start'] .popover__arrow_1ml4d,
59
- .popover__component_1ml4d[data-popper-placement='right-end'] .popover__arrow_1ml4d {
57
+ .popover__component_397e[data-popper-placement='right'] .popover__arrow_397e,
58
+ .popover__component_397e[data-popper-placement='right-start'] .popover__arrow_397e,
59
+ .popover__component_397e[data-popper-placement='right-end'] .popover__arrow_397e {
60
60
  left: -7px;
61
61
  }
62
- .popover__component_1ml4d[data-popper-placement='right'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='right-start'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='right-end'] .popover__arrow_1ml4d:after {
62
+ .popover__component_397e[data-popper-placement='right'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='right-start'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='right-end'] .popover__arrow_397e:after {
63
63
  top: var(--gap-6-neg);
64
64
  border-top: none;
65
65
  border-right: none;
66
66
  }
67
- .popover__component_1ml4d[data-popper-placement='top'] .popover__arrow_1ml4d,
68
- .popover__component_1ml4d[data-popper-placement='top-start'] .popover__arrow_1ml4d,
69
- .popover__component_1ml4d[data-popper-placement='top-end'] .popover__arrow_1ml4d {
67
+ .popover__component_397e[data-popper-placement='top'] .popover__arrow_397e,
68
+ .popover__component_397e[data-popper-placement='top-start'] .popover__arrow_397e,
69
+ .popover__component_397e[data-popper-placement='top-end'] .popover__arrow_397e {
70
70
  bottom: 5px;
71
71
  }
72
- .popover__component_1ml4d[data-popper-placement='top'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='top-start'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='top-end'] .popover__arrow_1ml4d:after {
72
+ .popover__component_397e[data-popper-placement='top'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='top-start'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='top-end'] .popover__arrow_397e:after {
73
73
  left: var(--gap-6-neg);
74
74
  border-top: none;
75
75
  border-left: none;
76
76
  }
77
- .popover__component_1ml4d[data-popper-placement='bottom'] .popover__arrow_1ml4d,
78
- .popover__component_1ml4d[data-popper-placement='bottom-start'] .popover__arrow_1ml4d,
79
- .popover__component_1ml4d[data-popper-placement='bottom-end'] .popover__arrow_1ml4d {
77
+ .popover__component_397e[data-popper-placement='bottom'] .popover__arrow_397e,
78
+ .popover__component_397e[data-popper-placement='bottom-start'] .popover__arrow_397e,
79
+ .popover__component_397e[data-popper-placement='bottom-end'] .popover__arrow_397e {
80
80
  top: -7px;
81
81
  }
82
- .popover__component_1ml4d[data-popper-placement='bottom'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='bottom-start'] .popover__arrow_1ml4d:after, .popover__component_1ml4d[data-popper-placement='bottom-end'] .popover__arrow_1ml4d:after {
82
+ .popover__component_397e[data-popper-placement='bottom'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='bottom-start'] .popover__arrow_397e:after, .popover__component_397e[data-popper-placement='bottom-end'] .popover__arrow_397e:after {
83
83
  left: var(--gap-6-neg);
84
84
  border-bottom: none;
85
85
  border-right: none;
86
86
  }
87
- .popover__enter_1ml4d .popover__inner_1ml4d {
87
+ .popover__enter_397e .popover__inner_397e {
88
88
  opacity: 0;
89
89
  transform: scale(0.98);
90
90
  }
91
- .popover__enterActive_1ml4d .popover__inner_1ml4d {
91
+ .popover__enterActive_397e .popover__inner_397e {
92
92
  opacity: 1;
93
93
  transform: scale(1);
94
94
  transition-property: opacity, transform;
95
95
  transition-timing-function: ease-in-out;
96
96
  transition-duration: 150ms;
97
97
  }
98
- .popover__exit_1ml4d .popover__inner_1ml4d {
98
+ .popover__exit_397e .popover__inner_397e {
99
99
  opacity: 1;
100
100
  transform: scale(1);
101
101
  }
102
- .popover__exitActive_1ml4d .popover__inner_1ml4d {
102
+ .popover__exitActive_397e .popover__inner_397e {
103
103
  opacity: 0;
104
104
  transform: scale(0.98);
105
105
  transition-property: opacity, transform;
package/modern/index.module.css.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- const styles = {"component":"popover__component_1ml4d","inner":"popover__inner_1ml4d","scrollableContent":"popover__scrollableContent_1ml4d","arrow":"popover__arrow_1ml4d","enter":"popover__enter_1ml4d","enterActive":"popover__enterActive_1ml4d","exit":"popover__exit_1ml4d","exitActive":"popover__exitActive_1ml4d"};
3
+ const styles = {"component":"popover__component_397e","inner":"popover__inner_397e","scrollableContent":"popover__scrollableContent_397e","arrow":"popover__arrow_397e","enter":"popover__enter_397e","enterActive":"popover__enterActive_397e","exit":"popover__exit_397e","exitActive":"popover__exitActive_397e"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
package/modern/index.module.css.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n\n:root {\n --popover-border-color: transparent;\n}\n\n.component {\n background-color: transparent;\n color: var(--color-light-text-primary);\n}\n\n.inner {\n position: relative;\n background-color: var(--color-light-modal-bg-primary);\n box-shadow: var(--shadow-m);\n border: 1px solid var(--popover-border-color);\n box-sizing: border-box;\n will-change: transform;\n}\n\n.scrollableContent {\n position: relative;\n z-index: 2;\n overflow-y: auto;\n}\n\n.arrow {\n z-index: 1;\n}\n\n.arrow:after {\n content: '';\n display: block;\n position: absolute;\n width: 12px;\n height: 12px;\n background-color: var(--color-light-modal-bg-primary);\n border: 1px solid var(--popover-border-color);\n box-sizing: border-box;\n transform: rotate(45deg);\n}\n\n.component[data-popper-placement='left'] .arrow,\n.component[data-popper-placement='left-start'] .arrow,\n.component[data-popper-placement='left-end'] .arrow {\n right: 5px;\n\n &:after {\n top: var(--gap-6-neg);\n border-bottom: none;\n border-left: none;\n }\n}\n\n.component[data-popper-placement='right'] .arrow,\n.component[data-popper-placement='right-start'] .arrow,\n.component[data-popper-placement='right-end'] .arrow {\n left: -7px;\n\n &:after {\n top: var(--gap-6-neg);\n border-top: none;\n border-right: none;\n }\n}\n\n.component[data-popper-placement='top'] .arrow,\n.component[data-popper-placement='top-start'] .arrow,\n.component[data-popper-placement='top-end'] .arrow {\n bottom: 5px;\n\n &:after {\n left: var(--gap-6-neg);\n border-top: none;\n border-left: none;\n }\n}\n\n.component[data-popper-placement='bottom'] .arrow,\n.component[data-popper-placement='bottom-start'] .arrow,\n.component[data-popper-placement='bottom-end'] .arrow {\n top: -7px;\n\n &:after {\n left: var(--gap-6-neg);\n border-bottom: none;\n border-right: none;\n }\n}\n\n.enter .inner {\n opacity: 0;\n transform: scale(0.98);\n}\n\n.enterActive .inner {\n opacity: 1;\n transform: scale(1);\n transition-property: opacity, transform;\n transition-timing-function: ease-in-out;\n transition-duration: 150ms;\n}\n\n.exit .inner {\n opacity: 1;\n transform: scale(1);\n}\n\n.exitActive .inner {\n opacity: 0;\n transform: scale(0.98);\n transition-property: opacity, transform;\n transition-timing-function: ease-in-out;\n transition-duration: 150ms;\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,0BAA0B,CAAC,OAAO,CAAC,sBAAsB,CAAC,mBAAmB,CAAC,kCAAkC,CAAC,OAAO,CAAC,sBAAsB,CAAC,OAAO,CAAC,sBAAsB,CAAC,aAAa,CAAC,4BAA4B,CAAC,MAAM,CAAC,qBAAqB,CAAC,YAAY,CAAC,2BAA2B,CAAC;;;;"}
1
+ {"version":3,"file":"index.module.css.js","sources":["src/index.module.css"],"sourcesContent":["@import '@alfalab/core-components-vars/src/no-typography-index.css';\n\n:root {\n --popover-border-color: transparent;\n}\n\n.component {\n background-color: transparent;\n color: var(--color-light-text-primary);\n}\n\n.inner {\n position: relative;\n background-color: var(--color-light-modal-bg-primary);\n box-shadow: var(--shadow-m);\n border: 1px solid var(--popover-border-color);\n box-sizing: border-box;\n will-change: transform;\n}\n\n.scrollableContent {\n position: relative;\n z-index: 2;\n overflow-y: auto;\n}\n\n.arrow {\n z-index: 1;\n}\n\n.arrow:after {\n content: '';\n display: block;\n position: absolute;\n width: 12px;\n height: 12px;\n background-color: var(--color-light-modal-bg-primary);\n border: 1px solid var(--popover-border-color);\n box-sizing: border-box;\n transform: rotate(45deg);\n}\n\n.component[data-popper-placement='left'] .arrow,\n.component[data-popper-placement='left-start'] .arrow,\n.component[data-popper-placement='left-end'] .arrow {\n right: 5px;\n\n &:after {\n top: var(--gap-6-neg);\n border-bottom: none;\n border-left: none;\n }\n}\n\n.component[data-popper-placement='right'] .arrow,\n.component[data-popper-placement='right-start'] .arrow,\n.component[data-popper-placement='right-end'] .arrow {\n left: -7px;\n\n &:after {\n top: var(--gap-6-neg);\n border-top: none;\n border-right: none;\n }\n}\n\n.component[data-popper-placement='top'] .arrow,\n.component[data-popper-placement='top-start'] .arrow,\n.component[data-popper-placement='top-end'] .arrow {\n bottom: 5px;\n\n &:after {\n left: var(--gap-6-neg);\n border-top: none;\n border-left: none;\n }\n}\n\n.component[data-popper-placement='bottom'] .arrow,\n.component[data-popper-placement='bottom-start'] .arrow,\n.component[data-popper-placement='bottom-end'] .arrow {\n top: -7px;\n\n &:after {\n left: var(--gap-6-neg);\n border-bottom: none;\n border-right: none;\n }\n}\n\n.enter .inner {\n opacity: 0;\n transform: scale(0.98);\n}\n\n.enterActive .inner {\n opacity: 1;\n transform: scale(1);\n transition-property: opacity, transform;\n transition-timing-function: ease-in-out;\n transition-duration: 150ms;\n}\n\n.exit .inner {\n opacity: 1;\n transform: scale(1);\n}\n\n.exitActive .inner {\n opacity: 0;\n transform: scale(0.98);\n transition-property: opacity, transform;\n transition-timing-function: ease-in-out;\n transition-duration: 150ms;\n}\n"],"names":[],"mappings":";;AAEgB,eAAe,CAAC,WAAW,CAAC,yBAAyB,CAAC,OAAO,CAAC,qBAAqB,CAAC,mBAAmB,CAAC,iCAAiC,CAAC,OAAO,CAAC,qBAAqB,CAAC,OAAO,CAAC,qBAAqB,CAAC,aAAa,CAAC,2BAA2B,CAAC,MAAM,CAAC,oBAAoB,CAAC,YAAY,CAAC,0BAA0B,CAAC;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-popover",
3
- "version": "8.0.0",
3
+ "version": "8.0.1",
4
4
  "description": "Popover component",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -10,9 +10,9 @@
10
10
  "main": "index.js",
11
11
  "module": "./esm/index.js",
12
12
  "dependencies": {
13
- "@alfalab/core-components-portal": "^5.0.0",
14
- "@alfalab/core-components-shared": "^2.0.0",
15
- "@alfalab/core-components-stack": "^7.0.0",
13
+ "@alfalab/core-components-portal": "^5.0.1",
14
+ "@alfalab/core-components-shared": "^2.0.1",
15
+ "@alfalab/core-components-stack": "^7.0.1",
16
16
  "@alfalab/hooks": "^1.13.1",
17
17
  "@juggle/resize-observer": "^3.3.1",
18
18
  "@popperjs/core": "^2.11.8",
@@ -33,6 +33,6 @@
33
33
  "access": "public",
34
34
  "directory": "dist"
35
35
  },
36
- "themesVersion": "15.0.0",
37
- "varsVersion": "11.0.0"
36
+ "themesVersion": "15.0.1",
37
+ "varsVersion": "11.0.1"
38
38
  }