@xh/hoist 67.0.0-SNAPSHOT.1725050021281 → 67.0.0-SNAPSHOT.1725050289733

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.
package/CHANGELOG.md CHANGED
@@ -2,6 +2,10 @@
2
2
 
3
3
  ## 67.0.0-SNAPSHOT - unreleased
4
4
 
5
+ ### 💥 Breaking Changes
6
+
7
+ * Requires `hoist-core >= 21.0`.
8
+
5
9
  ### 🎁 New Features
6
10
 
7
11
  * Added support for Correlation IDs across fetch requests and error / activity tracking:
@@ -33,9 +37,9 @@
33
37
  * Fixed bug where a role with a dot in its name could not be deleted.
34
38
  * Fixed `SelectEditor` to ensure new value is flushed before editing stops.
35
39
 
36
- ### 💥 Breaking Changes
40
+ ### Styles
37
41
 
38
- * Requires `hoist-core >= 21.0`.
42
+ * Added CSS variables to support customization of `Badge` component styling.
39
43
 
40
44
  ### ⚙️ Technical
41
45
 
@@ -10,16 +10,16 @@
10
10
  justify-content: center;
11
11
  align-items: center;
12
12
  align-self: center;
13
- font-size: 0.75em;
13
+ font-size: var(--xh-badge-font-size);
14
14
  font-weight: bold;
15
- border-radius: 4px;
15
+ border-radius: var(--xh-badge-border-radius);
16
16
  margin-left: 5px;
17
- padding: 0 4px;
18
- height: 1.6em;
17
+ padding: var(--xh-badge-padding);
18
+ height: var(--xh-badge-height);
19
19
  width: fit-content;
20
- min-width: 15px;
21
- background-color: var(--xh-blue-gray);
22
- color: white;
20
+ min-width: var(--xh-badge-min-width);
21
+ background-color: var(--xh-badge-bg);
22
+ color: var(--xh-badge-text-color);
23
23
 
24
24
  &--compact {
25
25
  font-size: 0.5em;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@xh/hoist",
3
- "version": "67.0.0-SNAPSHOT.1725050021281",
3
+ "version": "67.0.0-SNAPSHOT.1725050289733",
4
4
  "description": "Hoist add-on for building and deploying React Applications.",
5
5
  "repository": "github:xh/hoist-react",
6
6
  "homepage": "https://xh.io",
package/styles/vars.scss CHANGED
@@ -254,6 +254,16 @@ body {
254
254
  --xh-bg-highlight: var(--bg-highlight, hsl(200, 50%, 27%));
255
255
  }
256
256
 
257
+ //-----------------------------------------
258
+ // Badges
259
+ //-----------------------------------------
260
+ --xh-badge-bg: var(--badge-bg, var(--xh-blue-gray));
261
+ --xh-badge-border-radius: var(--badge-border-radius, var(--xh-border-radius-px));
262
+ --xh-badge-font-size: var(--badge-font-size, 0.75em);
263
+ --xh-badge-height: var(--badge-height, 1.6em);
264
+ --xh-badge-min-width: var(--badge-min-width, 15px);
265
+ --xh-badge-padding: var(--badge-padding, #{0 4px});
266
+ --xh-badge-text-color: var(--badge-text-color, white);
257
267
 
258
268
  //------------------------
259
269
  // Borders