@flightlesslabs/dodo-ui 0.22.2 → 0.23.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -9
- package/dist/index.d.ts +4 -0
- package/dist/index.js +4 -0
- package/package.json +20 -34
- package/src/lib/index.ts +5 -0
- package/src/lib/utils/time/date-creator/createDate/createDate.test.ts +109 -0
- package/src/lib/utils/time/date-creator/createDateFactory/createDateFactory.test.ts +146 -0
- package/dist/Home.mdx +0 -69
- package/dist/components/Form/Button/Button.stories.svelte +0 -178
- package/dist/components/Form/Button/Button.stories.svelte.d.ts +0 -22
- package/dist/components/Form/Checkbox/Checkbox.stories.svelte +0 -132
- package/dist/components/Form/Checkbox/Checkbox.stories.svelte.d.ts +0 -25
- package/dist/components/Form/DatePicker/DatePicker.stories.svelte +0 -139
- package/dist/components/Form/DatePicker/DatePicker.stories.svelte.d.ts +0 -22
- package/dist/components/Form/FormField/FormField.stories.svelte +0 -48
- package/dist/components/Form/FormField/FormField.stories.svelte.d.ts +0 -25
- package/dist/components/Form/InputEnclosure/InputEnclosure.stories.svelte +0 -166
- package/dist/components/Form/InputEnclosure/InputEnclosure.stories.svelte.d.ts +0 -22
- package/dist/components/Form/Label/Label.stories.svelte +0 -31
- package/dist/components/Form/Label/Label.stories.svelte.d.ts +0 -25
- package/dist/components/Form/RadioGroup/Radio/Radio.stories.svelte +0 -78
- package/dist/components/Form/RadioGroup/Radio/Radio.stories.svelte.d.ts +0 -25
- package/dist/components/Form/RadioGroup/RadioGroup.stories.svelte +0 -172
- package/dist/components/Form/RadioGroup/RadioGroup.stories.svelte.d.ts +0 -25
- package/dist/components/Form/Select/Select.stories.svelte +0 -175
- package/dist/components/Form/Select/Select.stories.svelte.d.ts +0 -22
- package/dist/components/Form/Switch/Switch.stories.svelte +0 -128
- package/dist/components/Form/Switch/Switch.stories.svelte.d.ts +0 -25
- package/dist/components/Form/TextInput/TextInput.stories.svelte +0 -162
- package/dist/components/Form/TextInput/TextInput.stories.svelte.d.ts +0 -22
- package/dist/components/Form/UtilityButton/UtilityButton.stories.svelte +0 -163
- package/dist/components/Form/UtilityButton/UtilityButton.stories.svelte.d.ts +0 -22
- package/dist/components/Info/Calendar/Calendar.stories.svelte +0 -134
- package/dist/components/Info/Calendar/Calendar.stories.svelte.d.ts +0 -22
- package/dist/components/Layout/Card/Card.stories.svelte +0 -113
- package/dist/components/Layout/Card/Card.stories.svelte.d.ts +0 -22
- package/dist/components/Layout/Grid/Column/Column.stories.svelte +0 -66
- package/dist/components/Layout/Grid/Column/Column.stories.svelte.d.ts +0 -22
- package/dist/components/Layout/Grid/Grid.stories.svelte +0 -192
- package/dist/components/Layout/Grid/Grid.stories.svelte.d.ts +0 -22
- package/dist/components/Layout/Grid/Row/Row.stories.svelte +0 -39
- package/dist/components/Layout/Grid/Row/Row.stories.svelte.d.ts +0 -22
- package/dist/components/Layout/Theme/Theme.stories.svelte +0 -54
- package/dist/components/Layout/Theme/Theme.stories.svelte.d.ts +0 -25
- package/dist/components/Layout/Theme/ThemeSystem/index.mdx +0 -35
- package/dist/storybook-types.d.ts +0 -129
- package/dist/storybook-types.js +0 -1
- package/dist/utils/time/date-creator/createDate/createDate.mdx +0 -98
- package/dist/utils/time/date-creator/createDateFactory/createDateFactory.mdx +0 -104
- package/dist/utils/time/timeout/timeout.mdx +0 -114
- package/src/lib/Home.mdx +0 -69
- package/src/lib/components/Form/Button/Button.stories.svelte +0 -178
- package/src/lib/components/Form/Checkbox/Checkbox.stories.svelte +0 -132
- package/src/lib/components/Form/DatePicker/DatePicker.stories.svelte +0 -139
- package/src/lib/components/Form/FormField/FormField.stories.svelte +0 -48
- package/src/lib/components/Form/InputEnclosure/InputEnclosure.stories.svelte +0 -166
- package/src/lib/components/Form/Label/Label.stories.svelte +0 -31
- package/src/lib/components/Form/RadioGroup/Radio/Radio.stories.svelte +0 -78
- package/src/lib/components/Form/RadioGroup/RadioGroup.stories.svelte +0 -172
- package/src/lib/components/Form/Select/Select.stories.svelte +0 -175
- package/src/lib/components/Form/Switch/Switch.stories.svelte +0 -128
- package/src/lib/components/Form/TextInput/TextInput.stories.svelte +0 -162
- package/src/lib/components/Form/UtilityButton/UtilityButton.stories.svelte +0 -163
- package/src/lib/components/Info/Calendar/Calendar.stories.svelte +0 -134
- package/src/lib/components/Layout/Card/Card.stories.svelte +0 -113
- package/src/lib/components/Layout/Grid/Column/Column.stories.svelte +0 -66
- package/src/lib/components/Layout/Grid/Grid.stories.svelte +0 -192
- package/src/lib/components/Layout/Grid/Row/Row.stories.svelte +0 -39
- package/src/lib/components/Layout/Theme/Theme.stories.svelte +0 -54
- package/src/lib/components/Layout/Theme/ThemeSystem/index.mdx +0 -35
- package/src/lib/storybook-types.ts +0 -182
- package/src/lib/utils/time/date-creator/createDate/createDate.mdx +0 -98
- package/src/lib/utils/time/date-creator/createDateFactory/createDateFactory.mdx +0 -104
- package/src/lib/utils/time/timeout/timeout.mdx +0 -114
|
@@ -1,182 +0,0 @@
|
|
|
1
|
-
type ControlType =
|
|
2
|
-
| 'object'
|
|
3
|
-
| 'boolean'
|
|
4
|
-
| 'check'
|
|
5
|
-
| 'inline-check'
|
|
6
|
-
| 'radio'
|
|
7
|
-
| 'inline-radio'
|
|
8
|
-
| 'select'
|
|
9
|
-
| 'multi-select'
|
|
10
|
-
| 'number'
|
|
11
|
-
| 'range'
|
|
12
|
-
| 'file'
|
|
13
|
-
| 'color'
|
|
14
|
-
| 'date'
|
|
15
|
-
| 'text';
|
|
16
|
-
|
|
17
|
-
interface ControlBase {
|
|
18
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
19
|
-
[key: string]: any;
|
|
20
|
-
/** @see https://storybook.js.org/docs/api/arg-types#controltype */
|
|
21
|
-
type?: ControlType;
|
|
22
|
-
disable?: boolean;
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
type Control =
|
|
26
|
-
| ControlType
|
|
27
|
-
| false
|
|
28
|
-
| (ControlBase &
|
|
29
|
-
(
|
|
30
|
-
| ControlBase
|
|
31
|
-
| {
|
|
32
|
-
type: 'color';
|
|
33
|
-
/** @see https://storybook.js.org/docs/api/arg-types#controlpresetcolors */
|
|
34
|
-
presetColors?: string[];
|
|
35
|
-
}
|
|
36
|
-
| {
|
|
37
|
-
type: 'file';
|
|
38
|
-
/** @see https://storybook.js.org/docs/api/arg-types#controlaccept */
|
|
39
|
-
accept?: string;
|
|
40
|
-
}
|
|
41
|
-
| {
|
|
42
|
-
type: 'inline-check' | 'radio' | 'inline-radio' | 'select' | 'multi-select';
|
|
43
|
-
/** @see https://storybook.js.org/docs/api/arg-types#controllabels */
|
|
44
|
-
labels?: {
|
|
45
|
-
[options: string]: string;
|
|
46
|
-
};
|
|
47
|
-
}
|
|
48
|
-
| {
|
|
49
|
-
type: 'number' | 'range';
|
|
50
|
-
/** @see https://storybook.js.org/docs/api/arg-types#controlmax */
|
|
51
|
-
max?: number;
|
|
52
|
-
/** @see https://storybook.js.org/docs/api/arg-types#controlmin */
|
|
53
|
-
min?: number;
|
|
54
|
-
/** @see https://storybook.js.org/docs/api/arg-types#controlstep */
|
|
55
|
-
step?: number;
|
|
56
|
-
}
|
|
57
|
-
));
|
|
58
|
-
|
|
59
|
-
type ConditionalTest =
|
|
60
|
-
| {
|
|
61
|
-
truthy?: boolean;
|
|
62
|
-
}
|
|
63
|
-
| {
|
|
64
|
-
exists: boolean;
|
|
65
|
-
}
|
|
66
|
-
| {
|
|
67
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
68
|
-
eq: any;
|
|
69
|
-
}
|
|
70
|
-
| {
|
|
71
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
72
|
-
neq: any;
|
|
73
|
-
};
|
|
74
|
-
type ConditionalValue =
|
|
75
|
-
| {
|
|
76
|
-
arg: string;
|
|
77
|
-
}
|
|
78
|
-
| {
|
|
79
|
-
global: string;
|
|
80
|
-
};
|
|
81
|
-
type Conditional = ConditionalValue & ConditionalTest;
|
|
82
|
-
|
|
83
|
-
interface Args {
|
|
84
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
85
|
-
[name: string]: any;
|
|
86
|
-
}
|
|
87
|
-
|
|
88
|
-
interface SBBaseType {
|
|
89
|
-
required?: boolean;
|
|
90
|
-
raw?: string;
|
|
91
|
-
}
|
|
92
|
-
type SBScalarType = SBBaseType & {
|
|
93
|
-
name: 'boolean' | 'string' | 'number' | 'function' | 'symbol';
|
|
94
|
-
};
|
|
95
|
-
type SBArrayType = SBBaseType & {
|
|
96
|
-
name: 'array';
|
|
97
|
-
value: SBType;
|
|
98
|
-
};
|
|
99
|
-
type SBObjectType = SBBaseType & {
|
|
100
|
-
name: 'object';
|
|
101
|
-
value: Record<string, SBType>;
|
|
102
|
-
};
|
|
103
|
-
type SBEnumType = SBBaseType & {
|
|
104
|
-
name: 'enum';
|
|
105
|
-
value: (string | number)[];
|
|
106
|
-
};
|
|
107
|
-
type SBIntersectionType = SBBaseType & {
|
|
108
|
-
name: 'intersection';
|
|
109
|
-
value: SBType[];
|
|
110
|
-
};
|
|
111
|
-
type SBUnionType = SBBaseType & {
|
|
112
|
-
name: 'union';
|
|
113
|
-
value: SBType[];
|
|
114
|
-
};
|
|
115
|
-
type SBOtherType = SBBaseType & {
|
|
116
|
-
name: 'other';
|
|
117
|
-
value: string;
|
|
118
|
-
};
|
|
119
|
-
|
|
120
|
-
type SBType =
|
|
121
|
-
| SBScalarType
|
|
122
|
-
| SBEnumType
|
|
123
|
-
| SBArrayType
|
|
124
|
-
| SBObjectType
|
|
125
|
-
| SBIntersectionType
|
|
126
|
-
| SBUnionType
|
|
127
|
-
| SBOtherType;
|
|
128
|
-
|
|
129
|
-
interface InputType {
|
|
130
|
-
/** @see https://storybook.js.org/docs/api/arg-types#control */
|
|
131
|
-
control?: Control;
|
|
132
|
-
/** @see https://storybook.js.org/docs/api/arg-types#description */
|
|
133
|
-
description?: string;
|
|
134
|
-
/** @see https://storybook.js.org/docs/api/arg-types#if */
|
|
135
|
-
if?: Conditional;
|
|
136
|
-
/** @see https://storybook.js.org/docs/api/arg-types#mapping */
|
|
137
|
-
mapping?: {
|
|
138
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
139
|
-
[key: string]: any;
|
|
140
|
-
};
|
|
141
|
-
/** @see https://storybook.js.org/docs/api/arg-types#name */
|
|
142
|
-
name?: string;
|
|
143
|
-
/** @see https://storybook.js.org/docs/api/arg-types#options */
|
|
144
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
145
|
-
options?: readonly any[];
|
|
146
|
-
/** @see https://storybook.js.org/docs/api/arg-types#table */
|
|
147
|
-
table?: {
|
|
148
|
-
[key: string]: unknown;
|
|
149
|
-
/** @see https://storybook.js.org/docs/api/arg-types#tablecategory */
|
|
150
|
-
category?: string;
|
|
151
|
-
/** @see https://storybook.js.org/docs/api/arg-types#tabledefaultvalue */
|
|
152
|
-
defaultValue?: {
|
|
153
|
-
summary?: string;
|
|
154
|
-
detail?: string;
|
|
155
|
-
};
|
|
156
|
-
/** @see https://storybook.js.org/docs/api/arg-types#tabledisable */
|
|
157
|
-
disable?: boolean;
|
|
158
|
-
/** @see https://storybook.js.org/docs/api/arg-types#tablesubcategory */
|
|
159
|
-
subcategory?: string;
|
|
160
|
-
/** @see https://storybook.js.org/docs/api/arg-types#tabletype */
|
|
161
|
-
type?: {
|
|
162
|
-
summary?: string;
|
|
163
|
-
detail?: string;
|
|
164
|
-
};
|
|
165
|
-
};
|
|
166
|
-
/** @see https://storybook.js.org/docs/api/arg-types#type */
|
|
167
|
-
type?: SBType | SBScalarType['name'];
|
|
168
|
-
/**
|
|
169
|
-
* @deprecated Use `table.defaultValue.summary` instead.
|
|
170
|
-
* @see https://storybook.js.org/docs/api/arg-types#defaultvalue
|
|
171
|
-
*/
|
|
172
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
173
|
-
defaultValue?: any;
|
|
174
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
175
|
-
[key: string]: any;
|
|
176
|
-
}
|
|
177
|
-
|
|
178
|
-
export type ArgTypes<TArgs = Args> = {
|
|
179
|
-
[name in keyof TArgs]: InputType;
|
|
180
|
-
};
|
|
181
|
-
|
|
182
|
-
export type StoryBookArgTypes = Partial<ArgTypes<Args>>;
|
|
@@ -1,98 +0,0 @@
|
|
|
1
|
-
# createDate
|
|
2
|
-
|
|
3
|
-
A centralized date factory built on top of `dayjs`.
|
|
4
|
-
|
|
5
|
-
This utility ensures **consistent parsing, timezone handling, and validation** across your application.
|
|
6
|
-
|
|
7
|
-
## 📦 Import
|
|
8
|
-
|
|
9
|
-
```ts
|
|
10
|
-
import { createDate } from '@flightlesslabs/dodo-ui';
|
|
11
|
-
```
|
|
12
|
-
|
|
13
|
-
## 🚀 Basic Usage
|
|
14
|
-
|
|
15
|
-
### Current Date
|
|
16
|
-
|
|
17
|
-
```ts
|
|
18
|
-
const now = createDate();
|
|
19
|
-
console.log(now.format());
|
|
20
|
-
```
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
### Parse a Date
|
|
24
|
-
|
|
25
|
-
```ts
|
|
26
|
-
const date = createDate("01-02-2025", "DD-MM-YYYY");
|
|
27
|
-
console.log(date.format());
|
|
28
|
-
```
|
|
29
|
-
|
|
30
|
-
## 🌍 Timezone & UTC
|
|
31
|
-
|
|
32
|
-
### UTC Mode
|
|
33
|
-
|
|
34
|
-
```ts
|
|
35
|
-
const utcDate = createDate("2025-01-01T12:00:00Z", undefined, {
|
|
36
|
-
utc: true,
|
|
37
|
-
});
|
|
38
|
-
```
|
|
39
|
-
|
|
40
|
-
### Timezone Conversion
|
|
41
|
-
|
|
42
|
-
```ts
|
|
43
|
-
const indiaTime = createDate("01-01-2025", "DD-MM-YYYY", {
|
|
44
|
-
timezone: "Asia/Kolkata",
|
|
45
|
-
});
|
|
46
|
-
```
|
|
47
|
-
|
|
48
|
-
## ⚙️ Options
|
|
49
|
-
|
|
50
|
-
```ts
|
|
51
|
-
interface CreateDateOptions {
|
|
52
|
-
timezone?: string;
|
|
53
|
-
utc?: boolean;
|
|
54
|
-
strict?: boolean;
|
|
55
|
-
throwOnInvalid?: boolean;
|
|
56
|
-
}
|
|
57
|
-
```
|
|
58
|
-
|
|
59
|
-
## 🔁 Behavior Priority
|
|
60
|
-
|
|
61
|
-
1. utc (highest priority)
|
|
62
|
-
2. timezone
|
|
63
|
-
3. local
|
|
64
|
-
|
|
65
|
-
---
|
|
66
|
-
|
|
67
|
-
### timezone
|
|
68
|
-
|
|
69
|
-
- IANA timezone string
|
|
70
|
-
- Interprets input in given timezone
|
|
71
|
-
|
|
72
|
-
---
|
|
73
|
-
|
|
74
|
-
### utc
|
|
75
|
-
|
|
76
|
-
- Forces UTC mode
|
|
77
|
-
|
|
78
|
-
---
|
|
79
|
-
|
|
80
|
-
### strict
|
|
81
|
-
|
|
82
|
-
- Only applies when format is provided
|
|
83
|
-
- Has no effect on ISO / timestamps
|
|
84
|
-
|
|
85
|
-
---
|
|
86
|
-
|
|
87
|
-
### throwOnInvalid
|
|
88
|
-
|
|
89
|
-
- Throws error if date is invalid
|
|
90
|
-
|
|
91
|
-
---
|
|
92
|
-
|
|
93
|
-
## 📥 Supported Inputs
|
|
94
|
-
|
|
95
|
-
- string
|
|
96
|
-
- number (timestamp)
|
|
97
|
-
- Date object
|
|
98
|
-
- undefined
|
|
@@ -1,104 +0,0 @@
|
|
|
1
|
-
# createDateFactory
|
|
2
|
-
|
|
3
|
-
A **factory function** that creates a `createDate` utility with an optional custom `dayjs` instance.
|
|
4
|
-
|
|
5
|
-
This allows advanced users to:
|
|
6
|
-
|
|
7
|
-
- Inject their own configured `dayjs`
|
|
8
|
-
- Share plugins across multiple libraries
|
|
9
|
-
- Avoid global `dayjs.extend` pollution
|
|
10
|
-
- Create isolated date environments
|
|
11
|
-
|
|
12
|
-
---
|
|
13
|
-
|
|
14
|
-
## 📦 Import
|
|
15
|
-
|
|
16
|
-
```ts
|
|
17
|
-
import { createDateFactory } from '@flightlesslabs/dodo-ui';
|
|
18
|
-
```
|
|
19
|
-
|
|
20
|
-
---
|
|
21
|
-
|
|
22
|
-
## 🚀 Basic Usage
|
|
23
|
-
|
|
24
|
-
### Default Factory
|
|
25
|
-
|
|
26
|
-
```ts
|
|
27
|
-
import { createDateFactory } from '@flightlesslabs/dodo-ui';
|
|
28
|
-
|
|
29
|
-
const { createDate } = createDateFactory();
|
|
30
|
-
|
|
31
|
-
const now = createDate();
|
|
32
|
-
console.log(now.format());
|
|
33
|
-
```
|
|
34
|
-
|
|
35
|
-
---
|
|
36
|
-
|
|
37
|
-
## 🧠 Why Use a Factory?
|
|
38
|
-
|
|
39
|
-
Instead of relying on global `dayjs.extend`, you can:
|
|
40
|
-
|
|
41
|
-
- isolate plugin setups
|
|
42
|
-
- avoid conflicts in monorepos
|
|
43
|
-
- support multiple configurations
|
|
44
|
-
- improve testability
|
|
45
|
-
|
|
46
|
-
---
|
|
47
|
-
|
|
48
|
-
## 🔌 Custom Dayjs Instance
|
|
49
|
-
|
|
50
|
-
### Inject your own configured instance
|
|
51
|
-
|
|
52
|
-
```ts
|
|
53
|
-
import dayjs from 'dayjs';
|
|
54
|
-
import utc from 'dayjs/plugin/utc';
|
|
55
|
-
import timezone from 'dayjs/plugin/timezone';
|
|
56
|
-
|
|
57
|
-
dayjs.extend(utc);
|
|
58
|
-
dayjs.extend(timezone);
|
|
59
|
-
|
|
60
|
-
const { createDate } = createDateFactory(dayjs);
|
|
61
|
-
|
|
62
|
-
const date = createDate("2025-01-01", "YYYY-MM-DD");
|
|
63
|
-
```
|
|
64
|
-
|
|
65
|
-
---
|
|
66
|
-
|
|
67
|
-
## ⚙️ Behavior
|
|
68
|
-
|
|
69
|
-
The factory wraps your `dayjs` instance and preserves:
|
|
70
|
-
|
|
71
|
-
- UTC handling
|
|
72
|
-
- Timezone support
|
|
73
|
-
- Strict parsing
|
|
74
|
-
- Validation options
|
|
75
|
-
|
|
76
|
-
---
|
|
77
|
-
|
|
78
|
-
## 🔁 Priority Order
|
|
79
|
-
|
|
80
|
-
1. utc (highest priority)
|
|
81
|
-
2. timezone
|
|
82
|
-
3. local parsing
|
|
83
|
-
|
|
84
|
-
---
|
|
85
|
-
|
|
86
|
-
## 📥 Returned API
|
|
87
|
-
|
|
88
|
-
```ts
|
|
89
|
-
{
|
|
90
|
-
createDate: Function,
|
|
91
|
-
dayjs: DayjsInstance
|
|
92
|
-
}
|
|
93
|
-
```
|
|
94
|
-
|
|
95
|
-
## 🧪 Example: Multiple Factories
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
```ts
|
|
99
|
-
const factoryA = createDateFactory(dayjsA);
|
|
100
|
-
const factoryB = createDateFactory(dayjsB);
|
|
101
|
-
|
|
102
|
-
factoryA.createDate("2025-01-01");
|
|
103
|
-
factoryB.createDate("2025-01-01");
|
|
104
|
-
```
|
|
@@ -1,114 +0,0 @@
|
|
|
1
|
-
# timeout
|
|
2
|
-
|
|
3
|
-
A simple utility to delay execution using Promises.
|
|
4
|
-
|
|
5
|
-
Useful for **pausing async workflows**, **simulating delays**, or **controlling execution timing**.
|
|
6
|
-
|
|
7
|
-
---
|
|
8
|
-
|
|
9
|
-
## 📦 Import
|
|
10
|
-
|
|
11
|
-
```ts
|
|
12
|
-
import { timeout } from '@flightlesslabs/dodo-ui';
|
|
13
|
-
```
|
|
14
|
-
|
|
15
|
-
---
|
|
16
|
-
|
|
17
|
-
## 🚀 Basic Usage
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
```ts
|
|
22
|
-
await timeout(1000); // waits 1 second
|
|
23
|
-
```
|
|
24
|
-
|
|
25
|
-
---
|
|
26
|
-
|
|
27
|
-
## 🎯 Resolve with Value
|
|
28
|
-
|
|
29
|
-
You can optionally pass a value that will be returned after the delay.
|
|
30
|
-
|
|
31
|
-
```ts
|
|
32
|
-
const result = await timeout(500, "done");
|
|
33
|
-
|
|
34
|
-
console.log(result); // "done"
|
|
35
|
-
```
|
|
36
|
-
|
|
37
|
-
---
|
|
38
|
-
|
|
39
|
-
## ⚙️ API
|
|
40
|
-
|
|
41
|
-
```ts
|
|
42
|
-
function timeout<T = void>(
|
|
43
|
-
milliseconds: number,
|
|
44
|
-
value?: T
|
|
45
|
-
): Promise<T>
|
|
46
|
-
```
|
|
47
|
-
|
|
48
|
-
---
|
|
49
|
-
|
|
50
|
-
### `milliseconds`
|
|
51
|
-
|
|
52
|
-
- Time to wait before resolving (in ms)
|
|
53
|
-
- Must be `>= 0`
|
|
54
|
-
|
|
55
|
-
---
|
|
56
|
-
|
|
57
|
-
### `value`
|
|
58
|
-
|
|
59
|
-
- Optional value to resolve with
|
|
60
|
-
- Defaults to `undefined`
|
|
61
|
-
|
|
62
|
-
---
|
|
63
|
-
|
|
64
|
-
## ⚠️ Error Handling
|
|
65
|
-
|
|
66
|
-
If a negative duration is provided, the promise will reject:
|
|
67
|
-
|
|
68
|
-
```ts
|
|
69
|
-
await timeout(-1); // ❌ throws Error
|
|
70
|
-
```
|
|
71
|
-
|
|
72
|
-
---
|
|
73
|
-
|
|
74
|
-
## 🧠 Use Cases
|
|
75
|
-
|
|
76
|
-
- Delay execution in async functions
|
|
77
|
-
- Simulate API latency in tests
|
|
78
|
-
- Simple throttling or pacing logic
|
|
79
|
-
|
|
80
|
-
---
|
|
81
|
-
|
|
82
|
-
## 🔍 Examples
|
|
83
|
-
|
|
84
|
-
### Async Flow
|
|
85
|
-
|
|
86
|
-
```ts
|
|
87
|
-
async function run() {
|
|
88
|
-
console.log("Start");
|
|
89
|
-
|
|
90
|
-
await timeout(1000);
|
|
91
|
-
|
|
92
|
-
console.log("End");
|
|
93
|
-
}
|
|
94
|
-
```
|
|
95
|
-
|
|
96
|
-
---
|
|
97
|
-
|
|
98
|
-
### With Data
|
|
99
|
-
|
|
100
|
-
<Source
|
|
101
|
-
dark
|
|
102
|
-
language="ts"
|
|
103
|
-
code={`
|
|
104
|
-
const data = await timeout(300, { success: true });
|
|
105
|
-
|
|
106
|
-
console.log(data.success); // true
|
|
107
|
-
`}
|
|
108
|
-
/>
|
|
109
|
-
|
|
110
|
-
```ts
|
|
111
|
-
const data = await timeout(300, { success: true });
|
|
112
|
-
|
|
113
|
-
console.log(data.success); // true
|
|
114
|
-
```
|