@hazelcast/ui 4.0.1-canary.12 → 4.0.1-canary.19

package/README.md

@@ -2,201 +2,53 @@
 
 ![](./hive.png)
 
-Design system built with A11Y in mind.
-**Design system is available live at URL**: https://5f80b6aa3ceb290022dfea61-tultjjrhhk.chromatic.com/?path=/story/getting-started-intro--page
+Hazelcast's React design system, built with accessibility in mind.
 
-## Installation
-
-1. `npm i @hazelcast/ui` (`npm i @hazelcast/ui@next` - canary version) - set of Hive UI components
-2. `npm i @hazelcast/services` (`npm i @hazelcast/services@next` - canary version) - Hive services
-3. `npm i @hazelcast/helpers` (`npm i @hazelcast/helpers@next` - canary version) - Hiver helpers
-4. `npm i -D @hazelcast/test-helpers` (`npm i -D @hazelcast/test-helpers@next` - canary version) - Hive test helpers
+**Live Storybook**: https://master--5f80b6aa3ceb290022dfea61.chromatic.com/
 
-## Usage
+## Installation
 
-Be aware, that we compile our TypeScript code to the modern `ES2018` JavaScript. To run it in legacy environment, please, configure webpack or any other bundler accordingly.
-Moreover, we do not do anything about styles (`scss` in our case). We just import them as modules. Please, configure webpack or any other bundler to handle them.
+```
+npm i @hazelcast/ui
+```
 
-The latest version of the design system is accessible at https://master--5f80b6aa3ceb290022dfea61.chromatic.com/.
+Use the `@next` dist-tag for the latest canary build: `npm i @hazelcast/ui@next`.
 
-## Global CSS
+## Usage
 
-This library is used from Next.js projects.
-Individual projects should transpile @hazelcast/ui.
-However, Next.js still [forbids](https://github.com/vercel/next.js/blob/master/errors/css-global.md) to import files with .css / .scss extension unless they're in \_app.tsx
+The package ships TypeScript compiled to `ES2018` — configure your bundler if you need to support older environments.
 
-So please make sure to import the following global styles in your projects if you need them.
+Styles are SCSS modules imported per-component; no global stylesheet is bundled. If you're on Next.js, it [forbids importing non-module CSS/SCSS](https://github.com/vercel/next.js/blob/master/errors/css-global.md) outside `_app.tsx`, so import any global styles you need there, e.g.:
 
 ```typescript
 import '@hazelcast/ui/styles/datepicker.scss'
-```
-
-or
-
-```typescript
+// or the CSS modules version
 import '@hazelcast/ui/styles/datepicker.module.scss'
 ```
 
-if you need a CSS modules version
-
-## SSR
-
-### Stable IDs
-
-We use [`react-uid`](https://github.com/thearnica/react-uid) to generate stable IDs. you'll need `UIDReset` and `UIDFork` (optionally) to properly handle SSR. See the [README](https://github.com/thearnica/react-uid#code-splitting).
-
-## Project structure
-
-`packages` contains a list of published packages:
-
-- `helpers` (full name `@hazelcast/helpers`)
-- `services` (full name `@hazelcast/services`)
-- `test-helpers` (full name `@hazelcast/test-helpers`)
-- `ui` (full name `@hazelcast/ui`)
-
-### Automated visual regression testing
-
-Uses stories from [Storybook](https://storybook.js.org/) as test cases. In other words, any story is going to result in a set of screenshots. Moreover, any story is required to have an associated set of screenshots. Based on [Loki](https://loki.js.org/), which uses headless Chrome to render the screenshots in Docker.
-
-## How-to
-
-### Install [PnpM](https://pnpm.io/installation)
-
-```
-npm install -g pnpm
-```
-
-### Setup
-
-```
-pnpm i
-```
-
-#### Under the hood
-
-It runs a regular `pnpm install` and executes a `postinstall` hook. In that hook it runs:
-
-- `pnpm run compile`
-  Our child packages are written in TypeScript. To import them from `node_modules` in other packages they must be compiled to JavaScript first.
-
-### Deploy
+### SSR
 
-Every commit to `master` is automatically deployed new canary version of the package (`@hazelcast/xxx@next`) by [Hazelcast Jenkins](http://jenkins.hazelcast.com/view/Frontend%20Shared/job/frontend-shared-master/).
+Components use [`react-uid`](https://github.com/thearnica/react-uid) for stable IDs. Wrap your app in `UIDReset` (and `UIDFork` for code-splitting) — see the [react-uid README](https://github.com/thearnica/react-uid#code-splitting).
 
-### Add a new shared dependency
-
-In the root folder run
-
-```
-pnpm add [-D] dependency-name
-```
-
-### Add a new local dependency (for one package only)
-
-In the root folder run (replace @hazelcast/ui with @hazelcast/helpers, @hazelcast/test-helpers or @hazelcast/services if needed)
+## Development
 
 ```
-pnpm add --filter @hazelcast/ui dependency-name
+npm install
+npm run dev          # Storybook on :6006
+npm test             # Jest unit tests
+npm run lint         # ESLint
+npm run compile      # compile src/ to lib/
+npm run verify-all   # lint + test + build-storybook + visual regression
 ```
 
-### Make changes to several packages and test it
-
-When Lerna does the bootstrapping, it creates symlinks to the local packages other packages depend on. In our case, `@hazelcast/ui` depends on `@hazelcast/helpers`. Lerna is going to create a symlink `./packages/ui/node_modules/@hazelcast/helpers` that points to `./packages/helpers`. When we change our TypeScript code, the associated compiled JavaScript is not updated automatically. So if we change something in `@hazelcast/helpers` and we want to test how it works in `@hazelcast/ui`, we need to compile our changes in `@hazelcast/helpers`. To do that we have two options:
-
-1. Compile all packages with `pnpm run compile` in the root directory
-2. Compile a specific package, e.g. `cd packages/helpers && pnpm run compile`
-
-Now we can use the updated code in `@hazelcast/ui`.
-
-### Run storybook for development
-
-In the root directory
-
-```
-pnpm start
-```
-
-### Run linting
-
-In the root directory
-
-```
-pnpm run lint
-```
-
-### Run unit tests
-
-In the root directory
-
-```
-pnpm test
-```
-
-### Run visual regression tests
-
-In the root directory
-
-```
-pnpm run build-storybook
-pnpm run test:visual
-```
-
-### Approve the updated for visual regression test screenshots
-
-Say, we have changed something in our components.
-First we need to run the visual regression tests to make sure that the change affected how the component is displayed.
-
-```
-pnpm run build-storybook
-pnpm run test:visual
-```
-
-Now, if the test suite failed, we need to go to `packages/ui/.loki` and manually review the screenshots in the `current` folder and the diff in the `difference` folder. If we like what we see, we need to run `pnpm run test:visual:approve` in the `packages/ui` folder. It will update the reference screenshots.
-
-### Run all checks at once
-
-```
-pnpm run verify-all
-```
-
-If you PR passes this check locally, it is almost guaranteed to pass it on the CI.
-
-## Releasing a new version
-
-Assuming you're on latest master and the build is alright (`pnpm run build` runs without errors).
-
-1. First we create a release branch for the next version locally (in this case v1.1.0):
-
-   ```
-   git checkout -b release/v1.1.0
-   ```
-
-   We push this new branch to Github:
-
-   ```
-   git push -u origin release/v1.1.0
-   ```
-
-2. Then we run:
-
-   ```
-   pnpm exec lerna version 1.1.0
-   ```
-
-   This updates the package versions (in package.json, package-lock.json), creates a commit with necessary tags and pushes to Github automatically.
-
-   At this point you should create a pull request and merge the new version branch (v1.1.0) to master.
-
-3. Now, after merging this pull request, we have the latest version available on GitHub. And it will be automatically published to npm with the required tags and releases;
+Visual regression tests use [Loki](https://loki.js.org/) against Storybook stories. If `npm run test:visual` fails on an intended change, review the diffs under `.loki`, then run `npm run test:visual:approve` to update the reference screenshots.
 
-   Wait for a few seconds/minutes (depends on how busy npm is at the time), and you should see the latest version we just released in the list returned by:
+See `CLAUDE.md` for project structure and code conventions.
 
-   ```
-   pnpm view @hazelcast/ui versions
-   ```
+## Releasing
 
-   If something went wrong and npm did not create a new release, then you can manually inform it about our new release:
+Releases are triggered manually via the ["manual release" GitHub Actions workflow](.github/workflows/release.yml):
 
-   ```
-   pnpm exec lerna publish from-git
-   ```
+1. Run the workflow (`workflow_dispatch`) with the desired version bump type.
+2. It opens a PR bumping the version and enables auto-merge.
+3. Once a code owner approves and it merges, npm publish and git tagging happen automatically.

package/lib/components/Alert.js

@@ -7,8 +7,7 @@ import { Link } from './Link';
 import { Button } from './Button';
 import { ToastIcon } from './Toast';
 import { Icon } from './Icon';
-import { IconButton } from './IconButton';
-import styles from './Alert.module.scss';
+import styles from './Alert.module.css';
 const isAlertActionButton = (action) => action.onClick !== undefined;
 export const Alert = ({ type, title, content, actions, className, dismissableByEscKey = true, closeToast, titleClassName, bodyClassName, }) => {
     const { icon, ariaLabel } = ToastIcon[type];
@@ -29,7 +28,8 @@ export const Alert = ({ type, title, content, actions, className, dismissableByE
         React.createElement("div", { className: styles.rightSide },
             React.createElement("div", { className: styles.header },
                 title && (React.createElement("div", { "data-test": "alert-title", className: cn(styles.title, titleClassName) }, title)),
-                !!closeToast && React.createElement(IconButton, { "data-test": "alert-close", variant: "ghost", ariaLabel: "Close icon", icon: X, onClick: closeToast })),
+                !!closeToast && (React.createElement("button", { type: "button", "data-test": "alert-close", className: styles.closeButton, onClick: closeToast, "aria-label": "Close icon" },
+                    React.createElement(X, { size: 16, "aria-hidden": true })))),
             React.createElement("div", { "data-test": "alert-body", className: cn(styles.body, bodyClassName) },
                 content && React.createElement("div", { "data-test": "alert-content" }, content),
                 (actions === null || actions === void 0 ? void 0 : actions.length) ? (React.createElement("div", { "data-test": "alert-actions", className: styles.actions }, actions.map((action, aI) => {
@@ -39,7 +39,6 @@ export const Alert = ({ type, title, content, actions, className, dismissableByE
                             ? {
                                 iconLeft: icon,
                                 iconLeftAriaLabel: ariaLabel,
-                                iconLeftClassName: styles.actionButtonIcon,
                             }
                             : {};
                         return (React.createElement(Button, { key: aI, variant: "ghost", color: "secondary", className: cn(styles.action, styles.actionButton), bodyClassName: styles.actionButtonBody, onClick: onClick, ...iconLeftProps }, text));

package/lib/components/Alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../src/components/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAiB,WAAW,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,YAAY,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAC/C,OAAO,MAAM,MAAM,sBAAsB,CAAA;AAEzC,OAAO,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAA;AACzD,OAAO,EAAE,IAAI,EAAa,MAAM,QAAQ,CAAA;AACxC,OAAO,EAAE,MAAM,EAAiC,MAAM,UAAU,CAAA;AAChE,OAAO,EAAE,SAAS,EAAa,MAAM,SAAS,CAAA;AAC9C,OAAO,EAAE,IAAI,EAAa,MAAM,QAAQ,CAAA;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAGzC,OAAO,MAAM,MAAM,qBAAqB,CAAA;AA4BxC,MAAM,mBAAmB,GAAG,CAAC,MAAmB,EAA+B,EAAE,CAAE,MAA4B,CAAC,OAAO,KAAK,SAAS,CAAA;AAcrI,MAAM,CAAC,MAAM,KAAK,GAAmB,CAAC,EACpC,IAAI,EACJ,KAAK,EACL,OAAO,EACP,OAAO,EACP,SAAS,EACT,mBAAmB,GAAG,IAAI,EAC1B,UAAU,EACV,cAAc,EACd,aAAa,GACd,EAAE,EAAE;IACH,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,SAAS,CAAC,IAAI,CAAC,CAAA;IAE3C,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,WAA0B,EAAE,EAAE;QAC7B,IAAI,mBAAmB,EAAE,CAAC;YACxB,UAAU,aAAV,UAAU,uBAAV,UAAU,EAAI,CAAA;YACd,WAAW,CAAC,wBAAwB,EAAE,CAAA;QACxC,CAAC;IACH,CAAC,EACD,CAAC,UAAU,EAAE,mBAAmB,CAAC,CAClC,CAAA;IAED,MAAM,CAAC,qBAAqB,EAAE,UAAU,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,UAAU,EAAE,mBAAmB,CAAC,CAAC,CAAA;IAEzG,OAAO,CACL,0CACY,OAAO,EACjB,SAAS,EAAE,EAAE,CACX,MAAM,CAAC,KAAK,EACZ;YACE,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,IAAI,KAAK,SAAS;YACpC,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,IAAI,KAAK,MAAM;YAC9B,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,IAAI,KAAK,SAAS;YACpC,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,IAAI,KAAK,UAAU;SACvC,EACD,SAAS,CACV;QAED,oBAAC,IAAI,iBAAW,YAAY,EAAC,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,CAAC,IAAI,GAAI;QACzF,6BAAK,SAAS,EAAE,MAAM,CAAC,SAAS;YAC9B,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM;gBAC1B,KAAK,IAAI,CACR,0CAAe,aAAa,EAAC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,cAAc,CAAC,IACrE,KAAK,CACF,CACP;gBACA,CAAC,CAAC,UAAU,IAAI,oBAAC,UAAU,iBAAW,aAAa,EAAC,OAAO,EAAC,OAAO,EAAC,SAAS,EAAC,YAAY,EAAC,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,UAAU,GAAI,CACxH;YACN,0CAAe,YAAY,EAAC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,aAAa,CAAC;gBAClE,OAAO,IAAI,0CAAe,eAAe,IAAE,OAAO,CAAO;gBACzD,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,MAAM,EAAC,CAAC,CAAC,CACjB,0CAAe,eAAe,EAAC,SAAS,EAAE,MAAM,CAAC,OAAO,IACrD,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,EAAE,EAAE;oBAC1B,IAAI,mBAAmB,CAAC,MAAM,CAAC,EAAE,CAAC;wBAChC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,MAAM,CAAA;wBACjD,MAAM,aAAa,GACjB,IAAI,IAAI,SAAS;4BACf,CAAC,CAAC;gCACE,QAAQ,EAAE,IAAI;gCACd,iBAAiB,EAAE,SAAS;gCAC5B,iBAAiB,EAAE,MAAM,CAAC,gBAAgB;6BAC3C;4BACH,CAAC,CAAC,EAAE,CAAA;wBAER,OAAO,CACL,oBAAC,MAAM,IACL,GAAG,EAAE,EAAE,EACP,OAAO,EAAC,OAAO,EACf,KAAK,EAAC,WAAW,EACjB,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,YAAY,CAAC,EACjD,aAAa,EAAE,MAAM,CAAC,gBAAgB,EACtC,OAAO,EAAE,OAAO,KACZ,aAAa,IAEhB,IAAI,CACE,CACV,CAAA;oBACH,CAAC;oBAED,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,GAAG,MAAM,CAAA;oBAEvC,OAAO,CACL,oBAAC,IAAI,IACH,GAAG,EAAE,EAAE,EACP,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,YAAY,EAClB,SAAS,EAAC,oBAAoB,EAC9B,SAAS,EAAE,MAAM,CAAC,MAAM,EACxB,IAAI,EAAC,OAAO,KACR,KAAK,IAER,IAAI,CACA,CACR,CAAA;gBACH,CAAC,CAAC,CACE,CACP,CAAC,CAAC,CAAC,IAAI,CACJ,CACF,CACF,CACP,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../src/components/Alert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAiB,WAAW,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EAAE,YAAY,EAAE,CAAC,EAAE,MAAM,eAAe,CAAA;AAC/C,OAAO,MAAM,MAAM,sBAAsB,CAAA;AAEzC,OAAO,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAA;AACzD,OAAO,EAAE,IAAI,EAAa,MAAM,QAAQ,CAAA;AACxC,OAAO,EAAE,MAAM,EAAiC,MAAM,UAAU,CAAA;AAChE,OAAO,EAAE,SAAS,EAAa,MAAM,SAAS,CAAA;AAC9C,OAAO,EAAE,IAAI,EAAa,MAAM,QAAQ,CAAA;AAGxC,OAAO,MAAM,MAAM,oBAAoB,CAAA;AA4BvC,MAAM,mBAAmB,GAAG,CAAC,MAAmB,EAA+B,EAAE,CAAE,MAA4B,CAAC,OAAO,KAAK,SAAS,CAAA;AAcrI,MAAM,CAAC,MAAM,KAAK,GAAmB,CAAC,EACpC,IAAI,EACJ,KAAK,EACL,OAAO,EACP,OAAO,EACP,SAAS,EACT,mBAAmB,GAAG,IAAI,EAC1B,UAAU,EACV,cAAc,EACd,aAAa,GACd,EAAE,EAAE;IACH,MAAM,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,SAAS,CAAC,IAAI,CAAC,CAAA;IAE3C,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,WAA0B,EAAE,EAAE;QAC7B,IAAI,mBAAmB,EAAE,CAAC;YACxB,UAAU,aAAV,UAAU,uBAAV,UAAU,EAAI,CAAA;YACd,WAAW,CAAC,wBAAwB,EAAE,CAAA;QACxC,CAAC;IACH,CAAC,EACD,CAAC,UAAU,EAAE,mBAAmB,CAAC,CAClC,CAAA;IAED,MAAM,CAAC,qBAAqB,EAAE,UAAU,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,UAAU,EAAE,mBAAmB,CAAC,CAAC,CAAA;IAEzG,OAAO,CACL,0CACY,OAAO,EACjB,SAAS,EAAE,EAAE,CACX,MAAM,CAAC,KAAK,EACZ;YACE,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,IAAI,KAAK,SAAS;YACpC,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,IAAI,KAAK,MAAM;YAC9B,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,IAAI,KAAK,SAAS;YACpC,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,IAAI,KAAK,UAAU;SACvC,EACD,SAAS,CACV;QAED,oBAAC,IAAI,iBAAW,YAAY,EAAC,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,CAAC,IAAI,GAAI;QACzF,6BAAK,SAAS,EAAE,MAAM,CAAC,SAAS;YAC9B,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM;gBAC1B,KAAK,IAAI,CACR,0CAAe,aAAa,EAAC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,EAAE,cAAc,CAAC,IACrE,KAAK,CACF,CACP;gBACA,CAAC,CAAC,UAAU,IAAI,CACf,gCAAQ,IAAI,EAAC,QAAQ,eAAW,aAAa,EAAC,SAAS,EAAE,MAAM,CAAC,WAAW,EAAE,OAAO,EAAE,UAAU,gBAAa,YAAY;oBACvH,oBAAC,CAAC,IAAC,IAAI,EAAE,EAAE,wBAAgB,CACpB,CACV,CACG;YACN,0CAAe,YAAY,EAAC,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,aAAa,CAAC;gBAClE,OAAO,IAAI,0CAAe,eAAe,IAAE,OAAO,CAAO;gBACzD,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,MAAM,EAAC,CAAC,CAAC,CACjB,0CAAe,eAAe,EAAC,SAAS,EAAE,MAAM,CAAC,OAAO,IACrD,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,EAAE,EAAE;oBAC1B,IAAI,mBAAmB,CAAC,MAAM,CAAC,EAAE,CAAC;wBAChC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,MAAM,CAAA;wBACjD,MAAM,aAAa,GACjB,IAAI,IAAI,SAAS;4BACf,CAAC,CAAC;gCACE,QAAQ,EAAE,IAAI;gCACd,iBAAiB,EAAE,SAAS;6BAC7B;4BACH,CAAC,CAAC,EAAE,CAAA;wBAER,OAAO,CACL,oBAAC,MAAM,IACL,GAAG,EAAE,EAAE,EACP,OAAO,EAAC,OAAO,EACf,KAAK,EAAC,WAAW,EACjB,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,YAAY,CAAC,EACjD,aAAa,EAAE,MAAM,CAAC,gBAAgB,EACtC,OAAO,EAAE,OAAO,KACZ,aAAa,IAEhB,IAAI,CACE,CACV,CAAA;oBACH,CAAC;oBAED,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,GAAG,MAAM,CAAA;oBAEvC,OAAO,CACL,oBAAC,IAAI,IACH,GAAG,EAAE,EAAE,EACP,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,YAAY,EAClB,SAAS,EAAC,oBAAoB,EAC9B,SAAS,EAAE,MAAM,CAAC,MAAM,EACxB,IAAI,EAAC,OAAO,KACR,KAAK,IAER,IAAI,CACA,CACR,CAAA;gBACH,CAAC,CAAC,CACE,CACP,CAAC,CAAC,CAAC,IAAI,CACJ,CACF,CACF,CACP,CAAA;AACH,CAAC,CAAA"}

package/lib/components/Alert.module.css

@@ -0,0 +1,111 @@
+.alert {
+  --alert-color: var(--hive-color-text);
+  --alert-surface: lab(from var(--alert-color) 95% a b);
+  --alert-border: lab(from var(--alert-color) 84% a b);
+
+  box-sizing: border-box;
+  display: flex;
+  align-items: flex-start;
+  gap: calc(var(--hive-grid) * 3);
+  width: 100%;
+  padding: calc(var(--hive-grid) * 3) calc(var(--hive-grid) * 4);
+  border: var(--hive-border-width) solid var(--alert-border);
+  border-radius: var(--hive-border-radius);
+  background-color: var(--alert-surface);
+  color: var(--alert-color);
+}
+
+.icon {
+  flex-shrink: 0;
+  margin-top: calc(var(--hive-grid) * 0.5);
+  color: var(--alert-color);
+}
+
+.rightSide {
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+}
+
+.header {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  min-width: 0;
+}
+
+.title {
+  flex: 1 1 auto;
+  min-width: 0;
+  margin-right: calc(var(--hive-grid) * 8.5);
+  overflow: hidden;
+  font-family: var(--hive-font-family-text);
+  font-size: var(--hive-font-size-body-normal);
+  font-weight: var(--hive-font-weight-text-bold);
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.closeButton {
+  flex: 0 0 auto;
+  margin-left: auto;
+  padding: 0;
+  border: none;
+  background: none;
+  color: var(--alert-color);
+  line-height: 0;
+  cursor: pointer;
+}
+
+.body {
+  font-size: var(--hive-font-size-body-small);
+  line-height: var(--hive-line-height-body-normal);
+}
+
+.success {
+  --alert-color: var(--hive-color-success-darkest);
+}
+
+.info {
+  --alert-color: var(--hive-color-info-darkest);
+}
+
+.warning {
+  --alert-color: var(--hive-color-warning-darkest);
+}
+
+.critical {
+  --alert-color: var(--hive-color-error);
+}
+
+.actions {
+  display: flex;
+  margin: calc(var(--hive-grid) * 3) 0 calc(var(--hive-grid) * 1);
+}
+
+.action {
+  color: var(--alert-color);
+}
+
+.action:not(:last-child) {
+  margin-right: calc(var(--hive-grid) * 4);
+}
+
+.actionButton {
+  --button-bg-hover: transparent;
+  --button-bg-active: transparent;
+
+  height: auto;
+  padding: 0;
+  font-size: var(--hive-font-size-body-small);
+}
+
+.actionButton:hover,
+.actionButton.hover {
+  text-decoration: underline solid;
+}
+
+.actionButtonBody {
+  padding: 0;
+}

package/lib/components/AppHeader/AppHeader.js

@@ -4,7 +4,7 @@ import { EnvironmentBadge } from './EnvironmentBadge';
 import { AppHeaderMenu } from './AppHeaderMenu';
 import { AppHeaderLogo } from './AppHeaderLogo';
 import { SelectCluster } from './SelectCluster';
-import styles from './AppHeader.module.scss';
+import styles from './AppHeader.module.css';
 export const AppHeader = ({ name, className, children, environment, clusterSelectProps, logoProps, menuContent, asideContent, 'data-test': dataTest = 'app-header', }) => (React.createElement("header", { "data-test": dataTest, className: cls(styles.root, className) },
     React.createElement(AppHeaderLogo, { ...logoProps }),
     React.createElement("span", { className: styles.name }, name),

package/lib/components/AppHeader/AppHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"AppHeader.js","sourceRoot":"","sources":["../../../src/components/AppHeader/AppHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAA;AACxC,OAAO,GAAG,MAAM,YAAY,CAAA;AAE5B,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AACrD,OAAO,EAAE,aAAa,EAAsB,MAAM,iBAAiB,CAAA;AACnE,OAAO,EAAE,aAAa,EAAsB,MAAM,iBAAiB,CAAA;AACnE,OAAO,EAAE,aAAa,EAAsB,MAAM,iBAAiB,CAAA;AAGnE,OAAO,MAAM,MAAM,yBAAyB,CAAA;AAa5C,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EACxB,IAAI,EACJ,SAAS,EACT,QAAQ,EACR,WAAW,EACX,kBAAkB,EAClB,SAAS,EACT,WAAW,EACX,YAAY,EACZ,WAAW,EAAE,QAAQ,GAAG,YAAY,GACrB,EAAE,EAAE,CAAC,CACpB,6CAAmB,QAAQ,EAAE,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC;IACjE,oBAAC,aAAa,OAAK,SAAS,GAAI;IAChC,8BAAM,SAAS,EAAE,MAAM,CAAC,IAAI,IAAG,IAAI,CAAQ;IAC1C,kBAAkB,IAAI,oBAAC,aAAa,OAAK,kBAAkB,GAAI;IAC/D,QAAQ;IACR,WAAW,IAAI,oBAAC,gBAAgB,IAAC,WAAW,EAAE,WAAW,GAAI;IAC9D,6BAAK,SAAS,EAAE,MAAM,CAAC,KAAK;QACzB,YAAY;QACZ,WAAW,IAAI,oBAAC,aAAa,IAAC,SAAS,EAAE,CAAC,CAAC,YAAY,IAAG,WAAW,CAAiB,CACnF,CACC,CACV,CAAA"}
+{"version":3,"file":"AppHeader.js","sourceRoot":"","sources":["../../../src/components/AppHeader/AppHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAA;AACxC,OAAO,GAAG,MAAM,YAAY,CAAA;AAE5B,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AACrD,OAAO,EAAE,aAAa,EAAsB,MAAM,iBAAiB,CAAA;AACnE,OAAO,EAAE,aAAa,EAAsB,MAAM,iBAAiB,CAAA;AACnE,OAAO,EAAE,aAAa,EAAsB,MAAM,iBAAiB,CAAA;AAGnE,OAAO,MAAM,MAAM,wBAAwB,CAAA;AAa3C,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EACxB,IAAI,EACJ,SAAS,EACT,QAAQ,EACR,WAAW,EACX,kBAAkB,EAClB,SAAS,EACT,WAAW,EACX,YAAY,EACZ,WAAW,EAAE,QAAQ,GAAG,YAAY,GACrB,EAAE,EAAE,CAAC,CACpB,6CAAmB,QAAQ,EAAE,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC;IACjE,oBAAC,aAAa,OAAK,SAAS,GAAI;IAChC,8BAAM,SAAS,EAAE,MAAM,CAAC,IAAI,IAAG,IAAI,CAAQ;IAC1C,kBAAkB,IAAI,oBAAC,aAAa,OAAK,kBAAkB,GAAI;IAC/D,QAAQ;IACR,WAAW,IAAI,oBAAC,gBAAgB,IAAC,WAAW,EAAE,WAAW,GAAI;IAC9D,6BAAK,SAAS,EAAE,MAAM,CAAC,KAAK;QACzB,YAAY;QACZ,WAAW,IAAI,oBAAC,aAAa,IAAC,SAAS,EAAE,CAAC,CAAC,YAAY,IAAG,WAAW,CAAiB,CACnF,CACC,CACV,CAAA"}

package/lib/components/AppHeader/AppHeader.module.css

@@ -0,0 +1,27 @@
+.root {
+  background: var(--hive-color-brand-secondary);
+  color: var(--hive-color-neutral-lighter);
+  display: flex;
+  align-items: center;
+  height: 59px;
+  box-sizing: border-box;
+  flex-direction: row;
+  font-size: var(--hive-font-size-body-small);
+  width: 100%;
+  padding: 0 calc(var(--hive-grid) * 5);
+  overflow-x: auto;
+  flex-shrink: 0;
+  gap: calc(var(--hive-grid) * 7.5);
+}
+
+.name {
+  color: var(--hive-color-brand-primary);
+  font-weight: 600;
+}
+
+.aside {
+  display: flex;
+  align-items: center;
+  margin-left: auto;
+  gap: calc(var(--hive-grid) * 4);
+}

package/lib/components/AppHeader/AppHeaderLogo/AppHeaderLogo.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import cls from 'classnames';
-import styles from './AppHeaderLogo.module.scss';
+import styles from './AppHeaderLogo.module.css';
 export const AppHeaderLogo = ({ imgProps, wrapperProps, LinkComponent }) => (React.createElement("div", { ...wrapperProps, className: cls(styles.root, wrapperProps === null || wrapperProps === void 0 ? void 0 : wrapperProps.className) },
     React.createElement(LinkComponent, { className: styles.link, "data-test": "logo-link" },
         React.createElement("img", { alt: "Home", src: "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTU1IiBoZWlnaHQ9IjIwIiB2aWV3Qm94PSIwIDAgMTU1IDIwIiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNOTQuNDkwOSAzLjQzNzYxQzk1LjUxNTEgMi45MTkwOSA5Ni42MjY5IDIuNjU1MzUgOTcuNzk2NyAyLjY1NTM1Qzk5LjA0NjQgMi42NTUzNSAxMDAuMjMzIDIuOTQ4NTQgMTAxLjMzNiAzLjUzNDkyQzEwMS42MDQgMy42NTc4MyAxMDEuODI1IDMuNzE2NzIgMTAyLjAxMyAzLjcxNjcyQzEwMi4zMjQgMy43MTY3MiAxMDIuNTg0IDMuNTg5OTcgMTAyLjc2MyAzLjM1MDU1QzEwMi45MjkgMy4xMjkwNiAxMDMuMDE0IDIuODY0MDQgMTAzLjAxNCAyLjU2MDYxQzEwMy4wMTQgMS45OTM0MyAxMDIuNzgyIDEuNTU1NTcgMTAyLjMyMyAxLjI1ODU0QzEwMS42ODcgMC44NTc4MDMgMTAwLjk2IDAuNTQ0MTI5IDEwMC4xNTcgMC4zMjY0NzdDOTkuMzU2OCAwLjEwODgyNiA5OC41MjA3IDAgOTcuNjcwNSAwQzk2LjEwNzcgMCA5NC41OTUzIDAuMzYxMDQ1IDkzLjE3NjggMS4wNzQxN0M5MS43NTA3IDEuNzkxMTQgOTAuNTc0NSAyLjkwNzU3IDg5LjY3OTEgNC4zOTI3MkM4OC43ODUgNS44NzY1OSA4OC4zMzI4IDcuNzE1MTEgODguMzMyOCA5Ljg1NzA1Qzg4LjMzMjggMTEuOTk5IDg4Ljc4NjMgMTMuODE1NyA4OS42NzkxIDE1LjMwNzNDOTAuNTczMiAxNi44MDE0IDkxLjc0NDIgMTcuOTMwNiA5My4xNjE0IDE4LjY2NTVDOTQuNTcyMSAxOS4zOTc5IDk2LjA4MDcgMTkuNzY3OSA5Ny42NDQ3IDE5Ljc2NzlDOTkuNDE3NCAxOS43Njc5IDEwMC45OTIgMTkuMzI2MiAxMDIuMzE0IDE4LjQ2MDdDMTAyLjUzNiAxOC4zMzE0IDEwMi43MTIgMTguMTUwOSAxMDIuODM0IDE3LjkyNDJDMTAyLjk1NCAxNy43MDI3IDEwMy4wMTQgMTcuNDY5NyAxMDMuMDE0IDE3LjIzMjlDMTAzLjAxNCAxNi45MDkgMTAyLjkyIDE2LjYyNzMgMTAyLjczNCAxNi4zOTY4QzEwMi41MzYgMTYuMTUzNiAxMDIuMjcxIDE2LjAyNDMgMTAxLjk2MyAxNi4wMjQzQzEwMS43NTIgMTYuMDI0MyAxMDEuNTUgMTYuMDgwNiAxMDEuMzcgMTYuMTg2OUMxMDAuMjQ4IDE2Ljc4MzUgOTkuMDQ1MSAxNy4wODU2IDk3Ljc5NTQgMTcuMDg1NkM5Ni42MTAyIDE3LjA4NTYgOTUuNDkwNiAxNi44MTQyIDk0LjQ2NzcgMTYuMjc5MUM5My40NTEyIDE1Ljc0NzcgOTIuNjIwMyAxNC45MjgzIDkxLjk5OTMgMTMuODQzOUM5MS4zNzU4IDEyLjc1NjkgOTEuMDYwMSAxMS40MTUyIDkxLjA2MDEgOS44NTgzM0M5MS4wNjAxIDguMzAxNDkgOTEuMzc5NiA2LjkxMzY0IDkyLjAxMDkgNS44MzU2MkM5Mi42Mzk2IDQuNzYwMTcgOTMuNDc0NCAzLjk1NDg2IDk0LjQ4OTYgMy40NDAxN0w5NC40OTA5IDMuNDM3NjFaIiBmaWxsPSIjRjBGNkZGIi8+CjxwYXRoIGQ9Ik0xMzYuMDcyIDMuOTQxOTZDMTM2Ljc2NCAzLjUzNDgzIDEzNy4yMjggMi43MDEzNSAxMzUuMzM3IDEuMTU0NzRDMTM1LjMyNiAxLjE0NzA2IDEzNS4zMTYgMS4xMzkzOCAxMzUuMzA2IDEuMTMwNDJDMTM0LjMyNSAwLjM4NTI4MSAxMzMuMTAzIDAuMDI4MDc2MiAxMzEuNzAxIDAuMDI4MDc2MkMxMzAuNjYgMC4wMjgwNzYyIDEyOS43MDcgMC4yMzU0ODUgMTI4Ljg2NyAwLjY0NjQ2M0MxMjguMDE4IDEuMDYgMTI3LjM0MiAxLjY2MzAyIDEyNi44NTcgMi40Mzc2MUMxMjYuMzcxIDMuMjEyMTkgMTI2LjEyNSA0LjEwODQgMTI2LjEyNSA1LjEwMDY0QzEyNi4xMjUgNi4xODUwNSAxMjYuMzgyIDcuMTA1NTkgMTI2Ljg4OCA3LjgzNzkyQzEyNy4zODQgOC41NTYxNyAxMjcuOTkyIDkuMTQyNTUgMTI4LjY5NiA5LjU4MDQyQzEyOS4zOCAxMC4wMDY4IDEzMC4yOSAxMC40NzI4IDEzMS40IDEwLjk2NTdDMTMyLjI4IDExLjM2NTIgMTMyLjk5MSAxMS43MTYgMTMzLjUxIDEyLjAwOTJDMTM0LjAwOSAxMi4yOTA4IDEzNC40MjkgMTIuNjQ2NyAxMzQuNzYyIDEzLjA2NTRDMTM1LjA4NCAxMy40NzEzIDEzNS4yNCAxMy45NDg4IDEzNS4yNCAxNC41Mjc1QzEzNS4yNCAxNS4zNTIgMTM0Ljk1MyAxNS45OTYgMTM0LjM2MyAxNi40OTQxQzEzMy43NjggMTYuOTk1OSAxMzIuOTQ3IDE3LjI1MiAxMzEuOTIzIDE3LjI1MkMxMzEuMDU2IDE3LjI1MiAxMzAuMzkgMTcuMTYzNyAxMjkuNjcyIDE2Ljc1NzhDMTI5LjQ2NSAxNi42NCAxMjkuMTkgMTYuNDE4NSAxMjguOTA4IDE2LjExMjVDMTI4LjAzNiAxNS4xNzE1IDEyNy43NzggMTQuNTkyOCAxMjYuODU2IDE0LjgyOTdDMTI2LjE1IDE1LjAxMTUgMTI1Ljc4NCAxNS44MTE3IDEyNi4xMjIgMTYuNzMwOUMxMjYuNTY5IDE3Ljk0ODUgMTI4LjA0MSAxOC43NzQzIDEyOC4wNDEgMTguNzc0M0MxMjkuMTMxIDE5LjQ4ODcgMTMwLjQ1NyAxOS43NTYzIDEzMS45MjEgMTkuNzU2M0MxMzMuMDkxIDE5Ljc1NjMgMTM0LjE1MiAxOS41Mzk5IDEzNS4wNzQgMTkuMTE0OEMxMzYuMDA1IDE4LjY4NDcgMTM2Ljc0NSAxOC4wNTYgMTM3LjI3MiAxNy4yNDY5QzEzNy44MDEgMTYuNDM2NCAxMzguMDY5IDE1LjQ3NzUgMTM4LjA2OSAxNC4zOTU2QzEzOC4wNjkgMTMuMzEzOCAxMzcuODE3IDEyLjM5NTggMTM3LjMxOCAxMS42NzEyQzEzNi44MjkgMTAuOTU5MyAxMzYuMjIzIDEwLjM4OTYgMTM1LjUxNiA5Ljk3NzMxQzEzNC44MzMgOS41NzkxNCAxMzMuOTIzIDkuMTM2MTUgMTMyLjgxIDguNjU4NkMxMzEuOSA4LjI3ODM1IDEzMS4xNyA3LjkzNjUxIDEzMC42NDMgNy42NDMzMkMxMzAuMTM4IDcuMzYyOTMgMTI5LjcwOSA2Ljk5OTMzIDEyOS4zNjkgNi41NjI3NEMxMjkuMDM4IDYuMTQwMjQgMTI4Ljg3OCA1LjYzNDUyIDEyOC44NzggNS4wMTk5OEMxMjguODc4IDQuMjQ5MjMgMTI5LjE0IDMuNjU5MDIgMTI5LjY3OSAzLjIxMzQ3QzEzMC4yMjUgMi43NjI4IDEzMC45MTMgMi41MzM2MyAxMzEuNzI0IDIuNTMzNjNDMTMyLjUzNiAyLjUzMzYzIDEzMy4xNDIgMi43OTk5MyAxMzMuNzA4IDMuMjAwNjdDMTMzLjc0MiAzLjIyNDk5IDEzNC4wNTQgMy40OTY0MiAxMzQuMDU0IDMuNDk2NDJDMTM1LjEgNC40Njk0NSAxMzYuMDcgMy45NDE5NiAxMzYuMDcgMy45NDE5NkgxMzYuMDcyWiIgZmlsbD0iI0YwRjZGRiIvPgo8cGF0aCBkPSJNMTIuNTg5NCAwLjMyMDA2OEMxMS44NTEyIDAuMzIwMDY4IDExLjI1MzQgMC45MTQxMjkgMTEuMjUzNCAxLjY0Nzc0VjguNTg4MjZIMi42NzE5NVYxLjY0Nzc0QzIuNjcxOTUgMC45MTQxMjkgMi4wNzQxOCAwLjMyMDA2OCAxLjMzNTk4IDAuMzIwMDY4QzAuNTk3Nzc1IDAuMzIwMDY4IDAgMC45MTQxMjkgMCAxLjY0Nzc0VjE4LjEzNjhDMCAxOC44NzA0IDAuNTk3Nzc1IDE5LjQ2NDQgMS4zMzU5OCAxOS40NjQ0QzIuMDc0MTggMTkuNDY0NCAyLjY3MTk1IDE4Ljg3MDQgMi42NzE5NSAxOC4xMzY4VjExLjE4MDlIMTEuMjUzNFYxOC4xMzY4QzExLjI1MzQgMTguODcwNCAxMS44NTEyIDE5LjQ2NDQgMTIuNTg5NCAxOS40NjQ0QzEzLjMyNzYgMTkuNDY0NCAxMy45MjUzIDE4Ljg3MDQgMTMuOTI1MyAxOC4xMzY4VjEuNjQ3NzRDMTMuOTI1MyAwLjkxNDEyOSAxMy4zMjc2IDAuMzIwMDY4IDEyLjU4OTQgMC4zMjAwNjhaIiBmaWxsPSIjRjBGNkZGIi8+CjxwYXRoIGQ9Ik0zMy40MDMxIDE3LjY4NjJMMjcuOTY1MiAxLjY3OTg4QzI3LjgyMjIgMS4yODA0MiAyNy42MTQ4IDAuOTU1MjI0IDI3LjM1MDcgMC43MTE5NjZDMjcuMDY4NSAwLjQ1NDYyNSAyNi43NDY1IDAuMzIyNzU0IDI2LjM5MjIgMC4zMjI3NTRIMjUuODMwNUMyNS41MDg0IDAuMzIyNzU0IDI1LjE5NzkgMC40NTg0NjYgMjQuOTA4IDAuNzI0NzY5QzI0LjYzMzYgMC45NzgyNjkgMjQuNDMwMSAxLjMwMDkxIDI0LjMwMzggMS42ODM3MkwyMi42NjY0IDYuNTIwN0wyMy45MzU0IDEwLjQ5NzNDMjQuOTgwMiA3LjAxNDkgMjYuMTA2MiAzLjk3NDE4IDI2LjE2MDMgMy43OTg3OEwzMC44MzA0IDE4LjUyMjNDMzEuMDU4NCAxOS4yNDMxIDMxLjgzOTEgMTkuNjM2MSAzMi41NTggMTkuMzkyOUMzMy4yNjUzIDE5LjE1MzQgMzMuNjQ0MSAxOC4zOTA0IDMzLjQwNDQgMTcuNjg3NUwzMy40MDMxIDE3LjY4NjJaIiBmaWxsPSIjRjBGNkZGIi8+CjxwYXRoIGQ9Ik0yMS42MzQ1IDkuNjgyOTJMMTguOTE2MSAxNy42ODY0QzE4LjY3NjUgMTguMzg5NCAxOS4wNTUzIDE5LjE1MjUgMTkuNzYyNiAxOS4zOTE5QzIwLjQ4MjcgMTkuNjM1MSAyMS4yNjIyIDE5LjI0MjEgMjEuNDkwMiAxOC41MjEyTDIyLjk1NzYgMTMuNjg1M0wyMS42MzQ1IDkuNjgxNjRWOS42ODI5MloiIGZpbGw9IiMxMEE0QjMiLz4KPHBhdGggZD0iTTEyMi4xOTQgMTcuNjg2MkwxMTYuNzU2IDEuNjc5ODhDMTE2LjYxMyAxLjI4MDQyIDExNi40MDUgMC45NTUyMjQgMTE2LjE0MSAwLjcxMTk2NkMxMTUuODU5IDAuNDU0NjI1IDExNS41MzcgMC4zMjI3NTQgMTE1LjE4MyAwLjMyMjc1NEgxMTQuNjIxQzExNC4yOTkgMC4zMjI3NTQgMTEzLjk4OCAwLjQ1ODQ2NiAxMTMuNjk4IDAuNzI0NzY5QzExMy40MjQgMC45NzgyNjkgMTEzLjIyIDEuMzAwOTEgMTEzLjA5NCAxLjY4MzcyTDExMS40NTcgNi41MjA3TDExMi43MjYgMTAuNDk3M0MxMTMuNzcxIDcuMDE0OSAxMTQuODk3IDMuOTc0MTggMTE0Ljk1MSAzLjc5ODc4TDExOS42MjEgMTguNTIyM0MxMTkuODQ5IDE5LjI0MzEgMTIwLjYzIDE5LjYzNjEgMTIxLjM0OCAxOS4zOTI5QzEyMi4wNTYgMTkuMTUzNCAxMjIuNDM0IDE4LjM5MDQgMTIyLjE5NSAxNy42ODc1TDEyMi4xOTQgMTcuNjg2MloiIGZpbGw9IiNGMEY2RkYiLz4KPHBhdGggZD0iTTExMC40MjUgOS42ODI5MkwxMDcuNzA3IDE3LjY4NjRDMTA3LjQ2NyAxOC4zODk0IDEwNy44NDYgMTkuMTUyNSAxMDguNTUzIDE5LjM5MTlDMTA5LjI3MyAxOS42MzUxIDExMC4wNTMgMTkuMjQyMSAxMTAuMjgxIDE4LjUyMTJMMTExLjc0OCAxMy42ODUzTDExMC40MjUgOS42ODE2NFY5LjY4MjkyWiIgZmlsbD0iIzEwQTRCMyIvPgo8cGF0aCBkPSJNNTAuMjAwMyAxNi44ODg1SDQxLjcxOTRMNTAuODkyMSAyLjA3MDMxQzUxLjA2NiAxLjc4MjI0IDUxLjE1MTEgMS41MzM4NiA1MS4xNTExIDEuMzA5ODFDNTEuMTUxMSAxLjAyNTU4IDUxLjAzIDAuNzc1OTIyIDUwLjc5ODEgMC41ODg5OTdDNTAuNTgwMyAwLjQxMjMxNiA1MC4yOTA1IDAuMzIzOTc1IDQ5LjkzNzUgMC4zMjM5NzVIMzkuMDA2MkMzOC4yODk5IDAuMzIzOTc1IDM3LjcxMDEgMC45MDAxMTEgMzcuNzEwMSAxLjYxMTk2QzM3LjcxMDEgMi4zMjM4MSAzOC4yODk5IDIuODk5OTQgMzkuMDA2MiAyLjg5OTk0SDQ3LjQ2MDFMMzguMjE5IDE3LjcxMThDMzguMDQ1MSAxNy45Nzk0IDM3Ljk1NjIgMTguMjM4IDM3Ljk1NjIgMTguNDc5OUMzNy45NTYyIDE4Ljc4MzQgMzguMDc0NyAxOS4wMzY5IDM4LjI5NzYgMTkuMjE0OEMzOC41MDYzIDE5LjM4MTMgMzguNzkxIDE5LjQ2NTggMzkuMTQ0IDE5LjQ2NThINTAuMTk5QzUwLjkxNTMgMTkuNDY1OCA1MS40OTUgMTguODg5NiA1MS40OTUgMTguMTc3OEM1MS40OTUgMTcuNDY2IDUwLjkxNTMgMTYuODg5OCA1MC4xOTkgMTYuODg5OEw1MC4yMDAzIDE2Ljg4ODVaIiBmaWxsPSIjRjBGNkZGIi8+CjxwYXRoIGQ9Ik03MC42MzE1IDEuNTk5MTlDNzAuNjMxNSAwLjg4MzUwNCA3MC4wNDc5IDAuMzAyMjQ2IDY5LjMyNjQgMC4zMDIyNDZINTkuMjQ1NEM1OC41NDIgMC4zMDIyNDYgNTcuOTcyNiAwLjg2ODE0IDU3Ljk3MjYgMS41NjcxOVYyLjg5NDg2SDY5LjMyNzdDNzAuMDQ3OSAyLjg5NDg2IDcwLjYzMjggMi4zMTQ4OCA3MC42MzI4IDEuNTk3OTFMNzAuNjMxNSAxLjU5OTE5WiIgZmlsbD0iI0YwRjZGRiIvPgo8cGF0aCBkPSJNNjkuMzk3NCAxNi44NzE5SDU4LjA0MjJWMTguMTk5NkM1OC4wNDIyIDE4Ljg5ODYgNTguNjExNyAxOS40NjQ1IDU5LjMxNTEgMTkuNDY0NUg2OS4zOTYxQzcwLjExNjMgMTkuNDY0NSA3MC43MDEyIDE4Ljg4NDUgNzAuNzAxMiAxOC4xNjc2QzcwLjcwMTIgMTcuNDUwNiA3MC4xMTc2IDE2Ljg3MDYgNjkuMzk2MSAxNi44NzA2TDY5LjM5NzQgMTYuODcxOVoiIGZpbGw9IiNGMEY2RkYiLz4KPHBhdGggZD0iTTY5LjM5NzMgOC41ODY5N0g1NC44NjEzVjExLjE3OTZINjkuMzk3M0M3MC4xMTc0IDExLjE3OTYgNzAuNzAyMyAxMC41OTk2IDcwLjcwMjMgOS44ODI2NEM3MC43MDIzIDkuMTY2OTUgNzAuMTE4NyA4LjU4NTY5IDY5LjM5NzMgOC41ODU2OVY4LjU4Njk3WiIgZmlsbD0iI0YwRjZGRiIvPgo8cGF0aCBkPSJNODQuOTMyNyAxNi44NzE5SDc4LjM3OFYxLjY2NTczQzc4LjM3OCAwLjkyMTg3IDc3Ljc3MTMgMC4zMTg4NDggNzcuMDIyOCAwLjMxODg0OEM3Ni4yNzQzIDAuMzE4ODQ4IDc1LjY2NzUgMC45MjE4NyA3NS42Njc1IDEuNjY1NzNWMTguMTk4M0M3NS42Njc1IDE4Ljg5NzMgNzYuMjM2OSAxOS40NjMyIDc2Ljk0MDMgMTkuNDYzMkg4NC45MzE0Qzg1LjY1MTUgMTkuNDYzMiA4Ni4yMzY0IDE4Ljg4MzIgODYuMjM2NCAxOC4xNjYzQzg2LjIzNjQgMTcuNDQ5MyA4NS42NTI4IDE2Ljg2OTMgODQuOTMxNCAxNi44NjkzTDg0LjkzMjcgMTYuODcxOVoiIGZpbGw9IiNGMEY2RkYiLz4KPHBhdGggZD0iTTE1Mi4wMDUgMC4zMjAxMjhIMTQxLjk0NkMxNDEuMjI2IDAuMzIwMTI4IDE0MC42NDEgMC45MDAxMDUgMTQwLjY0MSAxLjYxNzA3QzE0MC42NDEgMi4zMzQwNCAxNDEuMjI0IDIuOTE0MDIgMTQxLjk0NiAyLjkxNDAySDE0NS42MlYxOC4xMjAyQzE0NS42MiAxOC44NjQgMTQ2LjIyNyAxOS40NjcxIDE0Ni45NzUgMTkuNDY3MUMxNDcuNzI0IDE5LjQ2NzEgMTQ4LjMzMSAxOC44NjQgMTQ4LjMzMSAxOC4xMjAyVjIuOTEyNzRIMTUyLjAwNUMxNTIuNzI1IDIuOTEyNzQgMTUzLjMxIDIuMzMyNzYgMTUzLjMxIDEuNjE1NzlDMTUzLjMxIDAuODk4ODI1IDE1Mi43MjYgMC4zMTg4NDggMTUyLjAwNSAwLjMxODg0OFYwLjMyMDEyOFoiIGZpbGw9IiNGMEY2RkYiLz4KPC9zdmc+Cg==", ...imgProps }))));

package/lib/components/AppHeader/AppHeaderLogo/AppHeaderLogo.js.map

@@ -1 +1 @@
-{"version":3,"file":"AppHeaderLogo.js","sourceRoot":"","sources":["../../../../src/components/AppHeader/AppHeaderLogo/AppHeaderLogo.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsE,MAAM,OAAO,CAAA;AAC1F,OAAO,GAAG,MAAM,YAAY,CAAA;AAI5B,OAAO,MAAM,MAAM,6BAA6B,CAAA;AAahD,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAAE,QAAQ,EAAE,YAAY,EAAE,aAAa,EAAsB,EAAE,EAAE,CAAC,CAC9F,gCAAS,YAAY,EAAE,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,IAAI,EAAE,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,SAAS,CAAC;IACzE,oBAAC,aAAa,IAAC,SAAS,EAAE,MAAM,CAAC,IAAI,eAAY,WAAW;QAC1D,6BACE,GAAG,EAAC,MAAM,EACV,GAAG,EAAC,g7RAAg7R,KACh7R,QAAQ,GACZ,CACY,CACZ,CACP,CAAA"}
+{"version":3,"file":"AppHeaderLogo.js","sourceRoot":"","sources":["../../../../src/components/AppHeader/AppHeaderLogo/AppHeaderLogo.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsE,MAAM,OAAO,CAAA;AAC1F,OAAO,GAAG,MAAM,YAAY,CAAA;AAI5B,OAAO,MAAM,MAAM,4BAA4B,CAAA;AAa/C,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAAE,QAAQ,EAAE,YAAY,EAAE,aAAa,EAAsB,EAAE,EAAE,CAAC,CAC9F,gCAAS,YAAY,EAAE,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,IAAI,EAAE,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,SAAS,CAAC;IACzE,oBAAC,aAAa,IAAC,SAAS,EAAE,MAAM,CAAC,IAAI,eAAY,WAAW;QAC1D,6BACE,GAAG,EAAC,MAAM,EACV,GAAG,EAAC,g7RAAg7R,KACh7R,QAAQ,GACZ,CACY,CACZ,CACP,CAAA"}

package/lib/components/AppHeader/AppHeaderLogo/{AppHeaderLogo.module.scss → AppHeaderLogo.module.css}

@@ -1,5 +1,3 @@
-@use '../../../../styles/helpers' as h;
-
 .root {
   flex: 0 0 auto;
   display: flex;
@@ -15,8 +13,7 @@
 
     &:focus {
       outline: none;
-
-      @include h.outlineSimple;
+      box-shadow: inset 0 0 0 var(--hive-outline-width) var(--hive-color-accessibility-outline);
     }
 
     img {

package/lib/components/AppHeader/AppHeaderMenu/AppHeaderMenu.js

@@ -4,7 +4,7 @@ import cn from 'classnames';
 import { Button } from '../../Button';
 import { Popover } from '../../Popover';
 import { useOpenCloseState } from '../../../hooks';
-import styles from './AppHeaderMenu.module.scss';
+import styles from './AppHeaderMenu.module.css';
 export const AppHeaderMenu = ({ separator, children }) => {
     const [anchorElement, setAnchorElement] = useState();
     const { isOpen, toggle, close } = useOpenCloseState();

package/lib/components/AppHeader/AppHeaderMenu/AppHeaderMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"AppHeaderMenu.js","sourceRoot":"","sources":["../../../../src/components/AppHeader/AppHeaderMenu/AppHeaderMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAa,QAAQ,EAAE,MAAM,OAAO,CAAA;AAClD,OAAO,EAAE,IAAI,IAAI,QAAQ,EAAE,MAAM,eAAe,CAAA;AAChD,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAA;AACrC,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAElD,OAAO,MAAM,MAAM,6BAA6B,CAAA;AAOhD,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAsB,EAAE,EAAE;IAC3E,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,EAAsB,CAAA;IACxE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAErD,OAAO,CACL,6BAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,SAAS,EAAE,CAAC;QAChE,oBAAC,MAAM,IACL,OAAO,EAAC,OAAO,EACf,KAAK,EAAC,WAAW,EACjB,OAAO,EAAE,MAAM,EACf,SAAS,EAAE,QAAQ,EACnB,GAAG,EAAE,gBAAgB,eACX,wBAAwB,EAClC,kBAAkB,EAAC,WAAW,EAC9B,SAAS,EAAE,MAAM,CAAC,YAAY,WAGvB;QACT,oBAAC,OAAO,IAAC,IAAI,EAAE,MAAM,EAAE,aAAa,EAAE,aAAa,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,CAAC,OAAO,IAC3F,QAAQ,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CACrB,CACN,CACP,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"AppHeaderMenu.js","sourceRoot":"","sources":["../../../../src/components/AppHeader/AppHeaderMenu/AppHeaderMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAa,QAAQ,EAAE,MAAM,OAAO,CAAA;AAClD,OAAO,EAAE,IAAI,IAAI,QAAQ,EAAE,MAAM,eAAe,CAAA;AAChD,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAA;AACrC,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAElD,OAAO,MAAM,MAAM,4BAA4B,CAAA;AAO/C,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAsB,EAAE,EAAE;IAC3E,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,EAAsB,CAAA;IACxE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAErD,OAAO,CACL,6BAAK,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,IAAI,EAAE,EAAE,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,SAAS,EAAE,CAAC;QAChE,oBAAC,MAAM,IACL,OAAO,EAAC,OAAO,EACf,KAAK,EAAC,WAAW,EACjB,OAAO,EAAE,MAAM,EACf,SAAS,EAAE,QAAQ,EACnB,GAAG,EAAE,gBAAgB,eACX,wBAAwB,EAClC,kBAAkB,EAAC,WAAW,EAC9B,SAAS,EAAE,MAAM,CAAC,YAAY,WAGvB;QACT,oBAAC,OAAO,IAAC,IAAI,EAAE,MAAM,EAAE,aAAa,EAAE,aAAa,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,CAAC,OAAO,IAC3F,QAAQ,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CACrB,CACN,CACP,CAAA;AACH,CAAC,CAAA"}

package/lib/components/AppHeader/AppHeaderMenu/AppHeaderMenu.module.css

@@ -0,0 +1,18 @@
+.root {
+  display: flex;
+  align-items: center;
+}
+
+.separator {
+  border-left: 1px solid var(--hive-color-neutral-light);
+}
+
+.content {
+  padding: calc(var(--hive-grid) * 2);
+  color: var(--hive-color-neutral-lighter);
+  background: var(--hive-color-brand-secondary);
+  display: flex;
+  flex-direction: column;
+  align-items: start;
+  gap: calc(var(--hive-grid) * 2);
+}

package/lib/components/AppHeader/EnvironmentBadge/EnvironmentBadge.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Box } from 'react-feather';
 import { Icon } from '../../Icon';
-import styles from './EnvironmentBadge.module.scss';
+import styles from './EnvironmentBadge.module.css';
 export const EnvironmentBadge = ({ environment }) => {
     return (React.createElement("span", { className: styles.root, "data-test": "environment-badge" },
         React.createElement(Icon, { icon: Box }),

package/lib/components/AppHeader/EnvironmentBadge/EnvironmentBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"EnvironmentBadge.js","sourceRoot":"","sources":["../../../../src/components/AppHeader/EnvironmentBadge/EnvironmentBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAA;AAEnC,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AAEjC,OAAO,MAAM,MAAM,gCAAgC,CAAA;AAMnD,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,WAAW,EAAyB,EAAE,EAAE;IACzE,OAAO,CACL,8BAAM,SAAS,EAAE,MAAM,CAAC,IAAI,eAAY,mBAAmB;QACzD,oBAAC,IAAI,IAAC,IAAI,EAAE,GAAG,GAAI;QAClB,WAAW,CACP,CACR,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"EnvironmentBadge.js","sourceRoot":"","sources":["../../../../src/components/AppHeader/EnvironmentBadge/EnvironmentBadge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAA;AAEnC,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AAEjC,OAAO,MAAM,MAAM,+BAA+B,CAAA;AAMlD,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,EAAE,WAAW,EAAyB,EAAE,EAAE;IACzE,OAAO,CACL,8BAAM,SAAS,EAAE,MAAM,CAAC,IAAI,eAAY,mBAAmB;QACzD,oBAAC,IAAI,IAAC,IAAI,EAAE,GAAG,GAAI;QAClB,WAAW,CACP,CACR,CAAA;AACH,CAAC,CAAA"}

package/lib/components/AppHeader/EnvironmentBadge/EnvironmentBadge.module.css

@@ -0,0 +1,11 @@
+.root {
+  display: inline-flex;
+  align-items: center;
+  gap: calc(var(--hive-grid) * 2);
+  color: #000;
+  background: var(--hive-color-error);
+  border-radius: calc(var(--hive-grid) * 3.5);
+  padding: 0 calc(var(--hive-grid) * 3);
+  height: calc(var(--hive-grid) * 7);
+  text-transform: capitalize;
+}

package/lib/components/AppHeader/SelectCluster/SelectCluster.js

@@ -3,7 +3,7 @@ import React, { useMemo } from 'react';
 import { CheckCircle } from 'react-feather';
 import { SelectField } from '../../Select';
 import { CenteredLoader } from '../../CenteredLoader';
-import styles from './SelectCluster.module.scss';
+import styles from './SelectCluster.module.css';
 const getSafeValue = (clusterName, clusterNames) => {
     if (!(clusterNames === null || clusterNames === void 0 ? void 0 : clusterNames.length)) {
         return { status: 'disabled', value: 'No Clusters' };

package/lib/components/AppHeader/SelectCluster/SelectCluster.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectCluster.js","sourceRoot":"","sources":["../../../../src/components/AppHeader/SelectCluster/SelectCluster.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,KAAK,EAAE,EAAM,OAAO,EAAE,MAAM,OAAO,CAAA;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAE3C,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAErD,OAAO,MAAM,MAAM,6BAA6B,CAAA;AAEhD,MAAM,YAAY,GAAG,CACnB,WAA0B,EAC1B,YAA6B,EAI7B,EAAE;IACF,IAAI,CAAC,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,MAAM,CAAA,EAAE,CAAC;QAC1B,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,aAAa,EAAE,CAAA;IACrD,CAAC;IAED,IAAI,CAAC,WAAW,EAAE,CAAC;QACjB,OAAO;YACL,MAAM,EAAE,cAAc;YACtB,KAAK,EAAE,gBAAgB;SACxB,CAAA;IACH,CAAC;IAED,OAAO;QACL,MAAM,EAAE,YAAY,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,cAAc;QACzE,KAAK,EAAE,WAAW;KACnB,CAAA;AACH,CAAC,CAAA;AAUD,MAAM,CAAC,MAAM,aAAa,GAA2B,CAAC,EAAE,eAAe,EAAE,WAAW,EAAE,YAAY,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC5H,MAAM,OAAO,GAAG,OAAO,CACrB,GAAG,EAAE,CACH,CAAC,YAAY,aAAZ,YAAY,cAAZ,YAAY,GAAI,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QAClC,KAAK,EAAE,IAAI;QACX,KAAK,EAAE,IAAI;QACX,YAAY,EACV,eAAe,IAAI,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CACzC,2CAAgB,iBAAiB,IAAE,eAAe,CAAC,IAAI,CAAC,CAAQ,CACjE,CAAC,CAAC,CAAC,CACF,oBAAC,cAAc,IAAC,IAAI,EAAC,OAAO,GAAG,CAChC;KACJ,CAAC,CAAC,EACL,CAAC,eAAe,EAAE,YAAY,CAAC,CAChC,CAAA;IAED,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,YAAY,CAAC,WAAW,EAAE,YAAY,CAAC,CAAA;IACjE,MAAM,QAAQ,GAAG,UAAU,IAAI,MAAM,KAAK,UAAU,CAAA;IAEpD,OAAO,CACL,oBAAC,WAAW,IACV,IAAI,EAAC,SAAS,EACd,KAAK,EAAC,gBAAgB,EACtB,aAAa,qBACH,gBAAgB,EAC1B,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC,EAC7D,UAAU,EAAE;YACV,UAAU,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,UAAU;SACpC,EACD,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,WAAW,EACrB,iBAAiB,EAAC,gBAAgB,EAClC,0BAA0B,EAAE,MAAM,CAAC,uBAAuB,EAC1D,iBAAiB,EAAE,EAAE,CAAC,MAAM,CAAC,cAAc,EAAE;YAC3C,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,KAAK,UAAU;YACxC,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE,MAAM,KAAK,cAAc;SACjD,CAAC,EACF,WAAW,EAAE,KAAK,EAClB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,GACZ,CACH,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"SelectCluster.js","sourceRoot":"","sources":["../../../../src/components/AppHeader/SelectCluster/SelectCluster.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,KAAK,EAAE,EAAM,OAAO,EAAE,MAAM,OAAO,CAAA;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAE3C,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AAErD,OAAO,MAAM,MAAM,4BAA4B,CAAA;AAE/C,MAAM,YAAY,GAAG,CACnB,WAA0B,EAC1B,YAA6B,EAI7B,EAAE;IACF,IAAI,CAAC,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,MAAM,CAAA,EAAE,CAAC;QAC1B,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,aAAa,EAAE,CAAA;IACrD,CAAC;IAED,IAAI,CAAC,WAAW,EAAE,CAAC;QACjB,OAAO;YACL,MAAM,EAAE,cAAc;YACtB,KAAK,EAAE,gBAAgB;SACxB,CAAA;IACH,CAAC;IAED,OAAO;QACL,MAAM,EAAE,YAAY,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,cAAc;QACzE,KAAK,EAAE,WAAW;KACnB,CAAA;AACH,CAAC,CAAA;AAUD,MAAM,CAAC,MAAM,aAAa,GAA2B,CAAC,EAAE,eAAe,EAAE,WAAW,EAAE,YAAY,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC5H,MAAM,OAAO,GAAG,OAAO,CACrB,GAAG,EAAE,CACH,CAAC,YAAY,aAAZ,YAAY,cAAZ,YAAY,GAAI,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QAClC,KAAK,EAAE,IAAI;QACX,KAAK,EAAE,IAAI;QACX,YAAY,EACV,eAAe,IAAI,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CACzC,2CAAgB,iBAAiB,IAAE,eAAe,CAAC,IAAI,CAAC,CAAQ,CACjE,CAAC,CAAC,CAAC,CACF,oBAAC,cAAc,IAAC,IAAI,EAAC,OAAO,GAAG,CAChC;KACJ,CAAC,CAAC,EACL,CAAC,eAAe,EAAE,YAAY,CAAC,CAChC,CAAA;IAED,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,YAAY,CAAC,WAAW,EAAE,YAAY,CAAC,CAAA;IACjE,MAAM,QAAQ,GAAG,UAAU,IAAI,MAAM,KAAK,UAAU,CAAA;IAEpD,OAAO,CACL,oBAAC,WAAW,IACV,IAAI,EAAC,SAAS,EACd,KAAK,EAAC,gBAAgB,EACtB,aAAa,qBACH,gBAAgB,EAC1B,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,CAAC,EAC7D,UAAU,EAAE;YACV,UAAU,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,UAAU;SACpC,EACD,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,WAAW,EACrB,iBAAiB,EAAC,gBAAgB,EAClC,0BAA0B,EAAE,MAAM,CAAC,uBAAuB,EAC1D,iBAAiB,EAAE,EAAE,CAAC,MAAM,CAAC,cAAc,EAAE;YAC3C,CAAC,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,KAAK,UAAU;YACxC,CAAC,MAAM,CAAC,YAAY,CAAC,EAAE,MAAM,KAAK,cAAc;SACjD,CAAC,EACF,WAAW,EAAE,KAAK,EAClB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,GACZ,CACH,CAAA;AACH,CAAC,CAAA"}

package/lib/components/AppHeader/SelectCluster/SelectCluster.module.css

@@ -0,0 +1,75 @@
+.select {
+  width: 260px;
+}
+
+.select.disabled :global .hz-select-field__control {
+  color: var(--hive-color-text-secondary);
+  background-color: transparent;
+}
+
+.select.disabled :global .hz-select-field__control :global .hz-select-field__single-value,
+.select.disabled :global .hz-select-field__control :global .hz-select-field__trailing-note,
+.select.disabled :global .hz-select-field__control :global .hz-select-field__indicators svg {
+  color: var(--hive-color-text-secondary);
+}
+
+.select :global .hz-select-field__control {
+  background: none;
+  border-radius: var(--hive-border-radius);
+  border: 1px solid var(--hive-color-text-secondary);
+}
+
+.select :global .hz-select-field__control :global .hz-select-field__input-container,
+.select :global .hz-select-field__control :global .hz-select-field__value-container,
+.select :global .hz-select-field__control :global .hz-select-field__trailing-note {
+  color: var(--hive-color-neutral-lighter);
+}
+
+.select :global .hz-select-field__single-value {
+  color: var(--hive-color-neutral-lighter);
+}
+
+.select :global .hz-select-field__indicators svg {
+  color: var(--hive-color-neutral-lighter);
+}
+
+.select .selectIconLeftContainer {
+  box-sizing: content-box;
+
+  .selectIconLeft {
+    color: var(--hive-color-success);
+
+    &.disconnected {
+      color: var(--hive-color-error);
+    }
+
+    &.disabled {
+      color: var(--hive-color-text-secondary);
+    }
+  }
+}
+
+.menuPortal :global .hz-select-field__menu {
+  border: none;
+  background: var(--hive-color-brand-secondary);
+  border-radius: 0 0 var(--hive-border-radius) var(--hive-border-radius);
+}
+
+.menuPortal :global .hz-select-field__option:active {
+  background: none;
+}
+
+.menuPortal :global .hz-select-field__option :global .hz-select-field__value-container,
+.menuPortal :global .hz-select-field__option :global .hz-select-field__trailing-note {
+  color: var(--hive-color-neutral-lighter);
+}
+
+.menuPortal :global .hz-select-field__option--is-focused {
+  background: var(--hive-color-brand-accent);
+  box-shadow: none;
+}
+
+.menuPortal :global .hz-select-field__option--is-focused :global .hz-select-field__value-container,
+.menuPortal :global .hz-select-field__option--is-focused :global .hz-select-field__trailing-note {
+  color: var(--hive-color-brand-text);
+}