@uibit/number-increment 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 UIBit Contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,22 @@
+# Number Ticker
+
+[Interactive Demonstration](https://rawlings.github.io/uibit/number-ticker)
+
+Number Ticker is a visual performance indicator component that animates numerical statistics, percentages, and currencies when they enter the user's viewport. By displaying numbers with a smooth counting motion rather than as static values, it highlights milestones and growth metrics.
+
+## Value Delivery
+
+- **Dynamic Visual Momentum** – Draws attention to critical business metrics, giving stats a sense of growth and scale.
+- **Scroll-Triggered Activation** – Automatically starts the counting animation only when the component enters the visible viewport.
+- **Global Localization Support** – Formats currencies, decimals, and custom separators according to user locale preferences.
+- **Fluid Easing Curves** – Uses hardware-accelerated rendering methods to ensure smooth visual ticks without causing layout recalculations.
+
+## Ideal Applications
+
+- **Key Performance Indicators** – Showcasing revenue figures, conversion rates, and corporate achievements.
+- **User Milestones** – Animating active user counts, community sizes, or transaction histories.
+- **Impact Dashboards** – Highlighting carbon offsets, project progress, or resource savings.
+
+## Further Information
+
+Detailed design guidelines, customizable attributes, and integration examples are available on our documentation site.

package/custom-elements.json

@@ -0,0 +1,434 @@
+{
+  "schemaVersion": "1.0.0",
+  "readme": "",
+  "modules": [
+    {
+      "kind": "javascript-module",
+      "path": "src/index.ts",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "default",
+            "module": "./number-increment"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "NumberIncrement",
+          "declaration": {
+            "name": "NumberIncrement",
+            "module": "./number-increment"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "module": "src/types"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/number-increment.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "Animates a numeric value from zero (or a custom start) up to the `value`\nattribute once the element scrolls into the viewport. Supports easing,\ndecimal places, and custom formatting functions.\n\nThe animation runs entirely in the shadow DOM on a rAF loop so it never\nblocks the main thread via layout thrashing.",
+          "name": "NumberIncrement",
+          "cssProperties": [
+            {
+              "description": "Font size",
+              "name": "--uibit-number-increment-font-size",
+              "default": "inherit"
+            },
+            {
+              "description": "Font weight",
+              "name": "--uibit-number-increment-font-weight",
+              "default": "inherit"
+            },
+            {
+              "description": "Text color",
+              "name": "--uibit-number-increment-color",
+              "default": "inherit"
+            },
+            {
+              "description": "Font family",
+              "name": "--uibit-number-increment-font-family",
+              "default": "inherit"
+            },
+            {
+              "description": "Line height",
+              "name": "--uibit-number-increment-line-height",
+              "default": "inherit"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "value",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "description": "Target numeric value to count up to.",
+              "attribute": "value"
+            },
+            {
+              "kind": "field",
+              "name": "from",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "description": "Starting value for the animation.",
+              "attribute": "from"
+            },
+            {
+              "kind": "field",
+              "name": "duration",
+              "type": {
+                "text": "number"
+              },
+              "default": "1800",
+              "description": "Duration of the count animation in milliseconds.",
+              "attribute": "duration"
+            },
+            {
+              "kind": "field",
+              "name": "decimals",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "description": "Number of decimal places to display. Used only if no custom formatter is provided.",
+              "attribute": "decimals"
+            },
+            {
+              "kind": "field",
+              "name": "locale",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "BCP 47 locale string for number formatting (e.g. \"en-US\"). Defaults to browser locale if options is set.",
+              "attribute": "locale"
+            },
+            {
+              "kind": "field",
+              "name": "options",
+              "type": {
+                "text": "Intl.NumberFormatOptions | undefined"
+              },
+              "description": "Options for Intl.NumberFormat.",
+              "attribute": "options"
+            },
+            {
+              "kind": "field",
+              "name": "formatter",
+              "type": {
+                "text": "(value: number) => string | undefined"
+              },
+              "description": "Custom formatter function to format the number for display. Overrides locale and options."
+            },
+            {
+              "kind": "field",
+              "name": "easing",
+              "type": {
+                "text": "'ease-out' | 'ease-in-out' | 'linear'"
+              },
+              "default": "'ease-out'",
+              "description": "Easing curve: \"ease-out\" | \"ease-in-out\" | \"linear\".",
+              "attribute": "easing"
+            },
+            {
+              "kind": "field",
+              "name": "threshold",
+              "type": {
+                "text": "number"
+              },
+              "default": "0.2",
+              "description": "Intersection threshold (0–1) at which the animation triggers.",
+              "attribute": "threshold"
+            },
+            {
+              "kind": "field",
+              "name": "repeat",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Re-animate each time the element re-enters the viewport.",
+              "attribute": "repeat"
+            },
+            {
+              "kind": "field",
+              "name": "_display",
+              "type": {
+                "text": "string"
+              },
+              "privacy": "private",
+              "default": "''"
+            },
+            {
+              "kind": "field",
+              "name": "_viewport",
+              "type": {
+                "text": "ViewportController | undefined"
+              },
+              "privacy": "private"
+            },
+            {
+              "kind": "field",
+              "name": "_loop",
+              "privacy": "private",
+              "default": "new LoopController(this, { autoStart: false, callback: (ts) => this._tick(ts), })"
+            },
+            {
+              "kind": "field",
+              "name": "_started",
+              "type": {
+                "text": "boolean"
+              },
+              "privacy": "private",
+              "default": "false"
+            },
+            {
+              "kind": "field",
+              "name": "_startTime",
+              "type": {
+                "text": "number | null"
+              },
+              "privacy": "private",
+              "default": "null"
+            },
+            {
+              "kind": "field",
+              "name": "_startVal",
+              "type": {
+                "text": "number"
+              },
+              "privacy": "private",
+              "default": "0"
+            },
+            {
+              "kind": "field",
+              "name": "_endVal",
+              "type": {
+                "text": "number"
+              },
+              "privacy": "private",
+              "default": "0"
+            },
+            {
+              "kind": "method",
+              "name": "_ease",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "number"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "t",
+                  "type": {
+                    "text": "number"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_format",
+              "privacy": "private",
+              "return": {
+                "type": {
+                  "text": "string"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "n",
+                  "type": {
+                    "text": "number"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_start",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "_tick",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "ts",
+                  "type": {
+                    "text": "number"
+                  }
+                }
+              ]
+            }
+          ],
+          "events": [
+            {
+              "description": "ticker-end - Fired when the count animation completes",
+              "name": "void"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "value",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "description": "Target numeric value to count up to.",
+              "fieldName": "value"
+            },
+            {
+              "name": "from",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "description": "Starting value for the animation.",
+              "fieldName": "from"
+            },
+            {
+              "name": "duration",
+              "type": {
+                "text": "number"
+              },
+              "default": "1800",
+              "description": "Duration of the count animation in milliseconds.",
+              "fieldName": "duration"
+            },
+            {
+              "name": "decimals",
+              "type": {
+                "text": "number"
+              },
+              "default": "0",
+              "description": "Number of decimal places to display. Used only if no custom formatter is provided.",
+              "fieldName": "decimals"
+            },
+            {
+              "name": "locale",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "BCP 47 locale string for number formatting (e.g. \"en-US\"). Defaults to browser locale if options is set.",
+              "fieldName": "locale"
+            },
+            {
+              "name": "options",
+              "type": {
+                "text": "Intl.NumberFormatOptions | undefined"
+              },
+              "description": "Options for Intl.NumberFormat.",
+              "fieldName": "options"
+            },
+            {
+              "name": "easing",
+              "type": {
+                "text": "'ease-out' | 'ease-in-out' | 'linear'"
+              },
+              "default": "'ease-out'",
+              "description": "Easing curve: \"ease-out\" | \"ease-in-out\" | \"linear\".",
+              "fieldName": "easing"
+            },
+            {
+              "name": "threshold",
+              "type": {
+                "text": "number"
+              },
+              "default": "0.2",
+              "description": "Intersection threshold (0–1) at which the animation triggers.",
+              "fieldName": "threshold"
+            },
+            {
+              "name": "repeat",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Re-animate each time the element re-enters the viewport.",
+              "fieldName": "repeat"
+            }
+          ],
+          "superclass": {
+            "name": "UIBitElement",
+            "package": "@uibit/core"
+          },
+          "tagName": "uibit-number-increment",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "NumberIncrement",
+          "declaration": {
+            "name": "NumberIncrement",
+            "module": "src/number-increment.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "uibit-number-increment",
+          "declaration": {
+            "name": "NumberIncrement",
+            "module": "src/number-increment.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "NumberIncrement",
+            "module": "src/number-increment.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/styles.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "styles",
+          "default": "css` :host { display: inline-block; font-variant-numeric: tabular-nums; font-size: var(--uibit-number-increment-font-size, inherit); font-weight: var(--uibit-number-increment-font-weight, inherit); color: var(--uibit-number-increment-color, inherit); font-family: var(--uibit-number-increment-font-family, inherit); line-height: var(--uibit-number-increment-line-height, inherit); } .value { display: inline; } `"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "styles",
+          "declaration": {
+            "name": "styles",
+            "module": "src/styles.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/types.ts",
+      "declarations": [],
+      "exports": []
+    }
+  ]
+}

package/dist/frameworks/angular/index.ts

@@ -0,0 +1,80 @@
+import { Component, ChangeDetectionStrategy, ElementRef, input, effect, output, booleanAttribute, numberAttribute } from '@angular/core';
+import '@uibit/number-increment';
+import type { NumberIncrement as HTMLElementClass } from '@uibit/number-increment';
+
+@Component({
+  selector: 'uibit-number-increment',
+  template: '<ng-content></ng-content>',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: true,
+  host: {
+    '(void)': 'void.emit($event)'
+  }
+})
+export class NgxNumberIncrement {
+  constructor(private el: ElementRef<HTMLElementClass>) {
+    effect(() => {
+      if (this.el.nativeElement) {
+        this.el.nativeElement.value = this.value();
+      }
+    });
+    effect(() => {
+      if (this.el.nativeElement) {
+        this.el.nativeElement.from = this.from();
+      }
+    });
+    effect(() => {
+      if (this.el.nativeElement) {
+        this.el.nativeElement.duration = this.duration();
+      }
+    });
+    effect(() => {
+      if (this.el.nativeElement) {
+        this.el.nativeElement.decimals = this.decimals();
+      }
+    });
+    effect(() => {
+      if (this.el.nativeElement) {
+        this.el.nativeElement.locale = this.locale();
+      }
+    });
+    effect(() => {
+      if (this.el.nativeElement) {
+        this.el.nativeElement.options = this.options();
+      }
+    });
+    effect(() => {
+      if (this.el.nativeElement) {
+        this.el.nativeElement.formatter = this.formatter();
+      }
+    });
+    effect(() => {
+      if (this.el.nativeElement) {
+        this.el.nativeElement.easing = this.easing();
+      }
+    });
+    effect(() => {
+      if (this.el.nativeElement) {
+        this.el.nativeElement.threshold = this.threshold();
+      }
+    });
+    effect(() => {
+      if (this.el.nativeElement) {
+        this.el.nativeElement.repeat = this.repeat();
+      }
+    });
+  }
+
+  readonly value = input<number, any>(0, { transform: numberAttribute });
+  readonly from = input<number, any>(0, { transform: numberAttribute });
+  readonly duration = input<number, any>(1800, { transform: numberAttribute });
+  readonly decimals = input<number, any>(0, { transform: numberAttribute });
+  readonly locale = input<string, any>('');
+  readonly options = input<Intl.NumberFormatOptions | undefined, any>(undefined);
+  readonly formatter = input<(value: number) => string | undefined, any>(0, { transform: numberAttribute });
+  readonly easing = input<'ease-out' | 'ease-in-out' | 'linear', any>('ease-out');
+  readonly threshold = input<number, any>(0.2, { transform: numberAttribute });
+  readonly repeat = input<boolean, any>(false, { transform: booleanAttribute });
+
+  readonly void = output<CustomEvent<any>>();
+}

package/dist/frameworks/astro/index.d.ts

@@ -0,0 +1,10 @@
+import type { NumberIncrement as HTMLElementClass } from '@uibit/number-increment';
+import '@uibit/number-increment';
+
+declare global {
+  namespace astroHTML.JSX {
+    interface IntrinsicElements {
+      'uibit-number-increment': Partial<HTMLElementClass> & astroHTML.JSX.HTMLAttributes;
+    }
+  }
+}

package/dist/frameworks/nuxt/index.ts

@@ -0,0 +1,7 @@
+import { defineNuxtPlugin } from '#app';
+
+export default defineNuxtPlugin(() => {
+  if (process.client) {
+    import('@uibit/number-increment');
+  }
+});

package/dist/frameworks/preact/index.d.ts

@@ -0,0 +1,22 @@
+import type { JSX } from 'preact';
+import type { NumberIncrement as HTMLElementClass } from '@uibit/number-increment';
+import '@uibit/number-increment';
+
+declare module 'preact' {
+  namespace JSX {
+    interface IntrinsicElements {
+      'uibit-number-increment': JSX.HTMLAttributes<HTMLElementClass> & {
+      value?: number;
+      from?: number;
+      duration?: number;
+      decimals?: number;
+      locale?: string;
+      options?: Intl.NumberFormatOptions | undefined;
+      formatter?: (value: number) => string | undefined;
+      easing?: 'ease-out' | 'ease-in-out' | 'linear';
+      threshold?: number;
+      repeat?: boolean;
+      };
+    }
+  }
+}

package/dist/frameworks/qwik/index.tsx

@@ -0,0 +1,10 @@
+import { component$, Slot } from '@builder.io/qwik';
+import '@uibit/number-increment';
+
+export const NumberIncrement = component$<any>((props) => {
+  return (
+    <uibit-number-increment {...props}>
+      <Slot />
+    </uibit-number-increment>
+  );
+});

package/dist/frameworks/react/index.d.ts

@@ -0,0 +1,27 @@
+import type { HTMLAttributes, ClassAttributes } from 'react';
+import type { NumberIncrement as HTMLElementClass } from '@uibit/number-increment';
+import '@uibit/number-increment';
+
+declare global {
+  namespace React {
+    namespace JSX {
+      interface IntrinsicElements {
+        'uibit-number-increment': ClassAttributes<HTMLElementClass> & HTMLAttributes<HTMLElementClass> & {
+          children?: React.ReactNode;
+          class?: string;
+      value?: number;
+      from?: number;
+      duration?: number;
+      decimals?: number;
+      locale?: string;
+      options?: Intl.NumberFormatOptions | undefined;
+      formatter?: (value: number) => string | undefined;
+      easing?: 'ease-out' | 'ease-in-out' | 'linear';
+      threshold?: number;
+      repeat?: boolean;
+      onVoid?: (event: any) => void;
+        };
+      }
+    }
+  }
+}

package/dist/frameworks/solid/index.d.ts

@@ -0,0 +1,23 @@
+import type { JSX } from 'solid-js';
+import type { NumberIncrement as HTMLElementClass } from '@uibit/number-increment';
+import '@uibit/number-increment';
+
+declare module 'solid-js' {
+  namespace JSX {
+    interface IntrinsicElements {
+      'uibit-number-increment': Partial<HTMLElementClass> & JSX.HTMLAttributes<HTMLElementClass> & {
+              value?: number;
+      from?: number;
+      duration?: number;
+      decimals?: number;
+      locale?: string;
+      options?: Intl.NumberFormatOptions | undefined;
+      formatter?: (value: number) => string | undefined;
+      easing?: 'ease-out' | 'ease-in-out' | 'linear';
+      threshold?: number;
+      repeat?: boolean;
+      "on:void"?: (event: CustomEvent) => void;
+      };
+    }
+  }
+}

package/dist/frameworks/stencil/index.d.ts

@@ -0,0 +1,21 @@
+import type { NumberIncrement as HTMLElementClass } from '@uibit/number-increment';
+import '@uibit/number-increment';
+
+declare module '@stencil/core' {
+  export namespace JSX {
+    interface IntrinsicElements {
+      'uibit-number-increment': HTMLElementClass & {
+    value?: number;
+    from?: number;
+    duration?: number;
+    decimals?: number;
+    locale?: string;
+    options?: Intl.NumberFormatOptions | undefined;
+    formatter?: (value: number) => string | undefined;
+    easing?: 'ease-out' | 'ease-in-out' | 'linear';
+    threshold?: number;
+    repeat?: boolean;
+      };
+    }
+  }
+}

package/dist/frameworks/svelte/index.svelte

@@ -0,0 +1,76 @@
+<script lang="ts">
+  import '@uibit/number-increment';
+  import type { NumberIncrement as HTMLElementClass } from '@uibit/number-increment';
+  
+  let {
+    value = undefined,
+      from = undefined,
+      duration = undefined,
+      decimals = undefined,
+      locale = undefined,
+      options = undefined,
+      formatter = undefined,
+      easing = undefined,
+      threshold = undefined,
+      repeat = undefined,
+      children
+  } = $props<{
+    children?: any;
+    value?: number;
+    from?: number;
+    duration?: number;
+    decimals?: number;
+    locale?: string;
+    options?: Intl.NumberFormatOptions | undefined;
+    formatter?: (value: number) => string | undefined;
+    easing?: 'ease-out' | 'ease-in-out' | 'linear';
+    threshold?: number;
+    repeat?: boolean;
+  
+  }>();
+  
+  let elementRef: HTMLElementClass | null = $state(null);
+  
+  $effect(() => {
+    if (elementRef && value !== undefined) {
+      elementRef.value = value;
+    }
+    if (elementRef && from !== undefined) {
+      elementRef.from = from;
+    }
+    if (elementRef && duration !== undefined) {
+      elementRef.duration = duration;
+    }
+    if (elementRef && decimals !== undefined) {
+      elementRef.decimals = decimals;
+    }
+    if (elementRef && locale !== undefined) {
+      elementRef.locale = locale;
+    }
+    if (elementRef && options !== undefined) {
+      elementRef.options = options;
+    }
+    if (elementRef && formatter !== undefined) {
+      elementRef.formatter = formatter;
+    }
+    if (elementRef && easing !== undefined) {
+      elementRef.easing = easing;
+    }
+    if (elementRef && threshold !== undefined) {
+      elementRef.threshold = threshold;
+    }
+    if (elementRef && repeat !== undefined) {
+      elementRef.repeat = repeat;
+    }
+  });
+  
+</script>
+
+<uibit-number-increment bind:this={elementRef} {...$$restProps}>
+
+  {#if children}
+    {@render children()}
+  {:else}
+    <slot />
+  {/if}
+</uibit-number-increment>

package/dist/frameworks/vue/index.ts

@@ -0,0 +1,33 @@
+import { defineComponent, h } from 'vue';
+import type { NumberIncrement as HTMLElementClass } from '@uibit/number-increment';
+import '@uibit/number-increment';
+
+export const NumberIncrement = defineComponent({
+  name: 'NumberIncrement',
+  props: {
+    value: { type: [String, Number, Boolean, Array, Object] as any },
+    from: { type: [String, Number, Boolean, Array, Object] as any },
+    duration: { type: [String, Number, Boolean, Array, Object] as any },
+    decimals: { type: [String, Number, Boolean, Array, Object] as any },
+    locale: { type: [String, Number, Boolean, Array, Object] as any },
+    options: { type: [String, Number, Boolean, Array, Object] as any },
+    formatter: { type: [String, Number, Boolean, Array, Object] as any },
+    easing: { type: [String, Number, Boolean, Array, Object] as any },
+    threshold: { type: [String, Number, Boolean, Array, Object] as any },
+    repeat: { type: [String, Number, Boolean, Array, Object] as any }
+  },
+  emits: ['void'],
+  setup(props, { slots, emit }) {
+    return () => {
+      const eventListeners: Record<string, any> = {};
+      eventListeners['onVoid'] = (event: Event) => {
+        emit('void', event);
+      };
+
+      return h('uibit-number-increment', {
+        ...props,
+        ...eventListeners
+      }, slots.default?.());
+    };
+  }
+});

package/dist/index.d.ts

@@ -0,0 +1,3 @@
+export { default, NumberIncrement } from './number-increment';
+export * from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAC9D,cAAc,SAAS,CAAC"}

package/dist/index.js

@@ -0,0 +1,3 @@
+export { default, NumberIncrement } from './number-increment';
+export * from './types';
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAC9D,cAAc,SAAS,CAAC"}

package/dist/number-increment.d.ts

@@ -0,0 +1,57 @@
+import { UIBitElement } from '@uibit/core';
+/**
+ * Animates a numeric value from zero (or a custom start) up to the `value`
+ * attribute once the element scrolls into the viewport. Supports easing,
+ * decimal places, and custom formatting functions.
+ *
+ * The animation runs entirely in the shadow DOM on a rAF loop so it never
+ * blocks the main thread via layout thrashing.
+ *
+ * @fires void ticker-start - Fired when the count animation begins
+ * @fires void ticker-end - Fired when the count animation completes
+ *
+ * @cssprop [--uibit-number-increment-font-size=inherit] - Font size
+ * @cssprop [--uibit-number-increment-font-weight=inherit] - Font weight
+ * @cssprop [--uibit-number-increment-color=inherit] - Text color
+ * @cssprop [--uibit-number-increment-font-family=inherit] - Font family
+ * @cssprop [--uibit-number-increment-line-height=inherit] - Line height
+ */
+export declare class NumberIncrement extends UIBitElement {
+    static styles: import("lit").CSSResult;
+    /** Target numeric value to count up to. */
+    value: number;
+    /** Starting value for the animation. */
+    from: number;
+    /** Duration of the count animation in milliseconds. */
+    duration: number;
+    /** Number of decimal places to display. Used only if no custom formatter is provided. */
+    decimals: number;
+    /** BCP 47 locale string for number formatting (e.g. "en-US"). Defaults to browser locale if options is set. */
+    locale: string;
+    /** Options for Intl.NumberFormat. */
+    options?: Intl.NumberFormatOptions;
+    /** Custom formatter function to format the number for display. Overrides locale and options. */
+    formatter?: (value: number) => string;
+    /** Easing curve: "ease-out" | "ease-in-out" | "linear". */
+    easing: 'ease-out' | 'ease-in-out' | 'linear';
+    /** Intersection threshold (0–1) at which the animation triggers. */
+    threshold: number;
+    /** Re-animate each time the element re-enters the viewport. */
+    repeat: boolean;
+    private _display;
+    private _viewport?;
+    private _loop;
+    private _started;
+    private _startTime;
+    private _startVal;
+    private _endVal;
+    connectedCallback(): void;
+    updated(changed: Map<string, unknown>): void;
+    private _ease;
+    private _format;
+    private _start;
+    private _tick;
+    render(): import("lit").TemplateResult<1>;
+}
+export default NumberIncrement;
+//# sourceMappingURL=number-increment.d.ts.map

package/dist/number-increment.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"number-increment.d.ts","sourceRoot":"","sources":["../src/number-increment.ts"],"names":[],"mappings":"AACA,OAAO,EAAiB,YAAY,EAAsC,MAAM,aAAa,CAAC;AAI9F;;;;;;;;;;;;;;;;GAgBG;AACH,qBACa,eAAgB,SAAQ,YAAY;IAC/C,MAAM,CAAC,MAAM,0BAAU;IAEvB,2CAA2C;IACf,KAAK,SAAK;IACtC,wCAAwC;IACO,IAAI,SAAK;IACxD,uDAAuD;IAC3B,QAAQ,SAAQ;IAC5C,yFAAyF;IAC7D,QAAQ,SAAK;IACzC,+GAA+G;IACnF,MAAM,SAAM;IACxC,qCAAqC;IACT,OAAO,CAAC,EAAE,IAAI,CAAC,mBAAmB,CAAC;IAC/D,gGAAgG;IAChE,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACtE,2DAA2D;IAC/B,MAAM,EAAE,UAAU,GAAG,aAAa,GAAG,QAAQ,CAAc;IACvF,oEAAoE;IACxC,SAAS,SAAO;IAC5C,+DAA+D;IAClC,MAAM,UAAS;IAEnC,OAAO,CAAC,QAAQ,CAAM;IAE/B,OAAO,CAAC,SAAS,CAAC,CAAqB;IACvC,OAAO,CAAC,KAAK,CAGV;IAEH,OAAO,CAAC,QAAQ,CAAS;IACzB,OAAO,CAAC,UAAU,CAAuB;IACzC,OAAO,CAAC,SAAS,CAAK;IACtB,OAAO,CAAC,OAAO,CAAK;IAEpB,iBAAiB,SAahB;IAED,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,QAIpC;IAED,OAAO,CAAC,KAAK;IAOb,OAAO,CAAC,OAAO;IAUf,OAAO,CAAC,MAAM;IAUd,OAAO,CAAC,KAAK;IAcb,MAAM,oCAEL;CACF;eAEc,eAAe"}

package/dist/number-increment.js

@@ -0,0 +1,157 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html } from 'lit';
+import { customElement, UIBitElement, ViewportController, LoopController } from '@uibit/core';
+import { property, state } from 'lit/decorators.js';
+import { styles } from './styles';
+/**
+ * Animates a numeric value from zero (or a custom start) up to the `value`
+ * attribute once the element scrolls into the viewport. Supports easing,
+ * decimal places, and custom formatting functions.
+ *
+ * The animation runs entirely in the shadow DOM on a rAF loop so it never
+ * blocks the main thread via layout thrashing.
+ *
+ * @fires void ticker-start - Fired when the count animation begins
+ * @fires void ticker-end - Fired when the count animation completes
+ *
+ * @cssprop [--uibit-number-increment-font-size=inherit] - Font size
+ * @cssprop [--uibit-number-increment-font-weight=inherit] - Font weight
+ * @cssprop [--uibit-number-increment-color=inherit] - Text color
+ * @cssprop [--uibit-number-increment-font-family=inherit] - Font family
+ * @cssprop [--uibit-number-increment-line-height=inherit] - Line height
+ */
+let NumberIncrement = class NumberIncrement extends UIBitElement {
+    constructor() {
+        super(...arguments);
+        /** Target numeric value to count up to. */
+        this.value = 0;
+        /** Starting value for the animation. */
+        this.from = 0;
+        /** Duration of the count animation in milliseconds. */
+        this.duration = 1800;
+        /** Number of decimal places to display. Used only if no custom formatter is provided. */
+        this.decimals = 0;
+        /** BCP 47 locale string for number formatting (e.g. "en-US"). Defaults to browser locale if options is set. */
+        this.locale = '';
+        /** Easing curve: "ease-out" | "ease-in-out" | "linear". */
+        this.easing = 'ease-out';
+        /** Intersection threshold (0–1) at which the animation triggers. */
+        this.threshold = 0.2;
+        /** Re-animate each time the element re-enters the viewport. */
+        this.repeat = false;
+        this._display = '';
+        this._loop = new LoopController(this, {
+            autoStart: false,
+            callback: (ts) => this._tick(ts),
+        });
+        this._started = false;
+        this._startTime = null;
+        this._startVal = 0;
+        this._endVal = 0;
+    }
+    static { this.styles = styles; }
+    connectedCallback() {
+        super.connectedCallback();
+        this._display = this._format(this.from);
+        if (!this._viewport) {
+            this._viewport = new ViewportController(this, {
+                threshold: this.threshold,
+                callback: (entry) => {
+                    if (entry.isIntersecting && (!this._started || this.repeat)) {
+                        this._start();
+                    }
+                },
+            });
+        }
+    }
+    updated(changed) {
+        if (changed.has('value') && this._started) {
+            this._start();
+        }
+    }
+    _ease(t) {
+        if (this.easing === 'linear')
+            return t;
+        if (this.easing === 'ease-in-out')
+            return t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t;
+        // ease-out cubic
+        return 1 - Math.pow(1 - t, 3);
+    }
+    _format(n) {
+        if (this.formatter) {
+            return this.formatter(n);
+        }
+        if (this.options || this.locale) {
+            return new Intl.NumberFormat(this.locale || undefined, this.options).format(n);
+        }
+        return n.toFixed(this.decimals);
+    }
+    _start() {
+        this._started = true;
+        this._startVal = this.from;
+        this._endVal = this.value;
+        this._startTime = null;
+        this.dispatchCustomEvent('ticker-start');
+        this._loop.start();
+    }
+    _tick(ts) {
+        if (this._startTime === null)
+            this._startTime = ts;
+        const elapsed = ts - this._startTime;
+        const progress = Math.min(elapsed / this.duration, 1);
+        const current = this._startVal + (this._endVal - this._startVal) * this._ease(progress);
+        this._display = this._format(current);
+        if (progress >= 1) {
+            this._display = this._format(this._endVal);
+            this._loop.stop();
+            this.dispatchCustomEvent('ticker-end');
+        }
+    }
+    render() {
+        return html `<span class="value" part="value" aria-live="polite">${this._display}</span>`;
+    }
+};
+__decorate([
+    property({ type: Number })
+], NumberIncrement.prototype, "value", void 0);
+__decorate([
+    property({ type: Number, attribute: 'from' })
+], NumberIncrement.prototype, "from", void 0);
+__decorate([
+    property({ type: Number })
+], NumberIncrement.prototype, "duration", void 0);
+__decorate([
+    property({ type: Number })
+], NumberIncrement.prototype, "decimals", void 0);
+__decorate([
+    property({ type: String })
+], NumberIncrement.prototype, "locale", void 0);
+__decorate([
+    property({ type: Object })
+], NumberIncrement.prototype, "options", void 0);
+__decorate([
+    property({ attribute: false })
+], NumberIncrement.prototype, "formatter", void 0);
+__decorate([
+    property({ type: String })
+], NumberIncrement.prototype, "easing", void 0);
+__decorate([
+    property({ type: Number })
+], NumberIncrement.prototype, "threshold", void 0);
+__decorate([
+    property({ type: Boolean })
+], NumberIncrement.prototype, "repeat", void 0);
+__decorate([
+    state()
+], NumberIncrement.prototype, "_display", void 0);
+NumberIncrement = __decorate([
+    customElement('uibit-number-increment')
+], NumberIncrement);
+export { NumberIncrement };
+export default NumberIncrement;
+//# sourceMappingURL=number-increment.js.map

package/dist/number-increment.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"number-increment.js","sourceRoot":"","sources":["../src/number-increment.ts"],"names":[],"mappings":"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"}

package/dist/styles.d.ts

@@ -0,0 +1,2 @@
+export declare const styles: import("lit").CSSResult;
+//# sourceMappingURL=styles.d.ts.map

package/dist/styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../src/styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAclB,CAAC"}

package/dist/styles.js

@@ -0,0 +1,17 @@
+import { css } from 'lit';
+export const styles = css `
+  :host {
+    display: inline-block;
+    font-variant-numeric: tabular-nums;
+    font-size: var(--uibit-number-increment-font-size, inherit);
+    font-weight: var(--uibit-number-increment-font-weight, inherit);
+    color: var(--uibit-number-increment-color, inherit);
+    font-family: var(--uibit-number-increment-font-family, inherit);
+    line-height: var(--uibit-number-increment-line-height, inherit);
+  }
+
+  .value {
+    display: inline;
+  }
+`;
+//# sourceMappingURL=styles.js.map

package/dist/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../src/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;CAcxB,CAAC"}

package/dist/types.d.ts

@@ -0,0 +1,7 @@
+import type NumberIncrement from './number-increment';
+declare global {
+    interface HTMLElementTagNameMap {
+        'uibit-number-increment': NumberIncrement;
+    }
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,eAAe,MAAM,oBAAoB,CAAC;AAEtD,OAAO,CAAC,MAAM,CAAC;IACf,UAAU,qBAAqB;QAC3B,wBAAwB,EAAE,eAAe,CAAC;KAC7C;CACA"}

package/dist/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":""}

package/package.json

@@ -0,0 +1,92 @@
+{
+  "name": "@uibit/number-increment",
+  "version": "0.1.0",
+  "description": "Intersection-aware numeric counter that animates to a target value with easing curves, locale-aware formatting, and custom formatter function overrides. Triggers once the element scrolls into the viewport.",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./custom-elements.json": "./custom-elements.json",
+    "./react": "./dist/frameworks/react/index.d.ts",
+    "./vue": "./dist/frameworks/vue/index.ts",
+    "./svelte": "./dist/frameworks/svelte/index.svelte",
+    "./angular": "./dist/frameworks/angular/index.ts",
+    "./solid": "./dist/frameworks/solid/index.d.ts",
+    "./astro": "./dist/frameworks/astro/index.astro",
+    "./qwik": "./dist/frameworks/qwik/index.tsx",
+    "./nuxt": "./dist/frameworks/nuxt/index.ts",
+    "./preact": "./dist/frameworks/preact/index.d.ts",
+    "./stencil": "./dist/frameworks/stencil/index.d.ts"
+  },
+  "files": [
+    "dist",
+    "package.json",
+    "README.md",
+    "LICENSE",
+    "custom-elements.json"
+  ],
+  "keywords": [
+    "counter",
+    "ticker",
+    "number",
+    "animation",
+    "intersection",
+    "web-component",
+    "lit"
+  ],
+  "author": "Jonathan Rawlings",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Rawlings/uibit",
+    "directory": "packages/components/number-increment"
+  },
+  "dependencies": {
+    "@uibit/core": "0.1.0"
+  },
+  "devDependencies": {
+    "@types/node": "^20.19.43",
+    "lit": "^3.3.3",
+    "typescript": "7.0.2",
+    "@uibit/codegen": "0.1.0"
+  },
+  "peerDependencies": {
+    "lit": "^3.0.0",
+    "react": ">=18",
+    "vue": ">=3",
+    "svelte": ">=4 || ^5",
+    "@angular/core": ">=14"
+  },
+  "customElements": "custom-elements.json",
+  "peerDependenciesMeta": {
+    "react": {
+      "optional": true
+    },
+    "vue": {
+      "optional": true
+    },
+    "svelte": {
+      "optional": true
+    },
+    "@angular/core": {
+      "optional": true
+    }
+  },
+  "uibit": {
+    "id": "number-increment",
+    "title": "Number Increment",
+    "category": "Data",
+    "tagName": "uibit-number-increment"
+  },
+  "scripts": {
+    "build": "cem analyze --globs 'src/**/*.ts' --litelement && uibit-codegen --package . && tsc",
+    "dev": "concurrently \"cem analyze --globs 'src/**/*.ts' --litelement --watch\" \"tsc --watch\"",
+    "analyze": "cem analyze --globs 'src/**/*.ts' --litelement",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run -c ../../../vitest.config.ts --passWithNoTests"
+  }
+}