diff --git a/distribution/downloads/src/main/resources/files b/distribution/downloads/src/main/resources/files
index 898459da79..8eb4b4d9a0 100644
--- a/distribution/downloads/src/main/resources/files
+++ b/distribution/downloads/src/main/resources/files
@@ -9,3 +9,6 @@ mvn:documentation/keycloak-documentation:keycloak-documentation
npm:js/libs/keycloak-admin-client/target/keycloak-keycloak-admin-client-$$VERSION$$.tgz:keycloak-admin-client-$$VERSION$$.tgz
npm:js/libs/keycloak-js/target/keycloak-js-$$VERSION$$.tgz:keycloak-js-$$VERSION$$.tgz
+npm:js/libs/ui-shared/target/keycloak-keycloak-ui-shared-$$VERSION$$.tgz:keycloak-ui-shared-$$VERSION$$.tgz
+npm:js/apps/account-ui/target/keycloak-keycloak-account-ui-$$VERSION$$.tgz:keycloak-account-ui-$$VERSION$$.tgz
+
diff --git a/js/apps/account-ui/.gitignore b/js/apps/account-ui/.gitignore
index 314b4cb1ac..b4800ec75b 100644
--- a/js/apps/account-ui/.gitignore
+++ b/js/apps/account-ui/.gitignore
@@ -1,4 +1,5 @@
/test-results/
/playwright-report/
/playwright/.cache/
-.auth/
\ No newline at end of file
+.auth/
+lib/
\ No newline at end of file
diff --git a/js/apps/account-ui/README.md b/js/apps/account-ui/README.md
index 2eb66bc077..80d4da3b39 100644
--- a/js/apps/account-ui/README.md
+++ b/js/apps/account-ui/README.md
@@ -1,3 +1,97 @@
# Keycloak Account UI
This project is the next generation of the Keycloak Account UI. It is written with React and [PatternFly 4](https://www.patternfly.org/v4/) and uses [Vite](https://vitejs.dev/guide/).
+
+## Features
+
+Contains all the "pages" from the account-ui as re-usable components, all the functions to save and the side menu to use in your own build of the account-ui
+
+## Install
+
+```bash
+npm i @keycloak/keycloak-account-ui
+```
+
+## Usage
+
+To use these pages you'll need to add `KeycloakProvider` in your component hierarchy to setup what client, realm and url to use.
+
+```jsx
+import { KeycloakProvider } from "@keycloak/keycloak-account-ui";
+
+//...
+
+
+ {/* rest of you application */}
+
+```
+
+### Translation
+
+For the translation we use `react-i18next` you can [set it up](https://react.i18next.com/) as described on their website.
+If you want to use the translations that are provided then you need to add `i18next-http-backend` to your project and add:
+
+```ts
+
+backend: {
+ loadPath: `http://localhost:8180/resources/master/account/{{lng}}`,
+ parse: (data: string) => {
+ const messages = JSON.parse(data);
+
+ const result: Record = {};
+ messages.forEach((v) => (result[v.key] = v.value));
+ return result;
+ },
+},
+```
+to the `i18next` config object.
+
+### Save functions
+
+If you want to build your own "pages" you can still reuse the save functions:
+ * deleteConsent
+ * deleteCredentials
+ * deleteSession
+ * getApplications
+ * getCredentials
+ * getDevices
+ * getGroups
+ * getLinkedAccounts
+ * getPermissionRequests
+ * getPersonalInfo
+ * getSupportedLocales
+ * linkAccount
+ * savePersonalInfo
+ * unLinkAccount
+
+Example:
+```ts
+import { savePersonalInfo, useEnvironment } from "@keycloak/keycloak-account-ui";
+
+//...
+function App() {
+ // the save function also needs to have the context so that it knows where to POST
+ // this hook gives us access to the `KeycloakProvider` context
+ const context = useEnvironment();
+ const submit = async (data) => {
+ try {
+ await savePersonalInfo(context, data);
+ } catch (error) {
+ // Error contains `name` and `value` of the server side errors
+ // and your app will have better error handling ;)
+ console.error(error);
+ }
+}
+// ...
+```
+## Building
+
+To build a library instead of an app you need to add the `LIB=true` environment variable.
+
+```bash
+LIB=true pnpm run build
+```
\ No newline at end of file
diff --git a/js/apps/account-ui/package.json b/js/apps/account-ui/package.json
index bd33e1da25..346a9ae8e2 100644
--- a/js/apps/account-ui/package.json
+++ b/js/apps/account-ui/package.json
@@ -1,14 +1,18 @@
{
- "name": "account-ui",
+ "name": "@keycloak/keycloak-account-ui",
+ "version": "999.0.0-SNAPSHOT",
"type": "module",
- "main": "dist/account-ui.js",
- "types": "./dist/account-ui.d.ts",
+ "main": "lib/keycloak-account-ui.js",
+ "types": "./lib/keycloak-account-ui.d.ts",
"exports": {
".": {
- "import": "./dist/account-ui.js",
- "types": "./dist/account-ui.d.ts"
+ "import": "./lib/keycloak-account-ui.js",
+ "types": "./lib/keycloak-account-ui.d.ts"
}
},
+ "files": [
+ "lib"
+ ],
"scripts": {
"dev": "wireit",
"build": "wireit",
@@ -30,7 +34,7 @@
"react-hook-form": "^7.51.3",
"react-i18next": "^14.1.0",
"react-router-dom": "^6.22.3",
- "ui-shared": "workspace:*"
+ "@keycloak/keycloak-ui-shared": "workspace:*"
},
"devDependencies": {
"@keycloak/keycloak-admin-client": "workspace:*",
diff --git a/js/apps/account-ui/pom.xml b/js/apps/account-ui/pom.xml
index 655e05e368..c90a569846 100644
--- a/js/apps/account-ui/pom.xml
+++ b/js/apps/account-ui/pom.xml
@@ -172,6 +172,25 @@
+
+ com.github.eirslett
+ frontend-maven-plugin
+
+
+ pack
+ package
+
+ pnpm
+
+
+ pack --pack-destination=target
+
+ true
+
+
+
+
+
\ No newline at end of file
diff --git a/js/apps/account-ui/src/account-security/AccountRow.tsx b/js/apps/account-ui/src/account-security/AccountRow.tsx
index b8d7c67889..5f5d7e3543 100644
--- a/js/apps/account-ui/src/account-security/AccountRow.tsx
+++ b/js/apps/account-ui/src/account-security/AccountRow.tsx
@@ -12,7 +12,7 @@ import {
} from "@patternfly/react-core";
import { LinkIcon, UnlinkIcon } from "@patternfly/react-icons";
import { useTranslation } from "react-i18next";
-import { IconMapper, useAlerts } from "ui-shared";
+import { IconMapper, useAlerts } from "@keycloak/keycloak-ui-shared";
import { linkAccount, unLinkAccount } from "../api/methods";
import { LinkedAccountRepresentation } from "../api/representations";
diff --git a/js/apps/account-ui/src/account-security/DeviceActivity.tsx b/js/apps/account-ui/src/account-security/DeviceActivity.tsx
index 70795611dc..bccff2a442 100644
--- a/js/apps/account-ui/src/account-security/DeviceActivity.tsx
+++ b/js/apps/account-ui/src/account-security/DeviceActivity.tsx
@@ -23,7 +23,7 @@ import {
} from "@patternfly/react-icons";
import { useState } from "react";
import { useTranslation } from "react-i18next";
-import { ContinueCancelModal, useAlerts } from "ui-shared";
+import { ContinueCancelModal, useAlerts } from "@keycloak/keycloak-ui-shared";
import { deleteSession, getDevices } from "../api/methods";
import {
ClientRepresentation,
diff --git a/js/apps/account-ui/src/applications/Applications.tsx b/js/apps/account-ui/src/applications/Applications.tsx
index fc464b0a15..d9f6bde65e 100644
--- a/js/apps/account-ui/src/applications/Applications.tsx
+++ b/js/apps/account-ui/src/applications/Applications.tsx
@@ -22,7 +22,7 @@ import {
} from "@patternfly/react-icons";
import { useState } from "react";
import { useTranslation } from "react-i18next";
-import { ContinueCancelModal, useAlerts } from "ui-shared";
+import { ContinueCancelModal, useAlerts } from "@keycloak/keycloak-ui-shared";
import { deleteConsent, getApplications } from "../api/methods";
import { ClientRepresentation } from "../api/representations";
import { Page } from "../components/page/Page";
diff --git a/js/apps/account-ui/src/personal-info/PersonalInfo.tsx b/js/apps/account-ui/src/personal-info/PersonalInfo.tsx
index b1fae4f73c..7dd58691cc 100644
--- a/js/apps/account-ui/src/personal-info/PersonalInfo.tsx
+++ b/js/apps/account-ui/src/personal-info/PersonalInfo.tsx
@@ -17,7 +17,7 @@ import {
debeerify,
setUserProfileServerError,
useAlerts,
-} from "ui-shared";
+} from "@keycloak/keycloak-ui-shared";
import {
getPersonalInfo,
diff --git a/js/apps/account-ui/src/resources/EditTheResource.tsx b/js/apps/account-ui/src/resources/EditTheResource.tsx
index 04d2d4c33e..e9b07bd0b4 100644
--- a/js/apps/account-ui/src/resources/EditTheResource.tsx
+++ b/js/apps/account-ui/src/resources/EditTheResource.tsx
@@ -3,7 +3,11 @@ import { Fragment, useEffect } from "react";
import { FormProvider, useFieldArray, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { SelectControl, TextControl, useAlerts } from "ui-shared";
+import {
+ SelectControl,
+ TextControl,
+ useAlerts,
+} from "@keycloak/keycloak-ui-shared";
import { updatePermissions } from "../api";
import type { Permission, Resource } from "../api/representations";
import { useEnvironment } from "../root/KeycloakContext";
diff --git a/js/apps/account-ui/src/resources/PermissionRequest.tsx b/js/apps/account-ui/src/resources/PermissionRequest.tsx
index 02b9d63786..7a0f80dc41 100644
--- a/js/apps/account-ui/src/resources/PermissionRequest.tsx
+++ b/js/apps/account-ui/src/resources/PermissionRequest.tsx
@@ -11,7 +11,7 @@ import { UserCheckIcon } from "@patternfly/react-icons";
import { Table, Tbody, Td, Th, Thead, Tr } from "@patternfly/react-table";
import { useState } from "react";
import { useTranslation } from "react-i18next";
-import { useAlerts } from "ui-shared";
+import { useAlerts } from "@keycloak/keycloak-ui-shared";
import { fetchPermission, updateRequest } from "../api";
import { Permission, Resource } from "../api/representations";
diff --git a/js/apps/account-ui/src/resources/ResourcesTab.tsx b/js/apps/account-ui/src/resources/ResourcesTab.tsx
index 9ffe1f5898..7b34fc1267 100644
--- a/js/apps/account-ui/src/resources/ResourcesTab.tsx
+++ b/js/apps/account-ui/src/resources/ResourcesTab.tsx
@@ -33,7 +33,7 @@ import {
import { useState } from "react";
import { useTranslation } from "react-i18next";
-import { ContinueCancelModal, useAlerts } from "ui-shared";
+import { ContinueCancelModal, useAlerts } from "@keycloak/keycloak-ui-shared";
import { fetchPermission, fetchResources, updatePermissions } from "../api";
import { getPermissionRequests } from "../api/methods";
import { Links } from "../api/parse-links";
diff --git a/js/apps/account-ui/src/resources/ShareTheResource.tsx b/js/apps/account-ui/src/resources/ShareTheResource.tsx
index f79bb4d577..6001514fc7 100644
--- a/js/apps/account-ui/src/resources/ShareTheResource.tsx
+++ b/js/apps/account-ui/src/resources/ShareTheResource.tsx
@@ -18,8 +18,11 @@ import {
useWatch,
} from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormErrorText, SelectControl, useAlerts } from "ui-shared";
-
+import {
+ FormErrorText,
+ SelectControl,
+ useAlerts,
+} from "@keycloak/keycloak-ui-shared";
import { updateRequest } from "../api";
import { Permission, Resource } from "../api/representations";
import { useEnvironment } from "../root/KeycloakContext";
diff --git a/js/apps/account-ui/src/root/Header.tsx b/js/apps/account-ui/src/root/Header.tsx
index e7d05b21b3..38d0de6939 100644
--- a/js/apps/account-ui/src/root/Header.tsx
+++ b/js/apps/account-ui/src/root/Header.tsx
@@ -2,7 +2,7 @@ import { Button } from "@patternfly/react-core";
import { ExternalLinkSquareAltIcon } from "@patternfly/react-icons";
import { useTranslation } from "react-i18next";
import { useHref } from "react-router-dom";
-import { KeycloakMasthead, label } from "ui-shared";
+import { KeycloakMasthead, label } from "@keycloak/keycloak-ui-shared";
import { environment } from "../environment";
import { joinPath } from "../utils/joinPath";
diff --git a/js/apps/account-ui/src/root/KeycloakContext.tsx b/js/apps/account-ui/src/root/KeycloakContext.tsx
index 7be6bc6f80..f611a38939 100644
--- a/js/apps/account-ui/src/root/KeycloakContext.tsx
+++ b/js/apps/account-ui/src/root/KeycloakContext.tsx
@@ -9,7 +9,7 @@ import {
useRef,
useState,
} from "react";
-import { AlertProvider, Help } from "ui-shared";
+import { AlertProvider, Help } from "@keycloak/keycloak-ui-shared";
import { Environment } from "../environment";
import { ErrorPage } from "./ErrorPage";
diff --git a/js/apps/account-ui/vite.config.ts b/js/apps/account-ui/vite.config.ts
index 044d3289ff..718b494da6 100644
--- a/js/apps/account-ui/vite.config.ts
+++ b/js/apps/account-ui/vite.config.ts
@@ -18,6 +18,7 @@ export default defineConfig(({ mode }) => {
}
const lib = env.LIB
? {
+ outDir: "lib",
lib: {
entry: path.resolve(__dirname, "src/index.ts"),
formats: ["es"],
@@ -37,7 +38,7 @@ export default defineConfig(({ mode }) => {
modulePreload: false,
cssMinify: "lightningcss",
rollupOptions: {
- external: external,
+ external,
},
},
plugins,
diff --git a/js/apps/admin-ui/package.json b/js/apps/admin-ui/package.json
index a1dc60f1a4..fd93f5bcab 100644
--- a/js/apps/admin-ui/package.json
+++ b/js/apps/admin-ui/package.json
@@ -86,7 +86,7 @@
"react-i18next": "^14.1.0",
"react-router-dom": "^6.22.3",
"reactflow": "^11.11.1",
- "ui-shared": "workspace:*",
+ "@keycloak/keycloak-ui-shared": "workspace:*",
"use-react-router-breadcrumbs": "^4.0.1"
},
"devDependencies": {
diff --git a/js/apps/admin-ui/src/App.tsx b/js/apps/admin-ui/src/App.tsx
index 62840fdacb..266dbc121f 100644
--- a/js/apps/admin-ui/src/App.tsx
+++ b/js/apps/admin-ui/src/App.tsx
@@ -1,7 +1,7 @@
import { Page } from "@patternfly/react-core";
import { PropsWithChildren, Suspense } from "react";
import { Outlet } from "react-router-dom";
-import { Help, mainPageContentId } from "ui-shared";
+import { Help, mainPageContentId } from "@keycloak/keycloak-ui-shared";
import { Header } from "./PageHeader";
import { PageNav } from "./PageNav";
diff --git a/js/apps/admin-ui/src/PageHeader.tsx b/js/apps/admin-ui/src/PageHeader.tsx
index afc3ced7e8..11a3256160 100644
--- a/js/apps/admin-ui/src/PageHeader.tsx
+++ b/js/apps/admin-ui/src/PageHeader.tsx
@@ -18,7 +18,7 @@ import { BarsIcon, EllipsisVIcon, HelpIcon } from "@patternfly/react-icons";
import { useState } from "react";
import { useTranslation } from "react-i18next";
import { Link, useHref } from "react-router-dom";
-import { useHelp } from "ui-shared";
+import { useHelp } from "@keycloak/keycloak-ui-shared";
import { HelpHeader } from "./components/help-enabler/HelpHeader";
import { useRealm } from "./context/realm-context/RealmContext";
diff --git a/js/apps/admin-ui/src/authentication/BindFlowDialog.tsx b/js/apps/admin-ui/src/authentication/BindFlowDialog.tsx
index 5bca22f5c5..3d21a6f499 100644
--- a/js/apps/admin-ui/src/authentication/BindFlowDialog.tsx
+++ b/js/apps/admin-ui/src/authentication/BindFlowDialog.tsx
@@ -9,7 +9,7 @@ import {
import { SelectVariant } from "@patternfly/react-core/deprecated";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { SelectControl } from "ui-shared";
+import { SelectControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/authentication/components/EditFlow.tsx b/js/apps/admin-ui/src/authentication/components/EditFlow.tsx
index 03298ff704..b13412073d 100644
--- a/js/apps/admin-ui/src/authentication/components/EditFlow.tsx
+++ b/js/apps/admin-ui/src/authentication/components/EditFlow.tsx
@@ -10,7 +10,7 @@ import { PencilAltIcon } from "@patternfly/react-icons";
import { useEffect } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { TextAreaControl, TextControl } from "ui-shared";
+import { TextAreaControl, TextControl } from "@keycloak/keycloak-ui-shared";
import useToggle from "../../utils/useToggle";
import type { ExpandableExecution } from "../execution-model";
diff --git a/js/apps/admin-ui/src/authentication/components/ExecutionConfigModal.tsx b/js/apps/admin-ui/src/authentication/components/ExecutionConfigModal.tsx
index 360b0f6d87..cbaf9b99e5 100644
--- a/js/apps/admin-ui/src/authentication/components/ExecutionConfigModal.tsx
+++ b/js/apps/admin-ui/src/authentication/components/ExecutionConfigModal.tsx
@@ -14,7 +14,7 @@ import { CogIcon, TrashIcon } from "@patternfly/react-icons";
import { useEffect, useState } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
import { DynamicComponents } from "../../components/dynamic/DynamicComponents";
diff --git a/js/apps/admin-ui/src/authentication/components/modals/AddSubFlowModal.tsx b/js/apps/admin-ui/src/authentication/components/modals/AddSubFlowModal.tsx
index 58fda90629..b0db6a7745 100644
--- a/js/apps/admin-ui/src/authentication/components/modals/AddSubFlowModal.tsx
+++ b/js/apps/admin-ui/src/authentication/components/modals/AddSubFlowModal.tsx
@@ -9,7 +9,7 @@ import {
import { useEffect, useState } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { SelectControl, TextControl } from "ui-shared";
+import { SelectControl, TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../../admin-client";
import { useFetch } from "../../../utils/useFetch";
diff --git a/js/apps/admin-ui/src/authentication/form/CreateFlow.tsx b/js/apps/admin-ui/src/authentication/form/CreateFlow.tsx
index 3c632f7650..e4278ec6ab 100644
--- a/js/apps/admin-ui/src/authentication/form/CreateFlow.tsx
+++ b/js/apps/admin-ui/src/authentication/form/CreateFlow.tsx
@@ -9,7 +9,7 @@ import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
-import { SelectControl } from "ui-shared";
+import { SelectControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
import { FormAccess } from "../../components/form/FormAccess";
diff --git a/js/apps/admin-ui/src/authentication/form/NameDescription.tsx b/js/apps/admin-ui/src/authentication/form/NameDescription.tsx
index e86733899e..302ab6c124 100644
--- a/js/apps/admin-ui/src/authentication/form/NameDescription.tsx
+++ b/js/apps/admin-ui/src/authentication/form/NameDescription.tsx
@@ -1,5 +1,5 @@
import { useTranslation } from "react-i18next";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
export const NameDescription = () => {
const { t } = useTranslation();
diff --git a/js/apps/admin-ui/src/authentication/policies/CibaPolicy.tsx b/js/apps/admin-ui/src/authentication/policies/CibaPolicy.tsx
index 5958e9d14d..37f7cf7f04 100644
--- a/js/apps/admin-ui/src/authentication/policies/CibaPolicy.tsx
+++ b/js/apps/admin-ui/src/authentication/policies/CibaPolicy.tsx
@@ -9,7 +9,7 @@ import {
import { useEffect } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { SelectControl, TextControl } from "ui-shared";
+import { SelectControl, TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
import { FormAccess } from "../../components/form/FormAccess";
diff --git a/js/apps/admin-ui/src/authentication/policies/OtpPolicy.tsx b/js/apps/admin-ui/src/authentication/policies/OtpPolicy.tsx
index b65c7f2932..a32ea1ffdf 100644
--- a/js/apps/admin-ui/src/authentication/policies/OtpPolicy.tsx
+++ b/js/apps/admin-ui/src/authentication/policies/OtpPolicy.tsx
@@ -18,7 +18,7 @@ import {
NumberControl,
SelectControl,
SwitchControl,
-} from "ui-shared";
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
import { FormAccess } from "../../components/form/FormAccess";
diff --git a/js/apps/admin-ui/src/authentication/policies/PolicyRow.tsx b/js/apps/admin-ui/src/authentication/policies/PolicyRow.tsx
index ef58dd87ad..b201289d46 100644
--- a/js/apps/admin-ui/src/authentication/policies/PolicyRow.tsx
+++ b/js/apps/admin-ui/src/authentication/policies/PolicyRow.tsx
@@ -12,7 +12,7 @@ import {
import { MinusCircleIcon } from "@patternfly/react-icons";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormErrorText, HelpItem } from "ui-shared";
+import { FormErrorText, HelpItem } from "@keycloak/keycloak-ui-shared";
import "./policy-row.css";
diff --git a/js/apps/admin-ui/src/authentication/policies/WebauthnPolicy.tsx b/js/apps/admin-ui/src/authentication/policies/WebauthnPolicy.tsx
index b7c912524c..edab37171c 100644
--- a/js/apps/admin-ui/src/authentication/policies/WebauthnPolicy.tsx
+++ b/js/apps/admin-ui/src/authentication/policies/WebauthnPolicy.tsx
@@ -21,7 +21,7 @@ import {
SwitchControl,
TextControl,
useHelp,
-} from "ui-shared";
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
import { FormAccess } from "../../components/form/FormAccess";
diff --git a/js/apps/admin-ui/src/client-scopes/EditClientScope.tsx b/js/apps/admin-ui/src/client-scopes/EditClientScope.tsx
index d9a5ea319d..0e1f73785e 100644
--- a/js/apps/admin-ui/src/client-scopes/EditClientScope.tsx
+++ b/js/apps/admin-ui/src/client-scopes/EditClientScope.tsx
@@ -14,7 +14,7 @@ import { DropdownItem } from "@patternfly/react-core/deprecated";
import { useState } from "react";
import { useTranslation } from "react-i18next";
import { useNavigate } from "react-router-dom";
-import { useHelp } from "ui-shared";
+import { useHelp } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/client-scopes/details/MappingDetails.tsx b/js/apps/admin-ui/src/client-scopes/details/MappingDetails.tsx
index ff21ee48c4..4ba51cfc01 100644
--- a/js/apps/admin-ui/src/client-scopes/details/MappingDetails.tsx
+++ b/js/apps/admin-ui/src/client-scopes/details/MappingDetails.tsx
@@ -14,7 +14,7 @@ import { useState } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useMatch, useNavigate } from "react-router-dom";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
import { useConfirmDialog } from "../../components/confirm-dialog/ConfirmDialog";
diff --git a/js/apps/admin-ui/src/client-scopes/details/ScopeForm.tsx b/js/apps/admin-ui/src/client-scopes/details/ScopeForm.tsx
index bfeaaec6b8..bc41f71846 100644
--- a/js/apps/admin-ui/src/client-scopes/details/ScopeForm.tsx
+++ b/js/apps/admin-ui/src/client-scopes/details/ScopeForm.tsx
@@ -5,7 +5,11 @@ import { useEffect } from "react";
import { FormProvider, useForm, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link } from "react-router-dom";
-import { SelectControl, TextAreaControl, TextControl } from "ui-shared";
+import {
+ SelectControl,
+ TextAreaControl,
+ TextControl,
+} from "@keycloak/keycloak-ui-shared";
import { getProtocolName } from "../../clients/utils";
import { DefaultSwitchControl } from "../../components/SwitchControl";
diff --git a/js/apps/admin-ui/src/clients/AdvancedTab.tsx b/js/apps/admin-ui/src/clients/AdvancedTab.tsx
index 69f6c0f22d..78d37f2730 100644
--- a/js/apps/admin-ui/src/clients/AdvancedTab.tsx
+++ b/js/apps/admin-ui/src/clients/AdvancedTab.tsx
@@ -4,7 +4,7 @@ import { AlertVariant, PageSection, Text } from "@patternfly/react-core";
import type { TFunction } from "i18next";
import { useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { ScrollForm } from "ui-shared";
+import { ScrollForm } from "@keycloak/keycloak-ui-shared";
import type { AddAlertFunction } from "../components/alert/Alerts";
import { convertAttributeNameToForm, toUpperCase } from "../util";
import type { FormFields, SaveOptions } from "./ClientDetails";
diff --git a/js/apps/admin-ui/src/clients/ClientDescription.tsx b/js/apps/admin-ui/src/clients/ClientDescription.tsx
index 4d08ac0a22..967f41c8c8 100644
--- a/js/apps/admin-ui/src/clients/ClientDescription.tsx
+++ b/js/apps/admin-ui/src/clients/ClientDescription.tsx
@@ -1,5 +1,5 @@
import { useTranslation } from "react-i18next";
-import { TextControl, TextAreaControl } from "ui-shared";
+import { TextControl, TextAreaControl } from "@keycloak/keycloak-ui-shared";
import { FormAccess } from "../components/form/FormAccess";
import { DefaultSwitchControl } from "../components/SwitchControl";
diff --git a/js/apps/admin-ui/src/clients/ClientSettings.tsx b/js/apps/admin-ui/src/clients/ClientSettings.tsx
index fe79a1d936..c4a5583cc5 100644
--- a/js/apps/admin-ui/src/clients/ClientSettings.tsx
+++ b/js/apps/admin-ui/src/clients/ClientSettings.tsx
@@ -2,7 +2,7 @@ import type ClientRepresentation from "@keycloak/keycloak-admin-client/lib/defs/
import { Form } from "@patternfly/react-core";
import { useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { ScrollForm } from "ui-shared";
+import { ScrollForm } from "@keycloak/keycloak-ui-shared";
import { ClientDescription } from "./ClientDescription";
import { FormFields } from "./ClientDetails";
import { AccessSettings } from "./add/AccessSettings";
diff --git a/js/apps/admin-ui/src/clients/add/AccessSettings.tsx b/js/apps/admin-ui/src/clients/add/AccessSettings.tsx
index 53c3a5d508..624b1f677c 100644
--- a/js/apps/admin-ui/src/clients/add/AccessSettings.tsx
+++ b/js/apps/admin-ui/src/clients/add/AccessSettings.tsx
@@ -1,6 +1,6 @@
import { useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { FixedButtonsGroup } from "../../components/form/FixedButtonGroup";
import { FormAccess } from "../../components/form/FormAccess";
diff --git a/js/apps/admin-ui/src/clients/add/CapabilityConfig.tsx b/js/apps/admin-ui/src/clients/add/CapabilityConfig.tsx
index f5c63901c5..d636fb6fdf 100644
--- a/js/apps/admin-ui/src/clients/add/CapabilityConfig.tsx
+++ b/js/apps/admin-ui/src/clients/add/CapabilityConfig.tsx
@@ -10,7 +10,7 @@ import {
} from "@patternfly/react-core";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { DefaultSwitchControl } from "../../components/SwitchControl";
import { FormAccess } from "../../components/form/FormAccess";
import { convertAttributeNameToForm } from "../../util";
diff --git a/js/apps/admin-ui/src/clients/add/GeneralSettings.tsx b/js/apps/admin-ui/src/clients/add/GeneralSettings.tsx
index 7bdb7b5754..b08cc852fc 100644
--- a/js/apps/admin-ui/src/clients/add/GeneralSettings.tsx
+++ b/js/apps/admin-ui/src/clients/add/GeneralSettings.tsx
@@ -1,5 +1,5 @@
import { useTranslation } from "react-i18next";
-import { SelectControl } from "ui-shared";
+import { SelectControl } from "@keycloak/keycloak-ui-shared";
import { FormAccess } from "../../components/form/FormAccess";
import { useLoginProviders } from "../../context/server-info/ServerInfoProvider";
import { ClientDescription } from "../ClientDescription";
diff --git a/js/apps/admin-ui/src/clients/add/LoginSettings.tsx b/js/apps/admin-ui/src/clients/add/LoginSettings.tsx
index fbe08dc5a9..7617afabbc 100644
--- a/js/apps/admin-ui/src/clients/add/LoginSettings.tsx
+++ b/js/apps/admin-ui/src/clients/add/LoginSettings.tsx
@@ -1,7 +1,7 @@
import { FormGroup } from "@patternfly/react-core";
import { useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem, TextControl } from "ui-shared";
+import { HelpItem, TextControl } from "@keycloak/keycloak-ui-shared";
import { MultiLineInput } from "../../components/multi-line-input/MultiLineInput";
import { convertAttributeNameToForm } from "../../util";
diff --git a/js/apps/admin-ui/src/clients/add/LoginSettingsPanel.tsx b/js/apps/admin-ui/src/clients/add/LoginSettingsPanel.tsx
index 8be7141745..9cb28d92ed 100644
--- a/js/apps/admin-ui/src/clients/add/LoginSettingsPanel.tsx
+++ b/js/apps/admin-ui/src/clients/add/LoginSettingsPanel.tsx
@@ -1,6 +1,6 @@
import { useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { SelectControl, TextAreaControl } from "ui-shared";
+import { SelectControl, TextAreaControl } from "@keycloak/keycloak-ui-shared";
import { DefaultSwitchControl } from "../../components/SwitchControl";
import { FormAccess } from "../../components/form/FormAccess";
import { useServerInfo } from "../../context/server-info/ServerInfoProvider";
diff --git a/js/apps/admin-ui/src/clients/add/LogoutPanel.tsx b/js/apps/admin-ui/src/clients/add/LogoutPanel.tsx
index 632554be42..c21c3c3db5 100644
--- a/js/apps/admin-ui/src/clients/add/LogoutPanel.tsx
+++ b/js/apps/admin-ui/src/clients/add/LogoutPanel.tsx
@@ -1,7 +1,7 @@
import { FormGroup, Switch } from "@patternfly/react-core";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem, TextControl } from "ui-shared";
+import { HelpItem, TextControl } from "@keycloak/keycloak-ui-shared";
import { FixedButtonsGroup } from "../../components/form/FixedButtonGroup";
import { FormAccess } from "../../components/form/FormAccess";
diff --git a/js/apps/admin-ui/src/clients/add/SamlConfig.tsx b/js/apps/admin-ui/src/clients/add/SamlConfig.tsx
index 847c26b56c..b19800a835 100644
--- a/js/apps/admin-ui/src/clients/add/SamlConfig.tsx
+++ b/js/apps/admin-ui/src/clients/add/SamlConfig.tsx
@@ -1,6 +1,6 @@
import { Path, PathValue } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { SelectControl } from "ui-shared";
+import { SelectControl } from "@keycloak/keycloak-ui-shared";
import { DefaultSwitchControl } from "../../components/SwitchControl";
import { FormAccess } from "../../components/form/FormAccess";
import { convertAttributeNameToForm } from "../../util";
diff --git a/js/apps/admin-ui/src/clients/add/SamlSignature.tsx b/js/apps/admin-ui/src/clients/add/SamlSignature.tsx
index 02fd350cdc..0e0dfcbe6f 100644
--- a/js/apps/admin-ui/src/clients/add/SamlSignature.tsx
+++ b/js/apps/admin-ui/src/clients/add/SamlSignature.tsx
@@ -1,6 +1,6 @@
import { useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { SelectControl } from "ui-shared";
+import { SelectControl } from "@keycloak/keycloak-ui-shared";
import { FormAccess } from "../../components/form/FormAccess";
import { convertAttributeNameToForm } from "../../util";
import { FormFields } from "../ClientDetails";
diff --git a/js/apps/admin-ui/src/clients/advanced/AddHostDialog.tsx b/js/apps/admin-ui/src/clients/advanced/AddHostDialog.tsx
index b9a4de7cc4..515724a401 100644
--- a/js/apps/admin-ui/src/clients/advanced/AddHostDialog.tsx
+++ b/js/apps/admin-ui/src/clients/advanced/AddHostDialog.tsx
@@ -7,7 +7,7 @@ import {
} from "@patternfly/react-core";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/clients/advanced/AdvancedSettings.tsx b/js/apps/admin-ui/src/clients/advanced/AdvancedSettings.tsx
index 0e7a42b9bc..707f06a730 100644
--- a/js/apps/admin-ui/src/clients/advanced/AdvancedSettings.tsx
+++ b/js/apps/admin-ui/src/clients/advanced/AdvancedSettings.tsx
@@ -9,7 +9,7 @@ import { useState } from "react";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { FormAccess } from "../../components/form/FormAccess";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { DefaultSwitchControl } from "../../components/SwitchControl";
import { adminClient } from "../../admin-client";
import { KeyValueInput } from "../../components/key-value-form/KeyValueInput";
diff --git a/js/apps/admin-ui/src/clients/advanced/ApplicationUrls.tsx b/js/apps/admin-ui/src/clients/advanced/ApplicationUrls.tsx
index d9692731b2..4b342ab17e 100644
--- a/js/apps/admin-ui/src/clients/advanced/ApplicationUrls.tsx
+++ b/js/apps/admin-ui/src/clients/advanced/ApplicationUrls.tsx
@@ -1,5 +1,5 @@
import { useTranslation } from "react-i18next";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
type ApplicationUrlsProps = {
isDisabled?: boolean;
diff --git a/js/apps/admin-ui/src/clients/advanced/AuthenticationOverrides.tsx b/js/apps/admin-ui/src/clients/advanced/AuthenticationOverrides.tsx
index d12e3ae387..5462c9e096 100644
--- a/js/apps/admin-ui/src/clients/advanced/AuthenticationOverrides.tsx
+++ b/js/apps/admin-ui/src/clients/advanced/AuthenticationOverrides.tsx
@@ -3,7 +3,7 @@ import { ActionGroup, Button } from "@patternfly/react-core";
import { sortBy } from "lodash-es";
import { useState } from "react";
import { useTranslation } from "react-i18next";
-import { SelectControl } from "ui-shared";
+import { SelectControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { FormAccess } from "../../components/form/FormAccess";
import { useFetch } from "../../utils/useFetch";
diff --git a/js/apps/admin-ui/src/clients/advanced/ClusteringPanel.tsx b/js/apps/admin-ui/src/clients/advanced/ClusteringPanel.tsx
index 314894e489..c76f9370a9 100644
--- a/js/apps/admin-ui/src/clients/advanced/ClusteringPanel.tsx
+++ b/js/apps/admin-ui/src/clients/advanced/ClusteringPanel.tsx
@@ -10,7 +10,7 @@ import {
} from "@patternfly/react-core";
import { useState } from "react";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/clients/advanced/FineGrainOpenIdConnect.tsx b/js/apps/admin-ui/src/clients/advanced/FineGrainOpenIdConnect.tsx
index 6cd0ca1526..bec7d14b81 100644
--- a/js/apps/admin-ui/src/clients/advanced/FineGrainOpenIdConnect.tsx
+++ b/js/apps/admin-ui/src/clients/advanced/FineGrainOpenIdConnect.tsx
@@ -1,7 +1,7 @@
import { ProviderRepresentation } from "@keycloak/keycloak-admin-client/lib/defs/serverInfoRepesentation";
import { ActionGroup, Button, FormGroup } from "@patternfly/react-core";
import { useTranslation } from "react-i18next";
-import { HelpItem, SelectControl } from "ui-shared";
+import { HelpItem, SelectControl } from "@keycloak/keycloak-ui-shared";
import { FormAccess } from "../../components/form/FormAccess";
import { MultiLineInput } from "../../components/multi-line-input/MultiLineInput";
import { useServerInfo } from "../../context/server-info/ServerInfoProvider";
diff --git a/js/apps/admin-ui/src/clients/advanced/FineGrainSamlEndpointConfig.tsx b/js/apps/admin-ui/src/clients/advanced/FineGrainSamlEndpointConfig.tsx
index 099e90eb28..514631f092 100644
--- a/js/apps/admin-ui/src/clients/advanced/FineGrainSamlEndpointConfig.tsx
+++ b/js/apps/admin-ui/src/clients/advanced/FineGrainSamlEndpointConfig.tsx
@@ -2,7 +2,7 @@ import { ActionGroup, Button } from "@patternfly/react-core";
import { useTranslation } from "react-i18next";
import { FormAccess } from "../../components/form/FormAccess";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { ApplicationUrls } from "./ApplicationUrls";
type FineGrainSamlEndpointConfigProps = {
diff --git a/js/apps/admin-ui/src/clients/advanced/OpenIdConnectCompatibilityModes.tsx b/js/apps/admin-ui/src/clients/advanced/OpenIdConnectCompatibilityModes.tsx
index ffa70b086f..e6e5d6efd6 100644
--- a/js/apps/admin-ui/src/clients/advanced/OpenIdConnectCompatibilityModes.tsx
+++ b/js/apps/admin-ui/src/clients/advanced/OpenIdConnectCompatibilityModes.tsx
@@ -3,7 +3,7 @@ import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { FormAccess } from "../../components/form/FormAccess";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { convertAttributeNameToForm } from "../../util";
import { FormFields } from "../ClientDetails";
diff --git a/js/apps/admin-ui/src/clients/advanced/TokenLifespan.tsx b/js/apps/admin-ui/src/clients/advanced/TokenLifespan.tsx
index 43cbedae92..df7c38d5aa 100644
--- a/js/apps/admin-ui/src/clients/advanced/TokenLifespan.tsx
+++ b/js/apps/admin-ui/src/clients/advanced/TokenLifespan.tsx
@@ -8,7 +8,7 @@ import { useState } from "react";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import {
TimeSelector,
Unit,
diff --git a/js/apps/admin-ui/src/clients/authorization/AuthorizationEvaluate.tsx b/js/apps/admin-ui/src/clients/authorization/AuthorizationEvaluate.tsx
index 52ec61db7c..9a24254a51 100644
--- a/js/apps/admin-ui/src/clients/authorization/AuthorizationEvaluate.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/AuthorizationEvaluate.tsx
@@ -25,7 +25,11 @@ import {
import { useState } from "react";
import { Controller, FormProvider, useForm, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormErrorText, HelpItem, TextControl } from "ui-shared";
+import {
+ FormErrorText,
+ HelpItem,
+ TextControl,
+} from "@keycloak/keycloak-ui-shared";
import { ForbiddenSection } from "../../ForbiddenSection";
import { adminClient } from "../../admin-client";
diff --git a/js/apps/admin-ui/src/clients/authorization/AuthorizationExport.tsx b/js/apps/admin-ui/src/clients/authorization/AuthorizationExport.tsx
index a41beea1ef..9efbb29da7 100644
--- a/js/apps/admin-ui/src/clients/authorization/AuthorizationExport.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/AuthorizationExport.tsx
@@ -8,7 +8,7 @@ import {
import { saveAs } from "file-saver";
import { useState } from "react";
import { useTranslation } from "react-i18next";
-import { TextAreaControl } from "ui-shared";
+import { TextAreaControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
import { FormAccess } from "../../components/form/FormAccess";
diff --git a/js/apps/admin-ui/src/clients/authorization/DecisionStrategySelect.tsx b/js/apps/admin-ui/src/clients/authorization/DecisionStrategySelect.tsx
index cfbcf8e2d9..aa48ba199f 100644
--- a/js/apps/admin-ui/src/clients/authorization/DecisionStrategySelect.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/DecisionStrategySelect.tsx
@@ -2,7 +2,7 @@ import { FormGroup, Radio } from "@patternfly/react-core";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
const DECISION_STRATEGY = ["UNANIMOUS", "AFFIRMATIVE", "CONSENSUS"] as const;
diff --git a/js/apps/admin-ui/src/clients/authorization/ImportDialog.tsx b/js/apps/admin-ui/src/clients/authorization/ImportDialog.tsx
index 9513354894..8d2ebf9746 100644
--- a/js/apps/admin-ui/src/clients/authorization/ImportDialog.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/ImportDialog.tsx
@@ -14,7 +14,7 @@ import {
import type ResourceServerRepresentation from "@keycloak/keycloak-admin-client/lib/defs/resourceServerRepresentation";
import { JsonFileUpload } from "../../components/json-file-upload/JsonFileUpload";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
type ImportDialogProps = {
onConfirm: (value: ResourceServerRepresentation) => void;
diff --git a/js/apps/admin-ui/src/clients/authorization/PermissionDetails.tsx b/js/apps/admin-ui/src/clients/authorization/PermissionDetails.tsx
index a46ba9ca90..ac95d5db00 100644
--- a/js/apps/admin-ui/src/clients/authorization/PermissionDetails.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/PermissionDetails.tsx
@@ -20,7 +20,7 @@ import {
HelpItem,
TextAreaControl,
TextControl,
-} from "ui-shared";
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/clients/authorization/ResourceDetails.tsx b/js/apps/admin-ui/src/clients/authorization/ResourceDetails.tsx
index 45b5d98c3d..99e72e1ae7 100644
--- a/js/apps/admin-ui/src/clients/authorization/ResourceDetails.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/ResourceDetails.tsx
@@ -15,7 +15,7 @@ import { useState } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
-import { HelpItem, TextControl } from "ui-shared";
+import { HelpItem, TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
import { useConfirmDialog } from "../../components/confirm-dialog/ConfirmDialog";
diff --git a/js/apps/admin-ui/src/clients/authorization/ScopeDetails.tsx b/js/apps/admin-ui/src/clients/authorization/ScopeDetails.tsx
index fbdae05bdd..79e17a3759 100644
--- a/js/apps/admin-ui/src/clients/authorization/ScopeDetails.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/ScopeDetails.tsx
@@ -11,7 +11,7 @@ import { useState } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
import { FormAccess } from "../../components/form/FormAccess";
diff --git a/js/apps/admin-ui/src/clients/authorization/ScopePicker.tsx b/js/apps/admin-ui/src/clients/authorization/ScopePicker.tsx
index 849fc01115..7681d73982 100644
--- a/js/apps/admin-ui/src/clients/authorization/ScopePicker.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/ScopePicker.tsx
@@ -8,7 +8,7 @@ import {
import { useState } from "react";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useFetch } from "../../utils/useFetch";
diff --git a/js/apps/admin-ui/src/clients/authorization/SearchDropdown.tsx b/js/apps/admin-ui/src/clients/authorization/SearchDropdown.tsx
index 99d6d6b000..3355d8ea99 100644
--- a/js/apps/admin-ui/src/clients/authorization/SearchDropdown.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/SearchDropdown.tsx
@@ -4,7 +4,7 @@ import { Dropdown, DropdownToggle } from "@patternfly/react-core/deprecated";
import { useEffect } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { SelectControl, TextControl } from "ui-shared";
+import { SelectControl, TextControl } from "@keycloak/keycloak-ui-shared";
import useToggle from "../../utils/useToggle";
import "./search-dropdown.css";
diff --git a/js/apps/admin-ui/src/clients/authorization/Settings.tsx b/js/apps/admin-ui/src/clients/authorization/Settings.tsx
index 80dd49e77f..984b8b0e2d 100644
--- a/js/apps/admin-ui/src/clients/authorization/Settings.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/Settings.tsx
@@ -10,7 +10,7 @@ import {
import { useState } from "react";
import { Controller, FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { DefaultSwitchControl } from "../../components/SwitchControl";
import { useAlerts } from "../../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/clients/authorization/policy/Aggregate.tsx b/js/apps/admin-ui/src/clients/authorization/policy/Aggregate.tsx
index 870d805e0c..5edd2b168b 100644
--- a/js/apps/admin-ui/src/clients/authorization/policy/Aggregate.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/policy/Aggregate.tsx
@@ -1,7 +1,7 @@
import { FormGroup } from "@patternfly/react-core";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { useParams } from "../../../utils/useParams";
import type { PolicyDetailsParams } from "../../routes/PolicyDetails";
import { DecisionStrategySelect } from "../DecisionStrategySelect";
diff --git a/js/apps/admin-ui/src/clients/authorization/policy/ClientScope.tsx b/js/apps/admin-ui/src/clients/authorization/policy/ClientScope.tsx
index 1a28bce034..1d96ec98c3 100644
--- a/js/apps/admin-ui/src/clients/authorization/policy/ClientScope.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/policy/ClientScope.tsx
@@ -5,7 +5,7 @@ import { Table, Tbody, Td, Th, Thead, Tr } from "@patternfly/react-table";
import { useState } from "react";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormErrorText, HelpItem } from "ui-shared";
+import { FormErrorText, HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../../admin-client";
import { useFetch } from "../../../utils/useFetch";
diff --git a/js/apps/admin-ui/src/clients/authorization/policy/Group.tsx b/js/apps/admin-ui/src/clients/authorization/policy/Group.tsx
index b0edb7b724..1eddc66ffd 100644
--- a/js/apps/admin-ui/src/clients/authorization/policy/Group.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/policy/Group.tsx
@@ -5,7 +5,11 @@ import { Table, Tbody, Td, Th, Thead, Tr } from "@patternfly/react-table";
import { useState } from "react";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormErrorText, HelpItem, TextControl } from "ui-shared";
+import {
+ FormErrorText,
+ HelpItem,
+ TextControl,
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../../admin-client";
import { GroupPickerDialog } from "../../../components/group/GroupPickerDialog";
diff --git a/js/apps/admin-ui/src/clients/authorization/policy/JavaScript.tsx b/js/apps/admin-ui/src/clients/authorization/policy/JavaScript.tsx
index 85f6c3b107..60e36d24a9 100644
--- a/js/apps/admin-ui/src/clients/authorization/policy/JavaScript.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/policy/JavaScript.tsx
@@ -3,7 +3,7 @@ import { Controller, useFormContext } from "react-hook-form";
import { FormGroup } from "@patternfly/react-core";
import { CodeEditor, Language } from "@patternfly/react-code-editor";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
export const JavaScript = () => {
const { t } = useTranslation();
diff --git a/js/apps/admin-ui/src/clients/authorization/policy/LogicSelector.tsx b/js/apps/admin-ui/src/clients/authorization/policy/LogicSelector.tsx
index 1e15110355..eba3484490 100644
--- a/js/apps/admin-ui/src/clients/authorization/policy/LogicSelector.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/policy/LogicSelector.tsx
@@ -2,7 +2,7 @@ import { useTranslation } from "react-i18next";
import { Controller, useFormContext } from "react-hook-form";
import { FormGroup, Radio } from "@patternfly/react-core";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
const LOGIC_TYPES = ["POSITIVE", "NEGATIVE"] as const;
diff --git a/js/apps/admin-ui/src/clients/authorization/policy/NameDescription.tsx b/js/apps/admin-ui/src/clients/authorization/policy/NameDescription.tsx
index 6ed8ebbd41..19ffed7799 100644
--- a/js/apps/admin-ui/src/clients/authorization/policy/NameDescription.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/policy/NameDescription.tsx
@@ -1,5 +1,5 @@
import { useTranslation } from "react-i18next";
-import { TextAreaControl, TextControl } from "ui-shared";
+import { TextAreaControl, TextControl } from "@keycloak/keycloak-ui-shared";
type NameDescriptionProps = {
isDisabled: boolean;
diff --git a/js/apps/admin-ui/src/clients/authorization/policy/Regex.tsx b/js/apps/admin-ui/src/clients/authorization/policy/Regex.tsx
index 94a8036a21..6b6a3cd47e 100644
--- a/js/apps/admin-ui/src/clients/authorization/policy/Regex.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/policy/Regex.tsx
@@ -1,5 +1,5 @@
import { useTranslation } from "react-i18next";
-import { SwitchControl, TextControl } from "ui-shared";
+import { SwitchControl, TextControl } from "@keycloak/keycloak-ui-shared";
export const Regex = () => {
const { t } = useTranslation();
diff --git a/js/apps/admin-ui/src/clients/authorization/policy/Role.tsx b/js/apps/admin-ui/src/clients/authorization/policy/Role.tsx
index feef906439..3d0cc7ff9f 100644
--- a/js/apps/admin-ui/src/clients/authorization/policy/Role.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/policy/Role.tsx
@@ -4,7 +4,7 @@ import { Table, Tbody, Td, Th, Thead, Tr } from "@patternfly/react-table";
import { useState } from "react";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormErrorText, HelpItem } from "ui-shared";
+import { FormErrorText, HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../../admin-client";
import { DefaultSwitchControl } from "../../../components/SwitchControl";
diff --git a/js/apps/admin-ui/src/clients/authorization/policy/Time.tsx b/js/apps/admin-ui/src/clients/authorization/policy/Time.tsx
index d4741356a7..9406d0f6d5 100644
--- a/js/apps/admin-ui/src/clients/authorization/policy/Time.tsx
+++ b/js/apps/admin-ui/src/clients/authorization/policy/Time.tsx
@@ -10,9 +10,9 @@ import {
TimePicker,
} from "@patternfly/react-core";
import { useState } from "react";
-import { Controller, useFormContext } from "react-hook-form";
+import { FormErrorText, HelpItem } from "@keycloak/keycloak-ui-shared";
import { useTranslation } from "react-i18next";
-import { FormErrorText, HelpItem } from "ui-shared";
+import { Controller, useFormContext } from "react-hook-form";
const DATE_TIME_FORMAT = /(\d\d\d\d-\d\d-\d\d)? (\d\d?):(\d\d?)/;
const padDateSegment = (value: number) => value.toString().padStart(2, "0");
diff --git a/js/apps/admin-ui/src/clients/credentials/ClientSecret.tsx b/js/apps/admin-ui/src/clients/credentials/ClientSecret.tsx
index 05a7238d8c..abc8bd24c3 100644
--- a/js/apps/admin-ui/src/clients/credentials/ClientSecret.tsx
+++ b/js/apps/admin-ui/src/clients/credentials/ClientSecret.tsx
@@ -11,7 +11,7 @@ import {
import { useState } from "react";
import { useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { PasswordInput } from "ui-shared";
+import { PasswordInput } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
import { useConfirmDialog } from "../../components/confirm-dialog/ConfirmDialog";
diff --git a/js/apps/admin-ui/src/clients/credentials/Credentials.tsx b/js/apps/admin-ui/src/clients/credentials/Credentials.tsx
index decccb3f5e..44f0e9c4c4 100644
--- a/js/apps/admin-ui/src/clients/credentials/Credentials.tsx
+++ b/js/apps/admin-ui/src/clients/credentials/Credentials.tsx
@@ -18,7 +18,7 @@ import {
import { useState } from "react";
import { useFormContext, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem, SelectControl } from "ui-shared";
+import { HelpItem, SelectControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
import { useConfirmDialog } from "../../components/confirm-dialog/ConfirmDialog";
diff --git a/js/apps/admin-ui/src/clients/credentials/SignedJWT.tsx b/js/apps/admin-ui/src/clients/credentials/SignedJWT.tsx
index 6452c9d0bd..7c59064576 100644
--- a/js/apps/admin-ui/src/clients/credentials/SignedJWT.tsx
+++ b/js/apps/admin-ui/src/clients/credentials/SignedJWT.tsx
@@ -1,5 +1,5 @@
import { useTranslation } from "react-i18next";
-import { SelectControl } from "ui-shared";
+import { SelectControl } from "@keycloak/keycloak-ui-shared";
import { useServerInfo } from "../../context/server-info/ServerInfoProvider";
import { convertAttributeNameToForm } from "../../util";
import { FormFields } from "../ClientDetails";
diff --git a/js/apps/admin-ui/src/clients/credentials/X509.tsx b/js/apps/admin-ui/src/clients/credentials/X509.tsx
index d31390af71..a80e21180b 100644
--- a/js/apps/admin-ui/src/clients/credentials/X509.tsx
+++ b/js/apps/admin-ui/src/clients/credentials/X509.tsx
@@ -1,5 +1,5 @@
import { useTranslation } from "react-i18next";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { DefaultSwitchControl } from "../../components/SwitchControl";
import { convertAttributeNameToForm } from "../../util";
import { FormFields } from "../ClientDetails";
diff --git a/js/apps/admin-ui/src/clients/import/ImportForm.tsx b/js/apps/admin-ui/src/clients/import/ImportForm.tsx
index bdf4781290..19a0a15b26 100644
--- a/js/apps/admin-ui/src/clients/import/ImportForm.tsx
+++ b/js/apps/admin-ui/src/clients/import/ImportForm.tsx
@@ -11,7 +11,7 @@ import { useState } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/clients/initial-access/CreateInitialAccessToken.tsx b/js/apps/admin-ui/src/clients/initial-access/CreateInitialAccessToken.tsx
index f64c5ac090..acf078a0df 100644
--- a/js/apps/admin-ui/src/clients/initial-access/CreateInitialAccessToken.tsx
+++ b/js/apps/admin-ui/src/clients/initial-access/CreateInitialAccessToken.tsx
@@ -9,7 +9,7 @@ import { useState } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
-import { NumberControl } from "ui-shared";
+import { NumberControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
import { FormAccess } from "../../components/form/FormAccess";
diff --git a/js/apps/admin-ui/src/clients/keys/Certificate.tsx b/js/apps/admin-ui/src/clients/keys/Certificate.tsx
index 24651fa5d8..fad5dc3e6e 100644
--- a/js/apps/admin-ui/src/clients/keys/Certificate.tsx
+++ b/js/apps/admin-ui/src/clients/keys/Certificate.tsx
@@ -2,7 +2,7 @@ import type CertificateRepresentation from "@keycloak/keycloak-admin-client/lib/
import { FormGroup, TextArea } from "@patternfly/react-core";
import { useId } from "react";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
type CertificateProps = Omit & {
plain?: boolean;
diff --git a/js/apps/admin-ui/src/clients/keys/GenerateKeyDialog.tsx b/js/apps/admin-ui/src/clients/keys/GenerateKeyDialog.tsx
index 251863eb20..2f685a0b13 100644
--- a/js/apps/admin-ui/src/clients/keys/GenerateKeyDialog.tsx
+++ b/js/apps/admin-ui/src/clients/keys/GenerateKeyDialog.tsx
@@ -18,7 +18,7 @@ import {
} from "@patternfly/react-core";
import type KeyStoreConfig from "@keycloak/keycloak-admin-client/lib/defs/keystoreConfig";
-import { HelpItem, SelectControl } from "ui-shared";
+import { HelpItem, SelectControl } from "@keycloak/keycloak-ui-shared";
import { StoreSettings } from "./StoreSettings";
import { FileUpload } from "../../components/json-file-upload/patternfly/FileUpload";
import { useServerInfo } from "../../context/server-info/ServerInfoProvider";
diff --git a/js/apps/admin-ui/src/clients/keys/ImportKeyDialog.tsx b/js/apps/admin-ui/src/clients/keys/ImportKeyDialog.tsx
index 3e5ee2d096..cf6f5c5863 100644
--- a/js/apps/admin-ui/src/clients/keys/ImportKeyDialog.tsx
+++ b/js/apps/admin-ui/src/clients/keys/ImportKeyDialog.tsx
@@ -10,7 +10,7 @@ import {
} from "@patternfly/react-core";
import { Controller, FormProvider, useForm, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { SelectControl } from "ui-shared";
+import { SelectControl } from "@keycloak/keycloak-ui-shared";
import { FileUpload } from "../../components/json-file-upload/patternfly/FileUpload";
import { useServerInfo } from "../../context/server-info/ServerInfoProvider";
import { StoreSettings } from "./StoreSettings";
diff --git a/js/apps/admin-ui/src/clients/keys/Keys.tsx b/js/apps/admin-ui/src/clients/keys/Keys.tsx
index 5da182a54b..506cd7701e 100644
--- a/js/apps/admin-ui/src/clients/keys/Keys.tsx
+++ b/js/apps/admin-ui/src/clients/keys/Keys.tsx
@@ -16,7 +16,7 @@ import { saveAs } from "file-saver";
import { useState } from "react";
import { useFormContext, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { DefaultSwitchControl } from "../../components/SwitchControl";
import { useAlerts } from "../../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/clients/keys/SamlKeys.tsx b/js/apps/admin-ui/src/clients/keys/SamlKeys.tsx
index ed16032f1b..47cf39e807 100644
--- a/js/apps/admin-ui/src/clients/keys/SamlKeys.tsx
+++ b/js/apps/admin-ui/src/clients/keys/SamlKeys.tsx
@@ -16,7 +16,7 @@ import { saveAs } from "file-saver";
import { Fragment, useState } from "react";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormPanel, HelpItem } from "ui-shared";
+import { FormPanel, HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
import { useConfirmDialog } from "../../components/confirm-dialog/ConfirmDialog";
diff --git a/js/apps/admin-ui/src/clients/keys/SamlKeysDialog.tsx b/js/apps/admin-ui/src/clients/keys/SamlKeysDialog.tsx
index 382a2fddf0..ec82b473c8 100644
--- a/js/apps/admin-ui/src/clients/keys/SamlKeysDialog.tsx
+++ b/js/apps/admin-ui/src/clients/keys/SamlKeysDialog.tsx
@@ -21,7 +21,7 @@ import { saveAs } from "file-saver";
import { useState } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/clients/keys/StoreSettings.tsx b/js/apps/admin-ui/src/clients/keys/StoreSettings.tsx
index d4eeda0d47..89af77c622 100644
--- a/js/apps/admin-ui/src/clients/keys/StoreSettings.tsx
+++ b/js/apps/admin-ui/src/clients/keys/StoreSettings.tsx
@@ -1,5 +1,5 @@
import { useTranslation } from "react-i18next";
-import { PasswordControl, TextControl } from "ui-shared";
+import { PasswordControl, TextControl } from "@keycloak/keycloak-ui-shared";
export const StoreSettings = ({
hidePassword = false,
diff --git a/js/apps/admin-ui/src/clients/registration/ClientRegistration.tsx b/js/apps/admin-ui/src/clients/registration/ClientRegistration.tsx
index e209904118..2ec9639f9d 100644
--- a/js/apps/admin-ui/src/clients/registration/ClientRegistration.tsx
+++ b/js/apps/admin-ui/src/clients/registration/ClientRegistration.tsx
@@ -1,6 +1,6 @@
import { Tab, TabTitleText } from "@patternfly/react-core";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import {
RoutableTabs,
useRoutableTab,
diff --git a/js/apps/admin-ui/src/clients/registration/DetailProvider.tsx b/js/apps/admin-ui/src/clients/registration/DetailProvider.tsx
index 4f55cb2c4b..addd31208b 100644
--- a/js/apps/admin-ui/src/clients/registration/DetailProvider.tsx
+++ b/js/apps/admin-ui/src/clients/registration/DetailProvider.tsx
@@ -11,7 +11,7 @@ import { useState } from "react";
import { FormProvider, useForm, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
import { useConfirmDialog } from "../../components/confirm-dialog/ConfirmDialog";
diff --git a/js/apps/admin-ui/src/clients/scopes/DedicatedScope.tsx b/js/apps/admin-ui/src/clients/scopes/DedicatedScope.tsx
index 68f479af6d..909e495c24 100644
--- a/js/apps/admin-ui/src/clients/scopes/DedicatedScope.tsx
+++ b/js/apps/admin-ui/src/clients/scopes/DedicatedScope.tsx
@@ -11,7 +11,7 @@ import { useState } from "react";
import { useTranslation } from "react-i18next";
import { FormAccess } from "../../components/form/FormAccess";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/clients/scopes/EvaluateScopes.tsx b/js/apps/admin-ui/src/clients/scopes/EvaluateScopes.tsx
index 1260a85a08..b16ccd27f4 100644
--- a/js/apps/admin-ui/src/clients/scopes/EvaluateScopes.tsx
+++ b/js/apps/admin-ui/src/clients/scopes/EvaluateScopes.tsx
@@ -27,7 +27,7 @@ import { QuestionCircleIcon } from "@patternfly/react-icons";
import { useEffect, useRef, useState } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem, useHelp } from "ui-shared";
+import { HelpItem, useHelp } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { KeycloakDataTable } from "../../components/table-toolbar/KeycloakDataTable";
diff --git a/js/apps/admin-ui/src/components/SwitchControl.tsx b/js/apps/admin-ui/src/components/SwitchControl.tsx
index 8c2af8eb47..a1c4ae4641 100644
--- a/js/apps/admin-ui/src/components/SwitchControl.tsx
+++ b/js/apps/admin-ui/src/components/SwitchControl.tsx
@@ -1,7 +1,7 @@
import { FieldPath, FieldValues } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import type { SwitchControlProps } from "ui-shared";
-import { SwitchControl } from "ui-shared";
+import type { SwitchControlProps } from "@keycloak/keycloak-ui-shared";
+import { SwitchControl } from "@keycloak/keycloak-ui-shared";
export type DefaultSwitchControlProps<
T extends FieldValues,
diff --git a/js/apps/admin-ui/src/components/alert/Alerts.tsx b/js/apps/admin-ui/src/components/alert/Alerts.tsx
index c44101d2fe..c36442d1bb 100644
--- a/js/apps/admin-ui/src/components/alert/Alerts.tsx
+++ b/js/apps/admin-ui/src/components/alert/Alerts.tsx
@@ -4,7 +4,10 @@ import { PropsWithChildren, useCallback, useMemo, useState } from "react";
import { useTranslation } from "react-i18next";
import { generateId } from "../../util";
-import { createNamedContext, useRequiredContext } from "ui-shared";
+import {
+ createNamedContext,
+ useRequiredContext,
+} from "@keycloak/keycloak-ui-shared";
import useSetTimeout from "../../utils/useSetTimeout";
import { AlertPanel } from "./AlertPanel";
diff --git a/js/apps/admin-ui/src/components/client/ClientSelect.tsx b/js/apps/admin-ui/src/components/client/ClientSelect.tsx
index 8368f08ad1..8074384e73 100644
--- a/js/apps/admin-ui/src/components/client/ClientSelect.tsx
+++ b/js/apps/admin-ui/src/components/client/ClientSelect.tsx
@@ -3,7 +3,7 @@ import type { ClientQuery } from "@keycloak/keycloak-admin-client/lib/resources/
import { SelectProps, SelectVariant } from "@patternfly/react-core/deprecated";
import { useState } from "react";
import { useTranslation } from "react-i18next";
-import { SelectControl } from "ui-shared";
+import { SelectControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useFetch } from "../../utils/useFetch";
diff --git a/js/apps/admin-ui/src/components/download-dialog/DownloadDialog.tsx b/js/apps/admin-ui/src/components/download-dialog/DownloadDialog.tsx
index 58c5f51c7e..dd66c0030e 100644
--- a/js/apps/admin-ui/src/components/download-dialog/DownloadDialog.tsx
+++ b/js/apps/admin-ui/src/components/download-dialog/DownloadDialog.tsx
@@ -15,7 +15,7 @@ import {
import { saveAs } from "file-saver";
import { useEffect, useMemo, useState } from "react";
import { useTranslation } from "react-i18next";
-import { HelpItem, useHelp } from "ui-shared";
+import { HelpItem, useHelp } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useRealm } from "../../context/realm-context/RealmContext";
diff --git a/js/apps/admin-ui/src/components/dynamic/BooleanComponent.tsx b/js/apps/admin-ui/src/components/dynamic/BooleanComponent.tsx
index f978c14484..63ae06f6bd 100644
--- a/js/apps/admin-ui/src/components/dynamic/BooleanComponent.tsx
+++ b/js/apps/admin-ui/src/components/dynamic/BooleanComponent.tsx
@@ -2,7 +2,7 @@ import { FormGroup, Switch } from "@patternfly/react-core";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import type { ComponentProps } from "./components";
import { convertToName } from "./DynamicComponents";
diff --git a/js/apps/admin-ui/src/components/dynamic/FileComponent.tsx b/js/apps/admin-ui/src/components/dynamic/FileComponent.tsx
index 04ba487091..ccd3420404 100644
--- a/js/apps/admin-ui/src/components/dynamic/FileComponent.tsx
+++ b/js/apps/admin-ui/src/components/dynamic/FileComponent.tsx
@@ -3,7 +3,7 @@ import { useState } from "react";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { FileUpload } from "../json-file-upload/patternfly/FileUpload";
import type { ComponentProps } from "./components";
import { convertToName } from "./DynamicComponents";
diff --git a/js/apps/admin-ui/src/components/dynamic/GroupComponent.tsx b/js/apps/admin-ui/src/components/dynamic/GroupComponent.tsx
index f7f681370f..d436f1107a 100644
--- a/js/apps/admin-ui/src/components/dynamic/GroupComponent.tsx
+++ b/js/apps/admin-ui/src/components/dynamic/GroupComponent.tsx
@@ -12,7 +12,7 @@ import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { GroupPickerDialog } from "../group/GroupPickerDialog";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import type { ComponentProps } from "./components";
import { convertToName } from "./DynamicComponents";
diff --git a/js/apps/admin-ui/src/components/dynamic/ListComponent.tsx b/js/apps/admin-ui/src/components/dynamic/ListComponent.tsx
index 267faf8460..43f1640a8b 100644
--- a/js/apps/admin-ui/src/components/dynamic/ListComponent.tsx
+++ b/js/apps/admin-ui/src/components/dynamic/ListComponent.tsx
@@ -8,7 +8,7 @@ import { useState } from "react";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import type { ComponentProps } from "./components";
import { convertToName } from "./DynamicComponents";
diff --git a/js/apps/admin-ui/src/components/dynamic/MapComponent.tsx b/js/apps/admin-ui/src/components/dynamic/MapComponent.tsx
index 6f2e6a7cb1..d10868ec74 100644
--- a/js/apps/admin-ui/src/components/dynamic/MapComponent.tsx
+++ b/js/apps/admin-ui/src/components/dynamic/MapComponent.tsx
@@ -16,7 +16,7 @@ import { useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { generateId } from "../../util";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { KeyValueType } from "../key-value-form/key-value-convert";
import type { ComponentProps } from "./components";
import { convertToName } from "./DynamicComponents";
diff --git a/js/apps/admin-ui/src/components/dynamic/MultivaluedListComponent.tsx b/js/apps/admin-ui/src/components/dynamic/MultivaluedListComponent.tsx
index 40c9104b87..8cd724852e 100644
--- a/js/apps/admin-ui/src/components/dynamic/MultivaluedListComponent.tsx
+++ b/js/apps/admin-ui/src/components/dynamic/MultivaluedListComponent.tsx
@@ -8,7 +8,7 @@ import { useState } from "react";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import type { ComponentProps } from "./components";
import { convertToName } from "./DynamicComponents";
diff --git a/js/apps/admin-ui/src/components/dynamic/MultivaluedStringComponent.tsx b/js/apps/admin-ui/src/components/dynamic/MultivaluedStringComponent.tsx
index 5195f8b0ea..1d8d1a5e16 100644
--- a/js/apps/admin-ui/src/components/dynamic/MultivaluedStringComponent.tsx
+++ b/js/apps/admin-ui/src/components/dynamic/MultivaluedStringComponent.tsx
@@ -2,7 +2,7 @@ import { useTranslation } from "react-i18next";
import { FormGroup } from "@patternfly/react-core";
import type { ComponentProps } from "./components";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { MultiLineInput } from "../multi-line-input/MultiLineInput";
import { convertToName } from "./DynamicComponents";
diff --git a/js/apps/admin-ui/src/components/dynamic/PasswordComponent.tsx b/js/apps/admin-ui/src/components/dynamic/PasswordComponent.tsx
index 3f0de1b9ae..39b887e9bd 100644
--- a/js/apps/admin-ui/src/components/dynamic/PasswordComponent.tsx
+++ b/js/apps/admin-ui/src/components/dynamic/PasswordComponent.tsx
@@ -1,5 +1,5 @@
import { useTranslation } from "react-i18next";
-import { PasswordControl } from "ui-shared";
+import { PasswordControl } from "@keycloak/keycloak-ui-shared";
import { convertToName } from "./DynamicComponents";
import type { ComponentProps } from "./components";
diff --git a/js/apps/admin-ui/src/components/dynamic/RoleComponent.tsx b/js/apps/admin-ui/src/components/dynamic/RoleComponent.tsx
index f798827d9f..4f17e53206 100644
--- a/js/apps/admin-ui/src/components/dynamic/RoleComponent.tsx
+++ b/js/apps/admin-ui/src/components/dynamic/RoleComponent.tsx
@@ -7,9 +7,9 @@ import {
} from "@patternfly/react-core";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormErrorText, HelpItem } from "ui-shared";
import useToggle from "../../utils/useToggle";
+import { FormErrorText, HelpItem } from "@keycloak/keycloak-ui-shared";
import { AddRoleMappingModal } from "../role-mapping/AddRoleMappingModal";
import { Row, ServiceRole } from "../role-mapping/RoleMapping";
import { convertToName } from "./DynamicComponents";
diff --git a/js/apps/admin-ui/src/components/dynamic/ScriptComponent.tsx b/js/apps/admin-ui/src/components/dynamic/ScriptComponent.tsx
index e63efbb4ac..2a77ddd8f2 100644
--- a/js/apps/admin-ui/src/components/dynamic/ScriptComponent.tsx
+++ b/js/apps/admin-ui/src/components/dynamic/ScriptComponent.tsx
@@ -3,7 +3,7 @@ import { FormGroup } from "@patternfly/react-core";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import type { ComponentProps } from "./components";
import { convertToName } from "./DynamicComponents";
diff --git a/js/apps/admin-ui/src/components/dynamic/StringComponent.tsx b/js/apps/admin-ui/src/components/dynamic/StringComponent.tsx
index 83f6ae1104..3da266c1a8 100644
--- a/js/apps/admin-ui/src/components/dynamic/StringComponent.tsx
+++ b/js/apps/admin-ui/src/components/dynamic/StringComponent.tsx
@@ -1,7 +1,7 @@
import { FormGroup, TextInput } from "@patternfly/react-core";
import { useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { convertToName } from "./DynamicComponents";
import type { ComponentProps } from "./components";
diff --git a/js/apps/admin-ui/src/components/dynamic/TextComponent.tsx b/js/apps/admin-ui/src/components/dynamic/TextComponent.tsx
index 0b261d0859..ab2948c255 100644
--- a/js/apps/admin-ui/src/components/dynamic/TextComponent.tsx
+++ b/js/apps/admin-ui/src/components/dynamic/TextComponent.tsx
@@ -1,8 +1,8 @@
import { FormGroup } from "@patternfly/react-core";
import { useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem, KeycloakTextArea } from "ui-shared";
+import { KeycloakTextArea, HelpItem } from "@keycloak/keycloak-ui-shared";
import { convertToName } from "./DynamicComponents";
import type { ComponentProps } from "./components";
diff --git a/js/apps/admin-ui/src/components/dynamic/UserProfileAttributeListComponent.tsx b/js/apps/admin-ui/src/components/dynamic/UserProfileAttributeListComponent.tsx
index 9dd46fe938..8aec190250 100644
--- a/js/apps/admin-ui/src/components/dynamic/UserProfileAttributeListComponent.tsx
+++ b/js/apps/admin-ui/src/components/dynamic/UserProfileAttributeListComponent.tsx
@@ -3,7 +3,7 @@ import { FormGroup } from "@patternfly/react-core";
import { useState } from "react";
import { useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormErrorText, HelpItem } from "ui-shared";
+import { FormErrorText, HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useFetch } from "../../utils/useFetch";
diff --git a/js/apps/admin-ui/src/components/help-enabler/HelpHeader.tsx b/js/apps/admin-ui/src/components/help-enabler/HelpHeader.tsx
index 907d5da92b..e248df3e75 100644
--- a/js/apps/admin-ui/src/components/help-enabler/HelpHeader.tsx
+++ b/js/apps/admin-ui/src/components/help-enabler/HelpHeader.tsx
@@ -15,7 +15,7 @@ import { useState } from "react";
import { useTranslation } from "react-i18next";
import helpUrls from "../../help-urls";
-import { useHelp } from "ui-shared";
+import { useHelp } from "@keycloak/keycloak-ui-shared";
import "./help-header.css";
diff --git a/js/apps/admin-ui/src/components/permission-tab/PermissionTab.tsx b/js/apps/admin-ui/src/components/permission-tab/PermissionTab.tsx
index 85e1166f28..b5f7749c0f 100644
--- a/js/apps/admin-ui/src/components/permission-tab/PermissionTab.tsx
+++ b/js/apps/admin-ui/src/components/permission-tab/PermissionTab.tsx
@@ -20,7 +20,7 @@ import {
import { useState } from "react";
import { Trans, useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { toPermissionDetails } from "../../clients/routes/PermissionDetails";
diff --git a/js/apps/admin-ui/src/components/realm-selector/RealmSelector.tsx b/js/apps/admin-ui/src/components/realm-selector/RealmSelector.tsx
index 670244526c..297479a11b 100644
--- a/js/apps/admin-ui/src/components/realm-selector/RealmSelector.tsx
+++ b/js/apps/admin-ui/src/components/realm-selector/RealmSelector.tsx
@@ -20,7 +20,7 @@ import { CheckIcon } from "@patternfly/react-icons";
import { Fragment, useState, useMemo } from "react";
import { useTranslation } from "react-i18next";
import { Link, To, useHref } from "react-router-dom";
-import { label } from "ui-shared";
+import { label } from "@keycloak/keycloak-ui-shared";
import { useRealm } from "../../context/realm-context/RealmContext";
import { useRealms } from "../../context/RealmsContext";
diff --git a/js/apps/admin-ui/src/components/role-form/RoleForm.tsx b/js/apps/admin-ui/src/components/role-form/RoleForm.tsx
index b7aad9bd88..decfe668d9 100644
--- a/js/apps/admin-ui/src/components/role-form/RoleForm.tsx
+++ b/js/apps/admin-ui/src/components/role-form/RoleForm.tsx
@@ -2,7 +2,7 @@ import { ActionGroup, Button, PageSection } from "@patternfly/react-core";
import { SubmitHandler, useFormContext, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, To } from "react-router-dom";
-import { TextAreaControl, TextControl } from "ui-shared";
+import { TextAreaControl, TextControl } from "@keycloak/keycloak-ui-shared";
import { FormAccess } from "../form/FormAccess";
import { AttributeForm } from "../key-value-form/AttributeForm";
diff --git a/js/apps/admin-ui/src/components/roles-list/RolesList.tsx b/js/apps/admin-ui/src/components/roles-list/RolesList.tsx
index 52ff13cf6f..e248435633 100644
--- a/js/apps/admin-ui/src/components/roles-list/RolesList.tsx
+++ b/js/apps/admin-ui/src/components/roles-list/RolesList.tsx
@@ -4,7 +4,7 @@ import { AlertVariant, Button, ButtonVariant } from "@patternfly/react-core";
import { useState } from "react";
import { useTranslation } from "react-i18next";
import { Link, To, useNavigate } from "react-router-dom";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useRealm } from "../../context/realm-context/RealmContext";
diff --git a/js/apps/admin-ui/src/components/table-toolbar/KeycloakDataTable.tsx b/js/apps/admin-ui/src/components/table-toolbar/KeycloakDataTable.tsx
index 6c87c2e385..4473037c1e 100644
--- a/js/apps/admin-ui/src/components/table-toolbar/KeycloakDataTable.tsx
+++ b/js/apps/admin-ui/src/components/table-toolbar/KeycloakDataTable.tsx
@@ -28,7 +28,7 @@ import {
} from "react";
import { useTranslation } from "react-i18next";
-import { useStoredState } from "ui-shared";
+import { useStoredState } from "@keycloak/keycloak-ui-shared";
import { useFetch } from "../../utils/useFetch";
import { KeycloakSpinner } from "../keycloak-spinner/KeycloakSpinner";
import { ListEmptyState } from "../list-empty-state/ListEmptyState";
diff --git a/js/apps/admin-ui/src/components/time-selector/TimeSelectorControl.tsx b/js/apps/admin-ui/src/components/time-selector/TimeSelectorControl.tsx
index b1c13f64a6..48cd1b6a8c 100644
--- a/js/apps/admin-ui/src/components/time-selector/TimeSelectorControl.tsx
+++ b/js/apps/admin-ui/src/components/time-selector/TimeSelectorControl.tsx
@@ -7,7 +7,7 @@ import {
UseControllerProps,
useFormContext,
} from "react-hook-form";
-import { FormErrorText, HelpItem } from "ui-shared";
+import { FormErrorText, HelpItem } from "@keycloak/keycloak-ui-shared";
import { TimeSelector, TimeSelectorProps } from "./TimeSelector";
export type NumberControlOption = {
diff --git a/js/apps/admin-ui/src/components/users/UserDataTableAttributeSearchForm.tsx b/js/apps/admin-ui/src/components/users/UserDataTableAttributeSearchForm.tsx
index 33310c2eff..d2e906b921 100644
--- a/js/apps/admin-ui/src/components/users/UserDataTableAttributeSearchForm.tsx
+++ b/js/apps/admin-ui/src/components/users/UserDataTableAttributeSearchForm.tsx
@@ -22,7 +22,7 @@ import { ReactNode, useState } from "react";
import { useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Form } from "react-router-dom";
-import { label } from "ui-shared";
+import { label } from "@keycloak/keycloak-ui-shared";
import { useAlerts } from "../alert/Alerts";
import { UserAttribute } from "./UserDataTable";
diff --git a/js/apps/admin-ui/src/components/users/UserSelect.tsx b/js/apps/admin-ui/src/components/users/UserSelect.tsx
index 55e85b755e..4c72b781a5 100644
--- a/js/apps/admin-ui/src/components/users/UserSelect.tsx
+++ b/js/apps/admin-ui/src/components/users/UserSelect.tsx
@@ -10,7 +10,7 @@ import { debounce } from "lodash-es";
import { useCallback, useState } from "react";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormErrorText, HelpItem } from "ui-shared";
+import { FormErrorText, HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useFetch } from "../../utils/useFetch";
diff --git a/js/apps/admin-ui/src/components/view-header/ViewHeader.tsx b/js/apps/admin-ui/src/components/view-header/ViewHeader.tsx
index b515cdd49a..3baae62cc4 100644
--- a/js/apps/admin-ui/src/components/view-header/ViewHeader.tsx
+++ b/js/apps/admin-ui/src/components/view-header/ViewHeader.tsx
@@ -26,7 +26,7 @@ import {
} from "react";
import { useTranslation } from "react-i18next";
import { FormattedLink } from "../external-link/FormattedLink";
-import { useHelp, HelpItem } from "ui-shared";
+import { useHelp, HelpItem } from "@keycloak/keycloak-ui-shared";
import "../../help-urls";
export type ViewHeaderProps = {
diff --git a/js/apps/admin-ui/src/context/ErrorBoundary.tsx b/js/apps/admin-ui/src/context/ErrorBoundary.tsx
index 99d7cd2f51..62f89d5451 100644
--- a/js/apps/admin-ui/src/context/ErrorBoundary.tsx
+++ b/js/apps/admin-ui/src/context/ErrorBoundary.tsx
@@ -5,7 +5,10 @@ import {
type GetDerivedStateFromError,
type ReactNode,
} from "react";
-import { createNamedContext, useRequiredContext } from "ui-shared";
+import {
+ createNamedContext,
+ useRequiredContext,
+} from "@keycloak/keycloak-ui-shared";
export interface ErrorBoundaryContextValue {
error?: Error;
diff --git a/js/apps/admin-ui/src/context/RealmsContext.tsx b/js/apps/admin-ui/src/context/RealmsContext.tsx
index ed84f25c27..261948b7d2 100644
--- a/js/apps/admin-ui/src/context/RealmsContext.tsx
+++ b/js/apps/admin-ui/src/context/RealmsContext.tsx
@@ -1,6 +1,10 @@
import { NetworkError } from "@keycloak/keycloak-admin-client";
import { PropsWithChildren, useCallback, useMemo, useState } from "react";
-import { createNamedContext, useRequiredContext, label } from "ui-shared";
+import {
+ createNamedContext,
+ useRequiredContext,
+ label,
+} from "@keycloak/keycloak-ui-shared";
import { keycloak } from "../keycloak";
import { useFetch } from "../utils/useFetch";
diff --git a/js/apps/admin-ui/src/context/RecentRealms.tsx b/js/apps/admin-ui/src/context/RecentRealms.tsx
index 1cde5d8894..05d09fe8f6 100644
--- a/js/apps/admin-ui/src/context/RecentRealms.tsx
+++ b/js/apps/admin-ui/src/context/RecentRealms.tsx
@@ -4,7 +4,7 @@ import {
createNamedContext,
useRequiredContext,
useStoredState,
-} from "ui-shared";
+} from "@keycloak/keycloak-ui-shared";
import { useRealm } from "./realm-context/RealmContext";
import { RealmNameRepresentation, useRealms } from "./RealmsContext";
diff --git a/js/apps/admin-ui/src/context/access/Access.tsx b/js/apps/admin-ui/src/context/access/Access.tsx
index 6ab2f740fa..18ebce7646 100644
--- a/js/apps/admin-ui/src/context/access/Access.tsx
+++ b/js/apps/admin-ui/src/context/access/Access.tsx
@@ -2,7 +2,10 @@ import type { AccessType } from "@keycloak/keycloak-admin-client/lib/defs/whoAmI
import { PropsWithChildren, useEffect, useState } from "react";
import { useRealm } from "../../context/realm-context/RealmContext";
import { useWhoAmI } from "../../context/whoami/WhoAmI";
-import { createNamedContext, useRequiredContext } from "ui-shared";
+import {
+ createNamedContext,
+ useRequiredContext,
+} from "@keycloak/keycloak-ui-shared";
type AccessContextProps = {
hasAccess: (...types: AccessType[]) => boolean;
diff --git a/js/apps/admin-ui/src/context/realm-context/RealmContext.tsx b/js/apps/admin-ui/src/context/realm-context/RealmContext.tsx
index 08ff295cb4..6927f3ae52 100644
--- a/js/apps/admin-ui/src/context/realm-context/RealmContext.tsx
+++ b/js/apps/admin-ui/src/context/realm-context/RealmContext.tsx
@@ -1,6 +1,9 @@
import { PropsWithChildren, useEffect, useMemo } from "react";
import { useMatch } from "react-router-dom";
-import { createNamedContext, useRequiredContext } from "ui-shared";
+import {
+ createNamedContext,
+ useRequiredContext,
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { DashboardRouteWithRealm } from "../../dashboard/routes/Dashboard";
diff --git a/js/apps/admin-ui/src/context/server-info/ServerInfoProvider.tsx b/js/apps/admin-ui/src/context/server-info/ServerInfoProvider.tsx
index a11fd38f52..dc8962ddd3 100644
--- a/js/apps/admin-ui/src/context/server-info/ServerInfoProvider.tsx
+++ b/js/apps/admin-ui/src/context/server-info/ServerInfoProvider.tsx
@@ -1,6 +1,9 @@
import type { ServerInfoRepresentation } from "@keycloak/keycloak-admin-client/lib/defs/serverInfoRepesentation";
import { PropsWithChildren, useState } from "react";
-import { createNamedContext, useRequiredContext } from "ui-shared";
+import {
+ createNamedContext,
+ useRequiredContext,
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { KeycloakSpinner } from "../../components/keycloak-spinner/KeycloakSpinner";
diff --git a/js/apps/admin-ui/src/context/whoami/WhoAmI.tsx b/js/apps/admin-ui/src/context/whoami/WhoAmI.tsx
index b923fe692b..78ad3da589 100644
--- a/js/apps/admin-ui/src/context/whoami/WhoAmI.tsx
+++ b/js/apps/admin-ui/src/context/whoami/WhoAmI.tsx
@@ -1,7 +1,10 @@
import type WhoAmIRepresentation from "@keycloak/keycloak-admin-client/lib/defs/whoAmIRepresentation";
import type { AccessType } from "@keycloak/keycloak-admin-client/lib/defs/whoAmIRepresentation";
import { PropsWithChildren, useState } from "react";
-import { createNamedContext, useRequiredContext } from "ui-shared";
+import {
+ createNamedContext,
+ useRequiredContext,
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import environment from "../../environment";
diff --git a/js/apps/admin-ui/src/dashboard/Dashboard.tsx b/js/apps/admin-ui/src/dashboard/Dashboard.tsx
index 3d5e08b44d..624e9de2b2 100644
--- a/js/apps/admin-ui/src/dashboard/Dashboard.tsx
+++ b/js/apps/admin-ui/src/dashboard/Dashboard.tsx
@@ -35,7 +35,7 @@ import FeatureRepresentation, {
} from "@keycloak/keycloak-admin-client/lib/defs/featureRepresentation";
import { useRealm } from "../context/realm-context/RealmContext";
import { useServerInfo } from "../context/server-info/ServerInfoProvider";
-import { HelpItem, label } from "ui-shared";
+import { HelpItem, label } from "@keycloak/keycloak-ui-shared";
import environment from "../environment";
import { KeycloakSpinner } from "../components/keycloak-spinner/KeycloakSpinner";
import useLocaleSort, { mapByKey } from "../utils/useLocaleSort";
diff --git a/js/apps/admin-ui/src/events/AdminEvents.tsx b/js/apps/admin-ui/src/events/AdminEvents.tsx
index a17271132f..376dab6994 100644
--- a/js/apps/admin-ui/src/events/AdminEvents.tsx
+++ b/js/apps/admin-ui/src/events/AdminEvents.tsx
@@ -29,7 +29,7 @@ import { PropsWithChildren, useMemo, useState } from "react";
import { Controller, FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import DropdownPanel from "../components/dropdown-panel/DropdownPanel";
import { ListEmptyState } from "../components/list-empty-state/ListEmptyState";
diff --git a/js/apps/admin-ui/src/events/EventsSection.tsx b/js/apps/admin-ui/src/events/EventsSection.tsx
index edb728f8f0..e9166275f2 100644
--- a/js/apps/admin-ui/src/events/EventsSection.tsx
+++ b/js/apps/admin-ui/src/events/EventsSection.tsx
@@ -50,7 +50,7 @@ import { useFetch } from "../utils/useFetch";
import useFormatDate, { FORMAT_DATE_AND_TIME } from "../utils/useFormatDate";
import { AdminEvents } from "./AdminEvents";
import { EventsTab, toEvents } from "./routes/Events";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import "./events.css";
diff --git a/js/apps/admin-ui/src/groups/GroupsModal.tsx b/js/apps/admin-ui/src/groups/GroupsModal.tsx
index de7bfc21ea..9eac2d0a26 100644
--- a/js/apps/admin-ui/src/groups/GroupsModal.tsx
+++ b/js/apps/admin-ui/src/groups/GroupsModal.tsx
@@ -9,7 +9,7 @@ import {
} from "@patternfly/react-core";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/groups/SubGroupsContext.tsx b/js/apps/admin-ui/src/groups/SubGroupsContext.tsx
index b1b35fd243..178ab5bf0c 100644
--- a/js/apps/admin-ui/src/groups/SubGroupsContext.tsx
+++ b/js/apps/admin-ui/src/groups/SubGroupsContext.tsx
@@ -1,6 +1,9 @@
import type GroupRepresentation from "@keycloak/keycloak-admin-client/lib/defs/groupRepresentation";
import { PropsWithChildren, useState } from "react";
-import { createNamedContext, useRequiredContext } from "ui-shared";
+import {
+ createNamedContext,
+ useRequiredContext,
+} from "@keycloak/keycloak-ui-shared";
type SubGroupsProps = {
subGroups: GroupRepresentation[];
diff --git a/js/apps/admin-ui/src/identity-providers/IdentityProvidersSection.tsx b/js/apps/admin-ui/src/identity-providers/IdentityProvidersSection.tsx
index 653c1ef84e..c4af5b8d26 100644
--- a/js/apps/admin-ui/src/identity-providers/IdentityProvidersSection.tsx
+++ b/js/apps/admin-ui/src/identity-providers/IdentityProvidersSection.tsx
@@ -25,7 +25,7 @@ import { groupBy, sortBy } from "lodash-es";
import { Fragment, useState } from "react";
import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
-import { IconMapper } from "ui-shared";
+import { IconMapper } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
import { useConfirmDialog } from "../components/confirm-dialog/ConfirmDialog";
diff --git a/js/apps/admin-ui/src/identity-providers/add/AddMapper.tsx b/js/apps/admin-ui/src/identity-providers/add/AddMapper.tsx
index a2d56bee35..ec90e45b5d 100644
--- a/js/apps/admin-ui/src/identity-providers/add/AddMapper.tsx
+++ b/js/apps/admin-ui/src/identity-providers/add/AddMapper.tsx
@@ -14,7 +14,7 @@ import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
import { useConfirmDialog } from "../../components/confirm-dialog/ConfirmDialog";
diff --git a/js/apps/admin-ui/src/identity-providers/add/AddMapperForm.tsx b/js/apps/admin-ui/src/identity-providers/add/AddMapperForm.tsx
index b8781b309d..2a9ab6edb9 100644
--- a/js/apps/admin-ui/src/identity-providers/add/AddMapperForm.tsx
+++ b/js/apps/admin-ui/src/identity-providers/add/AddMapperForm.tsx
@@ -9,7 +9,11 @@ import {
import { useState } from "react";
import { Controller, UseFormReturn } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem, SelectControl, TextControl } from "ui-shared";
+import {
+ HelpItem,
+ SelectControl,
+ TextControl,
+} from "@keycloak/keycloak-ui-shared";
import type { IdPMapperRepresentationWithAttributes } from "./AddMapper";
type AddMapperFormProps = {
diff --git a/js/apps/admin-ui/src/identity-providers/add/AdvancedSettings.tsx b/js/apps/admin-ui/src/identity-providers/add/AdvancedSettings.tsx
index 0cb8976d2a..a40d24ec34 100644
--- a/js/apps/admin-ui/src/identity-providers/add/AdvancedSettings.tsx
+++ b/js/apps/admin-ui/src/identity-providers/add/AdvancedSettings.tsx
@@ -14,7 +14,11 @@ import {
import { useState } from "react";
import { Controller, useFormContext, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormErrorText, HelpItem, SelectControl } from "ui-shared";
+import {
+ FormErrorText,
+ HelpItem,
+ SelectControl,
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useFetch } from "../../utils/useFetch";
diff --git a/js/apps/admin-ui/src/identity-providers/add/DescriptorSettings.tsx b/js/apps/admin-ui/src/identity-providers/add/DescriptorSettings.tsx
index f37ebc287d..25b12741f2 100644
--- a/js/apps/admin-ui/src/identity-providers/add/DescriptorSettings.tsx
+++ b/js/apps/admin-ui/src/identity-providers/add/DescriptorSettings.tsx
@@ -3,7 +3,11 @@ import { ExpandableSection } from "@patternfly/react-core";
import { useState } from "react";
import { FormProvider, useFormContext, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { NumberControl, SelectControl, TextControl } from "ui-shared";
+import {
+ NumberControl,
+ SelectControl,
+ TextControl,
+} from "@keycloak/keycloak-ui-shared";
import { DefaultSwitchControl } from "../../components/SwitchControl";
import "./discovery-settings.css";
diff --git a/js/apps/admin-ui/src/identity-providers/add/DetailSettings.tsx b/js/apps/admin-ui/src/identity-providers/add/DetailSettings.tsx
index 5df5161a67..0ea480bc11 100644
--- a/js/apps/admin-ui/src/identity-providers/add/DetailSettings.tsx
+++ b/js/apps/admin-ui/src/identity-providers/add/DetailSettings.tsx
@@ -25,7 +25,7 @@ import {
} from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
-import { ScrollForm } from "ui-shared";
+import { ScrollForm } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/identity-providers/add/DiscoverySettings.tsx b/js/apps/admin-ui/src/identity-providers/add/DiscoverySettings.tsx
index d67ce931ac..78e945fa50 100644
--- a/js/apps/admin-ui/src/identity-providers/add/DiscoverySettings.tsx
+++ b/js/apps/admin-ui/src/identity-providers/add/DiscoverySettings.tsx
@@ -3,7 +3,11 @@ import { ExpandableSection } from "@patternfly/react-core";
import { useState } from "react";
import { useFormContext, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { SelectControl, TextAreaControl, TextControl } from "ui-shared";
+import {
+ SelectControl,
+ TextAreaControl,
+ TextControl,
+} from "@keycloak/keycloak-ui-shared";
import { DefaultSwitchControl } from "../../components/SwitchControl";
import "./discovery-settings.css";
diff --git a/js/apps/admin-ui/src/identity-providers/add/ExtendedNonDiscoverySettings.tsx b/js/apps/admin-ui/src/identity-providers/add/ExtendedNonDiscoverySettings.tsx
index 00c245065d..e600754e48 100644
--- a/js/apps/admin-ui/src/identity-providers/add/ExtendedNonDiscoverySettings.tsx
+++ b/js/apps/admin-ui/src/identity-providers/add/ExtendedNonDiscoverySettings.tsx
@@ -13,7 +13,7 @@ import { useState } from "react";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { FormGroupField } from "../component/FormGroupField";
import { SwitchField } from "../component/SwitchField";
import { TextField } from "../component/TextField";
diff --git a/js/apps/admin-ui/src/identity-providers/add/OIDCAuthentication.tsx b/js/apps/admin-ui/src/identity-providers/add/OIDCAuthentication.tsx
index ee812472ec..855ae54b79 100644
--- a/js/apps/admin-ui/src/identity-providers/add/OIDCAuthentication.tsx
+++ b/js/apps/admin-ui/src/identity-providers/add/OIDCAuthentication.tsx
@@ -8,7 +8,7 @@ import { useState } from "react";
import { Controller, useFormContext, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { ClientIdSecret } from "../component/ClientIdSecret";
import { SwitchField } from "../component/SwitchField";
import { sortProviders } from "../../util";
diff --git a/js/apps/admin-ui/src/identity-providers/add/OIDCGeneralSettings.tsx b/js/apps/admin-ui/src/identity-providers/add/OIDCGeneralSettings.tsx
index 917bbef64e..0f709ac895 100644
--- a/js/apps/admin-ui/src/identity-providers/add/OIDCGeneralSettings.tsx
+++ b/js/apps/admin-ui/src/identity-providers/add/OIDCGeneralSettings.tsx
@@ -1,7 +1,7 @@
import { useFormContext, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { useParams } from "react-router-dom";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { DisplayOrder } from "../component/DisplayOrder";
import { RedirectUrl } from "../component/RedirectUrl";
import type { IdentityProviderParams } from "../routes/IdentityProvider";
diff --git a/js/apps/admin-ui/src/identity-providers/add/OpenIdConnectSettings.tsx b/js/apps/admin-ui/src/identity-providers/add/OpenIdConnectSettings.tsx
index ca1757d879..2c44aeef32 100644
--- a/js/apps/admin-ui/src/identity-providers/add/OpenIdConnectSettings.tsx
+++ b/js/apps/admin-ui/src/identity-providers/add/OpenIdConnectSettings.tsx
@@ -1,7 +1,7 @@
import { FormGroup, Title } from "@patternfly/react-core";
import { useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormErrorText, HelpItem } from "ui-shared";
+import { FormErrorText, HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { JsonFileUpload } from "../../components/json-file-upload/JsonFileUpload";
diff --git a/js/apps/admin-ui/src/identity-providers/add/ReqAuthnConstraintsSettings.tsx b/js/apps/admin-ui/src/identity-providers/add/ReqAuthnConstraintsSettings.tsx
index bc1d94e01c..e1daf8c1f5 100644
--- a/js/apps/admin-ui/src/identity-providers/add/ReqAuthnConstraintsSettings.tsx
+++ b/js/apps/admin-ui/src/identity-providers/add/ReqAuthnConstraintsSettings.tsx
@@ -8,7 +8,7 @@ import { useState } from "react";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { MultiLineInput } from "../../components/multi-line-input/MultiLineInput";
const comparisonValues = ["exact", "minimum", "maximum", "better"];
diff --git a/js/apps/admin-ui/src/identity-providers/add/SamlConnectSettings.tsx b/js/apps/admin-ui/src/identity-providers/add/SamlConnectSettings.tsx
index 1ef9c2a5bb..1fefcdb1a0 100644
--- a/js/apps/admin-ui/src/identity-providers/add/SamlConnectSettings.tsx
+++ b/js/apps/admin-ui/src/identity-providers/add/SamlConnectSettings.tsx
@@ -3,7 +3,11 @@ import type IdentityProviderRepresentation from "@keycloak/keycloak-admin-client
import { FormGroup, Title } from "@patternfly/react-core";
import { useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormErrorText, HelpItem, TextControl } from "ui-shared";
+import {
+ FormErrorText,
+ HelpItem,
+ TextControl,
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { FileUploadForm } from "../../components/json-file-upload/FileUploadForm";
diff --git a/js/apps/admin-ui/src/identity-providers/add/SamlGeneralSettings.tsx b/js/apps/admin-ui/src/identity-providers/add/SamlGeneralSettings.tsx
index 75c93a8617..996ef2f463 100644
--- a/js/apps/admin-ui/src/identity-providers/add/SamlGeneralSettings.tsx
+++ b/js/apps/admin-ui/src/identity-providers/add/SamlGeneralSettings.tsx
@@ -1,7 +1,7 @@
import { FormGroup } from "@patternfly/react-core";
import { useFormContext, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem, TextControl } from "ui-shared";
+import { HelpItem, TextControl } from "@keycloak/keycloak-ui-shared";
import { FormattedLink } from "../../components/external-link/FormattedLink";
import { useRealm } from "../../context/realm-context/RealmContext";
import environment from "../../environment";
diff --git a/js/apps/admin-ui/src/identity-providers/component/ClientIdSecret.tsx b/js/apps/admin-ui/src/identity-providers/component/ClientIdSecret.tsx
index 8b6d2af716..bcc746c19a 100644
--- a/js/apps/admin-ui/src/identity-providers/component/ClientIdSecret.tsx
+++ b/js/apps/admin-ui/src/identity-providers/component/ClientIdSecret.tsx
@@ -1,5 +1,5 @@
import { useTranslation } from "react-i18next";
-import { PasswordControl, TextControl } from "ui-shared";
+import { PasswordControl, TextControl } from "@keycloak/keycloak-ui-shared";
export const ClientIdSecret = ({
secretRequired = true,
diff --git a/js/apps/admin-ui/src/identity-providers/component/DiscoveryEndpointField.tsx b/js/apps/admin-ui/src/identity-providers/component/DiscoveryEndpointField.tsx
index c228d80751..65f6b10aa4 100644
--- a/js/apps/admin-ui/src/identity-providers/component/DiscoveryEndpointField.tsx
+++ b/js/apps/admin-ui/src/identity-providers/component/DiscoveryEndpointField.tsx
@@ -3,7 +3,7 @@ import debouncePromise from "p-debounce";
import { ReactNode, useMemo, useState } from "react";
import { useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem, TextControl } from "ui-shared";
+import { HelpItem, TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
diff --git a/js/apps/admin-ui/src/identity-providers/component/DisplayOrder.tsx b/js/apps/admin-ui/src/identity-providers/component/DisplayOrder.tsx
index 6d719badc0..2dc67f67c1 100644
--- a/js/apps/admin-ui/src/identity-providers/component/DisplayOrder.tsx
+++ b/js/apps/admin-ui/src/identity-providers/component/DisplayOrder.tsx
@@ -2,7 +2,7 @@ import { FormGroup, TextInput } from "@patternfly/react-core";
import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
export const DisplayOrder = () => {
const { t } = useTranslation();
diff --git a/js/apps/admin-ui/src/identity-providers/component/FormGroupField.tsx b/js/apps/admin-ui/src/identity-providers/component/FormGroupField.tsx
index 6363065871..ccc8fa3eba 100644
--- a/js/apps/admin-ui/src/identity-providers/component/FormGroupField.tsx
+++ b/js/apps/admin-ui/src/identity-providers/component/FormGroupField.tsx
@@ -2,7 +2,7 @@ import { FormGroup } from "@patternfly/react-core";
import { PropsWithChildren } from "react";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
export type FieldProps = { label: string; field: string; isReadOnly?: boolean };
export type FormGroupFieldProps = { label: string };
diff --git a/js/apps/admin-ui/src/identity-providers/component/RedirectUrl.tsx b/js/apps/admin-ui/src/identity-providers/component/RedirectUrl.tsx
index 68661e4e47..6daf644977 100644
--- a/js/apps/admin-ui/src/identity-providers/component/RedirectUrl.tsx
+++ b/js/apps/admin-ui/src/identity-providers/component/RedirectUrl.tsx
@@ -1,6 +1,6 @@
import { ClipboardCopy, FormGroup } from "@patternfly/react-core";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useRealm } from "../../context/realm-context/RealmContext";
diff --git a/js/apps/admin-ui/src/realm-roles/UsersInRoleTab.tsx b/js/apps/admin-ui/src/realm-roles/UsersInRoleTab.tsx
index d1b735744f..0c7b7ee185 100644
--- a/js/apps/admin-ui/src/realm-roles/UsersInRoleTab.tsx
+++ b/js/apps/admin-ui/src/realm-roles/UsersInRoleTab.tsx
@@ -2,7 +2,7 @@ import { Button, PageSection, Popover } from "@patternfly/react-core";
import { QuestionCircleIcon } from "@patternfly/react-icons";
import { useTranslation } from "react-i18next";
import { useNavigate } from "react-router-dom";
-import { useHelp } from "ui-shared";
+import { useHelp } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import type { ClientRoleParams } from "../clients/routes/ClientRole";
diff --git a/js/apps/admin-ui/src/realm-settings/AddTranslationModal.tsx b/js/apps/admin-ui/src/realm-settings/AddTranslationModal.tsx
index 602be4f3f4..c053edfc82 100644
--- a/js/apps/admin-ui/src/realm-settings/AddTranslationModal.tsx
+++ b/js/apps/admin-ui/src/realm-settings/AddTranslationModal.tsx
@@ -7,7 +7,7 @@ import {
} from "@patternfly/react-core";
import { FormProvider, SubmitHandler, UseFormReturn } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import type { KeyValueType } from "../components/key-value-form/key-value-convert";
type AddTranslationModalProps = {
diff --git a/js/apps/admin-ui/src/realm-settings/ClientProfileForm.tsx b/js/apps/admin-ui/src/realm-settings/ClientProfileForm.tsx
index bf67f0bcec..544931557b 100644
--- a/js/apps/admin-ui/src/realm-settings/ClientProfileForm.tsx
+++ b/js/apps/admin-ui/src/realm-settings/ClientProfileForm.tsx
@@ -24,7 +24,11 @@ import { Fragment, useMemo, useState } from "react";
import { FormProvider, useFieldArray, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
-import { HelpItem, TextAreaControl, TextControl } from "ui-shared";
+import {
+ HelpItem,
+ TextAreaControl,
+ TextControl,
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
import { useConfirmDialog } from "../components/confirm-dialog/ConfirmDialog";
diff --git a/js/apps/admin-ui/src/realm-settings/DefaultGroupsTab.tsx b/js/apps/admin-ui/src/realm-settings/DefaultGroupsTab.tsx
index c6c2ff33fb..49700f6f50 100644
--- a/js/apps/admin-ui/src/realm-settings/DefaultGroupsTab.tsx
+++ b/js/apps/admin-ui/src/realm-settings/DefaultGroupsTab.tsx
@@ -17,7 +17,7 @@ import { QuestionCircleIcon } from "@patternfly/react-icons";
import { useState } from "react";
import { Trans, useTranslation } from "react-i18next";
import { Link } from "react-router-dom";
-import { useHelp } from "ui-shared";
+import { useHelp } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/realm-settings/EmailTab.tsx b/js/apps/admin-ui/src/realm-settings/EmailTab.tsx
index 9cf2089a81..e7c13238c9 100644
--- a/js/apps/admin-ui/src/realm-settings/EmailTab.tsx
+++ b/js/apps/admin-ui/src/realm-settings/EmailTab.tsx
@@ -18,7 +18,7 @@ import {
SwitchControl,
TextControl,
PasswordControl,
-} from "ui-shared";
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
import { FormAccess } from "../components/form/FormAccess";
diff --git a/js/apps/admin-ui/src/realm-settings/ExecutorForm.tsx b/js/apps/admin-ui/src/realm-settings/ExecutorForm.tsx
index 4d500cf2aa..bd87a06b0f 100644
--- a/js/apps/admin-ui/src/realm-settings/ExecutorForm.tsx
+++ b/js/apps/admin-ui/src/realm-settings/ExecutorForm.tsx
@@ -17,7 +17,7 @@ import { useState } from "react";
import { Controller, FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/realm-settings/GeneralTab.tsx b/js/apps/admin-ui/src/realm-settings/GeneralTab.tsx
index e90f84548c..c78ccaa64c 100644
--- a/js/apps/admin-ui/src/realm-settings/GeneralTab.tsx
+++ b/js/apps/admin-ui/src/realm-settings/GeneralTab.tsx
@@ -15,7 +15,12 @@ import {
import { useEffect, useState } from "react";
import { Controller, FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormErrorText, HelpItem, SelectControl, TextControl } from "ui-shared";
+import {
+ FormErrorText,
+ HelpItem,
+ SelectControl,
+ TextControl,
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { DefaultSwitchControl } from "../components/SwitchControl";
diff --git a/js/apps/admin-ui/src/realm-settings/LoginTab.tsx b/js/apps/admin-ui/src/realm-settings/LoginTab.tsx
index 45d31152e2..679064f828 100644
--- a/js/apps/admin-ui/src/realm-settings/LoginTab.tsx
+++ b/js/apps/admin-ui/src/realm-settings/LoginTab.tsx
@@ -1,7 +1,7 @@
import type RealmRepresentation from "@keycloak/keycloak-admin-client/lib/defs/realmRepresentation";
import { FormGroup, PageSection, Switch } from "@patternfly/react-core";
import { useTranslation } from "react-i18next";
-import { FormPanel, HelpItem } from "ui-shared";
+import { FormPanel, HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
import { FormAccess } from "../components/form/FormAccess";
diff --git a/js/apps/admin-ui/src/realm-settings/NewAttributeSettings.tsx b/js/apps/admin-ui/src/realm-settings/NewAttributeSettings.tsx
index b358305570..3bfcfb32bf 100644
--- a/js/apps/admin-ui/src/realm-settings/NewAttributeSettings.tsx
+++ b/js/apps/admin-ui/src/realm-settings/NewAttributeSettings.tsx
@@ -14,7 +14,7 @@ import { useState } from "react";
import { FormProvider, useForm, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
-import { ScrollForm } from "ui-shared";
+import { ScrollForm } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
import { FixedButtonsGroup } from "../components/form/FixedButtonGroup";
diff --git a/js/apps/admin-ui/src/realm-settings/NewClientPolicy.tsx b/js/apps/admin-ui/src/realm-settings/NewClientPolicy.tsx
index cacc42753b..5d54ea7a66 100644
--- a/js/apps/admin-ui/src/realm-settings/NewClientPolicy.tsx
+++ b/js/apps/admin-ui/src/realm-settings/NewClientPolicy.tsx
@@ -25,7 +25,11 @@ import { useState } from "react";
import { Controller, FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
-import { HelpItem, KeycloakTextArea, TextControl } from "ui-shared";
+import {
+ HelpItem,
+ KeycloakTextArea,
+ TextControl,
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/realm-settings/NewClientPolicyCondition.tsx b/js/apps/admin-ui/src/realm-settings/NewClientPolicyCondition.tsx
index ab5c9a91d7..0ed6688e63 100644
--- a/js/apps/admin-ui/src/realm-settings/NewClientPolicyCondition.tsx
+++ b/js/apps/admin-ui/src/realm-settings/NewClientPolicyCondition.tsx
@@ -19,7 +19,7 @@ import { useState } from "react";
import { Controller, FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate, useParams } from "react-router-dom";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
import { DynamicComponents } from "../components/dynamic/DynamicComponents";
diff --git a/js/apps/admin-ui/src/realm-settings/SessionsTab.tsx b/js/apps/admin-ui/src/realm-settings/SessionsTab.tsx
index 7b73917669..c5eab0c436 100644
--- a/js/apps/admin-ui/src/realm-settings/SessionsTab.tsx
+++ b/js/apps/admin-ui/src/realm-settings/SessionsTab.tsx
@@ -9,7 +9,7 @@ import {
import { useEffect } from "react";
import { Controller, useForm, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormPanel, HelpItem } from "ui-shared";
+import { FormPanel, HelpItem } from "@keycloak/keycloak-ui-shared";
import { FormAccess } from "../components/form/FormAccess";
import { TimeSelector } from "../components/time-selector/TimeSelector";
import { convertToFormValues } from "../util";
diff --git a/js/apps/admin-ui/src/realm-settings/ThemesTab.tsx b/js/apps/admin-ui/src/realm-settings/ThemesTab.tsx
index 1c706953d1..a4660b23f7 100644
--- a/js/apps/admin-ui/src/realm-settings/ThemesTab.tsx
+++ b/js/apps/admin-ui/src/realm-settings/ThemesTab.tsx
@@ -15,7 +15,7 @@ import { Controller, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { FormAccess } from "../components/form/FormAccess";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { useServerInfo } from "../context/server-info/ServerInfoProvider";
import { convertToFormValues } from "../util";
diff --git a/js/apps/admin-ui/src/realm-settings/TokensTab.tsx b/js/apps/admin-ui/src/realm-settings/TokensTab.tsx
index 7cf20f1cb8..a3b4546e3b 100644
--- a/js/apps/admin-ui/src/realm-settings/TokensTab.tsx
+++ b/js/apps/admin-ui/src/realm-settings/TokensTab.tsx
@@ -21,7 +21,7 @@ import {
import { useEffect, useState } from "react";
import { Controller, useForm, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormPanel, HelpItem } from "ui-shared";
+import { FormPanel, HelpItem } from "@keycloak/keycloak-ui-shared";
import { FormAccess } from "../components/form/FormAccess";
import {
diff --git a/js/apps/admin-ui/src/realm-settings/event-config/EventConfigForm.tsx b/js/apps/admin-ui/src/realm-settings/event-config/EventConfigForm.tsx
index a8463b7942..38d0b8730b 100644
--- a/js/apps/admin-ui/src/realm-settings/event-config/EventConfigForm.tsx
+++ b/js/apps/admin-ui/src/realm-settings/event-config/EventConfigForm.tsx
@@ -7,7 +7,7 @@ import {
} from "@patternfly/react-core";
import { Controller, FormProvider, UseFormReturn } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { DefaultSwitchControl } from "../../components/SwitchControl";
import { useConfirmDialog } from "../../components/confirm-dialog/ConfirmDialog";
import { TimeSelectorControl } from "../../components/time-selector/TimeSelectorControl";
diff --git a/js/apps/admin-ui/src/realm-settings/event-config/EventListenersForm.tsx b/js/apps/admin-ui/src/realm-settings/event-config/EventListenersForm.tsx
index 4341a7411b..c8ebba4d15 100644
--- a/js/apps/admin-ui/src/realm-settings/event-config/EventListenersForm.tsx
+++ b/js/apps/admin-ui/src/realm-settings/event-config/EventListenersForm.tsx
@@ -2,7 +2,7 @@ import { ActionGroup, Button } from "@patternfly/react-core";
import { SelectVariant } from "@patternfly/react-core/deprecated";
import { FormProvider, UseFormReturn } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { SelectControl } from "ui-shared";
+import { SelectControl } from "@keycloak/keycloak-ui-shared";
import { useServerInfo } from "../../context/server-info/ServerInfoProvider";
type EventListenersFormProps = {
diff --git a/js/apps/admin-ui/src/realm-settings/keys/key-providers/KeyProviderForm.tsx b/js/apps/admin-ui/src/realm-settings/keys/key-providers/KeyProviderForm.tsx
index bbbd998728..752c2f0441 100644
--- a/js/apps/admin-ui/src/realm-settings/keys/key-providers/KeyProviderForm.tsx
+++ b/js/apps/admin-ui/src/realm-settings/keys/key-providers/KeyProviderForm.tsx
@@ -8,7 +8,7 @@ import {
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { useNavigate } from "react-router-dom";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../../admin-client";
import { useAlerts } from "../../../components/alert/Alerts";
import { DynamicComponents } from "../../../components/dynamic/DynamicComponents";
diff --git a/js/apps/admin-ui/src/realm-settings/localization/LocalizationTab.tsx b/js/apps/admin-ui/src/realm-settings/localization/LocalizationTab.tsx
index 84faa7c680..842d96ebc0 100644
--- a/js/apps/admin-ui/src/realm-settings/localization/LocalizationTab.tsx
+++ b/js/apps/admin-ui/src/realm-settings/localization/LocalizationTab.tsx
@@ -16,7 +16,7 @@ import {
import { useEffect, useMemo, useState } from "react";
import { Controller, useForm, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { FormAccess } from "../../components/form/FormAccess";
import { useServerInfo } from "../../context/server-info/ServerInfoProvider";
import { useWhoAmI } from "../../context/whoami/WhoAmI";
diff --git a/js/apps/admin-ui/src/realm-settings/security-defences/BruteForceDetection.tsx b/js/apps/admin-ui/src/realm-settings/security-defences/BruteForceDetection.tsx
index b1c96ab3c4..3586fbd1d8 100644
--- a/js/apps/admin-ui/src/realm-settings/security-defences/BruteForceDetection.tsx
+++ b/js/apps/admin-ui/src/realm-settings/security-defences/BruteForceDetection.tsx
@@ -8,7 +8,7 @@ import {
import { useEffect, useState } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem, NumberControl } from "ui-shared";
+import { HelpItem, NumberControl } from "@keycloak/keycloak-ui-shared";
import { FormAccess } from "../../components/form/FormAccess";
import { convertToFormValues } from "../../util";
import { Time } from "./Time";
diff --git a/js/apps/admin-ui/src/realm-settings/security-defences/HelpLinkTextInput.tsx b/js/apps/admin-ui/src/realm-settings/security-defences/HelpLinkTextInput.tsx
index 472fbe9768..03385b6fe2 100644
--- a/js/apps/admin-ui/src/realm-settings/security-defences/HelpLinkTextInput.tsx
+++ b/js/apps/admin-ui/src/realm-settings/security-defences/HelpLinkTextInput.tsx
@@ -1,5 +1,5 @@
import { Trans, useTranslation } from "react-i18next";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { FormattedLink } from "../../components/external-link/FormattedLink";
type HelpLinkTextInputProps = {
diff --git a/js/apps/admin-ui/src/realm-settings/user-profile/AttributesGroupForm.tsx b/js/apps/admin-ui/src/realm-settings/user-profile/AttributesGroupForm.tsx
index c24bd8f9ef..a9be43669a 100644
--- a/js/apps/admin-ui/src/realm-settings/user-profile/AttributesGroupForm.tsx
+++ b/js/apps/admin-ui/src/realm-settings/user-profile/AttributesGroupForm.tsx
@@ -11,7 +11,7 @@ import { useEffect, useMemo } from "react";
import { FormProvider, SubmitHandler, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate, useParams } from "react-router-dom";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { FormAccess } from "../../components/form/FormAccess";
import { KeyValueInput } from "../../components/key-value-form/KeyValueInput";
diff --git a/js/apps/admin-ui/src/realm-settings/user-profile/UserProfileContext.tsx b/js/apps/admin-ui/src/realm-settings/user-profile/UserProfileContext.tsx
index 8a28a718e6..256f577ddc 100644
--- a/js/apps/admin-ui/src/realm-settings/user-profile/UserProfileContext.tsx
+++ b/js/apps/admin-ui/src/realm-settings/user-profile/UserProfileContext.tsx
@@ -2,7 +2,10 @@ import type { UserProfileConfig } from "@keycloak/keycloak-admin-client/lib/defs
import { AlertVariant } from "@patternfly/react-core";
import { PropsWithChildren, useState } from "react";
import { useTranslation } from "react-i18next";
-import { createNamedContext, useRequiredContext } from "ui-shared";
+import {
+ createNamedContext,
+ useRequiredContext,
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/realm-settings/user-profile/attribute/AddTranslationsDialog.tsx b/js/apps/admin-ui/src/realm-settings/user-profile/attribute/AddTranslationsDialog.tsx
index 73dbc2b701..d5263bc919 100644
--- a/js/apps/admin-ui/src/realm-settings/user-profile/attribute/AddTranslationsDialog.tsx
+++ b/js/apps/admin-ui/src/realm-settings/user-profile/attribute/AddTranslationsDialog.tsx
@@ -26,7 +26,7 @@ import { ListEmptyState } from "../../../components/list-empty-state/ListEmptySt
import { useFetch } from "../../../utils/useFetch";
import { localeToDisplayName } from "../../../util";
import { DEFAULT_LOCALE } from "../../../i18n/i18n";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
type TranslationForm = {
locale: string;
diff --git a/js/apps/admin-ui/src/realm-settings/user-profile/attribute/AttributeGeneralSettings.tsx b/js/apps/admin-ui/src/realm-settings/user-profile/attribute/AttributeGeneralSettings.tsx
index db1494fc45..a9c4a5b19e 100644
--- a/js/apps/admin-ui/src/realm-settings/user-profile/attribute/AttributeGeneralSettings.tsx
+++ b/js/apps/admin-ui/src/realm-settings/user-profile/attribute/AttributeGeneralSettings.tsx
@@ -22,7 +22,7 @@ import { isEqual } from "lodash-es";
import { useEffect, useRef, useState } from "react";
import { Controller, useFormContext, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormErrorText, HelpItem } from "ui-shared";
+import { FormErrorText, HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../../admin-client";
import { FormAccess } from "../../../components/form/FormAccess";
diff --git a/js/apps/admin-ui/src/realm-settings/user-profile/attribute/AttributePermission.tsx b/js/apps/admin-ui/src/realm-settings/user-profile/attribute/AttributePermission.tsx
index 8afb4dce40..70c8fb5b56 100644
--- a/js/apps/admin-ui/src/realm-settings/user-profile/attribute/AttributePermission.tsx
+++ b/js/apps/admin-ui/src/realm-settings/user-profile/attribute/AttributePermission.tsx
@@ -3,7 +3,7 @@ import { Controller, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { FormAccess } from "../../../components/form/FormAccess";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import "../../realm-settings-section.css";
diff --git a/js/apps/admin-ui/src/realm/add/NewRealmForm.tsx b/js/apps/admin-ui/src/realm/add/NewRealmForm.tsx
index 42e2a58c95..47d2851f2b 100644
--- a/js/apps/admin-ui/src/realm/add/NewRealmForm.tsx
+++ b/js/apps/admin-ui/src/realm/add/NewRealmForm.tsx
@@ -4,7 +4,7 @@ import { useState } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { useNavigate } from "react-router-dom";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { DefaultSwitchControl } from "../../components/SwitchControl";
diff --git a/js/apps/admin-ui/src/user-federation/UserFederationLdapForm.tsx b/js/apps/admin-ui/src/user-federation/UserFederationLdapForm.tsx
index 63ee6461cb..8f3b789f3a 100644
--- a/js/apps/admin-ui/src/user-federation/UserFederationLdapForm.tsx
+++ b/js/apps/admin-ui/src/user-federation/UserFederationLdapForm.tsx
@@ -3,7 +3,7 @@ import { Button, Form } from "@patternfly/react-core";
import { useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { useNavigate } from "react-router-dom";
-import { ScrollForm } from "ui-shared";
+import { ScrollForm } from "@keycloak/keycloak-ui-shared";
import { FixedButtonsGroup } from "../components/form/FixedButtonGroup";
import { useRealm } from "../context/realm-context/RealmContext";
diff --git a/js/apps/admin-ui/src/user-federation/custom/CustomProviderSettings.tsx b/js/apps/admin-ui/src/user-federation/custom/CustomProviderSettings.tsx
index 8ba3daf8af..dfb5229dcc 100644
--- a/js/apps/admin-ui/src/user-federation/custom/CustomProviderSettings.tsx
+++ b/js/apps/admin-ui/src/user-federation/custom/CustomProviderSettings.tsx
@@ -9,7 +9,7 @@ import { useState } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { Link, useNavigate } from "react-router-dom";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
import { DynamicComponents } from "../../components/dynamic/DynamicComponents";
diff --git a/js/apps/admin-ui/src/user-federation/custom/SyncSettings.tsx b/js/apps/admin-ui/src/user-federation/custom/SyncSettings.tsx
index b90b4cbbdc..7e4dc7b2da 100644
--- a/js/apps/admin-ui/src/user-federation/custom/SyncSettings.tsx
+++ b/js/apps/admin-ui/src/user-federation/custom/SyncSettings.tsx
@@ -1,7 +1,7 @@
import { FormGroup, Switch } from "@patternfly/react-core";
import { Controller, FormProvider, useFormContext } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem, TextControl } from "ui-shared";
+import { HelpItem, TextControl } from "@keycloak/keycloak-ui-shared";
export const SyncSettings = () => {
const { t } = useTranslation();
diff --git a/js/apps/admin-ui/src/user-federation/kerberos/KerberosSettingsRequired.tsx b/js/apps/admin-ui/src/user-federation/kerberos/KerberosSettingsRequired.tsx
index 987a53b269..2d3ee3bf8a 100644
--- a/js/apps/admin-ui/src/user-federation/kerberos/KerberosSettingsRequired.tsx
+++ b/js/apps/admin-ui/src/user-federation/kerberos/KerberosSettingsRequired.tsx
@@ -13,7 +13,7 @@ import {
useWatch,
} from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem, TextControl } from "ui-shared";
+import { HelpItem, TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { FormAccess } from "../../components/form/FormAccess";
import { WizardSectionHeader } from "../../components/wizard-section-header/WizardSectionHeader";
diff --git a/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsAdvanced.tsx b/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsAdvanced.tsx
index 66a604cd3f..9136ceeaaa 100644
--- a/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsAdvanced.tsx
+++ b/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsAdvanced.tsx
@@ -1,7 +1,7 @@
import { Button, FormGroup, Switch } from "@patternfly/react-core";
import { Controller, UseFormReturn } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsConnection.tsx b/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsConnection.tsx
index 68e04e29b0..44f4fa000d 100644
--- a/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsConnection.tsx
+++ b/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsConnection.tsx
@@ -19,7 +19,11 @@ import {
useWatch,
} from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem, PasswordControl, TextControl } from "ui-shared";
+import {
+ HelpItem,
+ PasswordControl,
+ TextControl,
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useAlerts } from "../../components/alert/Alerts";
import { FormAccess } from "../../components/form/FormAccess";
diff --git a/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsGeneral.tsx b/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsGeneral.tsx
index a3f9e2fc3b..eaa3af774f 100644
--- a/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsGeneral.tsx
+++ b/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsGeneral.tsx
@@ -8,7 +8,7 @@ import {
import { useState } from "react";
import { Controller, FormProvider, UseFormReturn } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem, TextControl } from "ui-shared";
+import { HelpItem, TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { FormAccess } from "../../components/form/FormAccess";
diff --git a/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsKerberosIntegration.tsx b/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsKerberosIntegration.tsx
index d8ad44bee2..c94550c9b2 100644
--- a/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsKerberosIntegration.tsx
+++ b/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsKerberosIntegration.tsx
@@ -6,7 +6,7 @@ import {
useWatch,
} from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem, TextControl } from "ui-shared";
+import { HelpItem, TextControl } from "@keycloak/keycloak-ui-shared";
import { FormAccess } from "../../components/form/FormAccess";
import { WizardSectionHeader } from "../../components/wizard-section-header/WizardSectionHeader";
diff --git a/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsSearching.tsx b/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsSearching.tsx
index ddcb9a197f..07fbfc0c7f 100644
--- a/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsSearching.tsx
+++ b/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsSearching.tsx
@@ -7,7 +7,11 @@ import {
import { useState } from "react";
import { Controller, FormProvider, UseFormReturn } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormErrorText, HelpItem, TextControl } from "ui-shared";
+import {
+ FormErrorText,
+ HelpItem,
+ TextControl,
+} from "@keycloak/keycloak-ui-shared";
import { FormAccess } from "../../components/form/FormAccess";
import { WizardSectionHeader } from "../../components/wizard-section-header/WizardSectionHeader";
diff --git a/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsSynchronization.tsx b/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsSynchronization.tsx
index 4f1adcc2a6..516680e484 100644
--- a/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsSynchronization.tsx
+++ b/js/apps/admin-ui/src/user-federation/ldap/LdapSettingsSynchronization.tsx
@@ -1,7 +1,7 @@
import { FormGroup, Switch } from "@patternfly/react-core";
import { Controller, FormProvider, UseFormReturn } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { HelpItem, TextControl } from "ui-shared";
+import { HelpItem, TextControl } from "@keycloak/keycloak-ui-shared";
import { FormAccess } from "../../components/form/FormAccess";
import { WizardSectionHeader } from "../../components/wizard-section-header/WizardSectionHeader";
diff --git a/js/apps/admin-ui/src/user-federation/ldap/mappers/LdapMapperDetails.tsx b/js/apps/admin-ui/src/user-federation/ldap/mappers/LdapMapperDetails.tsx
index 7d6aceb7ff..6a641ad247 100644
--- a/js/apps/admin-ui/src/user-federation/ldap/mappers/LdapMapperDetails.tsx
+++ b/js/apps/admin-ui/src/user-federation/ldap/mappers/LdapMapperDetails.tsx
@@ -19,7 +19,7 @@ import { useState } from "react";
import { Controller, FormProvider, useForm, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { useNavigate } from "react-router-dom";
-import { HelpItem, TextControl } from "ui-shared";
+import { HelpItem, TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../../admin-client";
import { useAlerts } from "../../../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/user-federation/shared/SettingsCache.tsx b/js/apps/admin-ui/src/user-federation/shared/SettingsCache.tsx
index 38bc077503..6ec7e3e6d7 100644
--- a/js/apps/admin-ui/src/user-federation/shared/SettingsCache.tsx
+++ b/js/apps/admin-ui/src/user-federation/shared/SettingsCache.tsx
@@ -9,7 +9,7 @@ import { Controller, UseFormReturn, useWatch } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { FormAccess } from "../../components/form/FormAccess";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { WizardSectionHeader } from "../../components/wizard-section-header/WizardSectionHeader";
import useToggle from "../../utils/useToggle";
diff --git a/js/apps/admin-ui/src/user/CreateUser.tsx b/js/apps/admin-ui/src/user/CreateUser.tsx
index ed5b703403..e8cfdfcba9 100644
--- a/js/apps/admin-ui/src/user/CreateUser.tsx
+++ b/js/apps/admin-ui/src/user/CreateUser.tsx
@@ -7,7 +7,10 @@ import { useState } from "react";
import { useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { useNavigate } from "react-router-dom";
-import { isUserProfileError, setUserProfileServerError } from "ui-shared";
+import {
+ isUserProfileError,
+ setUserProfileServerError,
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/user/EditUser.tsx b/js/apps/admin-ui/src/user/EditUser.tsx
index 55b9fde3f4..464007dd87 100644
--- a/js/apps/admin-ui/src/user/EditUser.tsx
+++ b/js/apps/admin-ui/src/user/EditUser.tsx
@@ -19,7 +19,10 @@ import { useState } from "react";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
import { useNavigate } from "react-router-dom";
-import { isUserProfileError, setUserProfileServerError } from "ui-shared";
+import {
+ isUserProfileError,
+ setUserProfileServerError,
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/user/UserCredentials.tsx b/js/apps/admin-ui/src/user/UserCredentials.tsx
index 2ab80e8ba5..6217f62aea 100644
--- a/js/apps/admin-ui/src/user/UserCredentials.tsx
+++ b/js/apps/admin-ui/src/user/UserCredentials.tsx
@@ -18,7 +18,7 @@ import {
useState,
} from "react";
import { useTranslation } from "react-i18next";
-import { HelpItem } from "ui-shared";
+import { HelpItem } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/user/UserForm.tsx b/js/apps/admin-ui/src/user/UserForm.tsx
index 3deede9b5f..c1e78103e7 100644
--- a/js/apps/admin-ui/src/user/UserForm.tsx
+++ b/js/apps/admin-ui/src/user/UserForm.tsx
@@ -25,7 +25,7 @@ import {
SwitchControl,
TextControl,
UserProfileFields,
-} from "ui-shared";
+} from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { DefaultSwitchControl } from "../components/SwitchControl";
diff --git a/js/apps/admin-ui/src/user/UserGroups.tsx b/js/apps/admin-ui/src/user/UserGroups.tsx
index e4cf323371..72fe9eefeb 100644
--- a/js/apps/admin-ui/src/user/UserGroups.tsx
+++ b/js/apps/admin-ui/src/user/UserGroups.tsx
@@ -12,7 +12,7 @@ import { cellWidth } from "@patternfly/react-table";
import { intersectionBy, sortBy, uniqBy } from "lodash-es";
import { useState } from "react";
import { useTranslation } from "react-i18next";
-import { useHelp } from "ui-shared";
+import { useHelp } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/user/UserIdPModal.tsx b/js/apps/admin-ui/src/user/UserIdPModal.tsx
index f3d96d207d..e8b632e5d0 100644
--- a/js/apps/admin-ui/src/user/UserIdPModal.tsx
+++ b/js/apps/admin-ui/src/user/UserIdPModal.tsx
@@ -12,7 +12,7 @@ import {
import { capitalize } from "lodash-es";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { TextControl } from "ui-shared";
+import { TextControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
diff --git a/js/apps/admin-ui/src/user/UserIdentityProviderLinks.tsx b/js/apps/admin-ui/src/user/UserIdentityProviderLinks.tsx
index e460ed63c6..5c90bf32fb 100644
--- a/js/apps/admin-ui/src/user/UserIdentityProviderLinks.tsx
+++ b/js/apps/admin-ui/src/user/UserIdentityProviderLinks.tsx
@@ -14,7 +14,7 @@ import { capitalize } from "lodash-es";
import { useState } from "react";
import { useTranslation } from "react-i18next";
import { Link } from "react-router-dom";
-import { FormPanel } from "ui-shared";
+import { FormPanel } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../admin-client";
import { useAlerts } from "../components/alert/Alerts";
import { useConfirmDialog } from "../components/confirm-dialog/ConfirmDialog";
diff --git a/js/apps/admin-ui/src/user/user-credentials/RequiredActionMultiSelect.tsx b/js/apps/admin-ui/src/user/user-credentials/RequiredActionMultiSelect.tsx
index b5b0fe545d..54fdbbaf80 100644
--- a/js/apps/admin-ui/src/user/user-credentials/RequiredActionMultiSelect.tsx
+++ b/js/apps/admin-ui/src/user/user-credentials/RequiredActionMultiSelect.tsx
@@ -3,7 +3,7 @@ import { SelectVariant } from "@patternfly/react-core/deprecated";
import { useState } from "react";
import { FieldPathByValue, FieldValues } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { SelectControl } from "ui-shared";
+import { SelectControl } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { useFetch } from "../../utils/useFetch";
diff --git a/js/apps/admin-ui/src/user/user-credentials/ResetPasswordDialog.tsx b/js/apps/admin-ui/src/user/user-credentials/ResetPasswordDialog.tsx
index b86f65bd55..5c30f1eb78 100644
--- a/js/apps/admin-ui/src/user/user-credentials/ResetPasswordDialog.tsx
+++ b/js/apps/admin-ui/src/user/user-credentials/ResetPasswordDialog.tsx
@@ -8,7 +8,7 @@ import {
} from "@patternfly/react-core";
import { FormProvider, useForm } from "react-hook-form";
import { useTranslation } from "react-i18next";
-import { FormErrorText, PasswordInput } from "ui-shared";
+import { FormErrorText, PasswordInput } from "@keycloak/keycloak-ui-shared";
import { adminClient } from "../../admin-client";
import { DefaultSwitchControl } from "../../components/SwitchControl";
diff --git a/js/libs/ui-shared/package.json b/js/libs/ui-shared/package.json
index 4bca4b1306..002459083c 100644
--- a/js/libs/ui-shared/package.json
+++ b/js/libs/ui-shared/package.json
@@ -1,12 +1,13 @@
{
- "name": "ui-shared",
+ "name": "@keycloak/keycloak-ui-shared",
+ "version": "999.0.0-SNAPSHOT",
"type": "module",
- "main": "./dist/ui-shared.js",
- "types": "./dist/ui-shared.d.ts",
+ "main": "./dist/keycloak-ui-shared.js",
+ "types": "./dist/keycloak-ui-shared.d.ts",
"exports": {
".": {
- "import": "./dist/ui-shared.js",
- "types": "./dist/ui-shared.d.ts"
+ "import": "./dist/keycloak-ui-shared.js",
+ "types": "./dist/keycloak-ui-shared.d.ts"
}
},
"files": [
diff --git a/js/libs/ui-shared/pom.xml b/js/libs/ui-shared/pom.xml
new file mode 100644
index 0000000000..a9ded2f678
--- /dev/null
+++ b/js/libs/ui-shared/pom.xml
@@ -0,0 +1,63 @@
+
+
+ 4.0.0
+
+
+ keycloak-js-parent
+ org.keycloak
+ 999.0.0-SNAPSHOT
+ ../../pom.xml
+
+
+ keycloak-ui-shared
+
+ Keycloak UI shared components
+ A JavaScript package containing shared components for the Keycloak UI.
+ pom
+
+
+
+
+ org.apache.maven.plugins
+ maven-deploy-plugin
+
+ true
+
+
+
+ org.apache.maven.plugins
+ maven-antrun-plugin
+
+
+ create-target-dir
+ prepare-package
+
+
+
+
+
+
+ run
+
+
+
+
+
+ com.github.eirslett
+ frontend-maven-plugin
+
+
+ pack
+ package
+
+ pnpm
+
+
+ pack --pack-destination=target
+
+
+
+
+
+
+
diff --git a/js/pom.xml b/js/pom.xml
index 1420cbdcfe..2d2c55e674 100644
--- a/js/pom.xml
+++ b/js/pom.xml
@@ -19,6 +19,7 @@
apps/account-ui
apps/admin-ui
libs/keycloak-admin-client
+ libs/ui-shared
libs/keycloak-js
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index dc777b0b79..831ca2b08b 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -65,6 +65,9 @@ importers:
js/apps/account-ui:
dependencies:
+ '@keycloak/keycloak-ui-shared':
+ specifier: workspace:*
+ version: link:../../libs/ui-shared
'@patternfly/patternfly':
specifier: ^5.2.1
version: 5.2.1
@@ -104,9 +107,6 @@ importers:
react-router-dom:
specifier: ^6.22.3
version: 6.22.3(react-dom@18.2.0(react@18.2.0))(react@18.2.0)
- ui-shared:
- specifier: workspace:*
- version: link:../../libs/ui-shared
devDependencies:
'@keycloak/keycloak-admin-client':
specifier: workspace:*
@@ -144,6 +144,9 @@ importers:
'@keycloak/keycloak-admin-client':
specifier: workspace:*
version: link:../../libs/keycloak-admin-client
+ '@keycloak/keycloak-ui-shared':
+ specifier: workspace:*
+ version: link:../../libs/ui-shared
'@patternfly/patternfly':
specifier: ^5.2.1
version: 5.2.1
@@ -216,9 +219,6 @@ importers:
reactflow:
specifier: ^11.11.1
version: 11.11.1(@types/react@18.2.79)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)
- ui-shared:
- specifier: workspace:*
- version: link:../../libs/ui-shared
use-react-router-breadcrumbs:
specifier: ^4.0.1
version: 4.0.1(react-router-dom@6.22.3(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(react@18.2.0)
@@ -6637,6 +6637,7 @@ snapshots:
admin-ui@file:js/apps/admin-ui(@types/react@18.2.79):
dependencies:
'@keycloak/keycloak-admin-client': link:js/libs/keycloak-admin-client
+ '@keycloak/keycloak-ui-shared': link:js/libs/ui-shared
'@patternfly/patternfly': 5.2.1
'@patternfly/react-code-editor': 5.2.3(monaco-editor@0.47.0)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)
'@patternfly/react-core': 5.2.3(react-dom@18.2.0(react@18.2.0))(react@18.2.0)
@@ -6660,7 +6661,6 @@ snapshots:
react-i18next: 14.1.0(i18next@23.11.2)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)
react-router-dom: 6.22.3(react-dom@18.2.0(react@18.2.0))(react@18.2.0)
reactflow: 11.11.1(@types/react@18.2.79)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)
- ui-shared: link:js/libs/ui-shared
use-react-router-breadcrumbs: 4.0.1(react-router-dom@6.22.3(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(react@18.2.0)
transitivePeerDependencies:
- '@types/react'
diff --git a/set-version.sh b/set-version.sh
index 21886a2021..d4fc34fe51 100755
--- a/set-version.sh
+++ b/set-version.sh
@@ -25,11 +25,11 @@ sed -i 's/:project_versionNpm: .*/:project_versionNpm: '$NEW_NPM_VERSION'/' topi
sed -i 's/:project_versionDoc: .*/:project_versionDoc: '$NEW_VERSION'/' topics/templates/document-attributes.adoc
cd -
-# Keycloak JS
+# NPM publish
echo "$(jq '. += {"version": "'$NEW_NPM_VERSION'"}' js/libs/keycloak-js/package.json)" > js/libs/keycloak-js/package.json
-
-# Keycloak Admin Client
echo "$(jq '. += {"version": "'$NEW_NPM_VERSION'"}' js/libs/keycloak-admin-client/package.json)" > js/libs/keycloak-admin-client/package.json
+echo "$(jq '. += {"version": "'$NEW_NPM_VERSION'"}' js/libs/ui-shared/package.json)" > js/libs/ui-shared/package.json
+echo "$(jq '. += {"version": "'$NEW_NPM_VERSION'"}' js/apps/account-ui/package.json)" > js/apps/account-ui/package.json
echo "New Mvn Version: $NEW_VERSION" >&2
echo "New NPM Version: $NEW_NPM_VERSION" >&2
diff --git a/tsconfig.eslint.json b/tsconfig.eslint.json
index cfec5d25c3..87d6e52a8d 100644
--- a/tsconfig.eslint.json
+++ b/tsconfig.eslint.json
@@ -1,5 +1,5 @@
{
"extends": "./tsconfig.json",
"include": ["**/*", "eslint.config.js"],
- "exclude": ["node_modules", "dist", "server"]
+ "exclude": ["node_modules", "dist", "lib", "server"]
}