react-autoql 8.0.0-alpha.22 → 8.0.0-alpha.23

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.
Binary file
@@ -55,25 +55,77 @@ a {
55
55
 
56
56
  .react-tiny-popover-container {
57
57
  z-index: 99999;
58
- border: 1px solid #ababab52;
59
- border-radius: 4px;
60
- box-shadow: 0px 0 8px var(--react-autoql-box-shadow-color, rgba(0, 0, 0, 0.15));
61
58
  opacity: 1 !important;
62
59
  overflow: hidden !important;
63
- background-color: var(--react-autoql-background-color-secondary);
64
- max-height: 90vh;
65
- max-width: 100vw; }
66
-
67
- .react-tiny-popover-container.react-autoql-popover-mobile {
68
- top: 0px !important;
69
- left: 0px !important;
70
- transform: unset !important;
71
- width: 100vw;
72
- max-height: 80vh;
73
- border-radius: 0;
74
- display: flex; }
75
- .react-tiny-popover-container.react-autoql-popover-mobile > div {
60
+ max-width: 95vw;
61
+ min-height: 0px;
62
+ max-height: 95vh; }
63
+ .react-tiny-popover-container .popover-container-content {
64
+ background: var(--react-autoql-background-color-secondary);
65
+ z-index: 99999 !important;
66
+ padding: 10px;
76
67
  flex: 1; }
68
+ .react-tiny-popover-container.popover-with-arrow-container {
69
+ box-shadow: none;
70
+ border: none;
71
+ background-color: transparent;
72
+ padding: 0 !important; }
73
+ .react-tiny-popover-container.popover-with-arrow-container .popover-arrow-container {
74
+ border-radius: 4px;
75
+ height: 100%;
76
+ width: 100%;
77
+ display: flex; }
78
+ .react-tiny-popover-container.popover-with-arrow-container .popover-arrow-container .popover-arrow-container-content {
79
+ display: flex;
80
+ flex-direction: column;
81
+ flex: 1; }
82
+ .react-tiny-popover-container.popover-with-arrow-container .popover-container-content {
83
+ box-shadow: 0px 0 8px var(--react-autoql-box-shadow-color, rgba(0, 0, 0, 0.15));
84
+ background-color: var(--react-autoql-background-color-secondary);
85
+ border: 1px solid #ababab52;
86
+ border-radius: 4px;
87
+ display: flex;
88
+ flex-direction: column;
89
+ justify-content: stretch;
90
+ padding: 10px;
91
+ box-sizing: border-box;
92
+ flex: 1; }
93
+ .react-tiny-popover-container.popover-with-arrow-container .popover-arrow {
94
+ border-bottom: 10px solid var(--react-autoql-border-color) !important;
95
+ top: 1px !important;
96
+ opacity: 1;
97
+ z-index: 999999; }
98
+ .react-tiny-popover-container.popover-with-arrow-container .popover-arrow::after {
99
+ content: '';
100
+ position: absolute;
101
+ border-left: 9px solid transparent;
102
+ border-right: 9px solid transparent;
103
+ border-bottom: 9px solid var(--react-autoql-background-color-secondary);
104
+ top: 1px;
105
+ left: -9px; }
106
+ .react-tiny-popover-container:not(.popover-with-arrow-container) {
107
+ box-shadow: 0px 0 8px var(--react-autoql-box-shadow-color, rgba(0, 0, 0, 0.15));
108
+ background-color: var(--react-autoql-background-color-secondary);
109
+ border: 1px solid #ababab52;
110
+ border-radius: 4px;
111
+ display: flex; }
112
+ .react-tiny-popover-container.react-autoql-popover-mobile {
113
+ display: flex;
114
+ top: 0px !important;
115
+ left: 0px !important;
116
+ transform: translatex(-100%) !important;
117
+ transition: box-shadow 0.3s ease;
118
+ padding: 0 !important;
119
+ margin: 0 !important;
120
+ min-height: 45px;
121
+ max-height: calc(100vh - 120px);
122
+ width: 100vw !important;
123
+ max-width: 100vw !important;
124
+ border-radius: 0 !important;
125
+ background: var(--react-autoql-background-color-secondary);
126
+ box-shadow: 0px 0px 500px 500px var(--react-autoql-mobile-mask-color, rgba(0, 0, 0, 0.15)), 0px 0 8px var(--react-autoql-box-shadow-color, rgba(0, 0, 0, 0.15)); }
127
+ .react-tiny-popover-container.react-autoql-popover-mobile .popover-container-content {
128
+ border-radius: 0 !important; }
77
129
 
78
130
  .react-autoql-menu {
79
131
  list-style-type: none;
@@ -107,6 +159,8 @@ a {
107
159
 
108
160
  .react-autoql-select-popover-container {
109
161
  margin: 0 6px; }
162
+ .react-autoql-select-popover-container .popover-container-content {
163
+ padding: 0; }
110
164
 
111
165
  .react-autoql-select-and-label {
112
166
  display: inline-flex;
@@ -1018,7 +1072,8 @@ a {
1018
1072
  display: flex; }
1019
1073
 
1020
1074
  .react-autoql-confirm-popover-content {
1021
- padding: 10px; }
1075
+ padding: 10px;
1076
+ flex: 1; }
1022
1077
  .react-autoql-confirm-popover-content .react-autoql-confirm-popover-title {
1023
1078
  display: flex;
1024
1079
  align-items: center;
@@ -1824,7 +1879,8 @@ g.legendOrdinal tspan {
1824
1879
 
1825
1880
  .number-axis-selector-popover {
1826
1881
  display: flex;
1827
- overflow: hidden; }
1882
+ overflow: hidden;
1883
+ flex: 1; }
1828
1884
  .number-axis-selector-popover .number-axis-selector-popover-content {
1829
1885
  display: flex;
1830
1886
  flex-direction: column;
@@ -1960,6 +2016,7 @@ g.legendOrdinal tspan {
1960
2016
 
1961
2017
  .mobile-string-axis-selector-popover-content {
1962
2018
  display: flex;
2019
+ flex: 1;
1963
2020
  flex-direction: column;
1964
2021
  background: var(--react-autoql-background-color-secondary);
1965
2022
  color: var(--react-autoql-text-color-primary);
@@ -3926,128 +3983,43 @@ g.legendOrdinal .legendTitle tspan {
3926
3983
  .notification-feed-top-options-container .react-autoql-notification-mark-all:hover {
3927
3984
  opacity: 1; }
3928
3985
 
3929
- .filter-lock-menu {
3930
- z-index: 99999 !important;
3931
- top: -4px !important;
3932
- min-width: 450px;
3933
- max-width: 95vw;
3934
- min-height: 0px;
3935
- max-height: 95vh;
3936
- height: 350px;
3937
- padding: 10px; }
3938
- .filter-lock-menu .filter-lock-menu-content-container {
3939
- background: var(--react-autoql-background-color-secondary);
3940
- color: var(--react-autoql-text-color-primary);
3941
- box-shadow: 0px 0 8px var(--react-autoql-box-shadow-color, rgba(0, 0, 0, 0.15));
3942
- transition: opacity 0.1s ease 0s !important;
3943
- border: 1px solid #ababab52;
3944
- padding: 0 !important;
3945
- border-radius: 4px;
3946
- height: 100%;
3947
- width: 100%;
3948
- opacity: 1; }
3949
- .filter-lock-menu .filter-lock-menu-popover-arrow {
3950
- border-bottom: 10px solid var(--react-autoql-border-color) !important;
3951
- top: 1px !important;
3952
- opacity: 1; }
3953
- .filter-lock-menu .filter-lock-menu-popover-arrow::after {
3954
- content: '';
3955
- position: absolute;
3956
- border-left: 9px solid transparent;
3957
- border-right: 9px solid transparent;
3958
- border-bottom: 9px solid var(--react-autoql-background-color-secondary);
3959
- top: 1px;
3960
- left: -9px; }
3961
- .filter-lock-menu .filter-lock-toast-container {
3962
- top: 0;
3963
- position: absolute;
3964
- max-width: calc(100% - 36px);
3965
- padding: 10px;
3966
- font-size: 14px; }
3967
- .filter-lock-menu .filter-lock-toast-container .Toastify__toast {
3968
- min-height: 48px; }
3969
- .filter-lock-menu .filter-lock-toast-container .Toastify__toast-body {
3970
- justify-content: center; }
3971
- .filter-lock-menu .filter-lock-toast-container .Toastify__toast-body > div:last-child {
3972
- flex: unset; }
3973
- .filter-lock-menu .include-exclude-toggle-group {
3974
- height: 23px;
3975
- font-size: 12px;
3976
- font-weight: 400; }
3977
- .filter-lock-menu .include-exclude-toggle-group .react-autoql-radio-btn.active {
3978
- background-color: var(--react-autoql-border-color); }
3979
- .filter-lock-menu .include-exclude-toggle-group :first-child.react-autoql-radio-btn:hover, .filter-lock-menu .include-exclude-toggle-group :first-child.react-autoql-radio-btn.active {
3980
- color: var(--react-autoql-accent-color);
3981
- border-color: var(--react-autoql-accent-color); }
3982
- .filter-lock-menu .include-exclude-toggle-group :nth-child(2).react-autoql-radio-btn:hover, .filter-lock-menu .include-exclude-toggle-group :nth-child(2).react-autoql-radio-btn.active {
3983
- color: var(--react-autoql-danger-color);
3984
- border-color: var(--react-autoql-danger-color); }
3986
+ .filter-lock-popover:not(.filter-lock-popover-mobile) {
3987
+ top: -15px !important;
3988
+ left: -2px !important;
3989
+ width: 450px;
3990
+ height: 350px; }
3985
3991
 
3986
- .mobile-filter-lock-menu {
3987
- z-index: 99999 !important;
3988
- top: -4px !important;
3989
- min-width: 95vw;
3990
- max-width: 95vw;
3991
- min-height: 0px;
3992
- max-height: 95vh;
3993
- height: 350px;
3994
- padding: 10px; }
3995
- .mobile-filter-lock-menu .filter-lock-menu-content-container {
3996
- background: var(--react-autoql-background-color-secondary);
3997
- color: var(--react-autoql-text-color-primary);
3998
- box-shadow: 0px 0 8px var(--react-autoql-box-shadow-color, rgba(0, 0, 0, 0.15));
3999
- transition: opacity 0.1s ease 0s !important;
4000
- border: 1px solid #ababab52;
4001
- padding: 0 !important;
4002
- border-radius: 4px;
4003
- height: 100%;
4004
- width: 100%;
4005
- opacity: 1; }
4006
- .mobile-filter-lock-menu .filter-lock-menu-popover-arrow {
4007
- border-bottom: 10px solid var(--react-autoql-border-color) !important;
4008
- top: 1px !important;
4009
- opacity: 1; }
4010
- .mobile-filter-lock-menu .filter-lock-menu-popover-arrow::after {
4011
- content: '';
4012
- position: absolute;
4013
- border-left: 9px solid transparent;
4014
- border-right: 9px solid transparent;
4015
- border-bottom: 9px solid var(--react-autoql-background-color-secondary);
4016
- top: 1px;
4017
- left: -9px; }
4018
- .mobile-filter-lock-menu .filter-lock-toast-container {
4019
- top: 0;
4020
- position: absolute;
4021
- max-width: calc(100% - 36px);
4022
- padding: 10px;
4023
- font-size: 14px; }
4024
- .mobile-filter-lock-menu .filter-lock-toast-container .Toastify__toast {
4025
- min-height: 48px; }
4026
- .mobile-filter-lock-menu .filter-lock-toast-container .Toastify__toast-body {
4027
- justify-content: center; }
4028
- .mobile-filter-lock-menu .filter-lock-toast-container .Toastify__toast-body > div:last-child {
4029
- flex: unset; }
4030
- .mobile-filter-lock-menu .include-exclude-toggle-group {
4031
- height: 23px;
4032
- font-size: 12px;
4033
- font-weight: 200; }
4034
- .mobile-filter-lock-menu .include-exclude-toggle-group .react-autoql-radio-btn.active {
4035
- background-color: var(--react-autoql-border-color); }
4036
- .mobile-filter-lock-menu .include-exclude-toggle-group :first-child.react-autoql-radio-btn:hover, .mobile-filter-lock-menu .include-exclude-toggle-group :first-child.react-autoql-radio-btn.active {
4037
- color: var(--react-autoql-accent-color);
4038
- border-color: var(--react-autoql-accent-color); }
4039
- .mobile-filter-lock-menu .include-exclude-toggle-group :nth-child(2).react-autoql-radio-btn:hover, .mobile-filter-lock-menu .include-exclude-toggle-group :nth-child(2).react-autoql-radio-btn.active {
4040
- color: var(--react-autoql-danger-color);
4041
- border-color: var(--react-autoql-danger-color); }
3992
+ .filter-lock-popover.filter-lock-popover-mobile {
3993
+ height: calc(100vh - 200px); }
3994
+
3995
+ .filter-lock-popover .filter-lock-toast-container {
3996
+ top: 0;
3997
+ position: absolute;
3998
+ max-width: calc(100% - 36px);
3999
+ padding: 10px;
4000
+ font-size: 14px; }
4001
+ .filter-lock-popover .filter-lock-toast-container .Toastify__toast {
4002
+ min-height: 48px; }
4003
+ .filter-lock-popover .filter-lock-toast-container .Toastify__toast-body {
4004
+ justify-content: center; }
4005
+ .filter-lock-popover .filter-lock-toast-container .Toastify__toast-body > div:last-child {
4006
+ flex: unset; }
4007
+
4008
+ .filter-lock-popover .include-exclude-toggle-group {
4009
+ height: 23px;
4010
+ font-size: 12px;
4011
+ font-weight: 400; }
4012
+ .filter-lock-popover .include-exclude-toggle-group .react-autoql-radio-btn.active {
4013
+ background-color: var(--react-autoql-border-color); }
4014
+ .filter-lock-popover .include-exclude-toggle-group :first-child.react-autoql-radio-btn:hover, .filter-lock-popover .include-exclude-toggle-group :first-child.react-autoql-radio-btn.active {
4015
+ color: var(--react-autoql-accent-color);
4016
+ border-color: var(--react-autoql-accent-color); }
4017
+ .filter-lock-popover .include-exclude-toggle-group :nth-child(2).react-autoql-radio-btn:hover, .filter-lock-popover .include-exclude-toggle-group :nth-child(2).react-autoql-radio-btn.active {
4018
+ color: var(--react-autoql-danger-color);
4019
+ border-color: var(--react-autoql-danger-color); }
4042
4020
 
4043
4021
  .filter-lock-menu-content {
4044
- padding: 15px 0 0px 20px;
4045
- display: flex;
4046
- flex-direction: column;
4047
- justify-content: stretch;
4048
- height: 100%;
4049
- width: 100%;
4050
- box-sizing: border-box; }
4022
+ padding: 5px 10px; }
4051
4023
  .filter-lock-menu-content.closed {
4052
4024
  opacity: 0; }
4053
4025
  .filter-lock-menu-content h3,
@@ -4087,15 +4059,14 @@ g.legendOrdinal .legendTitle tspan {
4087
4059
  align-items: flex-start;
4088
4060
  justify-content: space-between;
4089
4061
  padding-bottom: 15px;
4090
- box-sizing: border-box;
4091
- padding-right: 15px; }
4062
+ box-sizing: border-box; }
4092
4063
  .filter-lock-menu-content .filter-lock-menu-header .filter-locking-close-and-saving-container {
4093
4064
  display: flex;
4094
4065
  justify-content: flex-end; }
4095
4066
  .filter-lock-menu-content .filter-lock-menu-header .filter-locking-close-and-saving-container .filter-locking-close-btn {
4096
4067
  border-radius: 20px;
4097
- margin: 0;
4098
- padding: 3px;
4068
+ margin: 0px;
4069
+ padding: 0px;
4099
4070
  font-size: 20px;
4100
4071
  color: var(--react-autoql-text-color-primary); }
4101
4072
  .filter-lock-menu-content .filter-lock-menu-header .filter-locking-close-and-saving-container .filter-locking-saving-indicator {
@@ -4122,6 +4093,7 @@ g.legendOrdinal .legendTitle tspan {
4122
4093
  flex-direction: row;
4123
4094
  flex-wrap: nowrap;
4124
4095
  justify-content: space-between;
4096
+ align-items: flex-start;
4125
4097
  margin-bottom: 4px; }
4126
4098
  .filter-lock-menu-content .react-autoql-filter-list-container .react-autoql-filter-list-title .filter-lock-category-title {
4127
4099
  padding-right: 10px;
@@ -4139,7 +4111,7 @@ g.legendOrdinal .legendTitle tspan {
4139
4111
  align-items: center;
4140
4112
  justify-content: flex-end;
4141
4113
  flex: 0 0 auto;
4142
- margin-right: 40px; }
4114
+ margin-right: 20px; }
4143
4115
  .filter-lock-menu-content .react-autoql-filter-list-container .react-autoql-filter-list-item-container {
4144
4116
  margin-bottom: 10px;
4145
4117
  margin-right: 0px; }
@@ -4148,13 +4120,10 @@ g.legendOrdinal .legendTitle tspan {
4148
4120
  flex-direction: row;
4149
4121
  justify-content: space-between;
4150
4122
  flex-wrap: nowrap;
4151
- padding-right: 10px;
4152
- margin-bottom: 1px;
4153
- margin-top: 1px;
4123
+ margin: 1px 0px;
4154
4124
  padding-top: 1px;
4155
4125
  padding-bottom: 1px;
4156
- padding-left: 5px;
4157
- margin-right: 10px; }
4126
+ padding-left: 5px; }
4158
4127
  .filter-lock-menu-content .react-autoql-filter-list-container .react-autoql-filter-list-item-container .react-autoql-filter-list-item .react-autoql-filter-list-item-filter {
4159
4128
  overflow: hidden;
4160
4129
  text-overflow: ellipsis;
@@ -4201,8 +4170,6 @@ g.legendOrdinal .legendTitle tspan {
4201
4170
  .filter-lock-menu-content .react-autoql-filter-locking-input::placeholder {
4202
4171
  color: rgba(var(--react-autoql-text-color-placeholder), 2) !important;
4203
4172
  opacity: 0.5; }
4204
- .filter-lock-menu-content .react-autosuggest__container {
4205
- margin-right: 20px; }
4206
4173
  .filter-lock-menu-content .react-autosuggest__container--open {
4207
4174
  position: relative; }
4208
4175
  .filter-lock-menu-content .react-autosuggest__container--open .react-autosuggest__suggestions-container--open {
@@ -4752,7 +4719,7 @@ g.legendOrdinal .legendTitle tspan {
4752
4719
  text-align: center; }
4753
4720
 
4754
4721
  .react-autoql-drawer .react-autoql-drawer-header-btn.hidden {
4755
- display: none; }
4722
+ display: none !important; }
4756
4723
 
4757
4724
  .react-autoql-drawer .react-autoql-drawer-header-btn .react-autoql-filter-lock-icon-container {
4758
4725
  display: inline-flex;
Binary file