react-autoql 4.10.0 → 5.0.1

package/dist/autoql.esm.css

@@ -80,14 +80,6 @@ span.react-autoql-icon {
 .chat-voice-record-icon {
   vertical-align: top; }
 
-.react-autoql-tooltip {
-  font-family: inherit;
-  letter-spacing: 0.04em;
-  text-align: left;
-  padding: 7px 15px;
-  opacity: 1 !important;
-  z-index: 99999 !important; }
-
 @-webkit-keyframes slide {
   0% {
     transform: translateX(-100%); }
@@ -817,23 +809,35 @@ g.legendOrdinal .legendTitle tspan {
     opacity: 0;
     transition: none; }
   .react-autoql-chart-container .bar,
+  .react-autoql-chart-container .column,
+  .react-autoql-chart-container .circle,
+  .react-autoql-chart-container .line,
+  .react-autoql-chart-container .slice,
+  .react-autoql-chart-container .stacked-area,
   .react-autoql-chart-container .stacked-bar,
   .react-autoql-chart-container .stacked-column,
-  .react-autoql-chart-container .circle,
-  .react-autoql-chart-container .stacked-area {
+  .react-autoql-chart-container .swatch {
     transition: fill-opacity 0.3s ease;
-    fill-opacity: 0.7 !important;
+    fill-opacity: 1 !important;
     outline: none !important; }
     .react-autoql-chart-container .bar:hover, .react-autoql-chart-container .bar.active,
+    .react-autoql-chart-container .column:hover,
+    .react-autoql-chart-container .column.active,
+    .react-autoql-chart-container .circle:hover,
+    .react-autoql-chart-container .circle.active,
+    .react-autoql-chart-container .line:hover,
+    .react-autoql-chart-container .line.active,
+    .react-autoql-chart-container .slice:hover,
+    .react-autoql-chart-container .slice.active,
+    .react-autoql-chart-container .stacked-area:hover,
+    .react-autoql-chart-container .stacked-area.active,
     .react-autoql-chart-container .stacked-bar:hover,
     .react-autoql-chart-container .stacked-bar.active,
     .react-autoql-chart-container .stacked-column:hover,
     .react-autoql-chart-container .stacked-column.active,
-    .react-autoql-chart-container .circle:hover,
-    .react-autoql-chart-container .circle.active,
-    .react-autoql-chart-container .stacked-area:hover,
-    .react-autoql-chart-container .stacked-area.active {
-      fill-opacity: 1 !important; }
+    .react-autoql-chart-container .swatch:hover,
+    .react-autoql-chart-container .swatch.active {
+      fill-opacity: 0.7 !important; }
   .react-autoql-chart-container .line-dot,
   .react-autoql-chart-container .vertex-dot {
     transition: opacity 0.3s ease;
@@ -3265,12 +3269,12 @@ ul {
   box-shadow: 0px 0 8px rgba(0, 0, 0, 0.15);
   opacity: 1;
   min-width: 450px;
-  max-width: 70vw;
-  min-height: 350px;
-  max-height: 90vh;
+  max-width: 95vw;
+  min-height: 0px;
+  max-height: 95vh;
+  height: 350px;
   background: var(--react-autoql-background-color-primary);
-  color: var(--react-autoql-text-color-primary);
-  overflow-y: auto !important; }
+  color: var(--react-autoql-text-color-primary); }
   .filter-lock-menu .filter-lock-toast-container {
     top: 0;
     position: absolute;
@@ -3304,8 +3308,6 @@ ul {
   height: 100%;
   width: 100%;
   box-sizing: border-box; }
-  .filter-lock-menu-content > div {
-    padding-right: 15px; }
   .filter-lock-menu-content.closed {
     opacity: 0; }
   .filter-lock-menu-content h3 {
@@ -3317,9 +3319,17 @@ ul {
     margin-bottom: 5px;
     color: var(--react-autoql-text-color-primary); }
   .filter-lock-menu-content .react-autoql-filter-lock-list-loading-container,
+  .filter-lock-menu-content .react-autoql-empty-filter-list {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    opacity: 0.8;
+    padding-right: 20px;
+    padding-bottom: 45px; }
+  .filter-lock-menu-content .react-autoql-filter-lock-list-loading-container,
   .filter-lock-menu-content .react-autoql-empty-filter-list,
   .filter-lock-menu-content .react-autoql-filter-list-container {
-    flex: 1 0 245px; }
+    flex: 1; }
   .filter-lock-menu-content .filter-lock-menu-header {
     flex: 0;
     width: 100%;
@@ -3328,7 +3338,8 @@ ul {
     align-items: flex-start;
     justify-content: space-between;
     padding-bottom: 15px;
-    box-sizing: border-box; }
+    box-sizing: border-box;
+    padding-right: 15px; }
     .filter-lock-menu-content .filter-lock-menu-header .filter-locking-close-btn {
       border: none;
       margin: 0;
@@ -3344,14 +3355,9 @@ ul {
     width: 100%;
     display: flex;
     justify-content: flex-end; }
-  .filter-lock-menu-content .react-autoql-empty-filter-list {
-    opacity: 0.8;
-    width: 100%;
-    text-align: center;
-    padding-top: 70px; }
   .filter-lock-menu-content .react-autoql-filter-list-container {
-    padding-top: 15px;
-    padding-right: 0;
+    margin-top: 15px;
+    margin-right: 0;
     overflow: hidden; }
     .filter-lock-menu-content .react-autoql-filter-list-container .react-autoql-filter-list-title {
       width: 100%;
@@ -3381,18 +3387,24 @@ ul {
         align-items: center;
         justify-content: flex-end;
         flex: 0 0 auto;
-        margin-right: 25px; }
+        margin-right: 40px; }
         .filter-lock-menu-content .react-autoql-filter-list-container .react-autoql-filter-list-title .persist-toggle-column .react-autoql-icon {
           margin-left: 3px; }
     .filter-lock-menu-content .react-autoql-filter-list-container .react-autoql-filter-list-item-container {
       margin-bottom: 10px;
-      padding-right: 15px; }
+      margin-right: 0px; }
       .filter-lock-menu-content .react-autoql-filter-list-container .react-autoql-filter-list-item-container .react-autoql-filter-list-item {
         display: flex;
         flex-direction: row;
         justify-content: space-between;
         flex-wrap: nowrap;
-        padding-bottom: 4px; }
+        padding-right: 10px;
+        margin-bottom: 1px;
+        margin-top: 1px;
+        padding-top: 1px;
+        padding-bottom: 1px;
+        padding-left: 5px;
+        margin-right: 10px; }
         .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 {
           overflow: hidden;
           text-overflow: ellipsis;
@@ -3444,6 +3456,8 @@ ul {
     .filter-lock-menu-content .react-autoql-filter-locking-input::placeholder {
       color: rgba(var(--react-autoql-text-color-placeholder), 2) !important;
       opacity: 0.5; }
+  .filter-lock-menu-content .react-autosuggest__container {
+    margin-right: 20px; }
   .filter-lock-menu-content .react-autosuggest__container--open {
     position: relative; }
     .filter-lock-menu-content .react-autosuggest__container--open .react-autosuggest__suggestions-container--open {
@@ -3460,18 +3474,22 @@ ul {
       box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.13);
       text-align: left;
       border-radius: 4px;
+      width: 100%;
       height: auto;
-      width: 100%; }
-      .filter-lock-menu-content .react-autosuggest__container--open .react-autosuggest__suggestions-container--open ul.filter-lock-suggestion-item {
+      max-height: calc(90vh - 180px);
+      box-sizing: border-box;
+      overflow: hidden; }
+      .filter-lock-menu-content .react-autosuggest__container--open .react-autosuggest__suggestions-container--open .filter-lock-suggestion-item {
         cursor: pointer;
         width: 100%;
-        columns: 2;
-        -webkit-columns: 2;
-        list-style: none;
-        -moz-columns: 2;
         letter-spacing: 0.05em;
         line-height: 22.5px;
-        padding: 0px 20px 3px 20px; }
+        padding: 0px 20px 3px 20px;
+        box-sizing: border-box;
+        line-height: inherit;
+        margin-bottom: 5px;
+        overflow: hidden;
+        text-overflow: ellipsis; }
       .filter-lock-menu-content .react-autosuggest__container--open .react-autosuggest__suggestions-container--open .react-autosuggest__suggestion {
         color: var(--react-autoql-text-color-primary); }
       .filter-lock-menu-content .react-autosuggest__container--open .react-autosuggest__suggestions-container--open .react-autosuggest__suggestions-list {
@@ -3504,18 +3522,22 @@ ul {
 @-webkit-keyframes highlightIn {
   100% {
     background-color: var(--react-autoql-accent-color);
-    color: var(--react-autoql-accent-text-color); }
+    color: var(--react-autoql-accent-text-color);
+    opacity: 0.8; }
   0% {
     background-color: var(--react-autoql-background-color-primary);
-    color: var(--react-autoql-text-color-primary); } }
+    color: var(--react-autoql-text-color-primary);
+    opacity: 1; } }
 
 @keyframes highlightIn {
   100% {
     background-color: var(--react-autoql-accent-color);
-    color: var(--react-autoql-accent-text-color); }
+    color: var(--react-autoql-accent-text-color);
+    opacity: 0.8; }
   0% {
     background-color: var(--react-autoql-background-color-primary);
-    color: var(--react-autoql-text-color-primary); } }
+    color: var(--react-autoql-text-color-primary);
+    opacity: 1; } }
 
 .react-autoql-drawer {
   font-family: var(--react-autoql-font-family), sans-serif;
@@ -3718,7 +3740,7 @@ ul {
     cursor: ns-resize; }
 
 /* Tooltips */
-.react-autoql-drawer-tooltip {
+.react-autoql-tooltip {
   font-family: var(--react-autoql-font-family), sans-serif;
   letter-spacing: 0.04em;
   line-height: 1.5em;
@@ -3727,7 +3749,9 @@ ul {
   text-align: left;
   opacity: 1 !important;
   z-index: 99999 !important;
-  /* necessary to show up on top of rc drawer */ }
+  /* necessary to show up on top of rc drawer */
+  max-width: 300px;
+  word-break: break-word; }
 
 .interpretation-tooltip {
   font-family: var(--react-autoql-font-family), sans-serif;