@pixerate/editor-svelte 0.214.0 → 0.215.0

package/dist/effects/EffectsBrowser.svelte

@@ -9,6 +9,8 @@
     uses?: readonly EffectUse[];
     /** Only effects of these kinds (default: any). */
     kinds?: readonly EffectKind[];
+    /** Only effects this also keeps (e.g. `paintEffectOffered` for the paint editor's paint, which honours provider paint hints). */
+    filter?: (effect: EffectSummary) => boolean;
     /** Called with the effect the user picks. */
     onpick: (effect: EffectSummary) => void;
     /** Draw previews with the provider's renderer (default true). */
@@ -18,7 +20,7 @@
     class?: string;
   }
 
-  let { provider, uses, kinds, onpick, thumbnails = true, title = 'Effects', class: className = '' }: Props = $props();
+  let { provider, uses, kinds, filter, onpick, thumbnails = true, title = 'Effects', class: className = '' }: Props = $props();
   let all = $state.raw<readonly EffectSummary[]>([]);
   let found = $state.raw<readonly EffectSummary[]>([]);
   let query = $state('');
@@ -68,7 +70,7 @@
       live = false;
     };
   });
-  const allowed = (e: EffectSummary) => (!kinds || kinds.includes(e.kind)) && effectOffered(e, uses);
+  const allowed = (e: EffectSummary) => (!kinds || kinds.includes(e.kind)) && effectOffered(e, uses) && (!filter || filter(e));
   const categories = $derived([...new Set(all.filter(allowed).map((e) => e.category))]);
   const shown = $derived(found.filter(allowed));
 </script>

package/dist/effects/EffectsBrowser.svelte.d.ts

@@ -6,6 +6,8 @@ interface Props {
     uses?: readonly EffectUse[];
     /** Only effects of these kinds (default: any). */
     kinds?: readonly EffectKind[];
+    /** Only effects this also keeps (e.g. `paintEffectOffered` for the paint editor's paint, which honours provider paint hints). */
+    filter?: (effect: EffectSummary) => boolean;
     /** Called with the effect the user picks. */
     onpick: (effect: EffectSummary) => void;
     /** Draw previews with the provider's renderer (default true). */

package/dist/paint-editor/PaintEffectsPanel.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import { untrack } from 'svelte';
-  import { PAPER_EFFECT_BLENDS, type PaintEditorController, type PaperEffectBlend } from '@pixerate/editor/paint-editor';
+  import { paintEffectOffered, PAPER_EFFECT_BLENDS, type PaintEditorController, type PaperEffectBlend } from '@pixerate/editor/paint-editor';
   import { pathControlsOf, type EffectUse } from '@pixerate/editor/effects';
   import EffectsBrowser from '../effects/EffectsBrowser.svelte';
   import { effectDescriptionOf } from '../effects/effects.svelte.js';
@@ -34,7 +34,7 @@
   const repaint = (patch: { values?: Record<string, unknown>; map?: unknown; live?: boolean }) => {
     const fx = view.effectPaint;
     if (!fx) return;
-    run(() => controller.setEffectPaint({ effect: fx.effect, values: fx.values as never, time: fx.time, map: fx.map, live: fx.live, ...(patch as object) }));
+    run(() => controller.setEffectPaint({ effect: fx.effect, values: fx.values as never, time: fx.time, map: fx.map ?? { by: 'canvas' }, live: fx.live ?? false, ...(patch as object) }));
   };
   const thumbnail = $derived.by(() => {
     const { effectPaint, rendering } = view;
@@ -99,7 +99,7 @@
   </div>
   {#if !provider}<p class="text-[11px] text-slate-400">No effects provider is registered. Effects in the painting are kept.</p>{/if}
   {#if browse}
-    <EffectsBrowser {provider} uses={BROWSERS[browse].uses} title={BROWSERS[browse].title} onpick={(e) => pick(e.id)} />
+    <EffectsBrowser {provider} uses={BROWSERS[browse].uses} filter={(e) => paintEffectOffered(e, browse!, provider?.capabilities)} title={BROWSERS[browse].title} onpick={(e) => pick(e.id)} />
   {/if}
   {#if view.paper}
     {@const paper = view.paper}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pixerate/editor-svelte",
-  "version": "0.214.0",
+  "version": "0.215.0",
   "description": "Svelte bindings and prompt/rich-text components for @pixerate/editor",
   "author": "Pixerate",
   "license": "MIT",
@@ -184,7 +184,7 @@
     "**/*.css"
   ],
   "dependencies": {
-    "@pixerate/editor": "0.289.0"
+    "@pixerate/editor": "0.291.0"
   },
   "peerDependencies": {
     "@dagrejs/dagre": "^1.1.4",