@synerise/ds-completed-within v0.6.19
id: completed-within
title: CompletedWithin
CompletedWithin UI Component
Installation
npm i @synerise/ds-completed-within
or
yarn add @synerise/ds-completed-within
Usage
import CompletedWithin from '@synerise/ds-completed-within'
<CompletedWithin
value={store.state.value}
onSetValue={handleSetValue}
/>
Demo
API
Property | Description | Type | Default |
---|---|---|---|
text | Custom labels and tooltips | CompletedWithinTexts | - |
value | Selected value | PeriodValue | { value: undefined, period: 'YEARS'} |
maxValue | Max value | PeriodValuevalue | Number.MAX_SAFE_INTEGER |
onSetValue | Function called when user has closed the settings with set value, and period | (value: PeriodValue) => void | - |
periods | Custom list of periods | CustomPeriod[] | - |
placeholder | Trigger button label | string | - |
tooltip | Content of tooltip | string | - |
readOnly | Whether value is editable | boolean | - |
CompletedWithinTexts
Property | Description | Type | Default |
---|---|---|---|
header | Header of settings | string \ React.ReactNode | Completed within |
completedLabel | Label of button with selected value | string \ React.ReactNode | Completed within |
clear | Clear button tooltip | string \ React.ReactNode | Clear |
periodPlaceholder | Placeholder of period select | string \ React.ReactNode | Interval |
PeriodValue
Property | Description | Type | Default |
---|---|---|---|
value | Numerical value | number \ undefined | undefined |
period | Period key, default options: SECONDS , MINUTES , HOURS , DAYS , MONTHS , YEARS | string \ undefined | undefined |
CustomPeriod
Property | Description | Type | Default |
---|---|---|---|
value | Key of custom period | string | - |
label | Label of custom period | string | - |
5 days ago
11 days ago
13 days ago
13 days ago
22 days ago
24 days ago
1 month ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
4 months ago
4 months ago
4 months ago
5 months ago
5 months ago
6 months ago
6 months ago
6 months ago
7 months ago
7 months ago
7 months ago
7 months ago
8 months ago
8 months ago
9 months ago
8 months ago
9 months ago
9 months ago
9 months ago
9 months ago
9 months ago
8 months ago
8 months ago
8 months ago
10 months ago
10 months ago
10 months ago
11 months ago
11 months ago
12 months ago
1 year ago
12 months ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
2 years ago
1 year ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
3 years ago
2 years ago
2 years ago
3 years ago
3 years ago
2 years ago
2 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago