@empathyco/x-components 3.0.0-alpha.211 → 3.0.0-alpha.213

package/CHANGELOG.md

@@ -3,6 +3,36 @@
 All notable changes to this project will be documented in this file. See
 [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [3.0.0-alpha.213](https://github.com/empathyco/x/compare/@empathyco/x-components@3.0.0-alpha.212...@empathyco/x-components@3.0.0-alpha.213) (2022-11-03)
+
+### Features
+
+- Use Banner position (= row) to sort grid (#802)
+  ([28836a7](https://github.com/empathyco/x/commit/28836a71b91f210f425098f41ab71136a1b7b34c)),
+  closes [EX-7292](https://searchbroker.atlassian.net/browse/EX-7292)
+
+# Change Log
+
+All notable changes to this project will be documented in this file. See
+[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+## [3.0.0-alpha.212](https://github.com/empathyco/x/compare/@empathyco/x-components@3.0.0-alpha.211...@empathyco/x-components@3.0.0-alpha.212) (2022-11-03)
+
+### ⚠ BREAKING CHANGES
+
+- **components:** `facets` are now optional in `Suggestion`.
+
+### Features
+
+- **components:** add filters to base-suggestions (#758)
+  ([2014861](https://github.com/empathyco/x/commit/2014861453215808ee4279f9484f1d845780d7bf)),
+  closes [EX-6346](https://searchbroker.atlassian.net/browse/EX-6346)
+
+# Change Log
+
+All notable changes to this project will be documented in this file. See
+[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
 ## [3.0.0-alpha.211](https://github.com/empathyco/x/compare/@empathyco/x-components@3.0.0-alpha.210...@empathyco/x-components@3.0.0-alpha.211) (2022-11-02)
 
 ### Features

package/design-system/base.css

@@ -18,20 +18,6 @@
   --x-color-base-disable: #e11f26;
   --x-color-base-transparent: transparent;
 }
-:root {
-  --x-font-family-base: "Montserrat", sans-serif;
-  --x-size-font-base-xs: 12px;
-  --x-size-font-base-s: 14px;
-  --x-size-font-base-m: 16px;
-  --x-size-font-base-l: 18px;
-  --x-size-font-base-xl: 32px;
-  --x-number-font-weight-base-light: 300;
-  --x-number-font-weight-base-regular: 400;
-  --x-number-font-weight-base-bold: 600;
-  --x-size-line-height-base-s: 16px;
-  --x-size-line-height-base-m: 24px;
-  --x-size-line-height-base-l: 32px;
-}
 :root {
   --x-size-base-01: 2px;
   --x-size-base-02: 4px;
@@ -53,4 +39,18 @@
   --x-size-base-18: 216px;
   --x-size-base-19: 280px;
   --x-size-base-20: 344px;
+}
+:root {
+  --x-font-family-base: "Montserrat", sans-serif;
+  --x-size-font-base-xs: 12px;
+  --x-size-font-base-s: 14px;
+  --x-size-font-base-m: 16px;
+  --x-size-font-base-l: 18px;
+  --x-size-font-base-xl: 32px;
+  --x-number-font-weight-base-light: 300;
+  --x-number-font-weight-base-regular: 400;
+  --x-number-font-weight-base-bold: 600;
+  --x-size-line-height-base-s: 16px;
+  --x-size-line-height-base-m: 24px;
+  --x-size-line-height-base-l: 32px;
 }

package/design-system/default-theme.css

@@ -2052,13 +2052,6 @@
     --x-color-thumb-scroll-bar: var(--x-color-thumb-scroll-bar-hover);
   }
 }
-:root {
-  --x-string-overflow-scroll: auto;
-  --x-color-background-scroll-bar: transparent;
-  --x-color-thumb-scroll-bar: var(--x-color-base-neutral-95);
-  --x-color-background-scroll-bar-hover: transparent;
-  --x-color-thumb-scroll-bar-hover: var(--x-color-base-neutral-70);
-}
 .x-sliding-panel {
   z-index: 0;
   background-color: var(--x-color-background-sliding-panel);
@@ -2245,6 +2238,7 @@
   --x-color-text-suggestion-default: var(--x-color-text-default);
   --x-color-text-suggestion-matching-part-default: var(--x-color-base-neutral-35);
   --x-color-text-suggestion-default-matching: var(--x-color-text-suggestion-default);
+  --x-color-text-suggestion-filter-default: var(--x-color-base-neutral-35);
   --x-color-background-suggestion-default: transparent;
   --x-color-border-suggestion-default: var(--x-color-text-suggestion-default);
   --x-color-text-suggestion-default-curated: var(--x-color-text-suggestion-default);
@@ -2285,6 +2279,13 @@
   --x-number-font-weight-suggestion-default-matching: var(
     --x-number-font-weight-suggestion-default
   );
+  --x-font-family-suggestion-filter-default: var(--x-font-family-suggestion-default);
+  --x-size-font-suggestion-filter-default: var(--x-size-font-suggestion-default);
+  --x-size-line-height-suggestion-filter-default: var(--x-size-line-height-suggestion-default);
+  --x-number-font-weight-suggestion-filter-default: var(
+      --x-number-font-weight-suggestion-default
+  );
+  --x-text-transform-suggestion-filter-default: none;
   --x-font-family-suggestion-default-curated: var(--x-font-family-suggestion-default);
   --x-size-font-suggestion-default-curated: var(--x-size-font-suggestion-default);
   --x-size-line-height-suggestion-default-curated: var(--x-size-line-height-suggestion-default);
@@ -2376,9 +2377,6 @@
     margin-right: var(--x-size-gap-suggestion-default);
   }
 }
-.x-suggestion__query {
-  flex: 1 1 auto;
-}
 .x-suggestion__matching-part,
 .x-suggestion .x-identifier-result__matching-part {
   font-family: var(--x-font-family-suggestion-matching-part-default);
@@ -2387,6 +2385,14 @@
   font-weight: var(--x-number-font-weight-suggestion-matching-part-default);
   color: var(--x-color-text-suggestion-matching-part-default);
 }
+.x-suggestion__filter {
+  font-family: var(--x-font-family-suggestion-filter-default);
+  font-size: var(--x-size-font-suggestion-filter-default);
+  line-height: var(--x-size-line-height-suggestion-filter-default);
+  font-weight: var(--x-number-font-weight-suggestion-filter-default);
+  text-transform: var(--x-text-transform-suggestion-filter-default);
+  color: var(--x-color-text-suggestion-filter-default);
+}
 .x-suggestion--matching {
   --x-font-family-suggestion-default: var(--x-font-family-suggestion-default-matching);
   --x-size-font-suggestion-default: var(--x-size-font-suggestion-default-matching);
@@ -2430,6 +2436,7 @@
   --x-color-text-suggestion-default: var(--x-color-text-default);
   --x-color-text-suggestion-matching-part-default: var(--x-color-base-neutral-35);
   --x-color-text-suggestion-default-matching: var(--x-color-text-suggestion-default);
+  --x-color-text-suggestion-filter-default: var(--x-color-base-neutral-35);
   --x-color-background-suggestion-default: transparent;
   --x-color-border-suggestion-default: var(--x-color-text-suggestion-default);
   --x-color-text-suggestion-default-curated: var(--x-color-text-suggestion-default);
@@ -2470,6 +2477,13 @@
   --x-number-font-weight-suggestion-default-matching: var(
     --x-number-font-weight-suggestion-default
   );
+  --x-font-family-suggestion-filter-default: var(--x-font-family-suggestion-default);
+  --x-size-font-suggestion-filter-default: var(--x-size-font-suggestion-default);
+  --x-size-line-height-suggestion-filter-default: var(--x-size-line-height-suggestion-default);
+  --x-number-font-weight-suggestion-filter-default: var(
+      --x-number-font-weight-suggestion-default
+  );
+  --x-text-transform-suggestion-filter-default: none;
   --x-font-family-suggestion-default-curated: var(--x-font-family-suggestion-default);
   --x-size-font-suggestion-default-curated: var(--x-size-font-suggestion-default);
   --x-size-line-height-suggestion-default-curated: var(--x-size-line-height-suggestion-default);
@@ -2915,4 +2929,11 @@
   --x-size-line-height-base-s: 16px;
   --x-size-line-height-base-m: 24px;
   --x-size-line-height-base-l: 32px;
+}
+:root {
+  --x-string-overflow-scroll: auto;
+  --x-color-background-scroll-bar: transparent;
+  --x-color-thumb-scroll-bar: var(--x-color-base-neutral-95);
+  --x-color-background-scroll-bar-hover: transparent;
+  --x-color-thumb-scroll-bar-hover: var(--x-color-base-neutral-70);
 }