@via-profit/ui-kit 0.1.8 → 0.2.1-alpha.3

package/Calendar/CalendarMonthCell.js

@@ -30,11 +30,6 @@ const Btn = (0, styled_1.default)(Button_1.default) `
 const CalendarMonthCell = (props, ref) => {
     const { children, isSelected, accentColor } = props, restProps = __rest(props, ["children", "isSelected", "accentColor"]);
     const myRef = react_1.default.useRef(null);
-    react_1.default.useEffect(() => {
-        if (isSelected && myRef.current) {
-            myRef.current.scrollIntoView({ behavior: 'instant' });
-        }
-    }, [isSelected]);
     return (react_1.default.createElement(Btn, Object.assign({}, restProps, { type: "button", variant: isSelected ? 'standard' : 'plain', color: isSelected ? accentColor : 'default', ref: el => {
             if (typeof ref === 'function') {
                 ref(el);

package/Calendar/CalendarSubheading.js

@@ -17,10 +17,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const styled_1 = __importDefault(require("@emotion/styled"));
 const StyledCalendarSubheading = styled_1.default.div `
-  font-weight: 200;
+  font-weight: 400;
   font-size: 1em;
-  opacity: 0.6;
+  opacity: 0.8;
   margin-bottom: 1em;
+  text-align: center;
 `;
 const CalendarSubheading = (props, ref) => {
     const { children } = props, restProps = __rest(props, ["children"]);

package/Calendar/CalendarWeekDayCell.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+export interface CalendarWeekCellProps extends React.HTMLAttributes<HTMLSpanElement> {
+    /**
+     * if cell day is today, then property will be true
+     */
+    readonly isToday?: boolean;
+    readonly inCurrentMonth?: boolean;
+}
+declare const _default: React.ForwardRefExoticComponent<CalendarWeekCellProps & React.RefAttributes<HTMLSpanElement>>;
+export default _default;

package/Calendar/CalendarWeekDayCell.js

@@ -0,0 +1,32 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const react_2 = require("@emotion/react");
+const CalendarEmptyCell_1 = __importDefault(require("./CalendarEmptyCell"));
+const Cell = (0, styled_1.default)(CalendarEmptyCell_1.default) `
+  color: currentColor;
+  ${({ $inCurrentMonth }) => !$inCurrentMonth &&
+    (0, react_2.css) `
+      opacity: 0.5;
+    `}
+`;
+const CalendarWeekDayCell = (props, ref) => {
+    const { isToday, children, inCurrentMonth } = props, restProps = __rest(props, ["isToday", "children", "inCurrentMonth"]);
+    return (react_1.default.createElement(Cell, Object.assign({}, restProps, { "$isToday": isToday, "$inCurrentMonth": inCurrentMonth, ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(CalendarWeekDayCell);

package/Calendar/CalendarWeekDayWeekNumber.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { Week } from './use-calendar';
+export interface CalendarWeekDayWeekNumberProps extends React.HTMLAttributes<HTMLSpanElement> {
+    readonly week: Week;
+}
+declare const _default: React.ForwardRefExoticComponent<CalendarWeekDayWeekNumberProps & React.RefAttributes<HTMLSpanElement>>;
+export default _default;

package/Calendar/CalendarWeekDayWeekNumber.js

@@ -0,0 +1,38 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const CalendarEmptyCell_1 = __importDefault(require("./CalendarEmptyCell"));
+const Cell = (0, styled_1.default)(CalendarEmptyCell_1.default) `
+  font-weight: 800;
+  position: relative;
+  color: ${({ theme }) => theme.color.textPrimary.toString()};
+  &:before {
+    position: absolute;
+    content: '';
+    width: 1px;
+    right: 0;
+    top: 30%;
+    bottom: 30%;
+    background-color: currentColor;
+  }
+`;
+const CalendarWeekDayWeekNumber = (props, ref) => {
+    const { week, children } = props, restProps = __rest(props, ["week", "children"]);
+    return (react_1.default.createElement(Cell, Object.assign({}, restProps, { ref: ref }), children));
+};
+exports.default = react_1.default.forwardRef(CalendarWeekDayWeekNumber);

package/Calendar/CalendarWeekRow.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-export type CalendarWeekRowProps = React.HTMLAttributes<HTMLDivElement>;
-declare const _default: React.ForwardRefExoticComponent<CalendarWeekRowProps & React.RefAttributes<HTMLDivElement>>;
+export type CalendarWeekRowProps = React.HTMLAttributes<HTMLSpanElement>;
+declare const _default: React.ForwardRefExoticComponent<CalendarWeekRowProps & React.RefAttributes<HTMLSpanElement>>;
 export default _default;

package/Calendar/CalendarWeekRow.js

@@ -16,11 +16,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const styled_1 = __importDefault(require("@emotion/styled"));
-const StyledCalendarWeekRow = styled_1.default.div `
+const StyledCalendarWeekRow = styled_1.default.span `
   display: flex;
   flex-direction: row;
   justify-content: center;
   align-items: stretch;
+  color: inherit;
 `;
 const CalendarWeekRow = (props, ref) => {
     const { children } = props, restProps = __rest(props, ["children"]);

package/Calendar/CalendarWeekRowButton.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { Week } from './use-calendar';
+export type CalendarWeekRowButtonProps = React.HTMLAttributes<HTMLButtonElement> & {
+    readonly isSelected?: boolean;
+    readonly accentColor: string;
+    readonly week: Week;
+};
+declare const _default: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLButtonElement> & {
+    readonly isSelected?: boolean | undefined;
+    readonly accentColor: string;
+    readonly week: Week;
+} & React.RefAttributes<HTMLButtonElement>>;
+export default _default;

package/Calendar/CalendarWeekRowButton.js

@@ -0,0 +1,31 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const styled_1 = __importDefault(require("@emotion/styled"));
+const Button_1 = __importDefault(require("../Button"));
+const CalendarWeekRow_1 = __importDefault(require("./CalendarWeekRow"));
+const StyleButton = (0, styled_1.default)(Button_1.default) `
+  padding: 0.2em 0.5em !important;
+  font-size: 1em;
+  border-radius: ${({ theme }) => theme.shape.radiusFactor * 3}em;
+`;
+const CalendarWeekRowButton = (props, ref) => {
+    const { children, isSelected, accentColor } = props, restProps = __rest(props, ["children", "isSelected", "accentColor"]);
+    return (react_1.default.createElement(StyleButton, Object.assign({ type: "button", variant: isSelected ? 'standard' : 'plain', color: isSelected ? accentColor : 'default' }, restProps, { ref: ref }),
+        react_1.default.createElement(CalendarWeekRow_1.default, null, children)));
+};
+exports.default = react_1.default.forwardRef(CalendarWeekRowButton);

package/Calendar/CalendarYearCell.js

@@ -30,11 +30,11 @@ const Btn = (0, styled_1.default)(Button_1.default) `
 const CalendarYearCell = (props, ref) => {
     const { children, isSelected, accentColor } = props, restProps = __rest(props, ["children", "isSelected", "accentColor"]);
     const myRef = react_1.default.useRef(null);
-    react_1.default.useEffect(() => {
-        if (isSelected && myRef.current) {
-            myRef.current.scrollIntoView({ behavior: 'instant' });
-        }
-    }, [isSelected]);
+    // React.useEffect(() => {
+    //   if (isSelected && myRef.current) {
+    //     myRef.current.scrollIntoView({ behavior: 'instant' });
+    //   }
+    // }, [isSelected]);
     return (react_1.default.createElement(Btn, Object.assign({}, restProps, { type: "button", variant: isSelected ? 'standard' : 'plain', color: isSelected ? accentColor : 'default', ref: el => {
             if (typeof ref === 'function') {
                 ref(el);

package/Calendar/CalendarYearsSelector.d.ts

@@ -1,4 +1,42 @@
 import React from 'react';
-export type CalendarYearsSelectorProps = React.HTMLAttributes<HTMLDivElement>;
+import { CalendarYearCellProps } from './CalendarYearCell';
+export type CalendarYearsSelectorProps = {
+    readonly years: readonly number[];
+    /**
+     * Cell accent color
+     */
+    readonly accentColor: 'primary' | 'secondary' | string;
+    /**
+     * calendar locale
+     */
+    readonly locale: string;
+    /**
+     * Calendar date
+     */
+    readonly date: Date;
+    /**
+     * Minimum date limit
+  
+     */
+    readonly minDate: Date;
+    /**
+     * Maximum date limit
+     */
+    readonly maxDate: Date;
+    /**
+     * Selected year callback
+     */
+    readonly onChange: (year: number) => void;
+    /**
+     * Overridable components map
+     */
+    readonly overrides?: CalendarYearsSelectorOverrides;
+};
+export type CalendarYearsSelectorOverrides = {
+    /**
+     * Year cell element in years list
+     */
+    readonly YearCell?: React.ComponentType<CalendarYearCellProps & React.RefAttributes<HTMLButtonElement>>;
+};
 declare const _default: React.ForwardRefExoticComponent<CalendarYearsSelectorProps & React.RefAttributes<HTMLDivElement>>;
 export default _default;

package/Calendar/CalendarYearsSelector.js

@@ -1,30 +1,66 @@
 "use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const styled_1 = __importDefault(require("@emotion/styled"));
+const CalendarYearCell_1 = __importDefault(require("./CalendarYearCell"));
+const use_calendar_1 = __importDefault(require("./use-calendar"));
+const VirtualizedList_1 = __importDefault(require("../Menu/VirtualizedList"));
 const SelectorContainer = styled_1.default.div `
-  flex: 1;
   display: flex;
-  flex-wrap: wrap;
-  overflow-y: auto;
+  flex: 1;
   padding: 0.8em;
+  height: 100%;
+  width: 100%;
+`;
+const SelectorContainerInner = styled_1.default.div `
+  flex: 1;
+  position: relative;
+`;
+const Chunk = styled_1.default.div `
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
 `;
 const CalendarYearsSelector = (props, ref) => {
-    const { children } = props, restProps = __rest(props, ["children"]);
-    return (react_1.default.createElement(SelectorContainer, Object.assign({}, restProps, { ref: ref }), children));
+    const containerRef = react_1.default.useRef(null);
+    const { years, date, overrides, accentColor = 'primary', locale = 'ru-RU', minDate, maxDate, onChange, } = props;
+    const [maxHeight, setMaxHeight] = react_1.default.useState(undefined);
+    const overridesMap = react_1.default.useMemo(() => ({
+        YearCell: (overrides === null || overrides === void 0 ? void 0 : overrides.YearCell) || CalendarYearCell_1.default,
+    }), [overrides]);
+    const { getYearLabel } = (0, use_calendar_1.default)({
+        locale,
+        minDate,
+        maxDate,
+        weekStartDay: 'monday',
+        displayLeadingZero: false,
+    });
+    const items2 = react_1.default.useMemo(() => {
+        const list = [];
+        for (let i = 0; i < years.length; i += 3) {
+            list.push(years.slice(i, i + 3).map(year => {
+                const item = {
+                    value: year,
+                    label: getYearLabel(new Date(year, date.getMonth(), date.getDate(), 0, 0, 0, 0)),
+                };
+                return item;
+            }));
+        }
+        return list;
+    }, [date, getYearLabel, years]);
+    react_1.default.useLayoutEffect(() => {
+        if (containerRef.current) {
+            setMaxHeight(containerRef.current.getBoundingClientRect().height);
+        }
+    }, []);
+    const renderItem = react_1.default.useCallback((item) => (react_1.default.createElement(Chunk, null, item.map(item => {
+        const isSelected = date.getFullYear() === item.value;
+        return (react_1.default.createElement(overridesMap.YearCell, { key: item.value, accentColor: accentColor, isSelected: isSelected, onClick: () => onChange(item.value) }, item.label));
+    }))), [accentColor, date, onChange, overridesMap]);
+    return (react_1.default.createElement(SelectorContainer, { ref: ref },
+        react_1.default.createElement(SelectorContainerInner, { ref: containerRef }, maxHeight && react_1.default.createElement(VirtualizedList_1.default, { items: items2, renderItem: renderItem }))));
 };
 exports.default = react_1.default.forwardRef(CalendarYearsSelector);

package/Calendar/IconChevronDown.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare const ForwardRef: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement>, "ref"> & React.RefAttributes<SVGSVGElement>>;
+export default ForwardRef;

package/Calendar/IconChevronDown.js

@@ -0,0 +1,31 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = __importStar(require("react"));
+const react_1 = require("react");
+const IconChevronDown = (props, ref) => (React.createElement("svg", Object.assign({ xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", viewBox: "0 0 512 512", ref: ref }, props),
+    React.createElement("path", { d: "m105.79 160.82a24 24 0 0 0-10.76 6.2109 24 24 0 0 0 0 33.941l144 144a24.002 24.002 0 0 0 33.941 0l144-144a24 24 0 0 0 0-33.941 24 24 0 0 0-33.941 0l-127.03 127.03-127.03-127.03a24 24 0 0 0-23.182-6.2109z", fill: "currentColor" })));
+const ForwardRef = (0, react_1.forwardRef)(IconChevronDown);
+exports.default = ForwardRef;

package/Calendar/index.d.ts

@@ -1,220 +1,7 @@
-import React from 'react';
-import { CalendarBodyProps } from './CalendarBody';
-import { CalendarCellProps } from './CalendarCell';
-import { CalendarEmptyCellProps } from './CalendarEmptyCell';
-import { CalendarPaperProps } from './CalendarPaper';
-import { CalendarHeaderProps } from './CalendarHeader';
-import { CalendarWeekRowProps } from './CalendarWeekRow';
-import { CalendarDateContainerProps } from './CalendarDateContainer';
-import { CalendarToolbarProps } from './CalendarToolbar';
-import { CalendarYearsSelectorProps } from './CalendarYearsSelector';
-import { CalendarMonthsSelectorProps } from './CalendarMonthsSelector';
-import { CalendarMonthCellProps } from './CalendarMonthCell';
-import { CalendarYearCellProps } from './CalendarYearCell';
-import { CalendarDayBadgeProps } from './CalendarDayBadge';
-import { CalendarFooterProps } from './CalendarFooter';
-import { CalendarControlButtonProps } from './CalendarControlButton';
-import { CalendarHeadingProps } from './CalendarHeading';
-import { CalendarSubheadingProps } from './CalendarSubheading';
-import { CalendarIconPrevProps } from './CalendarIconPrev';
-import { CalendarIconNextProps } from './IconChevronRight';
-import { CalendarWeekDaysBarProps, WeekNameLabelFormat } from './CalendarWeekDaysBar';
-import { CalendarValue, WeekDayName } from './use-calendar';
-import { CalendarView as CalendarViewName } from './reducer';
-export * from './use-calendar';
-export * from './CalendarWeekDaysBar';
-export type CalendarView = CalendarViewName;
-export type CalendarProps<Range extends boolean | undefined = undefined> = {
-    readonly range?: Range;
-    /**
-     * Selected date
-     */
-    readonly value?: CalendarValue<Range>;
-    /**
-     * selected value if your component should not be controlled
-     */
-    readonly defaultValue?: CalendarValue<Range>;
-    /**
-     * It will be called at the moment of selecting the given
-     */
-    readonly onChange: (dates: CalendarValue<Range>) => void;
-    /**
-     * calendar locale\
-     * **Default:** `ru-RU`
-     */
-    readonly locale?: string;
-    /**
-     * array of badges
-     */
-    readonly badges?: readonly CalendarBadge[];
-    /**
-     * Minimum date limit\
-     * **Default:** -100 year
-  
-     */
-    readonly minDate?: Date;
-    /**
-     * Maximum date limit\
-     * **Default:** +100 year
-     */
-    readonly maxDate?: Date;
-    /**
-     * The day the week starts from\
-     * **Default:** `monday`
-     */
-    readonly weekStartDay?: WeekDayName;
-    /**
-     * Int weekday format\
-     * **Default:** `short`
-     */
-    readonly weekDayLabelFormat?: WeekNameLabelFormat;
-    /**
-     * Display days with leading zero
-     * **Default:** `false`
-     */
-    readonly displayLeadingZero?: boolean;
-    /**
-     * Mark current day cell\
-     * **Default:** `true`
-     */
-    readonly markToday?: boolean;
-    /**
-     * Cell accent color\
-     * **Default:** `primary`
-     */
-    readonly accentColor?: 'primary' | 'secondary' | string;
-    /**
-     * Tooltip for the Prev month button
-     */
-    readonly prevMonthButtonTooltip?: string;
-    /**
-     * Tooltip for the Next month button
-     */
-    readonly nextMonthButtonTooltip?: string;
-    /**
-     * Tooltip for tne month selector button
-     */
-    readonly changeMonthButtonTooltip?: string;
-    /**
-     * Tooltip for the year selector button
-     */
-    readonly changeYearButtonTooltip?: string;
-    /**
-     * Label for the Reset button. If label passed, then button will be rendered
-     */
-    readonly resetButtonLabel?: string;
-    /**
-     * Label for the Today button. If label passed, then button will be rendered
-     */
-    readonly toodayButtonLabel?: string;
-    /**
-     * Heading
-     */
-    readonly heading?: React.ReactNode;
-    /**
-     * Subheading
-     */
-    readonly subheading?: React.ReactNode;
-    /**
-     * Initial name of the view\
-     * **Default:** `days`
-     */
-    readonly initialView?: CalendarView;
-    /**
-     * Custom footer elements
-     */
-    readonly footer?: JSX.Element;
-    /**
-     * Overridable components map
-     */
-    readonly overrides?: CalendarOverrides;
-};
-export interface CalendarOverrides {
-    /**
-     * Element container
-     */
-    readonly Body?: React.ForwardRefExoticComponent<CalendarBodyProps & React.RefAttributes<HTMLDivElement>>;
-    /**
-     * Day element
-     */
-    readonly Cell?: React.ForwardRefExoticComponent<CalendarCellProps & React.RefAttributes<HTMLButtonElement>>;
-    /**
-     * Empty cell element
-     */
-    readonly EmptyCell?: React.ForwardRefExoticComponent<CalendarEmptyCellProps & React.RefAttributes<HTMLButtonElement>>;
-    /**
-     * Common container element
-     */
-    readonly Paper?: React.ForwardRefExoticComponent<CalendarPaperProps & React.RefAttributes<HTMLDivElement>>;
-    /**
-     * Header wrapper element
-     */
-    readonly Header?: React.ForwardRefExoticComponent<CalendarHeaderProps & React.RefAttributes<HTMLDivElement>>;
-    /**
-     * Week row container element
-     */
-    readonly WeekRow?: React.ForwardRefExoticComponent<CalendarWeekRowProps & React.RefAttributes<HTMLDivElement>>;
-    /**
-     * Days wrapper element
-     */
-    readonly DateContainer?: React.ForwardRefExoticComponent<CalendarDateContainerProps & React.RefAttributes<HTMLDivElement>>;
-    /**
-     * Toolbar wrapper element
-     */
-    readonly Toolbar?: React.ForwardRefExoticComponent<CalendarToolbarProps & React.RefAttributes<HTMLDivElement>>;
-    /**
-     * Years list element (year view)
-     */
-    readonly YearsSelector?: React.ForwardRefExoticComponent<CalendarYearsSelectorProps & React.RefAttributes<HTMLDivElement>>;
-    /**
-     * Monthes list element (month view)
-     */
-    readonly MonthsSelector?: React.ForwardRefExoticComponent<CalendarMonthsSelectorProps & React.RefAttributes<HTMLDivElement>>;
-    /**
-     * Month cell element in monthes list
-     */
-    readonly MonthCell?: React.ForwardRefExoticComponent<CalendarMonthCellProps & React.RefAttributes<HTMLButtonElement>>;
-    /**
-     * Year cell element in years list
-     */
-    readonly YearCell?: React.ForwardRefExoticComponent<CalendarYearCellProps & React.RefAttributes<HTMLButtonElement>>;
-    /**
-     * Badge of the day cell element
-     */
-    readonly DayBadge?: React.ForwardRefExoticComponent<CalendarDayBadgeProps & React.RefAttributes<HTMLSpanElement>>;
-    /**
-     * Footer container element
-     */
-    readonly Footer?: React.ForwardRefExoticComponent<CalendarFooterProps & React.RefAttributes<HTMLDivElement>>;
-    /**
-     * Common button element
-     */
-    readonly ControlButton?: React.ForwardRefExoticComponent<CalendarControlButtonProps & React.RefAttributes<HTMLButtonElement>>;
-    /**
-     * Heading element
-     */
-    readonly Heading?: React.ForwardRefExoticComponent<CalendarHeadingProps & React.RefAttributes<HTMLDivElement>>;
-    /**
-     * Subheading element
-     */
-    readonly Subheading?: React.ForwardRefExoticComponent<CalendarSubheadingProps & React.RefAttributes<HTMLDivElement>>;
-    /**
-     * Prev icon element in prev month button
-     */
-    readonly IconPrev?: React.ForwardRefExoticComponent<CalendarIconPrevProps & React.RefAttributes<SVGElement>>;
-    /**
-     * Next icon element in next month button
-     */
-    readonly IconNext?: React.ForwardRefExoticComponent<CalendarIconNextProps & React.RefAttributes<SVGElement>>;
-    /**
-     * Weeks bar  element
-     */
-    readonly WeekDaysBar?: React.ForwardRefExoticComponent<CalendarWeekDaysBarProps & React.RefAttributes<HTMLDivElement>>;
-}
-export type CalendarBadge = {
-    readonly date: Date;
-    readonly badgeContent: React.ReactNode;
-    readonly accentColor?: 'primary' | 'secondary' | string;
-};
-declare const Calendar: <Range_1 extends boolean | undefined = undefined>(props: CalendarProps<Range_1>) => React.ReactNode;
-export default Calendar;
+import * as React from 'react';
+import { CalendarProps, CalendarRef } from './CalendarComponent';
+export * from './CalendarComponent';
+declare const _default: <IsRangeValue extends boolean | undefined = undefined>(props: CalendarProps<IsRangeValue> & {
+    ref?: React.Ref<CalendarRef<IsRangeValue>> | undefined;
+}) => React.ReactElement;
+export default _default;