@dvcol/neo-svelte 1.1.2 → 1.2.0

package/dist/progress/NeoProgress.svelte

@@ -1,15 +1,20 @@
 <script lang="ts">
-  import type { NeoProgressContext, NeoProgressMethods, NeoProgressProps } from './neo-progress.model.js';
+  import type {
+    NeoProgressChange,
+    NeoProgressComplete,
+    NeoProgressContext,
+    NeoProgressMethods,
+    NeoProgressProps,
+    NeoProgressStart,
+    NeoProgressStatuses,
+  } from './neo-progress.model.js';
 
   import { percent } from '@dvcol/common-utils';
   import { clamp } from '@dvcol/common-utils/common/math';
+  import { onDestroy, onMount } from 'svelte';
 
-  import {
-
-    NeoProgressDirection,
-
-    NeoProgressStatus,
-  } from './neo-progress.model.js';
+  import { setProgressContext } from './neo-progress-service.svelte.js';
+  import { NeoProgressDirection, NeoProgressStatus } from './neo-progress.model.js';
   import { getColorVariable } from '../utils/colors.utils.js';
   import { toSize } from '../utils/style.utils.js';
 
@@ -31,6 +36,8 @@
     step = 1,
     tick = 500,
     timeout,
+    autoStart,
+    autoComplete,
 
     // Styles
     low, // threshold for tinting
@@ -41,17 +48,25 @@
     track = true,
     color,
     direction = NeoProgressDirection.Right,
+    immediate = $bindable(false),
 
     // Other Props
     ...rest
   }: NeoProgressProps = $props();
 
   // TODO: circular progress
+  const isIndeterminate = $derived(indeterminate || status === NeoProgressStatus.Indeterminate);
 
   const buffered = $derived((buffer ?? 0) > value ? buffer : value);
 
-  const valueProgress = $derived(value ? `${percent(clamp(value, min, max), 100)}%` : '-0.125rem');
-  const bufferProgress = $derived(buffered ? `${percent(clamp(buffered, min, max), 100)}%` : '-0.125rem');
+  const valueProgress = $derived.by(() => {
+    if (isIndeterminate) return '100%';
+    return value ? `${percent(clamp(value, min, max), 100)}%` : '-0.125rem';
+  });
+  const bufferProgress = $derived.by(() => {
+    if (isIndeterminate) return '100%';
+    return buffered ? `${percent(clamp(buffered, min, max), 100)}%` : '-0.125rem';
+  });
 
   const colorArray = $derived(Array.isArray(color) ? color.map(getColorVariable) : [getColorVariable(color)]);
   const background = $derived.by(() => {
@@ -71,7 +86,23 @@
     }
   });
 
-  const controlled = $derived(status && ([NeoProgressStatus.Active, NeoProgressStatus.Indeterminate] as string[]).includes(status));
+  const controlled = $derived(status === NeoProgressStatus.Active || status === NeoProgressStatus.Indeterminate);
+
+  /** Method to execute on the next animation iteration. */
+  let nextIteration = $state<() => void>();
+  /** Deferred function to be called on the next animation iteration. */
+  async function deferIteration<T extends () => Promise<undefined | NeoProgressStatuses>>(fn: T, defer = true) {
+    if (!defer || nextIteration) return fn();
+    const { promise, resolve } = Promise.withResolvers<undefined | NeoProgressStatuses>();
+    nextIteration = async () => resolve(await fn());
+    return promise;
+  };
+  /** Triggered when the animation iteration ends to gracefully transition the progress bar out of the indeterminate state. */
+  async function onIteration() {
+    if (!nextIteration) return;
+    await nextIteration();
+    nextIteration = undefined;
+  };
 
   let intervalId: ReturnType<typeof setTimeout>;
   let timeoutId: ReturnType<typeof setTimeout>;
@@ -80,49 +111,87 @@
     clearTimeout(timeoutId);
   };
 
-  export const change: NeoProgressMethods['change'] = (newValue?: number, newBuffer = buffer) => {
-    if (newValue === undefined && newBuffer === undefined) return;
+  export function change({ value: newValue, buffer: newBuffer, state }: NeoProgressChange = {}): undefined | NeoProgressStatuses {
+    if (newValue === undefined && newBuffer === undefined) return status;
     clear();
     if (newValue !== undefined) value = newValue;
     if (newBuffer !== undefined) buffer = newBuffer;
-    status = NeoProgressStatus.Idle;
-  };
+    status = state ?? (value >= (min ?? 0) ? NeoProgressStatus.Paused : NeoProgressStatus.Idle);
+    return status;
+  }
 
-  export const stop: NeoProgressMethods['stop'] = () => {
-    clear();
-    status = NeoProgressStatus.Paused;
-  };
+  function deferComplete(opts: NeoProgressComplete) {
+    const _immediate = immediate;
+    immediate = true;
+    change({ value: min, buffer: min });
+    const { promise, resolve } = Promise.withResolvers<undefined | NeoProgressStatuses>();
+    setTimeout(async () => {
+      immediate = _immediate;
+      const status = await complete({ ...opts, defer: false });
+      resolve(status);
+    }, 0);
+    return promise;
+  }
 
-  export const complete: NeoProgressMethods['complete'] = (pending = indeterminate) => {
+  export function complete({ pending = indeterminate, state, defer = true }: NeoProgressComplete = {}): undefined | NeoProgressStatuses | Promise<undefined | NeoProgressStatuses> {
+    if (status === NeoProgressStatus.Indeterminate) return deferIteration(() => deferComplete({ pending, state }), defer);
     clear();
     value = max ?? 100;
     buffer = max ?? 100;
-    status = pending ? NeoProgressStatus.Indeterminate : NeoProgressStatus.Completed;
-  };
+    status = state ?? (pending ? NeoProgressStatus.Indeterminate : NeoProgressStatus.Completed);
+    return status;
+  }
 
-  export const start: NeoProgressMethods['start'] = (pending = indeterminate, expire = timeout) => {
-    status = NeoProgressStatus.Active;
+  function deferCancel() {
+    const _immediate = immediate;
+    immediate = true;
     clear();
-    intervalId = setInterval(() => {
-      if (value < max) value += step;
-      else complete(pending);
-    }, tick);
-    if (expire) timeoutId = setTimeout(() => complete(), expire);
-  };
+    change({ value: min, buffer: min, state: NeoProgressStatus.Cancelled });
+    const { promise, resolve } = Promise.withResolvers<undefined | NeoProgressStatuses>();
+    setTimeout(() => {
+      immediate = _immediate;
+      resolve(status);
+    }, 0);
+    return promise;
+  }
 
-  export const reset: NeoProgressMethods['reset'] = (restart = status === NeoProgressStatus.Active) => {
+  export function cancel(defer = true): undefined | NeoProgressStatuses | Promise<undefined | NeoProgressStatuses> {
+    if (status === NeoProgressStatus.Indeterminate) return deferIteration(deferCancel, defer);
     clear();
-    value = min ?? 0;
-    buffer = min ?? 0;
-    if (restart) start();
-    else status = NeoProgressStatus.Idle;
-  };
+    change({ value: min, buffer: min, state: NeoProgressStatus.Cancelled });
+    return status;
+  }
+
+  function stepUp({ pending = indeterminate } = {}) {
+    if (value < max) value += step;
+    else complete({ pending });
+  }
 
-  export const cancel: NeoProgressMethods['cancel'] = () => {
+  export function start({ pending = indeterminate, expire = timeout, indeterminate: startIndeterminate, ...seed }: NeoProgressStart = {}): undefined | NeoProgressStatuses {
     clear();
-    reset(false);
+    if (startIndeterminate) {
+      change({ value: min, buffer: min, state: NeoProgressStatus.Indeterminate });
+    } else {
+      change(seed);
+      status = NeoProgressStatus.Active;
+      intervalId = setInterval(stepUp, tick, { pending });
+    }
+    if (expire) timeoutId = setTimeout(complete, expire);
+    return status;
+  }
+
+  export function stop(): undefined | NeoProgressStatuses {
+    clear();
+    status = NeoProgressStatus.Paused;
+    return status;
   };
 
+  export function reset(restart = status === NeoProgressStatus.Active, _start?: NeoProgressStart): undefined | NeoProgressStatuses {
+    clear();
+    if (restart) return start({ value: min, buffer: min, ..._start });
+    return change({ value: min, buffer: min });
+  }
+
   const width = $derived(toSize(_width));
   const height = $derived(toSize(_height));
 
@@ -141,6 +210,58 @@
 
     color,
     direction,
+
+    start,
+    stop,
+    reset,
+    cancel,
+    change,
+    complete,
+  });
+
+  setProgressContext({
+    get status() {
+      return status;
+    },
+    get value() {
+      return value;
+    },
+    get buffer() {
+      return buffer;
+    },
+    get min() {
+      return min;
+    },
+    get max() {
+      return max;
+    },
+    get indeterminate() {
+      return indeterminate;
+    },
+
+    get step() {
+      return step;
+    },
+    get tick() {
+      return tick;
+    },
+    get timeout() {
+      return timeout;
+    },
+
+    get color() {
+      return color;
+    },
+    get direction() {
+      return direction;
+    },
+
+    start,
+    stop,
+    reset,
+    cancel,
+    change,
+    complete,
   });
 
   $effect(() => {
@@ -152,7 +273,18 @@
       cancel,
       change,
       complete,
-    });
+    } satisfies NeoProgressMethods);
+  });
+
+  onMount(() => {
+    if (!autoStart) return;
+    stepUp(typeof autoStart === 'boolean' ? {} : autoStart);
+    start(typeof autoStart === 'boolean' ? {} : autoStart);
+  });
+
+  onDestroy(() => {
+    if (!autoComplete) return;
+    complete(typeof autoComplete === 'boolean' ? {} : autoComplete);
   });
 </script>
 
@@ -161,9 +293,10 @@
   role="progressbar"
   bind:this={ref}
   class:neo-progress={true}
-  class:neo-indeterminate={indeterminate || status === NeoProgressStatus.Indeterminate}
+  class:neo-indeterminate={isIndeterminate}
   class:neo-controlled={controlled}
   class:neo-track={track}
+  class:neo-immediate={immediate}
   data-direction={direction}
   data-indeterminate={indeterminate}
   data-status={status}
@@ -182,8 +315,8 @@
   style:--neo-progress-background={background}
   {...rest}
 >
-  <span class="neo-progress-value" style:--neo-progress-value={valueProgress}></span>
-  <span class="neo-progress-buffer" style:--neo-progress-buffer={bufferProgress}></span>
+  <span class="neo-progress-value" style:--neo-progress-value={valueProgress} onanimationiteration={onIteration}></span>
+  <span class="neo-progress-buffer" style:--neo-progress-buffer={bufferProgress} onanimationiteration={onIteration}></span>
   {@render children?.(context)}
 </svelte:element>
 
@@ -215,6 +348,35 @@
 .neo-progress.neo-controlled .neo-progress-value {
   transition: translate 1s linear, background-color 1.5s ease;
 }
+.neo-progress.neo-immediate .neo-progress-buffer,
+.neo-progress.neo-immediate .neo-progress-value {
+  transition: none;
+}
+.neo-progress[data-status=completed] .neo-progress-value,
+.neo-progress[data-status=completed] .neo-progress-buffer, .neo-progress[data-status=error] .neo-progress-value,
+.neo-progress[data-status=error] .neo-progress-buffer, .neo-progress[data-status=success] .neo-progress-value,
+.neo-progress[data-status=success] .neo-progress-buffer, .neo-progress[data-status=warning] .neo-progress-value,
+.neo-progress[data-status=warning] .neo-progress-buffer {
+  transition: translate 0.5s linear, background-color 0.1s ease;
+}
+.neo-progress[data-status=error] .neo-progress-value {
+  background: var(--neo-progress-background, var(--neo-color-error));
+}
+.neo-progress[data-status=error] .neo-progress-buffer {
+  background: var(--neo-progress-buffer-background, color-mix(in srgb, var(--neo-progress-background, var(--neo-color-error)), transparent 85%));
+}
+.neo-progress[data-status=success] .neo-progress-value {
+  background: var(--neo-progress-background, var(--neo-color-success));
+}
+.neo-progress[data-status=success] .neo-progress-buffer {
+  background: var(--neo-progress-buffer-background, color-mix(in srgb, var(--neo-progress-background, var(--neo-color-success)), transparent 85%));
+}
+.neo-progress[data-status=warning] .neo-progress-value {
+  background: var(--neo-progress-background, var(--neo-color-warning));
+}
+.neo-progress[data-status=warning] .neo-progress-buffer {
+  background: var(--neo-progress-buffer-background, color-mix(in srgb, var(--neo-progress-background, var(--neo-color-warning)), transparent 85%));
+}
 .neo-progress[data-direction=right], .neo-progress[data-direction=left] {
   width: 100%;
   height: 0.375rem;
@@ -269,7 +431,6 @@
   animation-duration: var(--neo-progress-indeterminate-duration, 3s);
   animation-timing-function: var(--neo-progress-indeterminate-timing, linear);
   animation-iteration-count: var(--neo-progress-indeterminate-iteration, infinite);
-  translate: 0;
 }
 .neo-progress.neo-indeterminate[data-direction=right] .neo-progress-buffer {
   animation-name: indeterminate-fast-right;

package/dist/progress/NeoProgress.svelte.d.ts

@@ -1,11 +1,11 @@
-import type { NeoProgressMethods, NeoProgressProps } from './neo-progress.model.js';
+import type { NeoProgressChange, NeoProgressComplete, NeoProgressProps, NeoProgressStart, NeoProgressStatuses } from './neo-progress.model.js';
 declare const NeoProgress: import("svelte").Component<NeoProgressProps, {
-    change: NeoProgressMethods["change"];
-    stop: NeoProgressMethods["stop"];
-    complete: NeoProgressMethods["complete"];
-    start: NeoProgressMethods["start"];
-    reset: NeoProgressMethods["reset"];
-    cancel: NeoProgressMethods["cancel"];
-}, "ref" | "value" | "status" | "buffer">;
+    change: ({ value: newValue, buffer: newBuffer, state }?: NeoProgressChange) => undefined | NeoProgressStatuses;
+    complete: ({ pending, state, defer }?: NeoProgressComplete) => undefined | NeoProgressStatuses | Promise<undefined | NeoProgressStatuses>;
+    cancel: (defer?: boolean) => undefined | NeoProgressStatuses | Promise<undefined | NeoProgressStatuses>;
+    start: ({ pending, expire, indeterminate: startIndeterminate, ...seed }?: NeoProgressStart) => undefined | NeoProgressStatuses;
+    stop: () => undefined | NeoProgressStatuses;
+    reset: (restart?: boolean, _start?: NeoProgressStart) => undefined | NeoProgressStatuses;
+}, "value" | "status" | "ref" | "buffer" | "immediate">;
 type NeoProgress = ReturnType<typeof NeoProgress>;
 export default NeoProgress;

package/dist/progress/NeoProgressBar.svelte

@@ -1,17 +1,20 @@
 <script lang="ts">
   import type { NeoProgressBarContext, NeoProgressBarProps } from './neo-progress-bar.model.js';
+  import type { NeoProgressChange, NeoProgressComplete, NeoProgressStart, NeoProgressStatuses } from './neo-progress.model.js';
 
   import { watch } from '@dvcol/svelte-utils/watch';
   import { innerHeight, innerWidth } from 'svelte/reactivity/window';
 
-  import { NeoProgressDirection } from './neo-progress.model.js';
+  import { NeoProgressDirection, NeoProgressStatus } from './neo-progress.model.js';
   import NeoProgress from './NeoProgress.svelte';
+  import { computeBorderRadius } from '../utils/border.utils.js';
   import { coerce, computeGlassFilter, computeShadowElevation, DefaultShallowMinMaxElevation, parseBlur } from '../utils/shadow.utils.js';
   import { toPixel, toSize } from '../utils/style.utils.js';
 
   let {
     // Snippets
     children,
+    progress,
     before,
     after,
     mark,
@@ -35,8 +38,9 @@
     rounded,
     pressed,
     glass,
-    start,
+    start: startOnEnter,
     track = true,
+    immediate = $bindable(false),
 
     // Shadow
     elevation: _elevation = pressed ? -1 : 1,
@@ -105,13 +109,39 @@
     rounded,
     pressed,
     glass,
-    start,
+    start: startOnEnter,
     track,
 
     // Shadow
     elevation,
     blur,
   });
+
+  let instance = $state<NeoProgress>();
+
+  export function change(payload: NeoProgressChange = {}): undefined | NeoProgressStatuses {
+    return instance!.change(payload);
+  }
+
+  export function complete(payload: NeoProgressComplete = {}): undefined | NeoProgressStatuses | Promise<undefined | NeoProgressStatuses> {
+    return instance!.complete(payload);
+  }
+
+  export function cancel(defer = true): undefined | NeoProgressStatuses | Promise<undefined | NeoProgressStatuses> {
+    return instance!.cancel(defer);
+  }
+
+  export function start(payload: NeoProgressStart = {}): undefined | NeoProgressStatuses {
+    return instance!.start(payload);
+  }
+
+  export function stop(): undefined | NeoProgressStatuses {
+    return instance!.stop();
+  }
+
+  export function reset(restart = status === NeoProgressStatus.Active, _start?: NeoProgressStart): undefined | NeoProgressStatuses {
+    return instance!.reset(restart, _start);
+  }
 </script>
 
 {#if typeof before === 'function'}
@@ -126,7 +156,7 @@
   class:neo-progress-bar={true}
   class:neo-borderless={borderless || !track}
   class:neo-flat={!elevation}
-  class:neo-start={start}
+  class:neo-start={startOnEnter}
   class:neo-glass={glass}
   class:neo-inset={elevation < 0}
   class:neo-rounded={rounded}
@@ -142,9 +172,10 @@
   style:--neo-progress-mark-margin-inline={margin?.width}
   style:--neo-progress-bar-glass-blur={filter}
   style:--neo-progress-bar-box-shadow={boxShadow}
+  style:--neo-progress-bar-border-radius={computeBorderRadius(rounded)}
   {...containerRest}
 >
-  <NeoProgress bind:ref bind:status bind:value bind:buffer {direction} {width} {height} {track} {...rest} />
+  <NeoProgress bind:this={instance} bind:ref bind:status bind:value bind:buffer {direction} {width} {height} {track} {immediate} children={progress} {...rest} />
   {#each marks as position, index (index)}
     {#if position !== undefined}
       <span bind:this={refs[index]} class="neo-progress-bar-mark" style:--neo-progress-bar-mark-position="{position}%">
@@ -225,7 +256,7 @@
   border-color: var(--neo-progress-bar-border-color-hover, var(--neo-border-color-highlight));
 }
 .neo-progress-bar.neo-rounded {
-  border-radius: var(--neo-pill-border-radius, var(--neo-border-radius-lg));
+  border-radius: var(--neo-progress-bar-border-radius, var(--neo-border-radius-xxl));
 }
 .neo-progress-bar.neo-glass {
   --neo-border-color: var(--neo-glass-border-color);

package/dist/progress/NeoProgressBar.svelte.d.ts

@@ -1,4 +1,12 @@
 import type { NeoProgressBarProps } from './neo-progress-bar.model.js';
-declare const NeoProgressBar: import("svelte").Component<NeoProgressBarProps, {}, "ref" | "value" | "status" | "refs" | "buffer">;
+import type { NeoProgressChange, NeoProgressComplete, NeoProgressStart, NeoProgressStatuses } from './neo-progress.model.js';
+declare const NeoProgressBar: import("svelte").Component<NeoProgressBarProps, {
+    change: (payload?: NeoProgressChange) => undefined | NeoProgressStatuses;
+    complete: (payload?: NeoProgressComplete) => undefined | NeoProgressStatuses | Promise<undefined | NeoProgressStatuses>;
+    cancel: (defer?: boolean) => undefined | NeoProgressStatuses | Promise<undefined | NeoProgressStatuses>;
+    start: (payload?: NeoProgressStart) => undefined | NeoProgressStatuses;
+    stop: () => undefined | NeoProgressStatuses;
+    reset: (restart?: boolean, _start?: NeoProgressStart) => undefined | NeoProgressStatuses;
+}, "value" | "status" | "ref" | "refs" | "buffer" | "immediate">;
 type NeoProgressBar = ReturnType<typeof NeoProgressBar>;
 export default NeoProgressBar;

package/dist/progress/index.d.ts

@@ -1,5 +1,6 @@
 export { default as NeoProgress } from './NeoProgress.svelte';
 export { default as NeoProgressBar } from './NeoProgressBar.svelte';
+export { NeoProgressService, useNeoProgressService } from './neo-progress-service.svelte.js';
 export { NeoProgressDirection, NeoProgressStatus } from './neo-progress.model.js';
 export type * from './neo-progress-bar.model.js';
 export type * from './neo-progress.model.js';

package/dist/progress/index.js

@@ -1,3 +1,4 @@
 export { default as NeoProgress } from './NeoProgress.svelte';
 export { default as NeoProgressBar } from './NeoProgressBar.svelte';
+export { NeoProgressService, useNeoProgressService } from './neo-progress-service.svelte.js';
 export { NeoProgressDirection, NeoProgressStatus } from './neo-progress.model.js';

package/dist/progress/neo-progress-bar.model.d.ts

@@ -1,5 +1,6 @@
 import type { Snippet } from 'svelte';
-import type { NeoProgressContext, NeoProgressProps } from './neo-progress.model.js';
+import type { NeoProgressProps, NeoProgressState } from './neo-progress.model.js';
+import type { BorderRadiusInput } from '../utils/border.utils.js';
 import type { HTMLNeoBaseElement, HTMLTagProps } from '../utils/html-element.utils.js';
 import type { BlurElevation, BlurElevationString, ShadowShallowElevation, ShadowShallowElevationString } from '../utils/shadow.utils.js';
 export type NeoProgressBlur = BlurElevation | BlurElevationString;
@@ -23,7 +24,7 @@ interface NeoProgressBarStyle {
     /**
      * Rounds border radius.
      */
-    rounded?: boolean;
+    rounded?: BorderRadiusInput;
     /**
      * Recess the content of the progress if elevation is inset (< 0).
      */
@@ -41,7 +42,7 @@ interface NeoProgressBarStyle {
      */
     track?: boolean;
 }
-export type NeoProgressBarContext = NeoProgressContext & NeoProgressBarStyle;
+export type NeoProgressBarContext = NeoProgressState & NeoProgressBarStyle;
 export interface NeoProgressBarMarkContext {
     index: number;
     position: number;
@@ -49,15 +50,19 @@ export interface NeoProgressBarMarkContext {
 }
 export type NeoProgressBarProps<Tag extends keyof HTMLElementTagNameMap = 'div', ContainerTag extends keyof HTMLElementTagNameMap = 'div'> = {
     /**
-     * Optional content to display inside the progress.
+     * Optional content to display inside the progress bar.
      */
     children?: Snippet<[NeoProgressBarContext]>;
     /**
-     * Optional content to display before the progress.
+     * Optional content to display inside the inner progress component.
+     */
+    progress?: NeoProgressProps<Tag>['children'];
+    /**
+     * Optional content to display before the progress bar.
      */
     before?: Snippet<[NeoProgressBarContext]> | string;
     /**
-     * Optional content to display after the progress.
+     * Optional content to display after the progress bar.
      */
     after?: Snippet<[NeoProgressBarContext]> | string;
     /**

package/dist/progress/neo-progress-service.svelte.d.ts

@@ -0,0 +1,47 @@
+import type { NeoProgressContext, NeoProgressStart } from './neo-progress.model.js';
+export interface NeoProgressServiceOptions {
+    /**
+     * Delay in milliseconds before the progress bar starts.
+     * This is useful to debounce multiple calls to the progress bar.
+     */
+    delay?: number;
+    /**
+     * Function to generate a unique ID for the progress bar.
+     * If not provided, a UUID will be generated.
+     */
+    uuid?: () => string;
+}
+/**
+ * Queuing service to keep track of concurrent call to progress bar
+ */
+export declare class NeoProgressService {
+    #private;
+    get context(): NeoProgressContext;
+    get value(): number | undefined;
+    get buffer(): number | undefined;
+    get status(): import("./neo-progress.model.js").NeoProgressStatuses | undefined;
+    get active(): Set<string>;
+    constructor(context: NeoProgressContext, options?: NeoProgressServiceOptions);
+    /**
+     * Synchronizes the progress state working with the current active IDs set.
+     */
+    sync(): Set<string> | undefined;
+    /**
+     * Starts a new progress bar with the given options.
+     * If an ID is provided, it will be used to track the progress bar.
+     * If no ID is provided, a new UUID will be generated.
+     * If a delay is provided, the progress bar will start after the specified delay.
+     */
+    start(opts?: NeoProgressStart, { id, delay }?: {
+        id?: string;
+        delay?: number;
+    }): string | undefined;
+    cancel(id?: string, force?: boolean): string | undefined;
+    complete(id?: string, force?: boolean): string | undefined;
+    error(id?: string, force?: boolean): string | undefined;
+    success(id?: string, force?: boolean): string | undefined;
+    warning(id?: string, force?: boolean): string | undefined;
+}
+export declare function getProgressContext(): NeoProgressContext;
+export declare function setProgressContext(context: NeoProgressContext): NeoProgressContext | undefined;
+export declare function useNeoProgressService(): NeoProgressService;