@streamscloud/kit 0.69.0 → 0.71.0

package/dist/ui/infinite-scroll/cmp.infinite-scroll.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">import { Button } from '../button';
 import { Spinner } from '../spinner';
 import { InfiniteScrollLocalization } from './infinite-scroll-localization';
-let { loadMore, container = null, rootMargin = '200px', children, loading, retry } = $props();
+let { loadMore, container = null, rootMargin = '200px', children, showLoading = false, loading, retry } = $props();
 const localization = new InfiniteScrollLocalization();
 const source = $derived(typeof loadMore === 'function' ? { loadMore, failed: false, canLoadMore: true } : loadMore);
 let isLoading = $state(false);
@@ -61,7 +61,7 @@ const onRetry = () => {
   {#if isLoading}
     {#if loading}
       {@render loading()}
-    {:else}
+    {:else if showLoading}
       <div class="infinite-scroll__loading-container">
         <Spinner timeout={500} />
       </div>
@@ -79,7 +79,7 @@ const onRetry = () => {
 
 <!--
 @component
-Triggers an async `loadMore` callback when a sentinel element scrolls into view, using IntersectionObserver. Re-observes the sentinel on container resize so layout shifts inside the parent re-evaluate visibility (a known IntersectionObserver gotcha). Internal `isLoading` guard prevents overlapping fires while a load is in flight.
+Triggers an async `loadMore` callback when a sentinel element scrolls into view, using IntersectionObserver. Re-observes the sentinel on container resize so layout shifts inside the parent re-evaluate visibility (a known IntersectionObserver gotcha). Internal `isLoading` guard prevents overlapping fires while a load is in flight. No loading indicator by default — opt in with `showLoading` or a `loading` snippet.
 
 Pairs with `core/data-loaders` (`CursorDataLoader`, `PageDataLoader`, `CursorDataLoaderWithSearch`) — wire `loadMore={loader.loadMore}` and `{#each loader.items as item}` directly.
 

package/dist/ui/infinite-scroll/cmp.infinite-scroll.svelte.d.ts

@@ -16,13 +16,15 @@ type Props = {
     /** IntersectionObserver `rootMargin`. Default `'200px'` — fires the load a viewport-screen before reaching the bottom. */
     rootMargin?: string;
     children: Snippet;
-    /** Custom loading indicator snippet. Defaults to the kit `Spinner`. */
+    /** Shows the kit `Spinner` while a batch loads. Off by default — the list owner usually renders its own loading state. */
+    showLoading?: boolean;
+    /** Custom loading indicator snippet. Passing it turns the indicator on regardless of `showLoading`. */
     loading?: Snippet;
     /** Manual continue shown while `failed`, taking the callback that retries the failed page. Defaults to a kit `Button`. */
     retry?: Snippet<[() => void]>;
 };
 /**
- * Triggers an async `loadMore` callback when a sentinel element scrolls into view, using IntersectionObserver. Re-observes the sentinel on container resize so layout shifts inside the parent re-evaluate visibility (a known IntersectionObserver gotcha). Internal `isLoading` guard prevents overlapping fires while a load is in flight.
+ * Triggers an async `loadMore` callback when a sentinel element scrolls into view, using IntersectionObserver. Re-observes the sentinel on container resize so layout shifts inside the parent re-evaluate visibility (a known IntersectionObserver gotcha). Internal `isLoading` guard prevents overlapping fires while a load is in flight. No loading indicator by default — opt in with `showLoading` or a `loading` snippet.
  *
  * Pairs with `core/data-loaders` (`CursorDataLoader`, `PageDataLoader`, `CursorDataLoaderWithSearch`) — wire `loadMore={loader.loadMore}` and `{#each loader.items as item}` directly.
  *

package/dist/ui/page-layout/cmp.page-layout.svelte

@@ -3,11 +3,11 @@ import { PageLayoutLocalization } from './page-layout-localization';
 import IconDismiss from '@fluentui/svg-icons/icons/dismiss_20_regular.svg?raw';
 import IconWindow from '@fluentui/svg-icons/icons/window_20_regular.svg?raw';
 import IconWindowMultiple from '@fluentui/svg-icons/icons/window_multiple_20_regular.svg?raw';
-const { children, title, actions, navigationToggle, editorControls, scrollable = false } = $props();
+const { children, title, actions, navigationToggle, editorControls, scrollable = false, inert = false } = $props();
 const localization = new PageLayoutLocalization();
 </script>
 
-<div class="page-layout" class:page-layout--scrollable={scrollable}>
+<div class="page-layout" class:page-layout--scrollable={scrollable} inert={inert}>
   <div class="page-layout__header">
     <div class="page-layout__title">
       {#if typeof title === 'function'}

package/dist/ui/page-layout/cmp.page-layout.svelte.d.ts

@@ -9,6 +9,8 @@ type Props = {
     /** Editor chrome — the fixed panels-toggle + close pair. Set it to render both buttons; omit it entirely for a non-editor page. */
     editorControls?: EditorControls;
     scrollable?: boolean;
+    /** Sets `inert` on the whole layout — header and body stop taking focus, clicks and assistive-tech interaction. */
+    inert?: boolean;
 };
 /**
  * PageLayout — top-level window chrome. Renders a fixed-height header (title + actions + an optional

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@streamscloud/kit",
-  "version": "0.69.0",
+  "version": "0.71.0",
   "author": "StreamsCloud",
   "repository": {
     "type": "git",