@keycloakify/keycloak-ui-shared 260305.0.0 → 260500.0.0

package/keycloak-theme/shared/keycloak-ui-shared/context/environment.ts

@@ -19,7 +19,7 @@ export type BaseEnvironment = {
   clientId: string;
   /** The base URL of the resources. */
   resourceUrl: string;
-  /** The source URL for the the logo image. */
+  /** The source URL for the logo image. */
   logo: string;
   /** The URL to be followed when the logo is clicked. */
   logoUrl: string;

package/keycloak-theme/shared/keycloak-ui-shared/controls/SwitchControl.tsx

@@ -58,6 +58,7 @@ export const SwitchControl = <
             id={props.name}
             data-testid={debeerify(props.name)}
             label={labelOn}
+            aria-label={props.label}
             isChecked={stringify ? value === "true" : value}
             onChange={(e, checked) => {
               const value = stringify ? checked.toString() : checked;

package/keycloak-theme/shared/keycloak-ui-shared/controls/table/KeycloakDataTable.tsx

@@ -262,7 +262,7 @@ function DataTable<T>({
                     rows[index + 1].cells.length === 0
                       ? undefined
                       : {
-                          isExpanded: !!expandedRows[index],
+                          isExpanded: expandedRows[index] ?? false,
                           rowIndex: index,
                           expandId: "expandable-row-",
                           onToggle: (_, rowIndex, isOpen) => {
@@ -282,7 +282,7 @@ function DataTable<T>({
                 />
               </Tr>
             ) : (
-              <Tr isExpanded={!!expandedRows[index - 1]}>
+              <Tr isExpanded={expandedRows[index - 1] ?? false}>
                 <Td />
                 <Td colSpan={columns.length}>
                   <ExpandableRowContent>
@@ -361,7 +361,7 @@ export type DataListProps<T> = Omit<
  * @param {DataListProps} props - The properties.
  * @param {string} props.ariaLabelKey - The aria label key i18n key to lookup the label
  * @param {string} props.searchPlaceholderKey - The i18n key to lookup the placeholder for the search box
- * @param {boolean} props.isPaginated - if true the the loader will be called with first, max and search and a pager will be added in the header
+ * @param {boolean} props.isPaginated - if true, the loader will be called with first, max and search and a pager will be added in the header
  * @param {(first?: number, max?: number, search?: string) => Promise<T[]>} props.loader - loader function that will fetch the data to display first, max and search are only applicable when isPaginated = true
  * @param {Field<T>} props.columns - definition of the columns
  * @param {Field<T>} props.detailColumns - definition of the columns expandable columns

package/keycloak-theme/shared/keycloak-ui-shared/select/KeycloakSelect.tsx

@@ -22,7 +22,7 @@ export type KeycloakSelectProps = Omit<
   "name" | "toggle" | "selected" | "onClick" | "onSelect" | "variant"
 > & {
   toggleId?: string;
-  onFilter?: (value: string) => JSX.Element[];
+  onFilter?: (value: string) => void;
   onClear?: () => void;
   variant?: Variant;
   isDisabled?: boolean;

package/keycloak-theme/shared/keycloak-ui-shared/user-profile/MultiInputComponent.tsx

@@ -33,6 +33,7 @@ export const MultiInputComponent = ({
       form={form}
       aria-label={labelAttribute(t, attribute)}
       name={fieldName(attribute.name)!}
+      defaultValue={[attribute.defaultValue || ""]}
       addButtonLabel={t("addMultivaluedLabel", {
         fieldLabel: labelAttribute(t, attribute),
       })}

package/keycloak-theme/shared/keycloak-ui-shared/user-profile/OptionsComponent.tsx

@@ -31,7 +31,7 @@ export const OptionComponent = (props: UserProfileFieldProps) => {
       <Controller
         name={fieldName(attribute.name)}
         control={form.control}
-        defaultValue=""
+        defaultValue={attribute.defaultValue}
         render={({ field }) => (
           <>
             {options.map((option) => (
@@ -41,15 +41,15 @@ export const OptionComponent = (props: UserProfileFieldProps) => {
                 data-testid={option}
                 label={label(props.t, optionLabel[option], option, prefix)}
                 value={option}
-                isChecked={field.value.includes(option)}
+                isChecked={field.value?.includes(option)}
                 onChange={() => {
                   if (isMultiSelect) {
-                    if (field.value.includes(option)) {
+                    if (field.value?.includes(option)) {
                       field.onChange(
-                        field.value.filter((item: string) => item !== option),
+                        field.value?.filter((item: string) => item !== option),
                       );
                     } else {
-                      field.onChange([...field.value, option]);
+                      field.onChange([...(field.value || []), option]);
                     }
                   } else {
                     field.onChange([option]);

package/keycloak-theme/shared/keycloak-ui-shared/user-profile/SelectComponent.tsx

@@ -70,7 +70,7 @@ export const SelectComponent = (props: UserProfileFieldProps) => {
     <UserProfileGroup {...props}>
       <Controller
         name={fieldName(attribute.name)}
-        defaultValue=""
+        defaultValue={attribute.defaultValue}
         control={form.control}
         render={({ field }) => (
           <KeycloakSelect

package/keycloak-theme/shared/keycloak-ui-shared/user-profile/TextAreaComponent.tsx

@@ -21,6 +21,7 @@ export const TextAreaComponent = (props: UserProfileFieldProps) => {
         rows={attribute.annotations?.["inputTypeRows"] as number}
         readOnly={attribute.readOnly}
         isRequired={isRequired}
+        defaultValue={attribute.defaultValue}
       />
     </UserProfileGroup>
   );

package/keycloak-theme/shared/keycloak-ui-shared/user-profile/TextComponent.tsx

@@ -35,6 +35,7 @@ export const TextComponent = (props: UserProfileFieldProps) => {
         }
         isDisabled={attribute.readOnly}
         isRequired={isRequired}
+        defaultValue={attribute.defaultValue}
         {...form.register(fieldName(attribute.name))}
       />
     </UserProfileGroup>

package/keycloak-theme/shared/keycloak-ui-shared/user-profile/utils.ts

@@ -81,9 +81,7 @@ export function setUserProfileServerError<T>(
   ).forEach((e) => {
     const params = Object.assign(
       {},
-      e.params?.map((p) =>
-        isBundleKey(p?.toString()) ? t(unWrap(p as string)) : p,
-      ),
+      e.params?.map((p) => (isBundleKey(p) ? t(unWrap(p as string)) : p)),
     );
     setError(fieldName(e.field) as keyof T, {
       message: t(

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@keycloakify/keycloak-ui-shared",
-  "version": "260305.0.0",
+  "version": "260500.0.0",
   "repository": {
     "type": "git",
     "url": "git://github.com/keycloakify/keycloak-ui-shared.git"
@@ -13,13 +13,13 @@
     "@patternfly/react-icons": "^5.4.2",
     "@patternfly/react-styles": "^5.4.1",
     "@patternfly/react-table": "^5.4.16",
-    "i18next": "^25.2.1",
-    "keycloak-js": "^26.2.0",
-    "lodash-es": "^4.17.21",
+    "i18next": "^25.7.3",
+    "keycloak-js": "^26.2.2",
+    "lodash-es": "^4.17.22",
     "react": "^18.3.1",
-    "react-hook-form": "7.59.0",
-    "react-i18next": "^15.5.3",
-    "@keycloak/keycloak-admin-client": "26.3.5",
+    "react-hook-form": "7.70.0",
+    "react-i18next": "^16.5.1",
+    "@keycloak/keycloak-admin-client": "26.5.0",
     "@types/lodash-es": "^4.17.12",
     "@types/react": "^18.3.18"
   },