@gooddata/sdk-ui-kit 11.50.0-alpha.2 → 11.50.0-alpha.3

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 (6) hide show
  1. package/esm/Header/Header.d.ts.map +1 -1
  2. package/esm/Header/Header.js +3 -17
  3. package/esm/Header/headerCss.d.ts +16 -0
  4. package/esm/Header/headerCss.d.ts.map +1 -0
  5. package/esm/Header/headerCss.js +34 -0
  6. package/package.json +11 -11
package/esm/Header/Header.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../src/Header/Header.tsx"],"names":[],"mappings":"AAiCA,OAAO,EAAE,KAAK,eAAe,EAA8C,MAAM,cAAc,CAAC;AAyBhG;;GAEG;AACH,eAAO,MAAM,SAAS,kGAulBpB,CAAC"}
1
+ {"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../src/Header/Header.tsx"],"names":[],"mappings":"AA2BA,OAAO,EAAE,KAAK,eAAe,EAA8C,MAAM,cAAc,CAAC;AAyBhG;;GAEG;AACH,eAAO,MAAM,SAAS,kGAokBpB,CAAC"}
package/esm/Header/Header.js CHANGED
@@ -12,10 +12,10 @@ import { Overlay } from "../Overlay/Overlay.js";
12
12
  import { Typography } from "../Typography/Typography.js";
13
13
  import { removeFromDom } from "../utils/domUtilities.js";
14
14
  import { addCssToStylesheet } from "./addCssToStylesheet.js";
15
- import { getItemActiveColor, getItemHoverColor, getSeparatorColor, getTextColor, getWorkspacePickerHoverColor, } from "./colors.js";
16
15
  import { LOGOUT_MENU_ITEM_ID } from "./generateHeaderAccountMenuItems.js";
17
16
  import { HeaderAccount } from "./HeaderAccount.js";
18
17
  import { HeaderChatButton } from "./HeaderChatButton.js";
18
+ import { createHeaderCssRules } from "./headerCss.js";
19
19
  import { HeaderHelp } from "./HeaderHelp.js";
20
20
  import { HeaderMenu } from "./HeaderMenu.js";
21
21
  import { HeaderSearchButton } from "./HeaderSearchButton.js";
@@ -134,22 +134,8 @@ export const AppHeader = withTheme(function AppHeader({ logoHref = "/", accountM
134
134
  }, [resizeHandler]);
135
135
  const createStyles = useCallback(() => {
136
136
  const { guid } = state;
137
- const textColor = getTextColor(headerTextColor ?? "", headerColor ?? "");
138
- const itemActiveColor = getItemActiveColor(activeColor ?? "", headerColor ?? "");
139
- const itemHoverColor = getItemHoverColor(headerColor ?? "", activeColor ?? "");
140
- const separatorColor = getSeparatorColor(headerColor ?? "", activeColor ?? "");
141
- const workspacesPickerHoverColor = getWorkspacePickerHoverColor(headerColor ?? "");
142
- const css = [];
143
- css.push(`.${guid} { color: ${textColor}; background: ${headerColor}}`);
144
- css.push(`.${guid} .gd-header-menu-section { border-color: ${separatorColor}}`);
145
- css.push(`.${guid} .gd-header-menu-item:hover { border-color: ${itemHoverColor}}`);
146
- css.push(`.${guid} .gd-header-menu-item.active { border-color: var(--gd-palette-primary-base-from-theme, ${itemActiveColor})}`);
147
- css.push(`.${guid} .gd-header-project { border-color: ${separatorColor}}`);
148
- css.push(`.${guid} .gd-header-project:hover { background-color: ${workspacesPickerHoverColor}; color: ${textColor}}`);
149
- css.push(`.${guid} .hamburger-icon:not(.is-open) i { border-color: ${textColor}}`);
150
- css.push(`.${guid} .hamburger-icon:not(.is-open):after { border-color: ${textColor}}`);
151
- css.push(`.${guid} .hamburger-icon:not(.is-open):before { border-color: ${textColor}}`);
152
- stylesheetRef.current = addCssToStylesheet(`header-css-${guid}`, css.join("\n"), true);
137
+ const css = createHeaderCssRules(guid, headerColor, headerTextColor, activeColor);
138
+ stylesheetRef.current = addCssToStylesheet(`header-css-${guid}`, css, true);
153
139
  }, [state, activeColor, headerColor, headerTextColor]);
154
140
  useEffect(() => {
155
141
  createStyles();
package/esm/Header/headerCss.d.ts ADDED
@@ -0,0 +1,16 @@
1
+ /**
2
+ * Builds the per-instance stylesheet that paints the app header with the branding/theme colors.
3
+ *
4
+ * The rules are scoped by `guid`, a class the header root carries next to the static `gd-header`
5
+ * one. The root rule is deliberately written as `.gd-header.<guid>` rather than `.<guid>`: the
6
+ * latter has the same specificity as `.gd-header { color: #fff; background: #000 }` from
7
+ * `header.scss` and applies to the very same element, so the cascade would be decided by document
8
+ * order alone. Any stylesheet appended to `<head>` after this one — module-federated apps re-ship
9
+ * `header.scss` when the host lazy-loads them — would then revert a themed header to the default
10
+ * black/white. The descendant rules below already outrank their `header.scss` counterparts on
11
+ * specificity, so they need no such qualification.
12
+ *
13
+ * @internal
14
+ */
15
+ export declare function createHeaderCssRules(guid: string, headerColor?: string, headerTextColor?: string, activeColor?: string): string;
16
+ //# sourceMappingURL=headerCss.d.ts.map
package/esm/Header/headerCss.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"headerCss.d.ts","sourceRoot":"","sources":["../../src/Header/headerCss.ts"],"names":[],"mappings":"AAUA;;;;;;;;;;;;;GAaG;AACH,wBAAgB,oBAAoB,CAChC,IAAI,EAAE,MAAM,EACZ,WAAW,SAAK,EAChB,eAAe,SAAK,EACpB,WAAW,SAAK,GACjB,MAAM,CAkBR"}
package/esm/Header/headerCss.js ADDED
@@ -0,0 +1,34 @@
1
+ // (C) 2026 GoodData Corporation
2
+ import { getItemActiveColor, getItemHoverColor, getSeparatorColor, getTextColor, getWorkspacePickerHoverColor, } from "./colors.js";
3
+ /**
4
+ * Builds the per-instance stylesheet that paints the app header with the branding/theme colors.
5
+ *
6
+ * The rules are scoped by `guid`, a class the header root carries next to the static `gd-header`
7
+ * one. The root rule is deliberately written as `.gd-header.<guid>` rather than `.<guid>`: the
8
+ * latter has the same specificity as `.gd-header { color: #fff; background: #000 }` from
9
+ * `header.scss` and applies to the very same element, so the cascade would be decided by document
10
+ * order alone. Any stylesheet appended to `<head>` after this one — module-federated apps re-ship
11
+ * `header.scss` when the host lazy-loads them — would then revert a themed header to the default
12
+ * black/white. The descendant rules below already outrank their `header.scss` counterparts on
13
+ * specificity, so they need no such qualification.
14
+ *
15
+ * @internal
16
+ */
17
+ export function createHeaderCssRules(guid, headerColor = "", headerTextColor = "", activeColor = "") {
18
+ const textColor = getTextColor(headerTextColor, headerColor);
19
+ const itemActiveColor = getItemActiveColor(activeColor, headerColor);
20
+ const itemHoverColor = getItemHoverColor(headerColor, activeColor);
21
+ const separatorColor = getSeparatorColor(headerColor, activeColor);
22
+ const workspacesPickerHoverColor = getWorkspacePickerHoverColor(headerColor);
23
+ return [
24
+ `.gd-header.${guid} { color: ${textColor}; background: ${headerColor}}`,
25
+ `.${guid} .gd-header-menu-section { border-color: ${separatorColor}}`,
26
+ `.${guid} .gd-header-menu-item:hover { border-color: ${itemHoverColor}}`,
27
+ `.${guid} .gd-header-menu-item.active { border-color: var(--gd-palette-primary-base-from-theme, ${itemActiveColor})}`,
28
+ `.${guid} .gd-header-project { border-color: ${separatorColor}}`,
29
+ `.${guid} .gd-header-project:hover { background-color: ${workspacesPickerHoverColor}; color: ${textColor}}`,
30
+ `.${guid} .hamburger-icon:not(.is-open) i { border-color: ${textColor}}`,
31
+ `.${guid} .hamburger-icon:not(.is-open):after { border-color: ${textColor}}`,
32
+ `.${guid} .hamburger-icon:not(.is-open):before { border-color: ${textColor}}`,
33
+ ].join("\n");
34
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gooddata/sdk-ui-kit",
3
- "version": "11.50.0-alpha.2",
3
+ "version": "11.50.0-alpha.3",
4
4
  "description": "GoodData SDK - UI Building Components",
5
5
  "license": "MIT",
6
6
  "author": "GoodData Corporation",
@@ -76,11 +76,11 @@
76
76
  "tslib": "2.8.1",
77
77
  "unified": "^11.0.5",
78
78
  "uuid": "11.1.1",
79
- "@gooddata/sdk-backend-spi": "11.50.0-alpha.2",
80
- "@gooddata/sdk-model": "11.50.0-alpha.2",
81
- "@gooddata/sdk-ui-theme-provider": "11.50.0-alpha.2",
82
- "@gooddata/sdk-ui": "11.50.0-alpha.2",
83
- "@gooddata/util": "11.50.0-alpha.2"
79
+ "@gooddata/sdk-model": "11.50.0-alpha.3",
80
+ "@gooddata/sdk-ui": "11.50.0-alpha.3",
81
+ "@gooddata/sdk-ui-theme-provider": "11.50.0-alpha.3",
82
+ "@gooddata/sdk-backend-spi": "11.50.0-alpha.3",
83
+ "@gooddata/util": "11.50.0-alpha.3"
84
84
  },
85
85
  "devDependencies": {
86
86
  "@microsoft/api-documenter": "^7.17.0",
@@ -129,11 +129,11 @@
129
129
  "typescript": "5.9.3",
130
130
  "vitest": "4.1.8",
131
131
  "vitest-dom": "0.1.1",
132
- "@gooddata/oxlint-config": "11.50.0-alpha.2",
133
- "@gooddata/eslint-config": "11.50.0-alpha.2",
134
- "@gooddata/reference-workspace": "11.50.0-alpha.2",
135
- "@gooddata/sdk-backend-mockingbird": "11.50.0-alpha.2",
136
- "@gooddata/stylelint-config": "11.50.0-alpha.2"
132
+ "@gooddata/eslint-config": "11.50.0-alpha.3",
133
+ "@gooddata/oxlint-config": "11.50.0-alpha.3",
134
+ "@gooddata/reference-workspace": "11.50.0-alpha.3",
135
+ "@gooddata/sdk-backend-mockingbird": "11.50.0-alpha.3",
136
+ "@gooddata/stylelint-config": "11.50.0-alpha.3"
137
137
  },
138
138
  "peerDependencies": {
139
139
  "react": "^18.0.0 || ^19.0.0",