Skip to content

Commit

Permalink
feat: add Calendar to landing
Browse files Browse the repository at this point in the history
  • Loading branch information
Arucard89 committed Jan 29, 2024
1 parent de3f765 commit 6451886
Show file tree
Hide file tree
Showing 4 changed files with 83 additions and 8 deletions.
44 changes: 43 additions & 1 deletion src/content/components/date-components/Calendar/index.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,49 @@
import dynamic from 'next/dynamic';
import {Repos} from 'src/types/common';

import {Component} from '../../types';
import {getGithubUrl, getReadmeUrl, mappingOptions} from '../../utils';

const getterOptions = {repoName: Repos.DateComponents, componentName: 'Calendar'};

export const calendarConfig: Component = {
id: 'calendar',
title: 'Calendar',
isComingSoon: true,
githubUrl: getGithubUrl(getterOptions),
content: {
readmeUrl: getReadmeUrl(getterOptions),
},
sandbox: {
component: dynamic(() =>
import('../examples/components/index').then((mod) => mod.CalendarExample),
),
props: {
size: {
type: 'radioButton',
values: mappingOptions(['m', 'l', 'xl']),
defaultValue: 'm',
},
mode: {
type: 'select',
values: mappingOptions(['days', 'months', 'quarters', 'years']),
},
disabled: {
type: 'switch',
defaultValue: false,
},
readOnly: {
type: 'switch',
defaultValue: false,
},
minValue: {
type: 'input',
},
maxValue: {
type: 'input',
},
focusedValue: {
type: 'input',
},
},
},
};
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
import {Calendar, CalendarProps} from '@gravity-ui/date-components';
import {DateTimeInput, dateTimeParse} from '@gravity-ui/date-utils';

type CalendarExampleProps = {
defaultValue?: DateTimeInput;
maxValue?: DateTimeInput;
minValue?: DateTimeInput;
defaultFocusedValue?: DateTimeInput;
focusedValue?: DateTimeInput;
} & Omit<
CalendarProps,
'defaultValue' | 'maxValue' | 'minValue' | 'defaultFocusedValue' | 'focusedValue'
>;

export const CalendarExample = ({
focusedValue,
defaultFocusedValue,
defaultValue,
maxValue,
minValue,
...otherProps
}: CalendarExampleProps) => {
const modes: CalendarProps['modes'] = {days: true, months: true, quarters: true, years: true};
return (
<Calendar
{...otherProps}
defaultFocusedValue={dateTimeParse(defaultFocusedValue)}
defaultValue={dateTimeParse(defaultValue)}
minValue={dateTimeParse(minValue)}
maxValue={dateTimeParse(maxValue)}
focusedValue={dateTimeParse(focusedValue)}
modes={modes}
/>
);
};
Original file line number Diff line number Diff line change
Expand Up @@ -13,16 +13,12 @@ export const DateFieldExample = ({
minValue,
...restProps
}: DateFieldExampleProps) => {
const parsedDefaultValue = defaultValue ? dateTimeParse(defaultValue) : undefined;
const parsedMaxValue = maxValue ? dateTimeParse(maxValue) : undefined;
const parsedMinValue = minValue ? dateTimeParse(minValue) : undefined;

return (
<DateField
{...restProps}
defaultValue={parsedDefaultValue}
maxValue={parsedMaxValue}
minValue={parsedMinValue}
defaultValue={dateTimeParse(defaultValue)}
maxValue={dateTimeParse(maxValue)}
minValue={dateTimeParse(minValue)}
/>
);
};
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
export * from './CalendarExample';
export * from './DateFieldExample';

0 comments on commit 6451886

Please sign in to comment.