From 404b9df6ad623916a2cd4c91768ff4d76e687c31 Mon Sep 17 00:00:00 2001
From: Darshan <itznotabug@gmail.com>
Date: Sun, 25 Jan 2026 14:13:55 +0530
Subject: [PATCH 1/3] add: bigint support.

---
 v2/pink-sb/src/lib/input/Nullable.svelte      |  2 +-
 v2/pink-sb/src/lib/input/Number.svelte        | 86 +++++++++++++++----
 v2/pink-sb/src/lib/input/bigint.ts            | 60 +++++++++++++
 .../src/stories/input/Number.stories.svelte   |  3 +
 4 files changed, 135 insertions(+), 16 deletions(-)
 create mode 100644 v2/pink-sb/src/lib/input/bigint.ts

diff --git a/v2/pink-sb/src/lib/input/Nullable.svelte b/v2/pink-sb/src/lib/input/Nullable.svelte
index 10085ef630..d53ed22e18 100644
--- a/v2/pink-sb/src/lib/input/Nullable.svelte
+++ b/v2/pink-sb/src/lib/input/Nullable.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
     import Checkbox from '$lib/selector/Checkbox.svelte';
 
-    export let value: string | number | boolean | undefined | null;
+    export let value: string | number | boolean | bigint | undefined | null;
 
     $: checked = value === null || value === undefined || value === '';
     $: hasValidContent = value !== null && value !== undefined && value !== '';
diff --git a/v2/pink-sb/src/lib/input/Number.svelte b/v2/pink-sb/src/lib/input/Number.svelte
index a11cd9a5ae..f68eabc0b9 100644
--- a/v2/pink-sb/src/lib/input/Number.svelte
+++ b/v2/pink-sb/src/lib/input/Number.svelte
@@ -4,6 +4,7 @@
     import Icon from '$lib/Icon.svelte';
     import { autofocusInput } from './autofocus.js';
     import { IconChevronUp, IconChevronDown } from '@appwrite.io/pink-icons-svelte';
+    import { parseBigIntStep, parseBigIntValue } from './bigint.js';
     import type { HTMLInputAttributes } from 'svelte/elements';
     import type { States } from './types.js';
     import { createEventDispatcher, type ComponentType } from 'svelte';
@@ -18,32 +19,66 @@
             leadingIcon?: ComponentType;
         }>;
 
+    type NumberValue = $$Props['value'] | bigint;
+
     export let state: States = 'default';
     export let nullable: $$Props['nullable'] = false;
     export let disabled: $$Props['disabled'] = false;
     export let id: $$Props['id'] = undefined;
-    export let value: $$Props['value'] = undefined;
+    export let value: NumberValue = undefined;
     export let label: $$Props['label'] = undefined;
     export let helper: $$Props['helper'] = undefined;
     export let readonly: $$Props['readonly'] = false;
     export let required: $$Props['required'] = false;
     export let autofocus: $$Props['autofocus'] = false;
     export let leadingIcon: $$Props['leadingIcon'] = undefined;
+    export let step: $$Props['step'] = undefined;
 
+    let bigintMode = false;
     let input: HTMLInputElement;
     const dispatch = createEventDispatcher();
 
+    $: if (typeof value === 'bigint' || typeof value === 'number') {
+        bigintMode = typeof value === 'bigint';
+    }
+
     function fireOnChangeDispatch() {
+        if (bigintMode) {
+            const parsed = parseBigIntValue(value);
+            dispatch('change', parsed ?? undefined);
+            return;
+        }
+
         dispatch('change', Number(value));
     }
 
     function increment(): void {
+        if (bigintMode) {
+            const stepValue = parseBigIntStep(step);
+            const current = parseBigIntValue(value) ?? 0n;
+            const next = current + stepValue;
+
+            value = next.toString();
+            fireOnChangeDispatch();
+            return;
+        }
+
         input.stepUp();
         value = input.value;
         fireOnChangeDispatch();
     }
 
     function decrement(): void {
+        if (bigintMode) {
+            const stepValue = parseBigIntStep(step);
+            const current = parseBigIntValue(value) ?? 0n;
+            const next = current - stepValue;
+
+            value = next.toString();
+            fireOnChangeDispatch();
+            return;
+        }
+
         input.stepDown();
         value = input.value;
         fireOnChangeDispatch();
@@ -61,20 +96,41 @@
         class:error={state === 'error'}
     >
         <slot name="start" />
-        <input
-            {id}
-            on:input
-            on:invalid
-            on:change={fireOnChangeDispatch}
-            bind:this={input}
-            bind:value
-            type="number"
-            {disabled}
-            {readonly}
-            {required}
-            {...$$restProps}
-            use:autofocusInput={autofocus}
-        />
+        {#key bigintMode}
+            {#if bigintMode}
+                <input
+                    {id}
+                    on:input
+                    on:invalid
+                    on:change={fireOnChangeDispatch}
+                    bind:this={input}
+                    bind:value
+                    type="text"
+                    inputmode="numeric"
+                    {disabled}
+                    {readonly}
+                    {required}
+                    {...$$restProps}
+                    use:autofocusInput={autofocus}
+                />
+            {:else}
+                <input
+                    {id}
+                    on:input
+                    on:invalid
+                    on:change={fireOnChangeDispatch}
+                    bind:this={input}
+                    bind:value
+                    type="number"
+                    {disabled}
+                    {readonly}
+                    {required}
+                    {step}
+                    {...$$restProps}
+                    use:autofocusInput={autofocus}
+                />
+            {/if}
+        {/key}
         {#if nullable}
             <Nullable bind:value />
         {/if}
diff --git a/v2/pink-sb/src/lib/input/bigint.ts b/v2/pink-sb/src/lib/input/bigint.ts
new file mode 100644
index 0000000000..f5e505cb34
--- /dev/null
+++ b/v2/pink-sb/src/lib/input/bigint.ts
@@ -0,0 +1,60 @@
+const bigintPattern = /^-?\d+$/;
+const defaultStep = 1n;
+
+function parseBigIntString(raw: string): bigint | null {
+    const trimmed = raw.trim();
+
+    if (trimmed === '' || !bigintPattern.test(trimmed)) {
+        return null;
+    }
+
+    try {
+        return BigInt(trimmed);
+    } catch {
+        return null;
+    }
+}
+
+export function parseBigIntValue(raw: unknown): bigint | null {
+    if (raw === undefined) {
+        return null;
+    }
+
+    if (typeof raw === 'bigint') {
+        return raw;
+    }
+
+    if (typeof raw === 'number') {
+        return Number.isFinite(raw) ? BigInt(Math.trunc(raw)) : null;
+    }
+
+    const trimmed = String(raw ?? '').trim();
+
+    if (trimmed === '') {
+        return 0n;
+    }
+
+    return parseBigIntString(trimmed);
+}
+
+export function parseBigIntStep(raw: unknown): bigint {
+    if (typeof raw === 'number') {
+        if (!Number.isFinite(raw) || raw === 0) {
+            return defaultStep;
+        }
+
+        return BigInt(Math.trunc(raw));
+    }
+
+    if (typeof raw === 'string') {
+        const trimmed = raw.trim();
+
+        if (trimmed === '' || trimmed === 'any') {
+            return defaultStep;
+        }
+
+        return parseBigIntString(trimmed) ?? defaultStep;
+    }
+
+    return defaultStep;
+}
diff --git a/v2/pink-sb/src/stories/input/Number.stories.svelte b/v2/pink-sb/src/stories/input/Number.stories.svelte
index 47ef13fae8..80cf14b4be 100644
--- a/v2/pink-sb/src/stories/input/Number.stories.svelte
+++ b/v2/pink-sb/src/stories/input/Number.stories.svelte
@@ -35,3 +35,6 @@
 <Story name="Readonly" args={{ readonly: true, value: 42 }} />
 <Story name="Disabled" args={{ disabled: true }} />
 <Story name="Nullable" args={{ nullable: true }} />
+<Story name="BigInt">
+    <Input.Number label="BigInt" value={9007199254740993n} step="1" />
+</Story>

From 9de6a8fe28804608346c49688294439c0b79e554 Mon Sep 17 00:00:00 2001
From: Darshan <itznotabug@gmail.com>
Date: Sun, 25 Jan 2026 14:58:57 +0530
Subject: [PATCH 2/3] fix: bounds on bigint.

---
 v2/pink-sb/src/lib/input/Number.svelte        | 60 ++++++++++++++++++-
 v2/pink-sb/src/lib/input/bigint.ts            | 26 ++++++++
 .../src/stories/input/Number.stories.svelte   |  9 ++-
 3 files changed, 91 insertions(+), 4 deletions(-)

diff --git a/v2/pink-sb/src/lib/input/Number.svelte b/v2/pink-sb/src/lib/input/Number.svelte
index f68eabc0b9..933fcae199 100644
--- a/v2/pink-sb/src/lib/input/Number.svelte
+++ b/v2/pink-sb/src/lib/input/Number.svelte
@@ -4,7 +4,7 @@
     import Icon from '$lib/Icon.svelte';
     import { autofocusInput } from './autofocus.js';
     import { IconChevronUp, IconChevronDown } from '@appwrite.io/pink-icons-svelte';
-    import { parseBigIntStep, parseBigIntValue } from './bigint.js';
+    import { parseBigIntBound, parseBigIntStep, parseBigIntValue } from './bigint.js';
     import type { HTMLInputAttributes } from 'svelte/elements';
     import type { States } from './types.js';
     import { createEventDispatcher, type ComponentType } from 'svelte';
@@ -33,8 +33,13 @@
     export let autofocus: $$Props['autofocus'] = false;
     export let leadingIcon: $$Props['leadingIcon'] = undefined;
     export let step: $$Props['step'] = undefined;
+    export let min: $$Props['min'] | bigint = undefined;
+    export let max: $$Props['max'] | bigint = undefined;
 
     let bigintMode = false;
+    let minAttr: $$Props['min'] | null | undefined = undefined;
+    let maxAttr: $$Props['max'] | null | undefined = undefined;
+
     let input: HTMLInputElement;
     const dispatch = createEventDispatcher();
 
@@ -42,6 +47,33 @@
         bigintMode = typeof value === 'bigint';
     }
 
+    function toNumberInputBound(raw: $$Props['min'] | bigint): $$Props['min'] | undefined {
+        if (raw === null || raw === undefined) {
+            return raw;
+        }
+
+        if (typeof raw === 'bigint') {
+            const maxSafe = BigInt(Number.MAX_SAFE_INTEGER);
+
+            if (raw > maxSafe) {
+                return Number.MAX_SAFE_INTEGER;
+            }
+
+            const minSafe = BigInt(Number.MIN_SAFE_INTEGER);
+
+            if (raw < minSafe) {
+                return Number.MIN_SAFE_INTEGER;
+            }
+
+            return Number(raw);
+        }
+
+        return raw;
+    }
+
+    $: minAttr = bigintMode ? undefined : toNumberInputBound(min);
+    $: maxAttr = bigintMode ? undefined : toNumberInputBound(max);
+
     function fireOnChangeDispatch() {
         if (bigintMode) {
             const parsed = parseBigIntValue(value);
@@ -56,7 +88,17 @@
         if (bigintMode) {
             const stepValue = parseBigIntStep(step);
             const current = parseBigIntValue(value) ?? 0n;
-            const next = current + stepValue;
+            const minValue = parseBigIntBound(min);
+            const maxValue = parseBigIntBound(max);
+            let next = current + stepValue;
+
+            if (minValue !== null && next < minValue) {
+                next = minValue;
+            }
+
+            if (maxValue !== null && next > maxValue) {
+                next = maxValue;
+            }
 
             value = next.toString();
             fireOnChangeDispatch();
@@ -72,7 +114,17 @@
         if (bigintMode) {
             const stepValue = parseBigIntStep(step);
             const current = parseBigIntValue(value) ?? 0n;
-            const next = current - stepValue;
+            const minValue = parseBigIntBound(min);
+            const maxValue = parseBigIntBound(max);
+            let next = current - stepValue;
+
+            if (minValue !== null && next < minValue) {
+                next = minValue;
+            }
+
+            if (maxValue !== null && next > maxValue) {
+                next = maxValue;
+            }
 
             value = next.toString();
             fireOnChangeDispatch();
@@ -125,6 +177,8 @@
                     {disabled}
                     {readonly}
                     {required}
+                    min={minAttr}
+                    max={maxAttr}
                     {step}
                     {...$$restProps}
                     use:autofocusInput={autofocus}
diff --git a/v2/pink-sb/src/lib/input/bigint.ts b/v2/pink-sb/src/lib/input/bigint.ts
index f5e505cb34..bb2a1b4e29 100644
--- a/v2/pink-sb/src/lib/input/bigint.ts
+++ b/v2/pink-sb/src/lib/input/bigint.ts
@@ -37,7 +37,33 @@ export function parseBigIntValue(raw: unknown): bigint | null {
     return parseBigIntString(trimmed);
 }
 
+export function parseBigIntBound(raw: unknown): bigint | null {
+    if (raw === undefined || raw === null) {
+        return null;
+    }
+
+    if (typeof raw === 'bigint') {
+        return raw;
+    }
+
+    if (typeof raw === 'number') {
+        return Number.isFinite(raw) ? BigInt(Math.trunc(raw)) : null;
+    }
+
+    const trimmed = String(raw).trim();
+
+    if (trimmed === '') {
+        return null;
+    }
+
+    return parseBigIntString(trimmed);
+}
+
 export function parseBigIntStep(raw: unknown): bigint {
+    if (typeof raw === 'bigint') {
+        return raw === 0n ? defaultStep : raw;
+    }
+
     if (typeof raw === 'number') {
         if (!Number.isFinite(raw) || raw === 0) {
             return defaultStep;
diff --git a/v2/pink-sb/src/stories/input/Number.stories.svelte b/v2/pink-sb/src/stories/input/Number.stories.svelte
index 80cf14b4be..9cff72168b 100644
--- a/v2/pink-sb/src/stories/input/Number.stories.svelte
+++ b/v2/pink-sb/src/stories/input/Number.stories.svelte
@@ -36,5 +36,12 @@
 <Story name="Disabled" args={{ disabled: true }} />
 <Story name="Nullable" args={{ nullable: true }} />
 <Story name="BigInt">
-    <Input.Number label="BigInt" value={9007199254740993n} step="1" />
+    <Input.Number
+        label="BigInt"
+        helper="Min: 1, Max: 9007199254741001"
+        value={9007199254740993n}
+        step="2"
+        min={1}
+        max={9007199254741001n}
+    />
 </Story>

From b2b1cfe10ed1189442b1ede5bccb97acd4629690 Mon Sep 17 00:00:00 2001
From: Darshan <itznotabug@gmail.com>
Date: Sun, 25 Jan 2026 15:31:39 +0530
Subject: [PATCH 3/3] fix: types.

---
 v2/pink-sb/src/lib/input/Number.svelte | 23 ++++++++++++++---------
 1 file changed, 14 insertions(+), 9 deletions(-)

diff --git a/v2/pink-sb/src/lib/input/Number.svelte b/v2/pink-sb/src/lib/input/Number.svelte
index 933fcae199..e7b4ae0248 100644
--- a/v2/pink-sb/src/lib/input/Number.svelte
+++ b/v2/pink-sb/src/lib/input/Number.svelte
@@ -9,7 +9,10 @@
     import type { States } from './types.js';
     import { createEventDispatcher, type ComponentType } from 'svelte';
 
-    type $$Props = Omit<HTMLInputAttributes, 'type'> &
+    type NativeNumber = HTMLInputAttributes['value'];
+    type ExtendedNumber = NativeNumber | bigint;
+
+    type $$Props = Omit<HTMLInputAttributes, 'type' | 'min' | 'max' | 'value'> &
         Partial<{
             label: string;
             state: States;
@@ -17,15 +20,15 @@
             nullable: boolean;
             autofocus: boolean;
             leadingIcon?: ComponentType;
+            min: ExtendedNumber;
+            max: ExtendedNumber;
+            value: ExtendedNumber;
         }>;
 
-    type NumberValue = $$Props['value'] | bigint;
-
     export let state: States = 'default';
     export let nullable: $$Props['nullable'] = false;
     export let disabled: $$Props['disabled'] = false;
     export let id: $$Props['id'] = undefined;
-    export let value: NumberValue = undefined;
     export let label: $$Props['label'] = undefined;
     export let helper: $$Props['helper'] = undefined;
     export let readonly: $$Props['readonly'] = false;
@@ -33,12 +36,14 @@
     export let autofocus: $$Props['autofocus'] = false;
     export let leadingIcon: $$Props['leadingIcon'] = undefined;
     export let step: $$Props['step'] = undefined;
-    export let min: $$Props['min'] | bigint = undefined;
-    export let max: $$Props['max'] | bigint = undefined;
+
+    export let min: ExtendedNumber = undefined;
+    export let max: ExtendedNumber = undefined;
+    export let value: ExtendedNumber = undefined;
 
     let bigintMode = false;
-    let minAttr: $$Props['min'] | null | undefined = undefined;
-    let maxAttr: $$Props['max'] | null | undefined = undefined;
+    let minAttr: NativeNumber = undefined;
+    let maxAttr: NativeNumber = undefined;
 
     let input: HTMLInputElement;
     const dispatch = createEventDispatcher();
@@ -47,7 +52,7 @@
         bigintMode = typeof value === 'bigint';
     }
 
-    function toNumberInputBound(raw: $$Props['min'] | bigint): $$Props['min'] | undefined {
+    function toNumberInputBound(raw: ExtendedNumber): NativeNumber {
         if (raw === null || raw === undefined) {
             return raw;
         }