@lightningtv/solid 3.0.1 → 3.0.3

package/src/core/elementNode.ts

@@ -49,11 +49,7 @@ import type {
 } from '@lightningjs/renderer';
 import { assertTruthy } from '@lightningjs/renderer/utils';
 import { NodeType } from './nodeTypes.js';
-import {
-  ForwardFocusHandler,
-  setActiveElement,
-  FocusNode,
-} from './focusManager.js';
+import { ForwardFocusHandler, setActiveElement, FocusNode } from './focusManager.js';
 import simpleAnimation, { SimpleAnimationSettings } from './animation.js';
 
 let layoutRunQueued = false;
@@ -77,11 +73,7 @@ function runLayout() {
   }
 }
 
-const parseAndAssignShaderProps = (
-  prefix: string,
-  obj: Record<string, any>,
-  props: Record<string, any> = {},
-) => {
+const parseAndAssignShaderProps = (prefix: string, obj: Record<string, any>, props: Record<string, any> = {}) => {
   if (!obj) return;
   props[prefix] = obj;
   Object.entries(obj).forEach(([key, value]) => {
@@ -144,7 +136,6 @@ const LightningRendererNonAnimatingProps = [
   'contain',
   'data',
   'destroyed',
-  'fontFamily',
   'fontStretch',
   'fontStyle',
   'imageType',
@@ -181,12 +172,7 @@ declare global {
 }
 
 export type RendererNode = AddColorString<
-  Partial<
-    NewOmit<
-      INode,
-      'parent' | 'shader' | 'src' | 'children' | 'id' | 'removeChild'
-    >
-  >
+  Partial<NewOmit<INode, 'parent' | 'shader' | 'src' | 'children' | 'id' | 'removeChild'>>
 >;
 export interface ElementNode extends RendererNode, FocusNode {
   [key: string]: unknown;
@@ -208,6 +194,7 @@ export interface ElementNode extends RendererNode, FocusNode {
   _containsFlexGrow?: boolean | null;
   _hasRenderedChildren?: boolean;
   _effects?: StyleEffects;
+  _fontFamily?: string;
   _id: string | undefined;
   _parent: ElementNode | undefined;
   _rendererProps?: any;
@@ -270,10 +257,7 @@ export interface ElementNode extends RendererNode, FocusNode {
   /**
    * The underlying Lightning Renderer node object. This is where the properties are ultimately set for rendering.
    */
-  lng:
-    | Partial<ElementNode>
-    | IRendererNode
-    | (IRendererTextNode & { shader?: any });
+  lng: Partial<ElementNode> | IRendererNode | (IRendererTextNode & { shader?: any });
   /**
    * A reference to the `ElementNode` instance. Can be an object or a callback function.
    */
@@ -429,13 +413,7 @@ export interface ElementNode extends RendererNode, FocusNode {
    *
    * @see @see https://lightning-tv.github.io/solid/#/flow/layout?id=flex
    */
-  justifyContent?:
-    | 'flexStart'
-    | 'flexEnd'
-    | 'center'
-    | 'spaceBetween'
-    | 'spaceAround'
-    | 'spaceEvenly';
+  justifyContent?: 'flexStart' | 'flexEnd' | 'center' | 'spaceBetween' | 'spaceAround' | 'spaceEvenly';
   /**
    * Applies a linear gradient effect to the element.
    *
@@ -519,10 +497,7 @@ export interface ElementNode extends RendererNode, FocusNode {
    *
    * @see https://lightning-tv.github.io/solid/#/essentials/transitions?id=transitions-animations
    */
-  transition?:
-    | Record<string, AnimationSettings | undefined | true | false>
-    | true
-    | false;
+  transition?: Record<string, AnimationSettings | undefined | true | false> | true | false;
   /**
    * Optional handlers for animation events.
    *
@@ -670,23 +645,29 @@ export class ElementNode extends Object {
   }
 
   set fontWeight(v) {
+    if (this._fontWeight === v) {
+      return;
+    }
+
     this._fontWeight = v;
-    const family = this.fontFamily || Config.fontSettings?.fontFamily;
-    const weight =
-      (Config.fontWeightAlias &&
-        (Config.fontWeightAlias[v as string] as number | string)) ??
-      v;
-    this.fontFamily = `${family}${weight}`;
+    const weight = (Config.fontWeightAlias && (Config.fontWeightAlias[v as string] as number | string)) ?? v;
+    (this.lng as any).fontFamily = `${this.fontFamily}${weight}`;
   }
 
   get fontWeight() {
     return this._fontWeight;
   }
 
-  insertChild(
-    node: ElementNode | ElementText | TextNode,
-    beforeNode?: ElementNode | ElementText | TextNode | null,
-  ) {
+  set fontFamily(v) {
+    this._fontFamily = v;
+    (this.lng as any).fontFamily = v;
+  }
+
+  get fontFamily() {
+    return this._fontFamily || Config.fontSettings?.fontFamily;
+  }
+
+  insertChild(node: ElementNode | ElementText | TextNode, beforeNode?: ElementNode | ElementText | TextNode | null) {
     // always remove nodes if they have a parent - for back swap of node
     // this will then put the node at the end of the array when re-added
     if (node.parent) {
@@ -735,12 +716,8 @@ export class ElementNode extends Object {
     return undefined;
   }
 
-  set shader(
-    shaderProps: IRendererShader | [kind: string, props: IRendererShaderProps],
-  ) {
-    this.lng.shader = isArray(shaderProps)
-      ? renderer.createShader(...shaderProps)
-      : shaderProps;
+  set shader(shaderProps: IRendererShader | [kind: string, props: IRendererShaderProps]) {
+    this.lng.shader = isArray(shaderProps) ? renderer.createShader(...shaderProps) : shaderProps;
   }
 
   _sendToLightningAnimatable(name: string, value: number) {
@@ -748,9 +725,7 @@ export class ElementNode extends Object {
       this.transition &&
       this.rendered &&
       Config.animationsEnabled &&
-      (this.transition === true ||
-        this.transition[name] ||
-        this.transition[getPropertyAlias(name)])
+      (this.transition === true || this.transition[name] || this.transition[getPropertyAlias(name)])
     ) {
       const animationSettings =
         this.transition === true || this.transition[name] === true
@@ -762,29 +737,20 @@ export class ElementNode extends Object {
           this,
           name,
           value,
-          animationSettings ||
-            (this.animationSettings as SimpleAnimationSettings),
+          animationSettings || (this.animationSettings as SimpleAnimationSettings),
         );
         simpleAnimation.register(renderer.stage);
         return;
       } else {
-        const animationController = this.animate(
-          { [name]: value },
-          animationSettings,
-        );
+        const animationController = this.animate({ [name]: value }, animationSettings);
 
         if (this.onAnimation) {
-          const animationEvents = Object.keys(
-            this.onAnimation,
-          ) as AnimationEvents[];
+          const animationEvents = Object.keys(this.onAnimation) as AnimationEvents[];
           for (const event of animationEvents) {
             const handler = this.onAnimation[event];
-            animationController.on(
-              event,
-              (controller: IAnimationController, props?: any) => {
-                handler!.call(this, controller, name, value, props);
-              },
-            );
+            animationController.on(event, (controller: IAnimationController, props?: any) => {
+              handler!.call(this, controller, name, value, props);
+            });
           }
         }
 
@@ -799,18 +765,11 @@ export class ElementNode extends Object {
     props: Partial<INodeAnimateProps<CoreShaderNode>>,
     animationSettings?: AnimationSettings,
   ): IAnimationController {
-    isDev &&
-      assertTruthy(this.rendered, 'Node must be rendered before animating');
-    return (this.lng as IRendererNode).animate(
-      props,
-      animationSettings || this.animationSettings || {},
-    );
+    isDev && assertTruthy(this.rendered, 'Node must be rendered before animating');
+    return (this.lng as IRendererNode).animate(props, animationSettings || this.animationSettings || {});
   }
 
-  chain(
-    props: Partial<INodeAnimateProps<CoreShaderNode>>,
-    animationSettings?: AnimationSettings,
-  ) {
+  chain(props: Partial<INodeAnimateProps<CoreShaderNode>>, animationSettings?: AnimationSettings) {
     if (this._animationRunning) {
       this._animationQueue = [];
       this._animationRunning = false;
@@ -819,8 +778,7 @@ export class ElementNode extends Object {
     if (animationSettings) {
       this._animationQueueSettings = animationSettings;
     } else if (!this._animationQueueSettings) {
-      this._animationQueueSettings =
-        animationSettings || this.animationSettings;
+      this._animationQueueSettings = animationSettings || this.animationSettings;
     }
     animationSettings = animationSettings || this._animationQueueSettings;
     this._animationQueue = this._animationQueue || [];
@@ -832,9 +790,7 @@ export class ElementNode extends Object {
     let animation = this._animationQueue!.shift();
     while (animation) {
       this._animationRunning = true;
-      await this.animate(animation.props, animation.animationSettings)
-        .start()
-        .waitUntilStopped();
+      await this.animate(animation.props, animation.animationSettings).start().waitUntilStopped();
       animation = this._animationQueue!.shift();
     }
     this._animationRunning = false;
@@ -866,8 +822,7 @@ export class ElementNode extends Object {
             return;
           }
         } else {
-          const focusedIndex =
-            typeof this.forwardFocus === 'number' ? this.forwardFocus : null;
+          const focusedIndex = typeof this.forwardFocus === 'number' ? this.forwardFocus : null;
           const nodes = this.children;
           if (focusedIndex !== null && focusedIndex < nodes.length) {
             const child = nodes[focusedIndex];
@@ -991,9 +946,7 @@ export class ElementNode extends Object {
   }
 
   set states(states: NodeStates) {
-    this._states = this._states
-      ? this._states.merge(states)
-      : new States(this._stateChanged.bind(this), states);
+    this._states = this._states ? this._states.merge(states) : new States(this._stateChanged.bind(this), states);
     if (this.rendered) {
       this._stateChanged();
     }
@@ -1061,8 +1014,7 @@ export class ElementNode extends Object {
 
       const flexChanged = this.display === 'flex' && calculateFlex(this);
       layoutQueue.delete(this);
-      const onLayoutChanged =
-        isFunc(this.onLayout) && this.onLayout.call(this, this);
+      const onLayoutChanged = isFunc(this.onLayout) && this.onLayout.call(this, this);
 
       if ((flexChanged || onLayoutChanged) && this.parent) {
         addToLayoutQueue(this.parent);
@@ -1119,9 +1071,7 @@ export class ElementNode extends Object {
       let newStyles: Styles;
       if (numStates === 1) {
         newStyles = this[states[0] as keyof Styles] as Styles;
-        newStyles = stylesToUndo
-          ? { ...stylesToUndo, ...newStyles }
-          : newStyles;
+        newStyles = stylesToUndo ? { ...stylesToUndo, ...newStyles } : newStyles;
       } else {
         newStyles = states.reduce((acc, state) => {
           const styles = this[state];
@@ -1236,17 +1186,13 @@ export class ElementNode extends Object {
         }
 
         if (!textProps.maxWidth) {
-          textProps.maxWidth =
-            parentWidth - textProps.x! - (textProps.marginRight || 0);
+          textProps.maxWidth = parentWidth - textProps.x! - (textProps.marginRight || 0);
         }
 
         if (textProps.contain === 'both' && !textProps.maxHeight) {
-          textProps.maxHeight =
-            parentHeight - textProps.y! - (textProps.marginBottom || 0);
+          textProps.maxHeight = parentHeight - textProps.y! - (textProps.marginBottom || 0);
         } else if (textProps.maxLines === 1) {
-          textProps.maxHeight = (textProps.maxHeight ||
-            textProps.lineHeight ||
-            textProps.fontSize) as number;
+          textProps.maxHeight = (textProps.maxHeight || textProps.lineHeight || textProps.fontSize) as number;
         }
 
         textProps.w = textProps.h = undefined;
@@ -1258,9 +1204,7 @@ export class ElementNode extends Object {
       }
 
       isDev && log('Rendering: ', this, props);
-      node.lng = renderer.createTextNode(
-        props as unknown as IRendererTextNodeProps,
-      );
+      node.lng = renderer.createTextNode(props as unknown as IRendererTextNodeProps);
       if (parent.requiresLayout()) {
         if (!textProps.maxWidth || !textProps.maxHeight) {
           node._layoutOnLoad();
@@ -1390,9 +1334,7 @@ function createRawShaderAccessor<T>(key: keyof StyleEffects) {
   };
 }
 
-function shaderAccessor<T extends Record<string, any> | number>(
-  key: 'border' | 'shadow' | 'rounded',
-) {
+function shaderAccessor<T extends Record<string, any> | number>(key: 'border' | 'shadow' | 'rounded') {
   return {
     set(this: ElementNode, value: T) {
       let target = this.lng.shader || {};
@@ -1401,17 +1343,12 @@ function shaderAccessor<T extends Record<string, any> | number>(
       if (this.lng.shader?.program) {
         target = this.lng.shader.props;
         const transitionKey = key === 'rounded' ? 'borderRadius' : key;
-        if (
-          this.transition &&
-          (this.transition === true || this.transition[transitionKey])
-        ) {
+        if (this.transition && (this.transition === true || this.transition[transitionKey])) {
           target = {};
           animationSettings =
             this.transition === true || this.transition[transitionKey] === true
               ? undefined
-              : (this.transition[transitionKey] as
-                  | undefined
-                  | AnimationSettings);
+              : (this.transition[transitionKey] as undefined | AnimationSettings);
         }
       }
 
@@ -1451,8 +1388,6 @@ Object.defineProperties(ElementNode.prototype, {
   rounded: shaderAccessor<BorderRadius>('rounded'),
   // Alias for rounded
   borderRadius: shaderAccessor<BorderRadius>('rounded'),
-  linearGradient:
-    createRawShaderAccessor<LinearGradientProps>('linearGradient'),
-  radialGradient:
-    createRawShaderAccessor<RadialGradientProps>('radialGradient'),
+  linearGradient: createRawShaderAccessor<LinearGradientProps>('linearGradient'),
+  radialGradient: createRawShaderAccessor<RadialGradientProps>('radialGradient'),
 });

package/src/core/intrinsicTypes.ts

@@ -9,12 +9,7 @@ import {
   ShaderRoundedProps,
   ShaderShadowProps,
 } from './shaders.js';
-import {
-  EventHandlers,
-  DefaultKeyMap,
-  KeyHoldMap,
-  FocusNode,
-} from './focusKeyTypes.js';
+import { EventHandlers, DefaultKeyMap, KeyHoldMap, FocusNode } from './focusKeyTypes.js';
 import type { JSXElement } from 'solid-js';
 
 export type AnimationSettings = Partial<lngr.AnimationSettings>;
@@ -52,9 +47,7 @@ export type RemoveUnderscoreProps<T> = {
   [K in keyof T as K extends `_${string}` ? never : K]: T[K];
 };
 
-type RendererText = AddColorString<
-  Partial<Omit<lngr.ITextNodeProps, 'debug' | 'shader' | 'parent'>>
->;
+type RendererText = AddColorString<Partial<Omit<lngr.ITextNodeProps, 'debug' | 'shader' | 'parent'>>>;
 
 type CleanElementNode = NewOmit<
   RemoveUnderscoreProps<ElementNode>,
@@ -80,10 +73,7 @@ type CleanElementNode = NewOmit<
 >;
 /** Node text, children of a ElementNode of type TextNode */
 export interface ElementText
-  extends NewOmit<
-      ElementNode,
-      '_type' | 'parent' | 'children' | 'src' | 'scale'
-    >,
+  extends NewOmit<ElementNode, '_type' | 'parent' | 'children' | 'src' | 'scale' | 'fontFamily'>,
     NewOmit<RendererText, 'x' | 'y' | 'w' | 'h'> {
   _type: 'textNode';
   parent?: ElementNode;
@@ -107,14 +97,7 @@ export interface NodeProps
     Partial<
       NewOmit<
         CleanElementNode,
-        | 'children'
-        | 'text'
-        | 'lng'
-        | 'rendered'
-        | 'renderer'
-        | 'emit'
-        | 'preFlexwidth'
-        | 'preFlexHeight'
+        'children' | 'text' | 'lng' | 'rendered' | 'renderer' | 'emit' | 'preFlexwidth' | 'preFlexHeight'
       >
     > {
   states?: NodeStates;
@@ -189,10 +172,7 @@ type EventPayloadMap = {
 
 type NodeEvents = keyof EventPayloadMap;
 
-type EventHandler<E extends NodeEvents> = (
-  target: ElementNode,
-  event?: EventPayloadMap[E],
-) => void;
+type EventHandler<E extends NodeEvents> = (target: ElementNode, event?: EventPayloadMap[E]) => void;
 
 export type OnEvent = Partial<{
   [K in NodeEvents]: EventHandler<K>;

package/src/index.ts

@@ -1,4 +1,4 @@
-export * from '@lightningtv/solid/jsx-runtime';
+export type * from '@lightningtv/solid/jsx-runtime';
 export * from './core/index.js';
 export type * from './core/index.js';
 export type { KeyHandler, KeyMap } from './core/focusManager.js';
@@ -6,13 +6,4 @@ export * from './activeElement.js';
 export * from './utils.js';
 export * from './render.js';
 export * from './types.js';
-export {
-  For,
-  Show,
-  Suspense,
-  SuspenseList,
-  Switch,
-  Match,
-  Index,
-  ErrorBoundary,
-} from 'solid-js';
+export { For, Show, Suspense, SuspenseList, Switch, Match, Index, ErrorBoundary } from 'solid-js';

package/src/primitives/FadeInOut.tsx

@@ -1,4 +1,4 @@
-import { ElementNode, NodeProps, View  } from '@lightningtv/solid';
+import { ElementNode, NodeProps, View } from '@lightningtv/solid';
 import { Show } from 'solid-js';
 
 interface Props {
@@ -14,6 +14,19 @@ const DEFAULT_PROPS = {
   easing: 'ease-in-out',
 };
 
+export const ALPHA_NONE = { alpha: 0 };
+export const ALPHA_FULL = { alpha: 1 };
+
+export function fadeIn(el: ElementNode): void {
+  if (!el?.lng?.animate) return;
+  el.alpha = 0;
+  el.animate(ALPHA_FULL).start();
+}
+export function fadeOut(el: ElementNode): Promise<void> {
+  if (!el?.lng?.animate) return Promise.resolve();
+  return el.animate(ALPHA_NONE).start().waitUntilStopped();
+}
+
 export default function FadeInOut(props: Props & NodeProps) {
   const config = Object.assign({}, DEFAULT_PROPS, props.transition);
   function onCreate(elm: ElementNode) {
@@ -23,12 +36,12 @@ export default function FadeInOut(props: Props & NodeProps) {
 
   function onDestroy(elm: ElementNode) {
     elm.rtt = true;
-    return elm.animate({ alpha: 0 }, { duration: config.duration, easing: config.easing })
-      .start().waitUntilStopped();
+    return elm.animate({ alpha: 0 }, { duration: config.duration, easing: config.easing }).start().waitUntilStopped();
   }
 
   return (
     <Show when={props.when} keyed>
       <View {...props} onDestroy={onDestroy} onCreate={onCreate} />
-    </Show>);
+    </Show>
+  );
 }

package/src/primitives/Lazy.tsx

@@ -68,7 +68,7 @@ function createLazy<T>(
       if (itemLength != props.each.length) {
         itemLength = props.each.length;
         if (viewRef && !viewRef.noRefocus && lng.hasFocus(viewRef)) {
-          queueMicrotask(viewRef.setFocus);
+          queueMicrotask(() => viewRef.setFocus());
         }
       }
       return props.each.slice(0, offset());

package/src/primitives/Virtual.tsx

@@ -46,7 +46,7 @@ function createVirtual<T>(
     return props.uniformSize !== false;
   });
 
-  type SliceState = { start: number; slice: T[]; selected: number, delta: number, shiftBy: number, atStart: boolean };
+  type SliceState = { start: number; slice: T[]; selected: number, delta: number, shiftBy: number, atStart: boolean; cursor: number };
     const [slice, setSlice] = s.createSignal<SliceState>({
       start: 0,
       slice: [],
@@ -54,6 +54,7 @@ function createVirtual<T>(
       delta: 0,
       shiftBy: 0,
       atStart: true,
+      cursor: 0,
     });
 
     function normalizeDeltaForWindow(delta: number, windowLen: number): number {
@@ -86,7 +87,7 @@ function createVirtual<T>(
 
     function computeSlice(c: number, delta: number, prev: SliceState): SliceState {
       const total = itemCount();
-      if (total === 0) return { start: 0, slice: [], selected: 0, delta, shiftBy: 0, atStart: true };
+      if (total === 0) return { start: 0, slice: [], selected: 0, delta, shiftBy: 0, atStart: true, cursor: 0 };
 
       const length = props.displaySize + bufferSize();
       let start = prev.start;
@@ -186,7 +187,7 @@ function createVirtual<T>(
               atStart = false;
             } else {
               // ScrollToIndex was called
-              if (Math.abs(c - prev.start) > 1) {
+              if (c !== prev.cursor) {
                 start = c;
                 if (c === 0) {
                   atStart = true;
@@ -286,7 +287,7 @@ function createVirtual<T>(
           : items().slice(start, start + length);
       }
 
-      const state: SliceState = { start, slice: newSlice, selected, delta, shiftBy, atStart };
+      const state: SliceState = { start, slice: newSlice, selected, delta, shiftBy, atStart, cursor: c };
 
       if (props.debugInfo) {
         console.log(`[Virtual]`, {
@@ -412,6 +413,15 @@ function createVirtual<T>(
       if (lng.hasFocus(viewRef)) {
         viewRef.children[activeIndex]?.setFocus();
       }
+
+      if (newState.shiftBy === 0) return;
+
+      const childSize = computeSize(slice().selected);
+      // Original Position is offset to support scrollToIndex
+      originalPosition = originalPosition ?? viewRef.lng[axis];
+      targetPosition = targetPosition ?? viewRef.lng[axis];
+
+      viewRef.lng[axis] = (viewRef.lng[axis] || 0) + (childSize * -1);
     });
   };
 

package/src/primitives/borderBox.tsx

@@ -0,0 +1,60 @@
+import { ElementNode, insertNode, type NodeProps, type NodeStyles } from '@lightningtv/solid';
+import { createMemo, getOwner, onMount, runWithOwner, type Accessor } from 'solid-js';
+import { fadeIn, fadeOut } from './FadeInOut.jsx';
+import { chainFunctions } from '@lightningtv/solid/primitives';
+
+export const BorderBoxStyle: NodeStyles = {
+  alpha: 0,
+  borderSpace: 6,
+  borderRadius: 20,
+  border: { color: 0xffffff, width: 2 },
+};
+
+type BorderProps = NodeProps & { borderSpace?: number };
+const borderComponent = (props: BorderProps) => {
+  const space = createMemo(() => props.borderSpace ?? (BorderBoxStyle.borderSpace as number));
+  return (
+    <>
+      <view
+        skipFocus
+        onCreate={(el) => {
+          const parent = el.parent!;
+          el.width = parent.width + space() * 2;
+          el.height = parent.height + space() * 2;
+          fadeIn(el);
+        }}
+        onDestroy={fadeOut}
+        style={BorderBoxStyle}
+        x={-space()}
+        y={-space()}
+        {...props}
+      />
+    </>
+  );
+};
+
+// Solid directives can only be used on native root elements `view` and `text`
+export default function borderbox(el: ElementNode, accessor: Accessor<BorderProps | true | undefined>) {
+  let border: ElementNode | null;
+  const owner = getOwner();
+
+  onMount(() => {
+    el.onFocusChanged = chainFunctions((f) => {
+      if (f) {
+        if (border) return;
+        runWithOwner(owner, () => {
+          const props = accessor();
+          border = borderComponent(
+            props === true || props === undefined ? ({} as NodeProps) : props,
+          ) as any as ElementNode;
+          insertNode(el, border);
+          border.render();
+        });
+      } else if (border) {
+        border.destroy();
+        el.removeChild(border!);
+        border = null;
+      }
+    }, el.onFocusChanged);
+  });
+}

package/src/primitives/index.ts

@@ -1,6 +1,7 @@
 export * from './useFocusManager.js';
 export * from './announcer/index.js';
 export * from './createInfiniteItems.js';
+export * from './borderBox.jsx';
 export * from './useMouse.js';
 export * from './portal.jsx';
 export * from './Lazy.jsx';
@@ -23,11 +24,7 @@ export * from './VirtualGrid.jsx';
 export * from './Virtual.jsx';
 export * from './utils/withScrolling.js';
 export * from './createTag.jsx';
-export {
-  type AnyFunction,
-  chainFunctions,
-  chainRefs,
-} from './utils/chainFunctions.js';
+export { type AnyFunction, chainFunctions, chainRefs } from './utils/chainFunctions.js';
 export * from './utils/handleNavigation.js';
 export { createSpriteMap, type SpriteDef } from './utils/createSpriteMap.js';
 export { createBlurredImage } from './utils/createBlurredImage.js';