@keycloakify/svelte 0.1.11 → 0.2.0

package/keycloakify-svelte/bin/818.index.js

@@ -673,8 +673,6 @@ async function command(params) {
                 'GroupLabel.svelte',
                 'InputTagSelects.svelte',
                 'TextareaTag.svelte',
-                'InputFieldByTypeProps.ts',
-                'UserProfileFormFieldsProps.ts',
             ];
         }
         return [(0,tsafe_capitalize__WEBPACK_IMPORTED_MODULE_6__/* .capitalize */ .Z)((0,_tools_kebabCaseToSnakeCase__WEBPACK_IMPORTED_MODULE_7__/* .kebabCaseToCamelCase */ .b)(pageIdOrComponent)).replace(/ftl$/, 'svelte')];
@@ -697,7 +695,7 @@ async function command(params) {
         let componentCode = fs__WEBPACK_IMPORTED_MODULE_2__.readFileSync((0,path__WEBPACK_IMPORTED_MODULE_3__.join)((0,_tools_getThisCodebaseRootDirPath__WEBPACK_IMPORTED_MODULE_8__/* .getThisCodebaseRootDirPath */ .J)(), 'src', themeType, pagesOrDot, componentBasename))
             .toString('utf8');
         if (userProfileFormFieldsValue) {
-            componentCode = componentCode.replace(new RegExp(`from '@keycloakify/svelte/login/components/(${componentBasenames.join('|').replace(/\.ts/g, '')})`, 'g'), `from './$1`);
+            componentCode = componentCode.replace(new RegExp(`from '@keycloakify/svelte/login/components/(${componentBasenames.join('|')})`, 'g'), `from './$1`);
         }
         run_prettier: {
             if (!(await (0,_tools_runPrettier__WEBPACK_IMPORTED_MODULE_9__/* .getIsPrettierAvailable */ .L)())) {

package/keycloakify-svelte/login/Template.svelte

@@ -193,7 +193,7 @@
                   href="#"
                   id="try-another-way"
                   onclick={() => {
-                    document.forms['kc-select-try-another-way-form' as never].submit();
+                    document.forms['kc-select-try-another-way-form' as never].requestSubmit();
                     return false;
                   }}
                 >

package/keycloakify-svelte/login/Template.useInitialize.d.ts

@@ -5,6 +5,9 @@ export type KcContextLike = {
         ssoLoginInOtherTabsUrl: string;
     };
     scripts?: string[];
+    authenticationSession?: {
+        authSessionIdHash: string;
+    };
 };
 export declare function useInitialize(params: {
     kcContext: KcContextLike;

package/keycloakify-svelte/login/Template.useInitialize.js

@@ -35,11 +35,14 @@ export function useInitialize(params) {
                 }))),
             {
                 type: 'module',
-                textContent: `
-                    import { checkCookiesAndSetTimer } from "${url.resourcesPath}/js/authChecker.js";
-
-                    checkCookiesAndSetTimer("${url.ssoLoginInOtherTabsUrl}");
-                `,
+                textContent: [
+                    `import { startSessionPolling, checkAuthSession } from "${url.resourcesPath}/js/authChecker.js";`,
+                    ``,
+                    `startSessionPolling("${kcContext.url.ssoLoginInOtherTabsUrl}");`,
+                    kcContext.authenticationSession === undefined
+                        ? ''
+                        : `checkAuthSession("${kcContext.authenticationSession.authSessionIdHash}");`,
+                ].join('\n'),
             },
         ],
     });

package/keycloakify-svelte/login/components/InputFieldByType.svelte

@@ -5,8 +5,9 @@
   import PasswordWrapper from './PasswordWrapper.svelte';
   import SelectTag from './SelectTag.svelte';
   import TextareaTag from './TextareaTag.svelte';
+  import type { I18n } from '../i18n';
 
-  let { displayableErrors, ...props }: InputFieldByTypeProps = $props();
+  let { displayableErrors, ...props }: InputFieldByTypeProps<I18n> = $props();
   const { attribute, valueOrValues } = props;
   const inputType = attribute.annotations.inputType ?? '';
 </script>

package/keycloakify-svelte/login/components/InputFieldByType.svelte.d.ts

@@ -1,4 +1,5 @@
 import type { InputFieldByTypeProps } from './InputFieldByTypeProps';
-declare const InputFieldByType: import("svelte").Component<InputFieldByTypeProps, {}, "">;
+import type { I18n } from '../i18n';
+declare const InputFieldByType: import("svelte").Component<InputFieldByTypeProps<I18n>, {}, "">;
 type InputFieldByType = ReturnType<typeof InputFieldByType>;
 export default InputFieldByType;

package/keycloakify-svelte/login/components/InputFieldByTypeProps.d.ts

@@ -2,9 +2,8 @@ import type { FormAction, FormFieldError } from '../lib/useUserProfileForm';
 import type { Attribute } from 'keycloakify/login/KcContext';
 import type { KcClsx } from 'keycloakify/login/lib/kcClsx';
 import type { EventDispatcher } from 'svelte';
-import type { I18n } from '../i18n';
 import type { Readable } from 'svelte/store';
-export type InputFieldByTypeProps = {
+export type InputFieldByTypeProps<I18n> = {
     attribute: Attribute;
     valueOrValues: string | string[];
     displayableErrors: FormFieldError[];

package/keycloakify-svelte/login/components/InputTag.svelte

@@ -3,8 +3,9 @@
   import FieldErrors from './FieldErrors.svelte';
   import type { InputFieldByTypeProps } from './InputFieldByTypeProps';
   import { assert } from 'keycloakify/tools/assert';
+  import type { I18n } from '../i18n';
 
-  type InputTagProps = InputFieldByTypeProps & { fieldIndex?: number };
+  type InputTagProps = InputFieldByTypeProps<I18n> & { fieldIndex?: number };
   let {
     attribute,
     fieldIndex,

package/keycloakify-svelte/login/components/InputTag.svelte.d.ts

@@ -1,5 +1,6 @@
 import type { InputFieldByTypeProps } from './InputFieldByTypeProps';
-type InputTagProps = InputFieldByTypeProps & {
+import type { I18n } from '../i18n';
+type InputTagProps = InputFieldByTypeProps<I18n> & {
     fieldIndex?: number;
 };
 declare const InputTag: import("svelte").Component<InputTagProps, {}, "displayableErrors">;

package/keycloakify-svelte/login/components/InputTagSelects.svelte

@@ -2,8 +2,9 @@
   import type { InputFieldByTypeProps } from './InputFieldByTypeProps';
   import { inputLabel } from './inputLabel';
   import { assert } from 'keycloakify/tools/assert';
+  import type { I18n } from '../i18n';
 
-  const { attribute, dispatchFormAction, kcClsx, i18n, valueOrValues, displayableErrors }: InputFieldByTypeProps =
+  const { attribute, dispatchFormAction, kcClsx, i18n, valueOrValues, displayableErrors }: InputFieldByTypeProps<I18n> =
     $props();
 
   const { classDiv, classInput, classLabel, inputType } = (() => {

package/keycloakify-svelte/login/components/InputTagSelects.svelte.d.ts

@@ -1,4 +1,5 @@
 import type { InputFieldByTypeProps } from './InputFieldByTypeProps';
-declare const InputTagSelects: import("svelte").Component<InputFieldByTypeProps, {}, "">;
+import type { I18n } from '../i18n';
+declare const InputTagSelects: import("svelte").Component<InputFieldByTypeProps<I18n>, {}, "">;
 type InputTagSelects = ReturnType<typeof InputTagSelects>;
 export default InputTagSelects;

package/keycloakify-svelte/login/components/SelectTag.svelte

@@ -2,7 +2,9 @@
   import type { InputFieldByTypeProps } from './InputFieldByTypeProps';
   import { inputLabel } from './inputLabel';
   import { assert } from 'keycloakify/tools/assert';
-  const { attribute, dispatchFormAction, kcClsx, displayableErrors, i18n, valueOrValues }: InputFieldByTypeProps =
+  import type { I18n } from '../i18n';
+
+  const { attribute, dispatchFormAction, kcClsx, displayableErrors, i18n, valueOrValues }: InputFieldByTypeProps<I18n> =
     $props();
 
   const isMultiple = attribute.annotations.inputType === 'multiselect';

package/keycloakify-svelte/login/components/SelectTag.svelte.d.ts

@@ -1,4 +1,5 @@
 import type { InputFieldByTypeProps } from './InputFieldByTypeProps';
-declare const SelectTag: import("svelte").Component<InputFieldByTypeProps, {}, "">;
+import type { I18n } from '../i18n';
+declare const SelectTag: import("svelte").Component<InputFieldByTypeProps<I18n>, {}, "">;
 type SelectTag = ReturnType<typeof SelectTag>;
 export default SelectTag;

package/keycloakify-svelte/login/components/TextareaTag.svelte

@@ -1,8 +1,10 @@
 <script lang="ts">
-  import { assert } from 'keycloakify/tools/assert';
   import type { InputFieldByTypeProps } from './InputFieldByTypeProps';
+  import { assert } from 'keycloakify/tools/assert';
+  import type { I18n } from '../i18n';
 
-  const { attribute, dispatchFormAction, kcClsx, displayableErrors, valueOrValues }: InputFieldByTypeProps = $props();
+  const { attribute, dispatchFormAction, kcClsx, displayableErrors, valueOrValues }: InputFieldByTypeProps<I18n> =
+    $props();
 
   assert(typeof valueOrValues === 'string');
 

package/keycloakify-svelte/login/components/TextareaTag.svelte.d.ts

@@ -1,4 +1,5 @@
 import type { InputFieldByTypeProps } from './InputFieldByTypeProps';
-declare const TextareaTag: import("svelte").Component<InputFieldByTypeProps, {}, "">;
+import type { I18n } from '../i18n';
+declare const TextareaTag: import("svelte").Component<InputFieldByTypeProps<I18n>, {}, "">;
 type TextareaTag = ReturnType<typeof TextareaTag>;
 export default TextareaTag;

package/keycloakify-svelte/login/pages/Register.svelte

@@ -110,7 +110,7 @@
             )}
             data-sitekey={recaptchaSiteKey}
             data-callback={() => {
-              (document.getElementById('kc-register-form') as HTMLFormElement).submit();
+              (document.getElementById('kc-register-form') as HTMLFormElement).requestSubmit();
             }}
             data-action={recaptchaAction}
             type="submit"

package/keycloakify-svelte/login/pages/SamlPostForm.svelte

@@ -28,7 +28,7 @@
       return;
     }
 
-    htmlFormElement.submit();
+    htmlFormElement.requestSubmit();
   });
 </script>
 

package/keycloakify-svelte/login/pages/WebauthnError.svelte

@@ -57,7 +57,7 @@
       // @ts-expect-error: Trusted Keycloak's code
       document.getElementById('executionValue').value = '${execution}';
       // @ts-expect-error: Trusted Keycloak's code
-      document.getElementById('kc-error-credential-form').submit();
+      document.getElementById('kc-error-credential-form').requestSubmit();
     }}
     type="button"
     class={kcClsx('kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonBlockClass', 'kcButtonLargeClass')}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@keycloakify/svelte",
-  "version": "0.1.11",
+  "version": "0.2.0",
   "description": "Svelte Components for Keycloakify",
   "keywords": [
     "keycloak",
@@ -432,7 +432,7 @@
     "release": "sh scripts/release.sh"
   },
   "peerDependencies": {
-    "keycloakify": "^11.7.0",
+    "keycloakify": "^11.9.0",
     "svelte": "^5.0.0"
   },
   "devDependencies": {
@@ -452,7 +452,7 @@
     "eslint-plugin-svelte": "^3.10.1",
     "eslint-plugin-unused-imports": "^4.1.4",
     "globals": "^16.3.0",
-    "keycloakify": "^11.8.50",
+    "keycloakify": "^11.9.0",
     "npm-check-updates": "^18.0.1",
     "prettier": "^3.6.2",
     "prettier-plugin-svelte": "^3.4.0",

package/src/bin/eject-page.ts

@@ -114,8 +114,6 @@ export async function command(params: { buildContext: BuildContext }) {
         'GroupLabel.svelte',
         'InputTagSelects.svelte',
         'TextareaTag.svelte',
-        'InputFieldByTypeProps.ts',
-        'UserProfileFormFieldsProps.ts',
       ];
     }
 
@@ -148,10 +146,7 @@ export async function command(params: { buildContext: BuildContext }) {
       .toString('utf8');
     if (userProfileFormFieldsValue) {
       componentCode = componentCode.replace(
-        new RegExp(
-          `from '@keycloakify/svelte/login/components/(${componentBasenames.join('|').replace(/\.ts/g, '')})`,
-          'g',
-        ),
+        new RegExp(`from '@keycloakify/svelte/login/components/(${componentBasenames.join('|')})`, 'g'),
         `from './$1`,
       );
     }

package/src/login/Template.svelte

@@ -193,7 +193,7 @@
                   href="#"
                   id="try-another-way"
                   onclick={() => {
-                    document.forms['kc-select-try-another-way-form' as never].submit();
+                    document.forms['kc-select-try-another-way-form' as never].requestSubmit();
                     return false;
                   }}
                 >

package/src/login/Template.useInitialize.ts

@@ -11,6 +11,9 @@ export type KcContextLike = {
     ssoLoginInOtherTabsUrl: string;
   };
   scripts?: string[];
+  authenticationSession?: {
+    authSessionIdHash: string;
+  };
 };
 
 assert<keyof KcContextLike extends keyof KcContext ? true : false>();
@@ -50,11 +53,14 @@ export function useInitialize(params: { kcContext: KcContextLike; doUseDefaultCs
           }))),
       {
         type: 'module',
-        textContent: `
-                    import { checkCookiesAndSetTimer } from "${url.resourcesPath}/js/authChecker.js";
-
-                    checkCookiesAndSetTimer("${url.ssoLoginInOtherTabsUrl}");
-                `,
+        textContent: [
+          `import { startSessionPolling, checkAuthSession } from "${url.resourcesPath}/js/authChecker.js";`,
+          ``,
+          `startSessionPolling("${kcContext.url.ssoLoginInOtherTabsUrl}");`,
+          kcContext.authenticationSession === undefined
+            ? ''
+            : `checkAuthSession("${kcContext.authenticationSession.authSessionIdHash}");`,
+        ].join('\n'),
       },
     ],
   });

package/src/login/components/InputFieldByType.svelte

@@ -5,8 +5,9 @@
   import PasswordWrapper from '@keycloakify/svelte/login/components/PasswordWrapper.svelte';
   import SelectTag from '@keycloakify/svelte/login/components/SelectTag.svelte';
   import TextareaTag from '@keycloakify/svelte/login/components/TextareaTag.svelte';
+  import type { I18n } from '../i18n';
 
-  let { displayableErrors, ...props }: InputFieldByTypeProps = $props();
+  let { displayableErrors, ...props }: InputFieldByTypeProps<I18n> = $props();
   const { attribute, valueOrValues } = props;
   const inputType = attribute.annotations.inputType ?? '';
 </script>

package/src/login/components/InputFieldByTypeProps.ts

@@ -2,10 +2,9 @@ import type { FormAction, FormFieldError } from '@keycloakify/svelte/login/lib/u
 import type { Attribute } from 'keycloakify/login/KcContext';
 import type { KcClsx } from 'keycloakify/login/lib/kcClsx';
 import type { EventDispatcher } from 'svelte';
-import type { I18n } from '../i18n';
 import type { Readable } from 'svelte/store';
 
-export type InputFieldByTypeProps = {
+export type InputFieldByTypeProps<I18n> = {
   attribute: Attribute;
   valueOrValues: string | string[];
   displayableErrors: FormFieldError[];

package/src/login/components/InputTag.svelte

@@ -3,8 +3,9 @@
   import FieldErrors from '@keycloakify/svelte/login/components/FieldErrors.svelte';
   import type { InputFieldByTypeProps } from '@keycloakify/svelte/login/components/InputFieldByTypeProps';
   import { assert } from 'keycloakify/tools/assert';
+  import type { I18n } from '../i18n';
 
-  type InputTagProps = InputFieldByTypeProps & { fieldIndex?: number };
+  type InputTagProps = InputFieldByTypeProps<I18n> & { fieldIndex?: number };
   let {
     attribute,
     fieldIndex,

package/src/login/components/InputTagSelects.svelte

@@ -2,8 +2,9 @@
   import type { InputFieldByTypeProps } from '@keycloakify/svelte/login/components/InputFieldByTypeProps';
   import { inputLabel } from '@keycloakify/svelte/login/components/inputLabel';
   import { assert } from 'keycloakify/tools/assert';
+  import type { I18n } from '../i18n';
 
-  const { attribute, dispatchFormAction, kcClsx, i18n, valueOrValues, displayableErrors }: InputFieldByTypeProps =
+  const { attribute, dispatchFormAction, kcClsx, i18n, valueOrValues, displayableErrors }: InputFieldByTypeProps<I18n> =
     $props();
 
   const { classDiv, classInput, classLabel, inputType } = (() => {

package/src/login/components/SelectTag.svelte

@@ -2,7 +2,9 @@
   import type { InputFieldByTypeProps } from '@keycloakify/svelte/login/components/InputFieldByTypeProps';
   import { inputLabel } from '@keycloakify/svelte/login/components/inputLabel';
   import { assert } from 'keycloakify/tools/assert';
-  const { attribute, dispatchFormAction, kcClsx, displayableErrors, i18n, valueOrValues }: InputFieldByTypeProps =
+  import type { I18n } from '../i18n';
+
+  const { attribute, dispatchFormAction, kcClsx, displayableErrors, i18n, valueOrValues }: InputFieldByTypeProps<I18n> =
     $props();
 
   const isMultiple = attribute.annotations.inputType === 'multiselect';

package/src/login/components/TextareaTag.svelte

@@ -1,8 +1,10 @@
 <script lang="ts">
-  import { assert } from 'keycloakify/tools/assert';
   import type { InputFieldByTypeProps } from '@keycloakify/svelte/login/components/InputFieldByTypeProps';
+  import { assert } from 'keycloakify/tools/assert';
+  import type { I18n } from '../i18n';
 
-  const { attribute, dispatchFormAction, kcClsx, displayableErrors, valueOrValues }: InputFieldByTypeProps = $props();
+  const { attribute, dispatchFormAction, kcClsx, displayableErrors, valueOrValues }: InputFieldByTypeProps<I18n> =
+    $props();
 
   assert(typeof valueOrValues === 'string');
 

package/src/login/pages/Register.svelte

@@ -110,7 +110,7 @@
             )}
             data-sitekey={recaptchaSiteKey}
             data-callback={() => {
-              (document.getElementById('kc-register-form') as HTMLFormElement).submit();
+              (document.getElementById('kc-register-form') as HTMLFormElement).requestSubmit();
             }}
             data-action={recaptchaAction}
             type="submit"

package/src/login/pages/SamlPostForm.svelte

@@ -28,7 +28,7 @@
       return;
     }
 
-    htmlFormElement.submit();
+    htmlFormElement.requestSubmit();
   });
 </script>
 

package/src/login/pages/WebauthnError.svelte

@@ -57,7 +57,7 @@
       // @ts-expect-error: Trusted Keycloak's code
       document.getElementById('executionValue').value = '${execution}';
       // @ts-expect-error: Trusted Keycloak's code
-      document.getElementById('kc-error-credential-form').submit();
+      document.getElementById('kc-error-credential-form').requestSubmit();
     }}
     type="button"
     class={kcClsx('kcButtonClass', 'kcButtonPrimaryClass', 'kcButtonBlockClass', 'kcButtonLargeClass')}