@atlasauth/svelte 0.11.0 → 0.12.0

package/CHANGELOG.md

@@ -1,5 +1,9 @@
 # @atlasauth/svelte changelog
 
+## 0.12.0 — 2026-10-28
+
+- `ManageCiba` component lists sign-in approvals (approve or deny) and manages the CIBA PIN; mounted in the user profile.
+
 ## 0.11.0 — 2026-10-24
 
 - Integrator platform release: see the Atlas changelog for 2026-10-24.

package/dist/components/ManageCiba.svelte

@@ -0,0 +1,78 @@
+<script>import { onMount } from "svelte";
+import {
+  clearCibaPin,
+  decideCibaRequest,
+  getCibaPin,
+  listCibaRequests,
+  setCibaPin
+} from "@atlasauth/js";
+import { useAtlas } from "../context";
+import { classFor } from "../appearance";
+import { FapiClient } from "../fapi";
+import { ATLAS_SVELTE_SDK } from "../version";
+const atlas = useAtlas();
+const client = new FapiClient({
+  publishableKey: atlas.publishableKey,
+  baseUrl: atlas.frontendApi,
+  locale: atlas.locale,
+  sdk: ATLAS_SVELTE_SDK
+});
+let requests = [];
+let pin = null;
+let newPin = "";
+let password = "";
+let message = null;
+async function load() {
+  const [r, p] = await Promise.all([listCibaRequests(client).catch(() => []), getCibaPin(client).catch(() => null)]);
+  requests = r;
+  pin = p;
+}
+onMount(load);
+async function run(fn, fallback) {
+  message = null;
+  try {
+    await fn();
+    newPin = "";
+    password = "";
+    await load();
+  } catch (e) {
+    message = e instanceof Error && e.message ? e.message : fallback;
+  }
+}
+$: cardClass = classFor("card", atlas.appearance, "atlas-card");
+$: buttonClass = classFor("formButtonSecondary", atlas.appearance, "atlas-button-secondary");
+</script>
+
+{#if requests.length || (pin && (pin.set || pin.available))}
+  <section class={cardClass} data-atlas="manage-ciba">
+    {#if requests.length}
+      <h2>Sign-in requests from apps</h2>
+      <ul>
+        {#each requests as r (r.id)}
+          <li>
+            <strong>{r.client_name}</strong>
+            {#if r.binding_message}<div>{r.binding_message}</div>{/if}
+            <small>{r.scope.join(', ')}</small>
+            <button class={buttonClass} type="button" on:click={() => void run(() => decideCibaRequest(client, r.id, 'approve'), 'Could not approve.')}>Approve</button>
+            <button class={buttonClass} type="button" on:click={() => void run(() => decideCibaRequest(client, r.id, 'deny'), 'Could not deny.')}>Deny</button>
+          </li>
+        {/each}
+      </ul>
+    {/if}
+    {#if pin && (pin.set || pin.available)}
+      <form on:submit|preventDefault={() => void run(() => setCibaPin(client, { pin: newPin, currentPassword: password }), 'Could not save the PIN.')}>
+        <h2>CIBA PIN</h2>
+        <p>{pin.set ? 'You have a CIBA PIN.' : 'You have not set a CIBA PIN.'} Apps that start a sign-in request for you must send it.</p>
+        <input type="password" autocomplete="current-password" placeholder="Current password" aria-label="Current password" bind:value={password} />
+        <input type="password" inputmode="numeric" autocomplete="off" placeholder="6 to 12 digits" aria-label="New CIBA PIN" bind:value={newPin} />
+        <button class={buttonClass} type="submit">{pin.set ? 'Change PIN' : 'Set PIN'}</button>
+        {#if pin.set}
+          <button class={buttonClass} type="button" on:click={() => void run(() => clearCibaPin(client, { currentPassword: password }), 'Could not remove the PIN.')}>Remove PIN</button>
+        {/if}
+        {#if message}<small role="status">{message}</small>{/if}
+      </form>
+    {:else if message}
+      <small role="status">{message}</small>
+    {/if}
+  </section>
+{/if}

package/dist/components/ManageCiba.svelte.d.ts

@@ -0,0 +1,16 @@
+import { SvelteComponent } from "svelte";
+declare const __propDef: {
+    props: Record<string, never>;
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+    exports?: {} | undefined;
+    bindings?: string | undefined;
+};
+export type ManageCibaProps = typeof __propDef.props;
+export type ManageCibaEvents = typeof __propDef.events;
+export type ManageCibaSlots = typeof __propDef.slots;
+export default class ManageCiba extends SvelteComponent<ManageCibaProps, ManageCibaEvents, ManageCibaSlots> {
+}
+export {};

package/dist/components/UserProfile.svelte

@@ -4,6 +4,7 @@ import { classFor } from "../appearance";
 import { translate } from "../i18n";
 import { FapiClient } from "../fapi";
 import { ATLAS_SVELTE_SDK } from "../version";
+import ManageCiba from "./ManageCiba.svelte";
 const atlas = useAtlas();
 const user = getUser();
 const t = (key) => translate(atlas.catalog, key);
@@ -91,5 +92,7 @@ $: buttonClass = classFor("formButtonSecondary", atlas.appearance, "atlas-button
       <h2>{t('userProfile.securitySection')}</h2>
       <p>{current.mfa_enabled ? '2FA on' : '2FA off'}</p>
     </section>
+
+    <ManageCiba />
   </div>
 {/if}

package/dist/index.d.ts

@@ -27,6 +27,7 @@ export { default as SignIn } from './components/SignIn.svelte';
 export { default as SignUp } from './components/SignUp.svelte';
 export { default as UserButton } from './components/UserButton.svelte';
 export { default as UserProfile } from './components/UserProfile.svelte';
+export { default as ManageCiba } from './components/ManageCiba.svelte';
 export { default as OrganizationSwitcher } from './components/OrganizationSwitcher.svelte';
 export { default as OrganizationProfile } from './components/OrganizationProfile.svelte';
 export { default as OrganizationAuditLog } from './components/OrganizationAuditLog.svelte';

package/dist/index.js

@@ -31,6 +31,7 @@ export { default as SignIn } from './components/SignIn.svelte';
 export { default as SignUp } from './components/SignUp.svelte';
 export { default as UserButton } from './components/UserButton.svelte';
 export { default as UserProfile } from './components/UserProfile.svelte';
+export { default as ManageCiba } from './components/ManageCiba.svelte';
 export { default as OrganizationSwitcher } from './components/OrganizationSwitcher.svelte';
 export { default as OrganizationProfile } from './components/OrganizationProfile.svelte';
 export { default as OrganizationAuditLog } from './components/OrganizationAuditLog.svelte';

package/dist/version.d.ts

@@ -1,4 +1,4 @@
 import type { AtlasSdkInfo } from '@atlasauth/js';
 /** This package's version, sent as `X-Atlas-SDK` (kept in step with package.json by a test). */
-export declare const ATLAS_SVELTE_VERSION = "0.10.0";
+export declare const ATLAS_SVELTE_VERSION = "0.11.0";
 export declare const ATLAS_SVELTE_SDK: AtlasSdkInfo;

package/dist/version.js

@@ -1,3 +1,3 @@
 /** This package's version, sent as `X-Atlas-SDK` (kept in step with package.json by a test). */
-export const ATLAS_SVELTE_VERSION = '0.10.0';
+export const ATLAS_SVELTE_VERSION = '0.11.0';
 export const ATLAS_SVELTE_SDK = { name: '@atlasauth/svelte', version: ATLAS_SVELTE_VERSION };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlasauth/svelte",
-  "version": "0.11.0",
+  "version": "0.12.0",
   "type": "module",
   "svelte": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -23,9 +23,9 @@
   },
   "dependencies": {
     "@atlasauth/design": "0.3.0",
-    "@atlasauth/backend": "0.19.0",
-    "@atlasauth/js": "0.20.0",
-    "@atlasauth/authz": "0.2.0"
+    "@atlasauth/js": "0.26.1",
+    "@atlasauth/authz": "0.3.0",
+    "@atlasauth/backend": "0.27.0"
   },
   "peerDependencies": {
     "svelte": ">=4",