norma-library
Version:
Olos/Norma-DS. Design System based on Material UI, developed with TypeScript and Styled Components to create reusable and consistent components in web applications.
61 lines • 2.67 kB
JavaScript
import React from 'react';
import { DemoContainer } from '@mui/x-date-pickers/internals/demo';
import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
import { TimePicker as MuiTimePicker } from '@mui/x-date-pickers/TimePicker';
import { MobileTimePicker as MuiMobileTimePicker } from '@mui/x-date-pickers/MobileTimePicker';
import { DesktopTimePicker as MuiDesktopTimePicker } from '@mui/x-date-pickers/DesktopTimePicker';
import { styled } from '@mui/material/styles';
import 'dayjs/locale/pt-br';
import 'dayjs/locale/en';
import 'dayjs/locale/es';
import dayjs from 'dayjs';
import utc from 'dayjs/plugin/utc';
import timezone from 'dayjs/plugin/timezone';
import 'dayjs/locale/pt-br';
import 'dayjs/locale/en';
import 'dayjs/locale/es';
dayjs.extend(utc);
dayjs.extend(timezone);
var MuiTimePickerStyled = styled(MuiTimePicker)({
'& .MuiOutlinedInput-notchedOutline': {
border: 'none',
borderRadius: 0,
borderBottom: '1px solid #666666',
},
'& .MuiFormLabel-root': {
backgroundColor: '#fff',
padding: '0 5px',
},
});
var MuiMobileTimePickerStyled = styled(MuiMobileTimePicker)({
'& .MuiOutlinedInput-notchedOutline': {
border: 'none',
borderRadius: 0,
borderBottom: '1px solid #666666',
},
'& .MuiFormLabel-root': {
backgroundColor: '#fff',
padding: '0 5px',
},
});
var MuiDesktopTimePickerStyled = styled(MuiDesktopTimePicker)({
'& .MuiOutlinedInput-notchedOutline': {
border: 'none',
borderRadius: 0,
borderBottom: '1px solid #666666',
},
'& .MuiFormLabel-root': {
backgroundColor: '#fff',
padding: '0 5px',
},
});
export var TimePicker = function (_a) {
var label = _a.label, _b = _a.timezone, timezone = _b === void 0 ? 'America/Sao_Paulo' : _b, _c = _a.language, language = _c === void 0 ? 'pt-br' : _c, _d = _a.variant, variant = _d === void 0 ? 'desktop' : _d;
return (React.createElement(LocalizationProvider, { dateAdapter: AdapterDayjs, adapterLocale: language },
React.createElement(DemoContainer, { components: ['TimePicker', 'MobileTimePicker', 'DesktopTimePicker'] },
variant === 'responsive' && React.createElement(MuiTimePickerStyled, { label: label, timezone: timezone }),
variant === 'mobile' && React.createElement(MuiMobileTimePickerStyled, { label: label, timezone: timezone }),
variant === 'desktop' && React.createElement(MuiDesktopTimePickerStyled, { label: label, timezone: timezone }))));
};
//# sourceMappingURL=TimePicker.js.map