@empathyco/x-components 3.0.0-alpha.280 → 3.0.0-alpha.281

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 (12) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/design-system/full-theme.css +537 -537
  3. package/docs/API-reference/api/x-components.historyquery.md +2 -2
  4. package/js/x-modules/history-queries/components/history-query.vue.js +1 -0
  5. package/js/x-modules/history-queries/components/history-query.vue.js.map +1 -1
  6. package/js/x-modules/history-queries/components/history-query.vue_rollup-plugin-vue_script.vue.js +3 -3
  7. package/js/x-modules/history-queries/components/history-query.vue_rollup-plugin-vue_script.vue.js.map +1 -1
  8. package/package.json +2 -2
  9. package/report/x-components.api.json +2 -2
  10. package/report/x-components.api.md +3 -1
  11. package/types/x-modules/history-queries/components/history-query.vue.d.ts +3 -2
  12. package/types/x-modules/history-queries/components/history-query.vue.d.ts.map +1 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,17 @@
1
+ # Change Log
2
+
3
+ All notable changes to this project will be documented in this file.
4
+ See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
+
6
+ ## [3.0.0-alpha.281](https://github.com/empathyco/x/compare/@empathyco/x-components@3.0.0-alpha.280...@empathyco/x-components@3.0.0-alpha.281) (2023-01-16)
7
+
8
+
9
+ ### Features
10
+
11
+ * **history-queries:** add dynamic classes to the remove history query button (#1007) ([b5623d1](https://github.com/empathyco/x/commit/b5623d1c6f7f2709251164c6055b616218163c6f)), closes [EX-7833](https://searchbroker.atlassian.net/browse/EX-7833)
12
+
13
+
14
+
1
15
  # Change Log
2
16
 
3
17
  All notable changes to this project will be documented in this file. See
package/design-system/full-theme.css CHANGED
@@ -644,6 +644,15 @@
644
644
  --x-number-font-weight-facet-default: var(--x-number-font-weight-title3);
645
645
  --x-size-line-height-facet-default: var(--x-size-line-height-title3);
646
646
  }
647
+ .x-facet--line.x-facet,
648
+ .x-facet--line .x-facet {
649
+ --x-color-border-facet-header-default: var(--x-color-border-facet-header-line);
650
+ --x-size-border-width-facet-header-default: var(--x-size-border-width-facet-header-line);
651
+ --x-size-border-width-top-facet-header-default: var(--x-size-border-width-top-facet-header-line);
652
+ --x-size-border-width-right-facet-header-default: var(--x-size-border-width-right-facet-header-line);
653
+ --x-size-border-width-bottom-facet-header-default: var(--x-size-border-width-bottom-facet-header-line);
654
+ --x-size-border-width-left-facet-header-default: var(--x-size-border-width-left-facet-header-line);
655
+ }
647
656
  :root {
648
657
  --x-color-border-facet-header-line: var(--x-color-base-neutral-10);
649
658
  --x-size-border-width-facet-header-line: var(--x-size-border-width-base);
@@ -2003,494 +2012,171 @@
2003
2012
  --x-size-gap-list-20: var(--x-size-base-20);
2004
2013
  }
2005
2014
  /* @deprecated */
2006
- [class*=x-list--padding-].x-list.x-list--padding-top:not(.x-list--padding-right) {
2007
- padding-right: 0;
2008
- }
2009
- [class*=x-list--padding-].x-list.x-list--padding-top:not(.x-list--padding-bottom) {
2010
- padding-bottom: 0;
2011
- }
2012
- [class*=x-list--padding-].x-list.x-list--padding-top:not(.x-list--padding-left) {
2013
- padding-left: 0;
2014
- }
2015
- [class*=x-list--padding-].x-list.x-list--padding-right:not(.x-list--padding-top) {
2016
- padding-top: 0;
2017
- }
2018
- [class*=x-list--padding-].x-list.x-list--padding-right:not(.x-list--padding-bottom) {
2019
- padding-bottom: 0;
2020
- }
2021
- [class*=x-list--padding-].x-list.x-list--padding-right:not(.x-list--padding-left) {
2022
- padding-left: 0;
2023
- }
2024
- [class*=x-list--padding-].x-list.x-list--padding-bottom:not(.x-list--padding-top) {
2025
- padding-top: 0;
2026
- }
2027
- [class*=x-list--padding-].x-list.x-list--padding-bottom:not(.x-list--padding-right) {
2028
- padding-right: 0;
2029
- }
2030
- [class*=x-list--padding-].x-list.x-list--padding-bottom:not(.x-list--padding-left) {
2031
- padding-left: 0;
2015
+ :root {
2016
+ --x-size-padding-list-01: var(--x-size-base-01);
2017
+ --x-size-padding-list-02: var(--x-size-base-02);
2018
+ --x-size-padding-list-03: var(--x-size-base-03);
2019
+ --x-size-padding-list-04: var(--x-size-base-04);
2020
+ --x-size-padding-list-05: var(--x-size-base-05);
2021
+ --x-size-padding-list-06: var(--x-size-base-06);
2022
+ --x-size-padding-list-07: var(--x-size-base-07);
2023
+ --x-size-padding-list-08: var(--x-size-base-08);
2024
+ --x-size-padding-list-09: var(--x-size-base-09);
2025
+ --x-size-padding-list-10: var(--x-size-base-10);
2026
+ --x-size-padding-list-11: var(--x-size-base-11);
2027
+ --x-size-padding-list-12: var(--x-size-base-12);
2028
+ --x-size-padding-list-13: var(--x-size-base-13);
2032
2029
  }
2033
- [class*=x-list--padding-].x-list.x-list--padding-left:not(.x-list--padding-top) {
2034
- padding-top: 0;
2030
+ [dir="ltr"] .x-message {
2031
+ border-left-width: var(--x-size-border-width-left-message-default);
2035
2032
  }
2036
- [class*=x-list--padding-].x-list.x-list--padding-left:not(.x-list--padding-right) {
2037
- padding-right: 0;
2033
+ [dir="rtl"] .x-message {
2034
+ border-right-width: var(--x-size-border-width-left-message-default);
2038
2035
  }
2039
- [class*=x-list--padding-].x-list.x-list--padding-left:not(.x-list--padding-bottom) {
2040
- padding-bottom: 0;
2036
+ [dir="ltr"] .x-message {
2037
+ border-right-width: var(--x-size-border-width-right-message-default);
2041
2038
  }
2042
-
2043
- .x-list--padding-01.x-list {
2044
- padding: var(--x-size-padding-list-01);
2039
+ [dir="rtl"] .x-message {
2040
+ border-left-width: var(--x-size-border-width-right-message-default);
2045
2041
  }
2046
-
2047
- .x-list--gap-.x-list {
2048
- gap: var(--x-size-gap-list-01);
2042
+ .x-message {
2043
+ display: flex;
2044
+ flex-flow: column nowrap;
2045
+ justify-content: var(--x-string-justify-message-default);
2046
+ align-items: center;
2047
+ box-sizing: border-box;
2048
+ gap: var(--x-size-gap-message-default);
2049
+ padding: var(--x-size-padding-message-default);
2050
+ background-color: var(--x-color-background-message-default);
2051
+ border-color: var(--x-color-border-message-default);
2052
+ border-style: solid;
2053
+ border-top-width: var(--x-size-border-width-top-message-default);
2054
+ border-bottom-width: var(--x-size-border-width-bottom-message-default);
2055
+ border-radius: var(--x-size-border-radius-top-left-message-default) var(--x-size-border-radius-top-right-message-default) var(--x-size-border-radius-bottom-right-message-default) var(--x-size-border-radius-bottom-left-message-default);
2056
+ font-family: var(--x-font-family-message-default);
2057
+ font-size: var(--x-size-font-message-default);
2058
+ font-weight: var(--x-number-font-weight-message-default);
2049
2059
  }
2050
2060
  @media not all and (min-resolution: 0.001dpcm) {
2051
- .x-list--gap-.x-list {
2052
- gap: 0;
2053
- }
2054
- .x-list--gap-.x-list > *:not(:last-child) {
2055
- margin-bottom: var(--x-size-gap-list-01);
2056
- }
2057
- .x-list--gap-.x-list.x-list--horizontal {
2061
+ .x-message {
2058
2062
  gap: 0;
2059
2063
  }
2060
- .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
2061
- margin-right: var(--x-size-gap-list-01);
2064
+ .x-message > *:not(:last-child) {
2065
+ margin-right: var(--x-size-gap-message-default);
2062
2066
  }
2063
2067
  }
2064
-
2065
- .x-list--padding-02.x-list {
2066
- padding: var(--x-size-padding-list-02);
2067
- }
2068
-
2069
- .x-list--gap-.x-list {
2070
- gap: var(--x-size-gap-list-02);
2071
- }
2072
- @media not all and (min-resolution: 0.001dpcm) {
2073
- .x-list--gap-.x-list {
2074
- gap: 0;
2075
- }
2076
- .x-list--gap-.x-list > *:not(:last-child) {
2077
- margin-bottom: var(--x-size-gap-list-02);
2078
- }
2079
- .x-list--gap-.x-list.x-list--horizontal {
2080
- gap: 0;
2081
- }
2082
- .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
2083
- margin-right: var(--x-size-gap-list-02);
2084
- }
2068
+ .x-message,
2069
+ .x-message > a {
2070
+ color: var(--x-color-text-message-default);
2085
2071
  }
2086
-
2087
- .x-list--padding-03.x-list {
2088
- padding: var(--x-size-padding-list-03);
2072
+ .x-message > p {
2073
+ margin: 0;
2089
2074
  }
2090
-
2091
- .x-list--gap-.x-list {
2092
- gap: var(--x-size-gap-list-03);
2075
+ :root {
2076
+ --x-string-justify-message-default: center;
2077
+ --x-size-gap-message-default: var(--x-size-base-03);
2078
+ --x-size-padding-message-default: var(--x-size-base-06);
2079
+ --x-color-background-message-default: var(--x-color-base-neutral-95);
2080
+ --x-color-border-message-default: var(--x-color-background-message-default);
2081
+ --x-color-text-message-default: var(--x-color-text-default);
2082
+ --x-size-border-radius-message-default: var(--x-size-border-radius-base-m);
2083
+ --x-size-border-radius-top-left-message-default: var(--x-size-border-radius-message-default);
2084
+ --x-size-border-radius-top-right-message-default: var(--x-size-border-radius-message-default);
2085
+ --x-size-border-radius-bottom-right-message-default: var(--x-size-border-radius-message-default);
2086
+ --x-size-border-radius-bottom-left-message-default: var(--x-size-border-radius-message-default);
2087
+ --x-size-border-width-message-default: var(--x-size-border-width-base);
2088
+ --x-size-border-width-top-message-default: var(--x-size-border-width-message-default);
2089
+ --x-size-border-width-right-message-default: var(--x-size-border-width-message-default);
2090
+ --x-size-border-width-bottom-message-default: var(--x-size-border-width-message-default);
2091
+ --x-size-border-width-left-message-default: var(--x-size-border-width-message-default);
2092
+ --x-font-family-message-default: var(--x-font-family-title3);
2093
+ --x-size-font-message-default: var(--x-size-font-title3);
2094
+ --x-number-font-weight-message-default: var(--x-number-font-weight-title3);
2093
2095
  }
2094
- @media not all and (min-resolution: 0.001dpcm) {
2095
- .x-list--gap-.x-list {
2096
- gap: 0;
2097
- }
2098
- .x-list--gap-.x-list > *:not(:last-child) {
2099
- margin-bottom: var(--x-size-gap-list-03);
2100
- }
2101
- .x-list--gap-.x-list.x-list--horizontal {
2102
- gap: 0;
2103
- }
2104
- .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
2105
- margin-right: var(--x-size-gap-list-03);
2106
- }
2096
+ .x-option-list--bottom.x-option-list,
2097
+ .x-option-list--bottom .x-option-list {
2098
+ --x-color-text-option-list-button-default: var(--x-color-text-option-list-button-bottom);
2099
+ --x-color-text-option-list-button-default-hover: var(
2100
+ --x-color-text-option-list-button-bottom-hover
2101
+ );
2102
+ --x-color-border-option-list-item-default: var(--x-color-border-option-list-item-bottom);
2103
+ --x-color-border-top-option-list-item-default: var(--x-color-border-top-option-list-item-bottom);
2104
+ --x-color-border-right-option-list-item-default: var(
2105
+ --x-color-border-top-option-list-item-bottom
2106
+ );
2107
+ --x-color-border-bottom-option-list-item-default: var(
2108
+ --x-color-border-top-option-list-item-bottom
2109
+ );
2110
+ --x-color-border-left-option-list-item-default: var(--x-color-border-top-option-list-item-bottom);
2111
+ --x-size-border-width-option-list-item-default: var(
2112
+ --x-size-border-width-option-list-item-bottom
2113
+ );
2114
+ --x-size-border-width-top-option-list-item-default: var(
2115
+ --x-size-border-width-top-option-list-item-bottom
2116
+ );
2117
+ --x-size-border-width-right-option-list-item-default: var(
2118
+ --x-size-border-width-right-option-list-item-bottom
2119
+ );
2120
+ --x-size-border-width-bottom-option-list-item-default: var(
2121
+ --x-size-border-width-bottom-option-list-item-bottom
2122
+ );
2123
+ --x-size-border-width-left-option-list-item-default: var(
2124
+ --x-size-border-width-left-option-list-item-bottom
2125
+ );
2126
+ --x-font-decoration-option-list-button-default-hover: var(
2127
+ --x-font-decoration-option-list-button-bottom-hover
2128
+ );
2129
+ --x-size-font-option-list-button-default: var(--x-size-font-option-list-button-bottom);
2130
+ --x-number-font-weight-option-list-button-default: var(
2131
+ --x-number-font-weight-option-list-button-bottom
2132
+ );
2107
2133
  }
2108
-
2109
- .x-list--padding-04.x-list {
2110
- padding: var(--x-size-padding-list-04);
2134
+ .x-option-list--bottom.x-option-list .x-option-list__item.x-option-list__item--is-selected,
2135
+ .x-option-list--bottom .x-option-list .x-option-list__item.x-option-list__item--is-selected {
2136
+ --x-color-text-option-list-button-default-selected: var(
2137
+ --x-color-text-option-list-button-bottom-selected
2138
+ );
2139
+ --x-color-text-option-list-button-default-selected-hover: var(
2140
+ --x-color-text-option-list-button-bottom-selected-hover
2141
+ );
2142
+ --x-color-border-option-list-item-default-selected: var(
2143
+ --x-color-border-option-list-item-bottom-selected
2144
+ );
2145
+ --x-color-border-top-option-list-item-default-selected: var(
2146
+ --x-color-border-top-option-list-item-bottom-selected
2147
+ );
2148
+ --x-color-border-right-option-list-item-default-selected: var(
2149
+ --x-color-border-top-option-list-item-bottom-selected
2150
+ );
2151
+ --x-color-border-bottom-option-list-item-default-selected: var(
2152
+ --x-color-border-bottom-option-list-item-bottom-selected
2153
+ );
2154
+ --x-color-border-left-option-list-item-default-selected: var(
2155
+ --x-color-border-top-option-list-item-bottom-selected
2156
+ );
2157
+ --x-size-border-width-top-option-list-item-default: var(
2158
+ --x-size-border-width-top-option-list-item-bottom-selected
2159
+ );
2160
+ --x-size-border-width-right-option-list-item-default: var(
2161
+ --x-size-border-width-right-option-list-item-bottom-selected
2162
+ );
2163
+ --x-size-border-width-bottom-option-list-item-default: var(
2164
+ --x-size-border-width-bottom-option-list-item-bottom-selected
2165
+ );
2166
+ --x-size-border-width-left-option-list-item-default: var(
2167
+ --x-size-border-width-left-option-list-item-bottom-selected
2168
+ );
2169
+ --x-number-font-weight-option-list-button-default-selected: var(
2170
+ --x-number-font-weight-option-list-button-bottom-selected
2171
+ );
2111
2172
  }
2112
-
2113
- .x-list--gap-.x-list {
2114
- gap: var(--x-size-gap-list-04);
2115
- }
2116
- @media not all and (min-resolution: 0.001dpcm) {
2117
- .x-list--gap-.x-list {
2118
- gap: 0;
2119
- }
2120
- .x-list--gap-.x-list > *:not(:last-child) {
2121
- margin-bottom: var(--x-size-gap-list-04);
2122
- }
2123
- .x-list--gap-.x-list.x-list--horizontal {
2124
- gap: 0;
2125
- }
2126
- .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
2127
- margin-right: var(--x-size-gap-list-04);
2128
- }
2129
- }
2130
-
2131
- .x-list--padding-05.x-list {
2132
- padding: var(--x-size-padding-list-05);
2133
- }
2134
-
2135
- .x-list--gap-.x-list {
2136
- gap: var(--x-size-gap-list-05);
2137
- }
2138
- @media not all and (min-resolution: 0.001dpcm) {
2139
- .x-list--gap-.x-list {
2140
- gap: 0;
2141
- }
2142
- .x-list--gap-.x-list > *:not(:last-child) {
2143
- margin-bottom: var(--x-size-gap-list-05);
2144
- }
2145
- .x-list--gap-.x-list.x-list--horizontal {
2146
- gap: 0;
2147
- }
2148
- .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
2149
- margin-right: var(--x-size-gap-list-05);
2150
- }
2151
- }
2152
-
2153
- .x-list--padding-06.x-list {
2154
- padding: var(--x-size-padding-list-06);
2155
- }
2156
-
2157
- .x-list--gap-.x-list {
2158
- gap: var(--x-size-gap-list-06);
2159
- }
2160
- @media not all and (min-resolution: 0.001dpcm) {
2161
- .x-list--gap-.x-list {
2162
- gap: 0;
2163
- }
2164
- .x-list--gap-.x-list > *:not(:last-child) {
2165
- margin-bottom: var(--x-size-gap-list-06);
2166
- }
2167
- .x-list--gap-.x-list.x-list--horizontal {
2168
- gap: 0;
2169
- }
2170
- .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
2171
- margin-right: var(--x-size-gap-list-06);
2172
- }
2173
- }
2174
-
2175
- .x-list--padding-07.x-list {
2176
- padding: var(--x-size-padding-list-07);
2177
- }
2178
-
2179
- .x-list--gap-.x-list {
2180
- gap: var(--x-size-gap-list-07);
2181
- }
2182
- @media not all and (min-resolution: 0.001dpcm) {
2183
- .x-list--gap-.x-list {
2184
- gap: 0;
2185
- }
2186
- .x-list--gap-.x-list > *:not(:last-child) {
2187
- margin-bottom: var(--x-size-gap-list-07);
2188
- }
2189
- .x-list--gap-.x-list.x-list--horizontal {
2190
- gap: 0;
2191
- }
2192
- .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
2193
- margin-right: var(--x-size-gap-list-07);
2194
- }
2195
- }
2196
-
2197
- .x-list--padding-08.x-list {
2198
- padding: var(--x-size-padding-list-08);
2199
- }
2200
-
2201
- .x-list--gap-.x-list {
2202
- gap: var(--x-size-gap-list-08);
2203
- }
2204
- @media not all and (min-resolution: 0.001dpcm) {
2205
- .x-list--gap-.x-list {
2206
- gap: 0;
2207
- }
2208
- .x-list--gap-.x-list > *:not(:last-child) {
2209
- margin-bottom: var(--x-size-gap-list-08);
2210
- }
2211
- .x-list--gap-.x-list.x-list--horizontal {
2212
- gap: 0;
2213
- }
2214
- .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
2215
- margin-right: var(--x-size-gap-list-08);
2216
- }
2217
- }
2218
-
2219
- .x-list--padding-09.x-list {
2220
- padding: var(--x-size-padding-list-09);
2221
- }
2222
-
2223
- .x-list--gap-.x-list {
2224
- gap: var(--x-size-gap-list-09);
2225
- }
2226
- @media not all and (min-resolution: 0.001dpcm) {
2227
- .x-list--gap-.x-list {
2228
- gap: 0;
2229
- }
2230
- .x-list--gap-.x-list > *:not(:last-child) {
2231
- margin-bottom: var(--x-size-gap-list-09);
2232
- }
2233
- .x-list--gap-.x-list.x-list--horizontal {
2234
- gap: 0;
2235
- }
2236
- .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
2237
- margin-right: var(--x-size-gap-list-09);
2238
- }
2239
- }
2240
-
2241
- .x-list--padding-10.x-list {
2242
- padding: var(--x-size-padding-list-10);
2243
- }
2244
-
2245
- .x-list--gap-.x-list {
2246
- gap: var(--x-size-gap-list-10);
2247
- }
2248
- @media not all and (min-resolution: 0.001dpcm) {
2249
- .x-list--gap-.x-list {
2250
- gap: 0;
2251
- }
2252
- .x-list--gap-.x-list > *:not(:last-child) {
2253
- margin-bottom: var(--x-size-gap-list-10);
2254
- }
2255
- .x-list--gap-.x-list.x-list--horizontal {
2256
- gap: 0;
2257
- }
2258
- .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
2259
- margin-right: var(--x-size-gap-list-10);
2260
- }
2261
- }
2262
-
2263
- .x-list--padding-11.x-list {
2264
- padding: var(--x-size-padding-list-11);
2265
- }
2266
-
2267
- .x-list--gap-.x-list {
2268
- gap: var(--x-size-gap-list-11);
2269
- }
2270
- @media not all and (min-resolution: 0.001dpcm) {
2271
- .x-list--gap-.x-list {
2272
- gap: 0;
2273
- }
2274
- .x-list--gap-.x-list > *:not(:last-child) {
2275
- margin-bottom: var(--x-size-gap-list-11);
2276
- }
2277
- .x-list--gap-.x-list.x-list--horizontal {
2278
- gap: 0;
2279
- }
2280
- .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
2281
- margin-right: var(--x-size-gap-list-11);
2282
- }
2283
- }
2284
-
2285
- .x-list--padding-12.x-list {
2286
- padding: var(--x-size-padding-list-12);
2287
- }
2288
-
2289
- .x-list--gap-.x-list {
2290
- gap: var(--x-size-gap-list-12);
2291
- }
2292
- @media not all and (min-resolution: 0.001dpcm) {
2293
- .x-list--gap-.x-list {
2294
- gap: 0;
2295
- }
2296
- .x-list--gap-.x-list > *:not(:last-child) {
2297
- margin-bottom: var(--x-size-gap-list-12);
2298
- }
2299
- .x-list--gap-.x-list.x-list--horizontal {
2300
- gap: 0;
2301
- }
2302
- .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
2303
- margin-right: var(--x-size-gap-list-12);
2304
- }
2305
- }
2306
-
2307
- .x-list--padding-13.x-list {
2308
- padding: var(--x-size-padding-list-13);
2309
- }
2310
-
2311
- .x-list--gap-.x-list {
2312
- gap: var(--x-size-gap-list-13);
2313
- }
2314
- @media not all and (min-resolution: 0.001dpcm) {
2315
- .x-list--gap-.x-list {
2316
- gap: 0;
2317
- }
2318
- .x-list--gap-.x-list > *:not(:last-child) {
2319
- margin-bottom: var(--x-size-gap-list-13);
2320
- }
2321
- .x-list--gap-.x-list.x-list--horizontal {
2322
- gap: 0;
2323
- }
2324
- .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
2325
- margin-right: var(--x-size-gap-list-13);
2326
- }
2327
- }
2328
- /* @deprecated */
2329
- :root {
2330
- --x-size-padding-list-01: var(--x-size-base-01);
2331
- --x-size-padding-list-02: var(--x-size-base-02);
2332
- --x-size-padding-list-03: var(--x-size-base-03);
2333
- --x-size-padding-list-04: var(--x-size-base-04);
2334
- --x-size-padding-list-05: var(--x-size-base-05);
2335
- --x-size-padding-list-06: var(--x-size-base-06);
2336
- --x-size-padding-list-07: var(--x-size-base-07);
2337
- --x-size-padding-list-08: var(--x-size-base-08);
2338
- --x-size-padding-list-09: var(--x-size-base-09);
2339
- --x-size-padding-list-10: var(--x-size-base-10);
2340
- --x-size-padding-list-11: var(--x-size-base-11);
2341
- --x-size-padding-list-12: var(--x-size-base-12);
2342
- --x-size-padding-list-13: var(--x-size-base-13);
2343
- }
2344
- [dir="ltr"] .x-message {
2345
- border-left-width: var(--x-size-border-width-left-message-default);
2346
- }
2347
- [dir="rtl"] .x-message {
2348
- border-right-width: var(--x-size-border-width-left-message-default);
2349
- }
2350
- [dir="ltr"] .x-message {
2351
- border-right-width: var(--x-size-border-width-right-message-default);
2352
- }
2353
- [dir="rtl"] .x-message {
2354
- border-left-width: var(--x-size-border-width-right-message-default);
2355
- }
2356
- .x-message {
2357
- display: flex;
2358
- flex-flow: column nowrap;
2359
- justify-content: var(--x-string-justify-message-default);
2360
- align-items: center;
2361
- box-sizing: border-box;
2362
- gap: var(--x-size-gap-message-default);
2363
- padding: var(--x-size-padding-message-default);
2364
- background-color: var(--x-color-background-message-default);
2365
- border-color: var(--x-color-border-message-default);
2366
- border-style: solid;
2367
- border-top-width: var(--x-size-border-width-top-message-default);
2368
- border-bottom-width: var(--x-size-border-width-bottom-message-default);
2369
- border-radius: var(--x-size-border-radius-top-left-message-default) var(--x-size-border-radius-top-right-message-default) var(--x-size-border-radius-bottom-right-message-default) var(--x-size-border-radius-bottom-left-message-default);
2370
- font-family: var(--x-font-family-message-default);
2371
- font-size: var(--x-size-font-message-default);
2372
- font-weight: var(--x-number-font-weight-message-default);
2373
- }
2374
- @media not all and (min-resolution: 0.001dpcm) {
2375
- .x-message {
2376
- gap: 0;
2377
- }
2378
- .x-message > *:not(:last-child) {
2379
- margin-right: var(--x-size-gap-message-default);
2380
- }
2381
- }
2382
- .x-message,
2383
- .x-message > a {
2384
- color: var(--x-color-text-message-default);
2385
- }
2386
- .x-message > p {
2387
- margin: 0;
2388
- }
2389
- :root {
2390
- --x-string-justify-message-default: center;
2391
- --x-size-gap-message-default: var(--x-size-base-03);
2392
- --x-size-padding-message-default: var(--x-size-base-06);
2393
- --x-color-background-message-default: var(--x-color-base-neutral-95);
2394
- --x-color-border-message-default: var(--x-color-background-message-default);
2395
- --x-color-text-message-default: var(--x-color-text-default);
2396
- --x-size-border-radius-message-default: var(--x-size-border-radius-base-m);
2397
- --x-size-border-radius-top-left-message-default: var(--x-size-border-radius-message-default);
2398
- --x-size-border-radius-top-right-message-default: var(--x-size-border-radius-message-default);
2399
- --x-size-border-radius-bottom-right-message-default: var(--x-size-border-radius-message-default);
2400
- --x-size-border-radius-bottom-left-message-default: var(--x-size-border-radius-message-default);
2401
- --x-size-border-width-message-default: var(--x-size-border-width-base);
2402
- --x-size-border-width-top-message-default: var(--x-size-border-width-message-default);
2403
- --x-size-border-width-right-message-default: var(--x-size-border-width-message-default);
2404
- --x-size-border-width-bottom-message-default: var(--x-size-border-width-message-default);
2405
- --x-size-border-width-left-message-default: var(--x-size-border-width-message-default);
2406
- --x-font-family-message-default: var(--x-font-family-title3);
2407
- --x-size-font-message-default: var(--x-size-font-title3);
2408
- --x-number-font-weight-message-default: var(--x-number-font-weight-title3);
2409
- }
2410
- .x-option-list--bottom.x-option-list,
2411
- .x-option-list--bottom .x-option-list {
2412
- --x-color-text-option-list-button-default: var(--x-color-text-option-list-button-bottom);
2413
- --x-color-text-option-list-button-default-hover: var(
2414
- --x-color-text-option-list-button-bottom-hover
2415
- );
2416
- --x-color-border-option-list-item-default: var(--x-color-border-option-list-item-bottom);
2417
- --x-color-border-top-option-list-item-default: var(--x-color-border-top-option-list-item-bottom);
2418
- --x-color-border-right-option-list-item-default: var(
2419
- --x-color-border-top-option-list-item-bottom
2420
- );
2421
- --x-color-border-bottom-option-list-item-default: var(
2422
- --x-color-border-top-option-list-item-bottom
2423
- );
2424
- --x-color-border-left-option-list-item-default: var(--x-color-border-top-option-list-item-bottom);
2425
- --x-size-border-width-option-list-item-default: var(
2426
- --x-size-border-width-option-list-item-bottom
2427
- );
2428
- --x-size-border-width-top-option-list-item-default: var(
2429
- --x-size-border-width-top-option-list-item-bottom
2430
- );
2431
- --x-size-border-width-right-option-list-item-default: var(
2432
- --x-size-border-width-right-option-list-item-bottom
2433
- );
2434
- --x-size-border-width-bottom-option-list-item-default: var(
2435
- --x-size-border-width-bottom-option-list-item-bottom
2436
- );
2437
- --x-size-border-width-left-option-list-item-default: var(
2438
- --x-size-border-width-left-option-list-item-bottom
2439
- );
2440
- --x-font-decoration-option-list-button-default-hover: var(
2441
- --x-font-decoration-option-list-button-bottom-hover
2442
- );
2443
- --x-size-font-option-list-button-default: var(--x-size-font-option-list-button-bottom);
2444
- --x-number-font-weight-option-list-button-default: var(
2445
- --x-number-font-weight-option-list-button-bottom
2446
- );
2447
- }
2448
- .x-option-list--bottom.x-option-list .x-option-list__item.x-option-list__item--is-selected,
2449
- .x-option-list--bottom .x-option-list .x-option-list__item.x-option-list__item--is-selected {
2450
- --x-color-text-option-list-button-default-selected: var(
2451
- --x-color-text-option-list-button-bottom-selected
2452
- );
2453
- --x-color-text-option-list-button-default-selected-hover: var(
2454
- --x-color-text-option-list-button-bottom-selected-hover
2455
- );
2456
- --x-color-border-option-list-item-default-selected: var(
2457
- --x-color-border-option-list-item-bottom-selected
2458
- );
2459
- --x-color-border-top-option-list-item-default-selected: var(
2460
- --x-color-border-top-option-list-item-bottom-selected
2461
- );
2462
- --x-color-border-right-option-list-item-default-selected: var(
2463
- --x-color-border-top-option-list-item-bottom-selected
2464
- );
2465
- --x-color-border-bottom-option-list-item-default-selected: var(
2466
- --x-color-border-bottom-option-list-item-bottom-selected
2467
- );
2468
- --x-color-border-left-option-list-item-default-selected: var(
2469
- --x-color-border-top-option-list-item-bottom-selected
2470
- );
2471
- --x-size-border-width-top-option-list-item-default: var(
2472
- --x-size-border-width-top-option-list-item-bottom-selected
2473
- );
2474
- --x-size-border-width-right-option-list-item-default: var(
2475
- --x-size-border-width-right-option-list-item-bottom-selected
2476
- );
2477
- --x-size-border-width-bottom-option-list-item-default: var(
2478
- --x-size-border-width-bottom-option-list-item-bottom-selected
2479
- );
2480
- --x-size-border-width-left-option-list-item-default: var(
2481
- --x-size-border-width-left-option-list-item-bottom-selected
2482
- );
2483
- --x-number-font-weight-option-list-button-default-selected: var(
2484
- --x-number-font-weight-option-list-button-bottom-selected
2485
- );
2486
- }
2487
- .x-option-list--bottom.x-option-list .x-option-list__item:last-child,
2488
- .x-option-list--bottom .x-option-list .x-option-list__item:last-child {
2489
- --x-size-border-width-option-list-item-default: inherit;
2490
- --x-size-border-width-top-option-list-item-default: inherit;
2491
- --x-size-border-width-right-option-list-item-default: inherit;
2492
- --x-size-border-width-bottom-option-list-item-default: inherit;
2493
- --x-size-border-width-left-option-list-item-default: inherit;
2173
+ .x-option-list--bottom.x-option-list .x-option-list__item:last-child,
2174
+ .x-option-list--bottom .x-option-list .x-option-list__item:last-child {
2175
+ --x-size-border-width-option-list-item-default: inherit;
2176
+ --x-size-border-width-top-option-list-item-default: inherit;
2177
+ --x-size-border-width-right-option-list-item-default: inherit;
2178
+ --x-size-border-width-bottom-option-list-item-default: inherit;
2179
+ --x-size-border-width-left-option-list-item-default: inherit;
2494
2180
  }
2495
2181
  :root {
2496
2182
  --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
@@ -6572,101 +6258,415 @@
6572
6258
  .x-padding--top-17 {
6573
6259
  padding-top: var(--x-size-base-17) !important;
6574
6260
  }
6575
- .x-padding--bottom-17 {
6576
- padding-bottom: var(--x-size-base-17) !important;
6261
+ .x-padding--bottom-17 {
6262
+ padding-bottom: var(--x-size-base-17) !important;
6263
+ }
6264
+ [dir="ltr"] .x-padding--right-17 {
6265
+ padding-right: var(--x-size-base-17) !important;
6266
+ }
6267
+ [dir="rtl"] .x-padding--right-17 {
6268
+ padding-left: var(--x-size-base-17) !important;
6269
+ }
6270
+ [dir="ltr"] .x-padding--left-17 {
6271
+ padding-left: var(--x-size-base-17) !important;
6272
+ }
6273
+ [dir="rtl"] .x-padding--left-17 {
6274
+ padding-right: var(--x-size-base-17) !important;
6275
+ }
6276
+ .x-padding--top-18 {
6277
+ padding-top: var(--x-size-base-18) !important;
6278
+ }
6279
+ .x-padding--bottom-18 {
6280
+ padding-bottom: var(--x-size-base-18) !important;
6281
+ }
6282
+ [dir="ltr"] .x-padding--right-18 {
6283
+ padding-right: var(--x-size-base-18) !important;
6284
+ }
6285
+ [dir="rtl"] .x-padding--right-18 {
6286
+ padding-left: var(--x-size-base-18) !important;
6287
+ }
6288
+ [dir="ltr"] .x-padding--left-18 {
6289
+ padding-left: var(--x-size-base-18) !important;
6290
+ }
6291
+ [dir="rtl"] .x-padding--left-18 {
6292
+ padding-right: var(--x-size-base-18) !important;
6293
+ }
6294
+ .x-padding--top-19 {
6295
+ padding-top: var(--x-size-base-19) !important;
6296
+ }
6297
+ .x-padding--bottom-19 {
6298
+ padding-bottom: var(--x-size-base-19) !important;
6299
+ }
6300
+ [dir="ltr"] .x-padding--right-19 {
6301
+ padding-right: var(--x-size-base-19) !important;
6302
+ }
6303
+ [dir="rtl"] .x-padding--right-19 {
6304
+ padding-left: var(--x-size-base-19) !important;
6305
+ }
6306
+ [dir="ltr"] .x-padding--left-19 {
6307
+ padding-left: var(--x-size-base-19) !important;
6308
+ }
6309
+ [dir="rtl"] .x-padding--left-19 {
6310
+ padding-right: var(--x-size-base-19) !important;
6311
+ }
6312
+ .x-padding--top-20 {
6313
+ padding-top: var(--x-size-base-20) !important;
6314
+ }
6315
+ .x-padding--bottom-20 {
6316
+ padding-bottom: var(--x-size-base-20) !important;
6317
+ }
6318
+ [dir="ltr"] .x-padding--right-20 {
6319
+ padding-right: var(--x-size-base-20) !important;
6320
+ }
6321
+ [dir="rtl"] .x-padding--right-20 {
6322
+ padding-left: var(--x-size-base-20) !important;
6323
+ }
6324
+ [dir="ltr"] .x-padding--left-20 {
6325
+ padding-left: var(--x-size-base-20) !important;
6326
+ }
6327
+ [dir="rtl"] .x-padding--left-20 {
6328
+ padding-right: var(--x-size-base-20) !important;
6329
+ }
6330
+ .x-static {
6331
+ position: static !important;
6332
+ }
6333
+
6334
+ .x-fixed {
6335
+ position: fixed !important;
6336
+ }
6337
+
6338
+ .x-absolute {
6339
+ position: absolute !important;
6340
+ }
6341
+
6342
+ .x-relative {
6343
+ position: relative !important;
6344
+ }
6345
+
6346
+ .x-sticky {
6347
+ position: sticky !important;
6348
+ }
6349
+
6350
+ /* @deprecated */
6351
+ [class*=x-list--padding-].x-list.x-list--padding-top:not(.x-list--padding-right) {
6352
+ padding-right: 0;
6353
+ }
6354
+ [class*=x-list--padding-].x-list.x-list--padding-top:not(.x-list--padding-bottom) {
6355
+ padding-bottom: 0;
6356
+ }
6357
+ [class*=x-list--padding-].x-list.x-list--padding-top:not(.x-list--padding-left) {
6358
+ padding-left: 0;
6359
+ }
6360
+ [class*=x-list--padding-].x-list.x-list--padding-right:not(.x-list--padding-top) {
6361
+ padding-top: 0;
6362
+ }
6363
+ [class*=x-list--padding-].x-list.x-list--padding-right:not(.x-list--padding-bottom) {
6364
+ padding-bottom: 0;
6365
+ }
6366
+ [class*=x-list--padding-].x-list.x-list--padding-right:not(.x-list--padding-left) {
6367
+ padding-left: 0;
6368
+ }
6369
+ [class*=x-list--padding-].x-list.x-list--padding-bottom:not(.x-list--padding-top) {
6370
+ padding-top: 0;
6371
+ }
6372
+ [class*=x-list--padding-].x-list.x-list--padding-bottom:not(.x-list--padding-right) {
6373
+ padding-right: 0;
6374
+ }
6375
+ [class*=x-list--padding-].x-list.x-list--padding-bottom:not(.x-list--padding-left) {
6376
+ padding-left: 0;
6377
+ }
6378
+ [class*=x-list--padding-].x-list.x-list--padding-left:not(.x-list--padding-top) {
6379
+ padding-top: 0;
6380
+ }
6381
+ [class*=x-list--padding-].x-list.x-list--padding-left:not(.x-list--padding-right) {
6382
+ padding-right: 0;
6383
+ }
6384
+ [class*=x-list--padding-].x-list.x-list--padding-left:not(.x-list--padding-bottom) {
6385
+ padding-bottom: 0;
6386
+ }
6387
+
6388
+ .x-list--padding-01.x-list {
6389
+ padding: var(--x-size-padding-list-01);
6390
+ }
6391
+
6392
+ .x-list--gap-.x-list {
6393
+ gap: var(--x-size-gap-list-01);
6394
+ }
6395
+ @media not all and (min-resolution: 0.001dpcm) {
6396
+ .x-list--gap-.x-list {
6397
+ gap: 0;
6398
+ }
6399
+ .x-list--gap-.x-list > *:not(:last-child) {
6400
+ margin-bottom: var(--x-size-gap-list-01);
6401
+ }
6402
+ .x-list--gap-.x-list.x-list--horizontal {
6403
+ gap: 0;
6404
+ }
6405
+ .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
6406
+ margin-right: var(--x-size-gap-list-01);
6407
+ }
6408
+ }
6409
+
6410
+ .x-list--padding-02.x-list {
6411
+ padding: var(--x-size-padding-list-02);
6412
+ }
6413
+
6414
+ .x-list--gap-.x-list {
6415
+ gap: var(--x-size-gap-list-02);
6416
+ }
6417
+ @media not all and (min-resolution: 0.001dpcm) {
6418
+ .x-list--gap-.x-list {
6419
+ gap: 0;
6420
+ }
6421
+ .x-list--gap-.x-list > *:not(:last-child) {
6422
+ margin-bottom: var(--x-size-gap-list-02);
6423
+ }
6424
+ .x-list--gap-.x-list.x-list--horizontal {
6425
+ gap: 0;
6426
+ }
6427
+ .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
6428
+ margin-right: var(--x-size-gap-list-02);
6429
+ }
6430
+ }
6431
+
6432
+ .x-list--padding-03.x-list {
6433
+ padding: var(--x-size-padding-list-03);
6434
+ }
6435
+
6436
+ .x-list--gap-.x-list {
6437
+ gap: var(--x-size-gap-list-03);
6438
+ }
6439
+ @media not all and (min-resolution: 0.001dpcm) {
6440
+ .x-list--gap-.x-list {
6441
+ gap: 0;
6442
+ }
6443
+ .x-list--gap-.x-list > *:not(:last-child) {
6444
+ margin-bottom: var(--x-size-gap-list-03);
6445
+ }
6446
+ .x-list--gap-.x-list.x-list--horizontal {
6447
+ gap: 0;
6448
+ }
6449
+ .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
6450
+ margin-right: var(--x-size-gap-list-03);
6451
+ }
6452
+ }
6453
+
6454
+ .x-list--padding-04.x-list {
6455
+ padding: var(--x-size-padding-list-04);
6577
6456
  }
6578
- [dir="ltr"] .x-padding--right-17 {
6579
- padding-right: var(--x-size-base-17) !important;
6457
+
6458
+ .x-list--gap-.x-list {
6459
+ gap: var(--x-size-gap-list-04);
6580
6460
  }
6581
- [dir="rtl"] .x-padding--right-17 {
6582
- padding-left: var(--x-size-base-17) !important;
6461
+ @media not all and (min-resolution: 0.001dpcm) {
6462
+ .x-list--gap-.x-list {
6463
+ gap: 0;
6464
+ }
6465
+ .x-list--gap-.x-list > *:not(:last-child) {
6466
+ margin-bottom: var(--x-size-gap-list-04);
6467
+ }
6468
+ .x-list--gap-.x-list.x-list--horizontal {
6469
+ gap: 0;
6470
+ }
6471
+ .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
6472
+ margin-right: var(--x-size-gap-list-04);
6473
+ }
6583
6474
  }
6584
- [dir="ltr"] .x-padding--left-17 {
6585
- padding-left: var(--x-size-base-17) !important;
6475
+
6476
+ .x-list--padding-05.x-list {
6477
+ padding: var(--x-size-padding-list-05);
6586
6478
  }
6587
- [dir="rtl"] .x-padding--left-17 {
6588
- padding-right: var(--x-size-base-17) !important;
6479
+
6480
+ .x-list--gap-.x-list {
6481
+ gap: var(--x-size-gap-list-05);
6589
6482
  }
6590
- .x-padding--top-18 {
6591
- padding-top: var(--x-size-base-18) !important;
6483
+ @media not all and (min-resolution: 0.001dpcm) {
6484
+ .x-list--gap-.x-list {
6485
+ gap: 0;
6486
+ }
6487
+ .x-list--gap-.x-list > *:not(:last-child) {
6488
+ margin-bottom: var(--x-size-gap-list-05);
6489
+ }
6490
+ .x-list--gap-.x-list.x-list--horizontal {
6491
+ gap: 0;
6492
+ }
6493
+ .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
6494
+ margin-right: var(--x-size-gap-list-05);
6495
+ }
6592
6496
  }
6593
- .x-padding--bottom-18 {
6594
- padding-bottom: var(--x-size-base-18) !important;
6497
+
6498
+ .x-list--padding-06.x-list {
6499
+ padding: var(--x-size-padding-list-06);
6595
6500
  }
6596
- [dir="ltr"] .x-padding--right-18 {
6597
- padding-right: var(--x-size-base-18) !important;
6501
+
6502
+ .x-list--gap-.x-list {
6503
+ gap: var(--x-size-gap-list-06);
6598
6504
  }
6599
- [dir="rtl"] .x-padding--right-18 {
6600
- padding-left: var(--x-size-base-18) !important;
6505
+ @media not all and (min-resolution: 0.001dpcm) {
6506
+ .x-list--gap-.x-list {
6507
+ gap: 0;
6508
+ }
6509
+ .x-list--gap-.x-list > *:not(:last-child) {
6510
+ margin-bottom: var(--x-size-gap-list-06);
6511
+ }
6512
+ .x-list--gap-.x-list.x-list--horizontal {
6513
+ gap: 0;
6514
+ }
6515
+ .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
6516
+ margin-right: var(--x-size-gap-list-06);
6517
+ }
6601
6518
  }
6602
- [dir="ltr"] .x-padding--left-18 {
6603
- padding-left: var(--x-size-base-18) !important;
6519
+
6520
+ .x-list--padding-07.x-list {
6521
+ padding: var(--x-size-padding-list-07);
6604
6522
  }
6605
- [dir="rtl"] .x-padding--left-18 {
6606
- padding-right: var(--x-size-base-18) !important;
6523
+
6524
+ .x-list--gap-.x-list {
6525
+ gap: var(--x-size-gap-list-07);
6607
6526
  }
6608
- .x-padding--top-19 {
6609
- padding-top: var(--x-size-base-19) !important;
6527
+ @media not all and (min-resolution: 0.001dpcm) {
6528
+ .x-list--gap-.x-list {
6529
+ gap: 0;
6530
+ }
6531
+ .x-list--gap-.x-list > *:not(:last-child) {
6532
+ margin-bottom: var(--x-size-gap-list-07);
6533
+ }
6534
+ .x-list--gap-.x-list.x-list--horizontal {
6535
+ gap: 0;
6536
+ }
6537
+ .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
6538
+ margin-right: var(--x-size-gap-list-07);
6539
+ }
6610
6540
  }
6611
- .x-padding--bottom-19 {
6612
- padding-bottom: var(--x-size-base-19) !important;
6541
+
6542
+ .x-list--padding-08.x-list {
6543
+ padding: var(--x-size-padding-list-08);
6613
6544
  }
6614
- [dir="ltr"] .x-padding--right-19 {
6615
- padding-right: var(--x-size-base-19) !important;
6545
+
6546
+ .x-list--gap-.x-list {
6547
+ gap: var(--x-size-gap-list-08);
6616
6548
  }
6617
- [dir="rtl"] .x-padding--right-19 {
6618
- padding-left: var(--x-size-base-19) !important;
6549
+ @media not all and (min-resolution: 0.001dpcm) {
6550
+ .x-list--gap-.x-list {
6551
+ gap: 0;
6552
+ }
6553
+ .x-list--gap-.x-list > *:not(:last-child) {
6554
+ margin-bottom: var(--x-size-gap-list-08);
6555
+ }
6556
+ .x-list--gap-.x-list.x-list--horizontal {
6557
+ gap: 0;
6558
+ }
6559
+ .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
6560
+ margin-right: var(--x-size-gap-list-08);
6561
+ }
6619
6562
  }
6620
- [dir="ltr"] .x-padding--left-19 {
6621
- padding-left: var(--x-size-base-19) !important;
6563
+
6564
+ .x-list--padding-09.x-list {
6565
+ padding: var(--x-size-padding-list-09);
6622
6566
  }
6623
- [dir="rtl"] .x-padding--left-19 {
6624
- padding-right: var(--x-size-base-19) !important;
6567
+
6568
+ .x-list--gap-.x-list {
6569
+ gap: var(--x-size-gap-list-09);
6625
6570
  }
6626
- .x-padding--top-20 {
6627
- padding-top: var(--x-size-base-20) !important;
6571
+ @media not all and (min-resolution: 0.001dpcm) {
6572
+ .x-list--gap-.x-list {
6573
+ gap: 0;
6574
+ }
6575
+ .x-list--gap-.x-list > *:not(:last-child) {
6576
+ margin-bottom: var(--x-size-gap-list-09);
6577
+ }
6578
+ .x-list--gap-.x-list.x-list--horizontal {
6579
+ gap: 0;
6580
+ }
6581
+ .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
6582
+ margin-right: var(--x-size-gap-list-09);
6583
+ }
6628
6584
  }
6629
- .x-padding--bottom-20 {
6630
- padding-bottom: var(--x-size-base-20) !important;
6585
+
6586
+ .x-list--padding-10.x-list {
6587
+ padding: var(--x-size-padding-list-10);
6631
6588
  }
6632
- [dir="ltr"] .x-padding--right-20 {
6633
- padding-right: var(--x-size-base-20) !important;
6589
+
6590
+ .x-list--gap-.x-list {
6591
+ gap: var(--x-size-gap-list-10);
6634
6592
  }
6635
- [dir="rtl"] .x-padding--right-20 {
6636
- padding-left: var(--x-size-base-20) !important;
6593
+ @media not all and (min-resolution: 0.001dpcm) {
6594
+ .x-list--gap-.x-list {
6595
+ gap: 0;
6596
+ }
6597
+ .x-list--gap-.x-list > *:not(:last-child) {
6598
+ margin-bottom: var(--x-size-gap-list-10);
6599
+ }
6600
+ .x-list--gap-.x-list.x-list--horizontal {
6601
+ gap: 0;
6602
+ }
6603
+ .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
6604
+ margin-right: var(--x-size-gap-list-10);
6605
+ }
6637
6606
  }
6638
- [dir="ltr"] .x-padding--left-20 {
6639
- padding-left: var(--x-size-base-20) !important;
6607
+
6608
+ .x-list--padding-11.x-list {
6609
+ padding: var(--x-size-padding-list-11);
6640
6610
  }
6641
- [dir="rtl"] .x-padding--left-20 {
6642
- padding-right: var(--x-size-base-20) !important;
6611
+
6612
+ .x-list--gap-.x-list {
6613
+ gap: var(--x-size-gap-list-11);
6643
6614
  }
6644
- .x-static {
6645
- position: static !important;
6615
+ @media not all and (min-resolution: 0.001dpcm) {
6616
+ .x-list--gap-.x-list {
6617
+ gap: 0;
6618
+ }
6619
+ .x-list--gap-.x-list > *:not(:last-child) {
6620
+ margin-bottom: var(--x-size-gap-list-11);
6621
+ }
6622
+ .x-list--gap-.x-list.x-list--horizontal {
6623
+ gap: 0;
6624
+ }
6625
+ .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
6626
+ margin-right: var(--x-size-gap-list-11);
6627
+ }
6646
6628
  }
6647
6629
 
6648
- .x-fixed {
6649
- position: fixed !important;
6630
+ .x-list--padding-12.x-list {
6631
+ padding: var(--x-size-padding-list-12);
6650
6632
  }
6651
6633
 
6652
- .x-absolute {
6653
- position: absolute !important;
6634
+ .x-list--gap-.x-list {
6635
+ gap: var(--x-size-gap-list-12);
6654
6636
  }
6655
-
6656
- .x-relative {
6657
- position: relative !important;
6637
+ @media not all and (min-resolution: 0.001dpcm) {
6638
+ .x-list--gap-.x-list {
6639
+ gap: 0;
6640
+ }
6641
+ .x-list--gap-.x-list > *:not(:last-child) {
6642
+ margin-bottom: var(--x-size-gap-list-12);
6643
+ }
6644
+ .x-list--gap-.x-list.x-list--horizontal {
6645
+ gap: 0;
6646
+ }
6647
+ .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
6648
+ margin-right: var(--x-size-gap-list-12);
6649
+ }
6658
6650
  }
6659
6651
 
6660
- .x-sticky {
6661
- position: sticky !important;
6652
+ .x-list--padding-13.x-list {
6653
+ padding: var(--x-size-padding-list-13);
6662
6654
  }
6663
6655
 
6664
- .x-facet--line.x-facet,
6665
- .x-facet--line .x-facet {
6666
- --x-color-border-facet-header-default: var(--x-color-border-facet-header-line);
6667
- --x-size-border-width-facet-header-default: var(--x-size-border-width-facet-header-line);
6668
- --x-size-border-width-top-facet-header-default: var(--x-size-border-width-top-facet-header-line);
6669
- --x-size-border-width-right-facet-header-default: var(--x-size-border-width-right-facet-header-line);
6670
- --x-size-border-width-bottom-facet-header-default: var(--x-size-border-width-bottom-facet-header-line);
6671
- --x-size-border-width-left-facet-header-default: var(--x-size-border-width-left-facet-header-line);
6656
+ .x-list--gap-.x-list {
6657
+ gap: var(--x-size-gap-list-13);
6658
+ }
6659
+ @media not all and (min-resolution: 0.001dpcm) {
6660
+ .x-list--gap-.x-list {
6661
+ gap: 0;
6662
+ }
6663
+ .x-list--gap-.x-list > *:not(:last-child) {
6664
+ margin-bottom: var(--x-size-gap-list-13);
6665
+ }
6666
+ .x-list--gap-.x-list.x-list--horizontal {
6667
+ gap: 0;
6668
+ }
6669
+ .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
6670
+ margin-right: var(--x-size-gap-list-13);
6671
+ }
6672
6672
  }
package/docs/API-reference/api/x-components.historyquery.md CHANGED
@@ -9,9 +9,9 @@ This component renders a history query suggestion combining two buttons: one for
9
9
  <b>Signature:</b>
10
10
 
11
11
  ```typescript
12
- export default class HistoryQuery extends Vue
12
+ export default class HistoryQuery extends HistoryQuery_base
13
13
  ```
14
- <b>Extends:</b> Vue
14
+ <b>Extends:</b> HistoryQuery\_base
15
15
 
16
16
  ## Properties
17
17
 
package/js/x-modules/history-queries/components/history-query.vue.js CHANGED
@@ -52,6 +52,7 @@ var __vue_render__ = function () {
52
52
  "RemoveHistoryQuery",
53
53
  {
54
54
  staticClass: "x-history-query__remove x-suggestion-group-button",
55
+ class: _vm.removeHistoryQueryClass,
55
56
  attrs: {
56
57
  historyQuery: _vm.suggestion,
57
58
  "data-test": "remove-history-query",
package/js/x-modules/history-queries/components/history-query.vue.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"history-query.vue.js","sources":["../../../../../src/x-modules/history-queries/components/history-query.vue"],"sourcesContent":["<template>\n <div class=\"x-history-query x-suggestion-group\">\n <BaseSuggestion\n class=\"x-history-query__suggestion\"\n v-bind=\"{ suggestion, suggestionSelectedEvents, query }\"\n data-test=\"history-query\"\n feature=\"history_query\"\n #default=\"baseScope\"\n >\n <!-- eslint-disable max-len -->\n <!--\n @slot History Query content\n @binding {Object} v-bind - `BaseSuggestion` default slot scope: **suggestion** <code>Suggestion</code> - Suggestion data<br /> **query** <code>string</code> - The query that the suggestion belongs to<br /> **filter** <code>Filter \\| undefined</code> - Suggestion's filter\n -->\n <!-- eslint-enable max-len -->\n <slot v-bind=\"{ ...baseScope }\" />\n </BaseSuggestion>\n <RemoveHistoryQuery\n class=\"x-history-query__remove x-suggestion-group-button\"\n :historyQuery=\"suggestion\"\n data-test=\"remove-history-query\"\n >\n <!--\n @slot History Query remove button content\n @binding {Suggestion} suggestion - History Query suggestion data\n -->\n <slot name=\"remove-button-content\" v-bind=\"{ suggestion }\">✕</slot>\n </RemoveHistoryQuery>\n </div>\n</template>\n\n<script lang=\"ts\">\n import { HistoryQuery as HistoryQueryModel } from '@empathyco/x-types';\n import Vue from 'vue';\n import { Component, Prop } from 'vue-property-decorator';\n import { Getter } from '../../../components/decorators/store.decorators';\n import Highlight from '../../../components/highlight.vue';\n import BaseSuggestion from '../../../components/suggestions/base-suggestion.vue';\n import { xComponentMixin } from '../../../components/x-component.mixin';\n import { XEventsTypes } from '../../../wiring/events.types';\n import { historyQueriesXModule } from '../x-module';\n import RemoveHistoryQuery from './remove-history-query.vue';\n\n /**\n * This component renders a history query suggestion combining two buttons: one for selecting this\n * suggestion as the search query, and another one to remove this query suggestion from the\n * history queries.\n *\n * @public\n */\n @Component({\n mixins: [xComponentMixin(historyQueriesXModule)],\n components: { Highlight, RemoveHistoryQuery, BaseSuggestion }\n })\n export default class HistoryQuery extends Vue {\n /**\n * The history query suggestion to render.\n *\n * @public\n */\n @Prop({ required: true })\n protected suggestion!: HistoryQueryModel;\n\n /**\n * The normalized query of the history-queries module.\n *\n * @internal\n */\n @Getter('historyQueries', 'normalizedQuery')\n public query!: string;\n\n /**\n * The list of events that are going to be emitted when the suggestion button is pressed.\n *\n * @internal\n * @returns The {@link XEvent | XEvents} to emit.\n */\n protected get suggestionSelectedEvents(): Partial<XEventsTypes> {\n return {\n UserSelectedAHistoryQuery: this.suggestion\n };\n }\n }\n</script>\n\n<docs lang=\"mdx\">\n## Examples\n\n### Basic usage\n\nThis component only requires a prop called `suggestion`\n\n```vue live\n<template>\n <HistoryQuery :suggestion=\"suggestion\" />\n</template>\n\n<script>\n import { HistoryQuery } from '@empathyco/x-components/history-queries';\n export default {\n name: 'HistoryQueryDemo',\n components: {\n HistoryQuery\n },\n data() {\n return {\n suggestion: {\n modelName: 'HistoryQuery',\n query: 'trousers',\n facets: []\n }\n };\n }\n };\n</script>\n```\n\n### Customizing slots content\n\nSuggestion and remove buttons contents can be customized.\n\nThe default slot allows you to replace the content of the suggestion button. It has two properties,\nthe suggestion itself, and a `string` of HTML with the matched query.\n\nThe other slot is called `remove-button-content`, and allows you to set the content of the button\nthat serves to remove this query from the history. This slot only has one property, the suggestion.\n\n```vue live\n<template>\n <HistoryQuery :suggestion=\"suggestion\">\n <template #default=\"{ suggestion }\">\n <HistoryIcon />\n <Highlight highlight=\"tro\" :text=\"suggestion.query\" />\n </template>\n\n <template #remove-button-content=\"{ suggestion }\">\n <CrossIcon />\n </template>\n </HistoryQuery>\n</template>\n\n<script>\n import { HistoryQuery } from '@empathyco/x-components/history-queries';\n import { HistoryIcon, CrossIcon, Highlight } from '@empathyco/x-components';\n\n export default {\n name: 'HistoryQueryDemo',\n components: {\n HistoryQuery,\n HistoryIcon,\n CrossIcon,\n Highlight\n },\n data() {\n return {\n suggestion: {\n modelName: 'HistoryQuery',\n query: 'trousers',\n facets: []\n }\n };\n }\n };\n</script>\n```\n\n## Events\n\nA list of events that the component will emit:\n\n- `UserSelectedAHistoryQuery`: the event is emitted after the user clicks the button. The event\n payload is the history query data.\n</docs>\n"],"names":[],"mappings":";;;;AAEA,MAAc,cAAA,GAAA,OAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"history-query.vue.js","sources":["../../../../../src/x-modules/history-queries/components/history-query.vue"],"sourcesContent":["<template>\n <div class=\"x-history-query x-suggestion-group\">\n <BaseSuggestion\n class=\"x-history-query__suggestion\"\n v-bind=\"{ suggestion, suggestionSelectedEvents, query }\"\n data-test=\"history-query\"\n feature=\"history_query\"\n #default=\"baseScope\"\n >\n <!-- eslint-disable max-len -->\n <!--\n @slot History Query content\n @binding {Object} v-bind - `BaseSuggestion` default slot scope: **suggestion** <code>Suggestion</code> - Suggestion data<br /> **query** <code>string</code> - The query that the suggestion belongs to<br /> **filter** <code>Filter \\| undefined</code> - Suggestion's filter\n -->\n <!-- eslint-enable max-len -->\n <slot v-bind=\"{ ...baseScope }\" />\n </BaseSuggestion>\n <RemoveHistoryQuery\n class=\"x-history-query__remove x-suggestion-group-button\"\n :class=\"removeHistoryQueryClass\"\n :historyQuery=\"suggestion\"\n data-test=\"remove-history-query\"\n >\n <!--\n @slot History Query remove button content\n @binding {Suggestion} suggestion - History Query suggestion data\n -->\n <slot name=\"remove-button-content\" v-bind=\"{ suggestion }\">✕</slot>\n </RemoveHistoryQuery>\n </div>\n</template>\n\n<script lang=\"ts\">\n import { HistoryQuery as HistoryQueryModel } from '@empathyco/x-types';\n import { Component, Mixins, Prop } from 'vue-property-decorator';\n import { Getter } from '../../../components/decorators/store.decorators';\n import Highlight from '../../../components/highlight.vue';\n import BaseSuggestion from '../../../components/suggestions/base-suggestion.vue';\n import { xComponentMixin } from '../../../components/x-component.mixin';\n import { XEventsTypes } from '../../../wiring/events.types';\n import { historyQueriesXModule } from '../x-module';\n import { dynamicPropsMixin } from '../../../components/dynamic-props.mixin';\n import RemoveHistoryQuery from './remove-history-query.vue';\n\n /**\n * This component renders a history query suggestion combining two buttons: one for selecting this\n * suggestion as the search query, and another one to remove this query suggestion from the\n * history queries.\n *\n * @public\n */\n @Component({\n mixins: [xComponentMixin(historyQueriesXModule)],\n components: { Highlight, RemoveHistoryQuery, BaseSuggestion }\n })\n export default class HistoryQuery extends Mixins(dynamicPropsMixin(['removeHistoryQueryClass'])) {\n /**\n * The history query suggestion to render.\n *\n * @public\n */\n @Prop({ required: true })\n protected suggestion!: HistoryQueryModel;\n\n /**\n * The normalized query of the history-queries module.\n *\n * @internal\n */\n @Getter('historyQueries', 'normalizedQuery')\n public query!: string;\n\n /**\n * The list of events that are going to be emitted when the suggestion button is pressed.\n *\n * @internal\n * @returns The {@link XEvent | XEvents} to emit.\n */\n protected get suggestionSelectedEvents(): Partial<XEventsTypes> {\n return {\n UserSelectedAHistoryQuery: this.suggestion\n };\n }\n }\n</script>\n\n<docs lang=\"mdx\">\n## Examples\n\n### Basic usage\n\nThis component only requires a prop called `suggestion`\n\n```vue live\n<template>\n <HistoryQuery :suggestion=\"suggestion\" />\n</template>\n\n<script>\n import { HistoryQuery } from '@empathyco/x-components/history-queries';\n export default {\n name: 'HistoryQueryDemo',\n components: {\n HistoryQuery\n },\n data() {\n return {\n suggestion: {\n modelName: 'HistoryQuery',\n query: 'trousers',\n facets: []\n }\n };\n }\n };\n</script>\n```\n\n### Customizing slots content\n\nSuggestion and remove buttons contents can be customized.\n\nThe default slot allows you to replace the content of the suggestion button. It has two properties,\nthe suggestion itself, and a `string` of HTML with the matched query.\n\nThe other slot is called `remove-button-content`, and allows you to set the content of the button\nthat serves to remove this query from the history. This slot only has one property, the suggestion.\n\n```vue live\n<template>\n <HistoryQuery :suggestion=\"suggestion\">\n <template #default=\"{ suggestion }\">\n <HistoryIcon />\n <Highlight highlight=\"tro\" :text=\"suggestion.query\" />\n </template>\n\n <template #remove-button-content=\"{ suggestion }\">\n <CrossIcon />\n </template>\n </HistoryQuery>\n</template>\n\n<script>\n import { HistoryQuery } from '@empathyco/x-components/history-queries';\n import { HistoryIcon, CrossIcon, Highlight } from '@empathyco/x-components';\n\n export default {\n name: 'HistoryQueryDemo',\n components: {\n HistoryQuery,\n HistoryIcon,\n CrossIcon,\n Highlight\n },\n data() {\n return {\n suggestion: {\n modelName: 'HistoryQuery',\n query: 'trousers',\n facets: []\n }\n };\n }\n };\n</script>\n```\n\n## Events\n\nA list of events that the component will emit:\n\n- `UserSelectedAHistoryQuery`: the event is emitted after the user clicks the button. The event\n payload is the history query data.\n</docs>\n"],"names":[],"mappings":";;;;AAEA,MAAc,cAAA,GAAA,OAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/js/x-modules/history-queries/components/history-query.vue_rollup-plugin-vue_script.vue.js CHANGED
@@ -1,11 +1,11 @@
1
1
  import { __decorate } from 'tslib';
2
- import Vue from 'vue';
3
- import { Prop, Component } from 'vue-property-decorator';
2
+ import { Mixins, Prop, Component } from 'vue-property-decorator';
4
3
  import { Getter } from '../../../components/decorators/store.decorators.js';
5
4
  import __vue_component__ from '../../../components/highlight.vue.js';
6
5
  import __vue_component__$2 from '../../../components/suggestions/base-suggestion.vue.js';
7
6
  import { xComponentMixin } from '../../../components/x-component.mixin.js';
8
7
  import { historyQueriesXModule } from '../x-module.js';
8
+ import { dynamicPropsMixin } from '../../../components/dynamic-props.mixin.js';
9
9
  import __vue_component__$1 from './remove-history-query.vue.js';
10
10
 
11
11
  /**
@@ -15,7 +15,7 @@ import __vue_component__$1 from './remove-history-query.vue.js';
15
15
  *
16
16
  * @public
17
17
  */
18
- let HistoryQuery = class HistoryQuery extends Vue {
18
+ let HistoryQuery = class HistoryQuery extends Mixins(dynamicPropsMixin(['removeHistoryQueryClass'])) {
19
19
  /**
20
20
  * The list of events that are going to be emitted when the suggestion button is pressed.
21
21
  *
package/js/x-modules/history-queries/components/history-query.vue_rollup-plugin-vue_script.vue.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"history-query.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../src/x-modules/history-queries/components/history-query.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\n\n\n\n\n\n\n\n\n\n\n\n import { HistoryQuery as HistoryQueryModel } from '@empathyco/x-types';\n import Vue from 'vue';\n import { Component, Prop } from 'vue-property-decorator';\n import { Getter } from '../../../components/decorators/store.decorators';\n import Highlight from '../../../components/highlight.vue';\n import BaseSuggestion from '../../../components/suggestions/base-suggestion.vue';\n import { xComponentMixin } from '../../../components/x-component.mixin';\n import { XEventsTypes } from '../../../wiring/events.types';\n import { historyQueriesXModule } from '../x-module';\n import RemoveHistoryQuery from './remove-history-query.vue';\n\n /**\n * This component renders a history query suggestion combining two buttons: one for selecting this\n * suggestion as the search query, and another one to remove this query suggestion from the\n * history queries.\n *\n * @public\n */\n @Component({\n mixins: [xComponentMixin(historyQueriesXModule)],\n components: { Highlight, RemoveHistoryQuery, BaseSuggestion }\n })\n export default class HistoryQuery extends Vue {\n /**\n * The history query suggestion to render.\n *\n * @public\n */\n @Prop({ required: true })\n protected suggestion!: HistoryQueryModel;\n\n /**\n * The normalized query of the history-queries module.\n *\n * @internal\n */\n @Getter('historyQueries', 'normalizedQuery')\n public query!: string;\n\n /**\n * The list of events that are going to be emitted when the suggestion button is pressed.\n *\n * @internal\n * @returns The {@link XEvent | XEvents} to emit.\n */\n protected get suggestionSelectedEvents(): Partial<XEventsTypes> {\n return {\n UserSelectedAHistoryQuery: this.suggestion\n };\n }\n }\n"],"names":["Highlight","RemoveHistoryQuery","BaseSuggestion"],"mappings":";;;;;;;;;;AA2CE;;;;;;AAMG;AAKH,IAAqB,YAAY,GAAjC,MAAqB,YAAa,SAAQ,GAAG,CAAA;AAiB3C;;;;;AAKG;AACH,IAAA,IAAc,wBAAwB,GAAA;QACpC,OAAO;YACL,yBAAyB,EAAE,IAAI,CAAC,UAAU;SAC3C,CAAC;KACH;CACF,CAAA;AArBC,UAAA,CAAA;AADC,IAAA,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;AACgB,CAAA,EAAA,YAAA,CAAA,SAAA,EAAA,YAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAQzC,UAAA,CAAA;AADC,IAAA,MAAM,CAAC,gBAAgB,EAAE,iBAAiB,CAAC;AACtB,CAAA,EAAA,YAAA,CAAA,SAAA,EAAA,OAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAfH,YAAY,GAAA,UAAA,CAAA;AAJhC,IAAA,SAAS,CAAC;AACT,QAAA,MAAM,EAAE,CAAC,eAAe,CAAC,qBAAqB,CAAC,CAAC;AAChD,QAAA,UAAU,EAAE,aAAEA,iBAAS,sBAAEC,mBAAkB,kBAAEC,mBAAc,EAAE;KAC9D,CAAC;AACmB,CAAA,EAAA,YAAY,CA4BhC,CAAA;aA5BoB,YAAY;;;;"}
1
+ {"version":3,"file":"history-query.vue_rollup-plugin-vue_script.vue.js","sources":["../../../../../src/x-modules/history-queries/components/history-query.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\n\n\n\n\n\n\n\n\n\n\n\n\n import { HistoryQuery as HistoryQueryModel } from '@empathyco/x-types';\n import { Component, Mixins, Prop } from 'vue-property-decorator';\n import { Getter } from '../../../components/decorators/store.decorators';\n import Highlight from '../../../components/highlight.vue';\n import BaseSuggestion from '../../../components/suggestions/base-suggestion.vue';\n import { xComponentMixin } from '../../../components/x-component.mixin';\n import { XEventsTypes } from '../../../wiring/events.types';\n import { historyQueriesXModule } from '../x-module';\n import { dynamicPropsMixin } from '../../../components/dynamic-props.mixin';\n import RemoveHistoryQuery from './remove-history-query.vue';\n\n /**\n * This component renders a history query suggestion combining two buttons: one for selecting this\n * suggestion as the search query, and another one to remove this query suggestion from the\n * history queries.\n *\n * @public\n */\n @Component({\n mixins: [xComponentMixin(historyQueriesXModule)],\n components: { Highlight, RemoveHistoryQuery, BaseSuggestion }\n })\n export default class HistoryQuery extends Mixins(dynamicPropsMixin(['removeHistoryQueryClass'])) {\n /**\n * The history query suggestion to render.\n *\n * @public\n */\n @Prop({ required: true })\n protected suggestion!: HistoryQueryModel;\n\n /**\n * The normalized query of the history-queries module.\n *\n * @internal\n */\n @Getter('historyQueries', 'normalizedQuery')\n public query!: string;\n\n /**\n * The list of events that are going to be emitted when the suggestion button is pressed.\n *\n * @internal\n * @returns The {@link XEvent | XEvents} to emit.\n */\n protected get suggestionSelectedEvents(): Partial<XEventsTypes> {\n return {\n UserSelectedAHistoryQuery: this.suggestion\n };\n }\n }\n"],"names":["Highlight","RemoveHistoryQuery","BaseSuggestion"],"mappings":";;;;;;;;;;AA4CE;;;;;;AAMG;AAKH,IAAqB,YAAY,GAAjC,MAAqB,YAAa,SAAQ,MAAM,CAAC,iBAAiB,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,CAAA;AAiB9F;;;;;AAKG;AACH,IAAA,IAAc,wBAAwB,GAAA;QACpC,OAAO;YACL,yBAAyB,EAAE,IAAI,CAAC,UAAU;SAC3C,CAAC;KACH;CACF,CAAA;AArBC,UAAA,CAAA;AADC,IAAA,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC;AACgB,CAAA,EAAA,YAAA,CAAA,SAAA,EAAA,YAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAQzC,UAAA,CAAA;AADC,IAAA,MAAM,CAAC,gBAAgB,EAAE,iBAAiB,CAAC;AACtB,CAAA,EAAA,YAAA,CAAA,SAAA,EAAA,OAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAfH,YAAY,GAAA,UAAA,CAAA;AAJhC,IAAA,SAAS,CAAC;AACT,QAAA,MAAM,EAAE,CAAC,eAAe,CAAC,qBAAqB,CAAC,CAAC;AAChD,QAAA,UAAU,EAAE,aAAEA,iBAAS,sBAAEC,mBAAkB,kBAAEC,mBAAc,EAAE;KAC9D,CAAC;AACmB,CAAA,EAAA,YAAY,CA4BhC,CAAA;aA5BoB,YAAY;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@empathyco/x-components",
3
- "version": "3.0.0-alpha.280",
3
+ "version": "3.0.0-alpha.281",
4
4
  "description": "Empathy X Components",
5
5
  "author": "Empathy Systems Corporation S.L.",
6
6
  "license": "Apache-2.0",
@@ -138,5 +138,5 @@
138
138
  "access": "public",
139
139
  "directory": "dist"
140
140
  },
141
- "gitHead": "f0bad0fbb957dc37b0d261e6b231abfa90e9ab56"
141
+ "gitHead": "080fb2c284455fd577e7284b728db0227cdb90a9"
142
142
  }
package/report/x-components.api.json CHANGED
@@ -22808,8 +22808,8 @@
22808
22808
  },
22809
22809
  {
22810
22810
  "kind": "Reference",
22811
- "text": "Vue",
22812
- "canonicalReference": "vue!Vue:interface"
22811
+ "text": "HistoryQuery_base",
22812
+ "canonicalReference": "@empathyco/x-components!~HistoryQuery_base"
22813
22813
  },
22814
22814
  {
22815
22815
  "kind": "Content",
package/report/x-components.api.md CHANGED
@@ -2146,8 +2146,10 @@ export type HistoryQueriesXStoreModule = XStoreModule<HistoryQueriesState, Histo
2146
2146
  // @internal
2147
2147
  export const historyQueriesXStoreModule: HistoryQueriesXStoreModule;
2148
2148
 
2149
+ // Warning: (ae-forgotten-export) The symbol "HistoryQuery_base" needs to be exported by the entry point index.d.ts
2150
+ //
2149
2151
  // @public
2150
- export class HistoryQuery extends Vue_2 {
2152
+ export class HistoryQuery extends HistoryQuery_base {
2151
2153
  // @internal
2152
2154
  query: string;
2153
2155
  protected suggestion: HistoryQuery_2;
package/types/x-modules/history-queries/components/history-query.vue.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { HistoryQuery as HistoryQueryModel } from '@empathyco/x-types';
2
- import Vue from 'vue';
3
2
  import { XEventsTypes } from '../../../wiring/events.types';
3
+ declare const HistoryQuery_base: import("vue-class-component/lib/declarations").VueClass<object & import("vue/types/v3-component-options").ExtractComputedReturns<{}> & Record<never, any> & Partial<Record<"removeHistoryQueryClass", string>> & import("vue").ShallowUnwrapRef<{}>>;
4
4
  /**
5
5
  * This component renders a history query suggestion combining two buttons: one for selecting this
6
6
  * suggestion as the search query, and another one to remove this query suggestion from the
@@ -8,7 +8,7 @@ import { XEventsTypes } from '../../../wiring/events.types';
8
8
  *
9
9
  * @public
10
10
  */
11
- export default class HistoryQuery extends Vue {
11
+ export default class HistoryQuery extends HistoryQuery_base {
12
12
  /**
13
13
  * The history query suggestion to render.
14
14
  *
@@ -29,4 +29,5 @@ export default class HistoryQuery extends Vue {
29
29
  */
30
30
  protected get suggestionSelectedEvents(): Partial<XEventsTypes>;
31
31
  }
32
+ export {};
32
33
  //# sourceMappingURL=history-query.vue?rollup-plugin-vue=script.d.ts.map
package/types/x-modules/history-queries/components/history-query.vue.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"history-query.vue?rollup-plugin-vue=script.d.ts","sourceRoot":"","sources":["../../../../../src/x-modules/history-queries/components/history-query.vue?rollup-plugin-vue=script.ts"],"names":[],"mappings":"AAgCE,OAAO,EAAE,YAAY,IAAI,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AACvE,OAAO,GAAG,MAAM,KAAK,CAAC;AAMtB,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAI5D;;;;;;GAMG;AAKH,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,GAAG;IAC3C;;;;OAIG;IAEH,SAAS,CAAC,UAAU,EAAG,iBAAiB,CAAC;IAEzC;;;;OAIG;IAEI,KAAK,EAAG,MAAM,CAAC;IAEtB;;;;;OAKG;IACH,SAAS,KAAK,wBAAwB,IAAI,OAAO,CAAC,YAAY,CAAC,CAI9D;CACF"}
1
+ {"version":3,"file":"history-query.vue?rollup-plugin-vue=script.d.ts","sourceRoot":"","sources":["../../../../../src/x-modules/history-queries/components/history-query.vue?rollup-plugin-vue=script.ts"],"names":[],"mappings":"AAiCE,OAAO,EAAE,YAAY,IAAI,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAMvE,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;;AAK5D;;;;;;GAMG;AAKH,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,iBAAsD;IAC9F;;;;OAIG;IAEH,SAAS,CAAC,UAAU,EAAG,iBAAiB,CAAC;IAEzC;;;;OAIG;IAEI,KAAK,EAAG,MAAM,CAAC;IAEtB;;;;;OAKG;IACH,SAAS,KAAK,wBAAwB,IAAI,OAAO,CAAC,YAAY,CAAC,CAI9D;CACF"}