@skbkontur/react-ui 5.6.1-85c65.0 → 5.6.1-e2bc4.0

package/components/Calendar/Month.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Month.js","sourceRoot":"","sources":["../../../components/Calendar/Month.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { type JSX } from 'react';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport type { DateSelect } from '../../internal/DateSelect/index.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\n\nimport type { MonthViewModel } from './MonthViewModel.js';\nimport type { DayCellViewModel } from './DayCellViewModel.js';\nimport { MonthView } from './MonthView.js';\nimport { DayCellView } from './DayCellView.js';\nimport * as CalendarScrollEvents from './CalendarScrollEvents.js';\nimport { getStyles } from './MonthView.styles.js';\nimport { getStyles as getCellStyles } from './DayCellView.styles.js';\n\ninterface MonthProps {\n  top: number;\n  month: MonthViewModel;\n  onMonthYearChange: (monthNative: number, year: number) => void;\n}\n\nexport class Month extends React.Component<MonthProps> {\n  private theme!: Theme;\n\n  private monthSelect: DateSelect | null = null;\n  private yearSelect: DateSelect | null = null;\n\n  public shouldComponentUpdate(nextProps: MonthProps) {\n    if (this.props.top !== nextProps.top) {\n      return true;\n    }\n\n    return this.props.month !== nextProps.month;\n  }\n\n  public componentDidMount() {\n    CalendarScrollEvents.addListener(this.closeSelects);\n  }\n\n  public render(): React.JSX.Element {\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  public renderMain(): JSX.Element {\n    const { month, top } = this.props;\n    return (\n      <MonthView\n        firstDayOffset={month.offset}\n        height={month.getHeight(this.theme)}\n        isFirstInYear={month.isFirstInYear}\n        isLastInYear={month.isLastInYear}\n        month={month.month}\n        top={top}\n        year={month.year}\n        onMonthSelect={this.handleMonthSelect}\n        onYearSelect={this.handleYearSelect}\n        monthSelectRef={this.monthRef}\n        yearSelectRef={this.yearRef}\n      >\n        {this.renderCells()}\n      </MonthView>\n    );\n  }\n\n  private renderCells(): JSX.Element {\n    return <MonthDayGrid days={this.props.month.days} offset={this.props.month.offset} />;\n  }\n\n  private closeSelects = (): void => {\n    if (this.monthSelect) {\n      this.monthSelect.close();\n    }\n    if (this.yearSelect) {\n      this.yearSelect.close();\n    }\n  };\n\n  private monthRef = (monthSelect: DateSelect | null): void => {\n    this.monthSelect = monthSelect;\n  };\n\n  private yearRef = (yearSelect: DateSelect | null): void => {\n    this.yearSelect = yearSelect;\n  };\n\n  private handleMonthSelect = (month: number): void => {\n    this.props.onMonthYearChange(month, this.props.month.year);\n  };\n\n  private handleYearSelect = (year: number): void => {\n    this.props.onMonthYearChange(this.props.month.month, year);\n  };\n}\n\nconst DAYS_PER_WEEK = 7;\n\ninterface MonthDayGridProps {\n  days: DayCellViewModel[];\n  offset: number;\n}\n\n@withRenderEnvironment\nclass MonthDayGrid extends React.Component<MonthDayGridProps> {\n  private styles!: ReturnType<typeof getStyles>;\n  private cellStyles!: ReturnType<typeof getCellStyles>;\n  private theme!: Theme;\n  private emotion!: Emotion;\n\n  public shouldComponentUpdate(nextProps: MonthDayGridProps) {\n    return this.props.days !== nextProps.days;\n  }\n\n  public render(): JSX.Element {\n    this.styles = getStyles(this.emotion);\n    this.cellStyles = getCellStyles(this.emotion);\n\n    return (\n      <ThemeContext.Consumer>\n        {(theme) => {\n          this.theme = theme;\n          return this.renderMain();\n        }}\n      </ThemeContext.Consumer>\n    );\n  }\n\n  public renderMain(): JSX.Element {\n    const leadingDays = Array.from({ length: this.props.offset }, (_, i) => (\n      <div key={`leading_${i}`} className={this.cellStyles.cell(this.theme)} />\n    ));\n    const trailingOffset = DAYS_PER_WEEK - ((this.props.offset + this.props.days.length) % DAYS_PER_WEEK);\n    const trailingDays = Array.from({ length: trailingOffset }, (_, i) => (\n      <div key={`trailing_${i}`} className={this.cellStyles.cell(this.theme)} />\n    ));\n    const days = this.props.days.map((day) => {\n      return <DayCellView date={day} key={`${day.date}.${day.month}.${day.year}`} />;\n    });\n    const weeks = divideToWeeks(leadingDays.concat(days, trailingDays));\n    return (\n      <div className={this.styles.monthDayGrid(this.theme)}>\n        {weeks.map((week, i) => (\n          <div className={this.styles.monthDayRow(this.theme)} key={`week_${i}`}>\n            {week}\n          </div>\n        ))}\n      </div>\n    );\n  }\n}\n\nfunction divideToWeeks<T>(days: T[]): T[][] {\n  const weeks: T[][] = [];\n  for (let i = 0; i < days.length; i += DAYS_PER_WEEK) {\n    const week = days.slice(i, i + DAYS_PER_WEEK);\n    weeks.push(week);\n  }\n  return weeks;\n}\n"]}

package/components/Calendar/MonthView.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import type { Nullable } from '../..//typings/utility-types';
-import { DateSelect } from '../../internal/DateSelect';
-import * as CDS from './CalendarDateShape';
+import type { Nullable } from '../..//typings/utility-types.js';
+import { DateSelect } from '../../internal/DateSelect/index.js';
+import * as CDS from './CalendarDateShape.js';
 export declare const getMinMonth: (year: number, minDate: Nullable<CDS.CalendarDateShape>) => number;
 export declare const getMaxMonth: (year: number, maxDate: Nullable<CDS.CalendarDateShape>) => number;
 interface MonthViewProps {

package/components/Calendar/MonthView.js

@@ -0,0 +1,60 @@
+import React, { useContext } from 'react';
+import { useEmotion, useStyles } from '../../lib/renderEnvironment/index.js';
+import { ThemeContext } from '../../lib/theming/ThemeContext.js';
+import { useResponsiveLayout } from '../../components/ResponsiveLayout/index.js';
+import { DateSelect } from '../../internal/DateSelect/index.js';
+import { getStyles } from './MonthView.styles.js';
+import { themeConfig } from './config.js';
+import * as CDS from './CalendarDateShape.js';
+import { CalendarDataTids } from './Calendar.js';
+import { CalendarContext } from './CalendarContext.js';
+export var getMinMonth = function (year, minDate) {
+    var min = 0;
+    for (var i = 0; i < 12; ++i) {
+        if (minDate && CDS.isGreaterOrEqual({ date: 31, month: i, year: year }, minDate)) {
+            min = i;
+            break;
+        }
+    }
+    return min;
+};
+export var getMaxMonth = function (year, maxDate) {
+    var max = 11;
+    for (var i = 11; i >= 0; --i) {
+        if (maxDate && CDS.isLessOrEqual({ date: 1, month: i, year: year }, maxDate)) {
+            max = i;
+            break;
+        }
+    }
+    return max;
+};
+export function MonthView(props) {
+    var _a, _b;
+    var theme = useContext(ThemeContext);
+    var cx = useEmotion().cx;
+    var styles = useStyles(getStyles);
+    var _c = useContext(CalendarContext), minDate = _c.minDate, maxDate = _c.maxDate;
+    var isMobile = useResponsiveLayout().isMobile;
+    var children = props.children, height = props.height, isFirstInYear = props.isFirstInYear, isLastInYear = props.isLastInYear, month = props.month, top = props.top, year = props.year, onMonthSelect = props.onMonthSelect, onYearSelect = props.onYearSelect, monthSelectRef = props.monthSelectRef, yearSelectRef = props.yearSelectRef;
+    var isTopNegative = top <= 0;
+    var isHeaderSticky = isTopNegative && height >= -top;
+    var headerTop = isHeaderSticky ? Math.min(-top, height - themeConfig(theme).MONTH_TITLE_HEIGHT) : 0;
+    var alpha = isHeaderSticky ? (height + top - themeConfig(theme).MONTH_TITLE_HEIGHT) / 10 : 1;
+    var borderBottomColor = "color-mix(in srgb, ".concat(theme.calendarMonthTitleBorderBottomColor, ", transparent ").concat(Math.max(alpha, 0), "%)");
+    var isYearVisible = isFirstInYear || isHeaderSticky;
+    var yearTop = isHeaderSticky && !isLastInYear ? -headerTop - top : 0;
+    var monthSelectDisabled = top > 52 || headerTop < 0 || headerTop >= height - themeConfig(theme).MONTH_TITLE_HEIGHT;
+    var yearSelectDisabled = top > 52 || (isLastInYear && top < -height + themeConfig(theme).MONTH_TITLE_HEIGHT);
+    return (React.createElement("div", { "data-tid": CalendarDataTids.month, className: cx((_a = {}, _a[styles.month(theme)] = true, _a[styles.monthMobile()] = isMobile, _a)), style: { top: top }, key: month + '-' + year },
+        React.createElement("div", { style: { top: headerTop }, className: cx((_b = {},
+                _b[styles.header()] = true,
+                _b[styles.headerSticky(theme)] = isHeaderSticky,
+                _b)) },
+            React.createElement("div", { style: { borderBottomColor: borderBottomColor }, className: styles.monthTitle(theme) },
+                React.createElement("div", { "data-tid": CalendarDataTids.headerMonth, className: styles.headerMonth(theme) },
+                    React.createElement(DateSelect, { disabled: monthSelectDisabled, width: isMobile ? '6em' : 85, type: "month", value: month, onValueChange: onMonthSelect, ref: !monthSelectDisabled ? monthSelectRef : undefined, minValue: getMinMonth(year, minDate), maxValue: getMaxMonth(year, maxDate) })),
+                isYearVisible && (React.createElement("div", { "data-tid": CalendarDataTids.headerYear, className: styles.headerYear(theme), style: { top: yearTop } },
+                    React.createElement(DateSelect, { disabled: yearSelectDisabled, width: isMobile ? '3.5em' : 50, type: "year", value: year, minValue: minDate ? minDate.year : undefined, maxValue: maxDate ? maxDate.year : undefined, onValueChange: onYearSelect, ref: !yearSelectDisabled ? yearSelectRef : undefined }))))),
+        children));
+}
+//# sourceMappingURL=MonthView.js.map

package/components/Calendar/MonthView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MonthView.js","sourceRoot":"","sources":["../../../components/Calendar/MonthView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,sCAAsC,CAAC;AAC7E,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AACjE,OAAO,EAAE,mBAAmB,EAAE,MAAM,4CAA4C,CAAC;AAEjF,OAAO,EAAE,UAAU,EAAE,MAAM,oCAAoC,CAAC;AAEhE,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC1C,OAAO,KAAK,GAAG,MAAM,wBAAwB,CAAC;AAC9C,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACjD,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAEvD,MAAM,CAAC,IAAM,WAAW,GAAG,UAAC,IAAY,EAAE,OAAwC;IAChF,IAAI,GAAG,GAAG,CAAC,CAAC;IACZ,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC;QAC5B,IAAI,OAAO,IAAI,GAAG,CAAC,gBAAgB,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,MAAA,EAAE,EAAE,OAAO,CAAC,EAAE,CAAC;YAC3E,GAAG,GAAG,CAAC,CAAC;YACR,MAAM;QACR,CAAC;IACH,CAAC;IACD,OAAO,GAAG,CAAC;AACb,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,WAAW,GAAG,UAAC,IAAY,EAAE,OAAwC;IAChF,IAAI,GAAG,GAAG,EAAE,CAAC;IACb,KAAK,IAAI,CAAC,GAAG,EAAE,EAAE,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC,EAAE,CAAC;QAC7B,IAAI,OAAO,IAAI,GAAG,CAAC,aAAa,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,MAAA,EAAE,EAAE,OAAO,CAAC,EAAE,CAAC;YACvE,GAAG,GAAG,CAAC,CAAC;YACR,MAAM;QACR,CAAC;IACH,CAAC;IACD,OAAO,GAAG,CAAC;AACb,CAAC,CAAC;AAiBF,MAAM,UAAU,SAAS,CAAC,KAAqB;;IAC7C,IAAM,KAAK,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IAC/B,IAAA,EAAE,GAAK,UAAU,EAAE,GAAjB,CAAkB;IAC5B,IAAM,MAAM,GAAG,SAAS,CAAC,SAAS,CAAC,CAAC;IAC9B,IAAA,KAAuB,UAAU,CAAC,eAAe,CAAC,EAAhD,OAAO,aAAA,EAAE,OAAO,aAAgC,CAAC;IACjD,IAAA,QAAQ,GAAK,mBAAmB,EAAE,SAA1B,CAA2B;IAGzC,IAAA,QAAQ,GAWN,KAAK,SAXC,EACR,MAAM,GAUJ,KAAK,OAVD,EACN,aAAa,GASX,KAAK,cATM,EACb,YAAY,GAQV,KAAK,aARK,EACZ,KAAK,GAOH,KAAK,MAPF,EACL,GAAG,GAMD,KAAK,IANJ,EACH,IAAI,GAKF,KAAK,KALH,EACJ,aAAa,GAIX,KAAK,cAJM,EACb,YAAY,GAGV,KAAK,aAHK,EACZ,cAAc,GAEZ,KAAK,eAFO,EACd,aAAa,GACX,KAAK,cADM,CACL;IAEV,IAAM,aAAa,GAAG,GAAG,IAAI,CAAC,CAAC;IAC/B,IAAM,cAAc,GAAG,aAAa,IAAI,MAAM,IAAI,CAAC,GAAG,CAAC;IACvD,IAAM,SAAS,GAAG,cAAc,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,MAAM,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACtG,IAAM,KAAK,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC,MAAM,GAAG,GAAG,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC,kBAAkB,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;IAC/F,IAAM,iBAAiB,GAAG,6BAAsB,KAAK,CAAC,mCAAmC,2BAAiB,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,CAAC,OAAI,CAAC;IACjI,IAAM,aAAa,GAAG,aAAa,IAAI,cAAc,CAAC;IACtD,IAAM,OAAO,GAAG,cAAc,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,SAAS,GAAG,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;IACvE,IAAM,mBAAmB,GAAG,GAAG,GAAG,EAAE,IAAI,SAAS,GAAG,CAAC,IAAI,SAAS,IAAI,MAAM,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC,kBAAkB,CAAC;IACrH,IAAM,kBAAkB,GAAG,GAAG,GAAG,EAAE,IAAI,CAAC,YAAY,IAAI,GAAG,GAAG,CAAC,MAAM,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC,kBAAkB,CAAC,CAAC;IAE/G,OAAO,CACL,yCACY,gBAAgB,CAAC,KAAK,EAChC,SAAS,EAAE,EAAE,WAAG,GAAC,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,IAAG,IAAI,EAAE,GAAC,MAAM,CAAC,WAAW,EAAE,IAAG,QAAQ,MAAG,EAChF,KAAK,EAAE,EAAE,GAAG,KAAA,EAAE,EACd,GAAG,EAAE,KAAK,GAAG,GAAG,GAAG,IAAI;QAEvB,6BACE,KAAK,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,EACzB,SAAS,EAAE,EAAE;gBACX,GAAC,MAAM,CAAC,MAAM,EAAE,IAAG,IAAI;gBACvB,GAAC,MAAM,CAAC,YAAY,CAAC,KAAK,CAAC,IAAG,cAAc;oBAC5C;YAEF,6BAAK,KAAK,EAAE,EAAE,iBAAiB,mBAAA,EAAE,EAAE,SAAS,EAAE,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC;gBACpE,yCAAe,gBAAgB,CAAC,WAAW,EAAE,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,KAAK,CAAC;oBAC/E,oBAAC,UAAU,IACT,QAAQ,EAAE,mBAAmB,EAC7B,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAC5B,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,aAAa,EAC5B,GAAG,EAAE,CAAC,mBAAmB,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,SAAS,EACtD,QAAQ,EAAE,WAAW,CAAC,IAAI,EAAE,OAAO,CAAC,EACpC,QAAQ,EAAE,WAAW,CAAC,IAAI,EAAE,OAAO,CAAC,GACpC,CACE;gBACL,aAAa,IAAI,CAChB,yCAAe,gBAAgB,CAAC,UAAU,EAAE,SAAS,EAAE,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC,EAAE,KAAK,EAAE,EAAE,GAAG,EAAE,OAAO,EAAE;oBACtG,oBAAC,UAAU,IACT,QAAQ,EAAE,kBAAkB,EAC5B,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,EAC9B,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EAC5C,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,EAC5C,aAAa,EAAE,YAAY,EAC3B,GAAG,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,GACpD,CACE,CACP,CACG,CACF;QACL,QAAQ,CACL,CACP,CAAC;AACJ,CAAC","sourcesContent":["import React, { useContext } from 'react';\n\nimport { useEmotion, useStyles } from '../../lib/renderEnvironment/index.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport { useResponsiveLayout } from '../../components/ResponsiveLayout/index.js';\nimport type { Nullable } from '../..//typings/utility-types.js';\nimport { DateSelect } from '../../internal/DateSelect/index.js';\n\nimport { getStyles } from './MonthView.styles.js';\nimport { themeConfig } from './config.js';\nimport * as CDS from './CalendarDateShape.js';\nimport { CalendarDataTids } from './Calendar.js';\nimport { CalendarContext } from './CalendarContext.js';\n\nexport const getMinMonth = (year: number, minDate: Nullable<CDS.CalendarDateShape>): number => {\n  let min = 0;\n  for (let i = 0; i < 12; ++i) {\n    if (minDate && CDS.isGreaterOrEqual({ date: 31, month: i, year }, minDate)) {\n      min = i;\n      break;\n    }\n  }\n  return min;\n};\n\nexport const getMaxMonth = (year: number, maxDate: Nullable<CDS.CalendarDateShape>): number => {\n  let max = 11;\n  for (let i = 11; i >= 0; --i) {\n    if (maxDate && CDS.isLessOrEqual({ date: 1, month: i, year }, maxDate)) {\n      max = i;\n      break;\n    }\n  }\n  return max;\n};\n\ninterface MonthViewProps {\n  children: React.ReactNode;\n  firstDayOffset: number;\n  height: number;\n  isFirstInYear?: boolean;\n  isLastInYear?: boolean;\n  month: number;\n  top: number;\n  year: number;\n  onMonthSelect: (month: number) => void;\n  onYearSelect: (month: number) => void;\n  monthSelectRef: (select: DateSelect | null) => void;\n  yearSelectRef: (select: DateSelect | null) => void;\n}\n\nexport function MonthView(props: MonthViewProps): React.JSX.Element {\n  const theme = useContext(ThemeContext);\n  const { cx } = useEmotion();\n  const styles = useStyles(getStyles);\n  const { minDate, maxDate } = useContext(CalendarContext);\n  const { isMobile } = useResponsiveLayout();\n\n  const {\n    children,\n    height,\n    isFirstInYear,\n    isLastInYear,\n    month,\n    top,\n    year,\n    onMonthSelect,\n    onYearSelect,\n    monthSelectRef,\n    yearSelectRef,\n  } = props;\n\n  const isTopNegative = top <= 0;\n  const isHeaderSticky = isTopNegative && height >= -top;\n  const headerTop = isHeaderSticky ? Math.min(-top, height - themeConfig(theme).MONTH_TITLE_HEIGHT) : 0;\n  const alpha = isHeaderSticky ? (height + top - themeConfig(theme).MONTH_TITLE_HEIGHT) / 10 : 1;\n  const borderBottomColor = `color-mix(in srgb, ${theme.calendarMonthTitleBorderBottomColor}, transparent ${Math.max(alpha, 0)}%)`;\n  const isYearVisible = isFirstInYear || isHeaderSticky;\n  const yearTop = isHeaderSticky && !isLastInYear ? -headerTop - top : 0;\n  const monthSelectDisabled = top > 52 || headerTop < 0 || headerTop >= height - themeConfig(theme).MONTH_TITLE_HEIGHT;\n  const yearSelectDisabled = top > 52 || (isLastInYear && top < -height + themeConfig(theme).MONTH_TITLE_HEIGHT);\n\n  return (\n    <div\n      data-tid={CalendarDataTids.month}\n      className={cx({ [styles.month(theme)]: true, [styles.monthMobile()]: isMobile })}\n      style={{ top }}\n      key={month + '-' + year}\n    >\n      <div\n        style={{ top: headerTop }}\n        className={cx({\n          [styles.header()]: true,\n          [styles.headerSticky(theme)]: isHeaderSticky,\n        })}\n      >\n        <div style={{ borderBottomColor }} className={styles.monthTitle(theme)}>\n          <div data-tid={CalendarDataTids.headerMonth} className={styles.headerMonth(theme)}>\n            <DateSelect\n              disabled={monthSelectDisabled}\n              width={isMobile ? '6em' : 85}\n              type=\"month\"\n              value={month}\n              onValueChange={onMonthSelect}\n              ref={!monthSelectDisabled ? monthSelectRef : undefined}\n              minValue={getMinMonth(year, minDate)}\n              maxValue={getMaxMonth(year, maxDate)}\n            />\n          </div>\n          {isYearVisible && (\n            <div data-tid={CalendarDataTids.headerYear} className={styles.headerYear(theme)} style={{ top: yearTop }}>\n              <DateSelect\n                disabled={yearSelectDisabled}\n                width={isMobile ? '3.5em' : 50}\n                type=\"year\"\n                value={year}\n                minValue={minDate ? minDate.year : undefined}\n                maxValue={maxDate ? maxDate.year : undefined}\n                onValueChange={onYearSelect}\n                ref={!yearSelectDisabled ? yearSelectRef : undefined}\n              />\n            </div>\n          )}\n        </div>\n      </div>\n      {children}\n    </div>\n  );\n}\n"]}

package/components/Calendar/MonthView.styles.d.ts

@@ -1,5 +1,5 @@
-import type { Theme } from '../../lib/theming/Theme';
-export declare const getStyles: import("../../lib/theming/Emotion").StylesGetter<{
+import type { Theme } from '../../lib/theming/Theme.js';
+export declare const getStyles: import("../../lib/theming/Emotion.js").StylesGetter<{
     headerMonth(t: Theme): string;
     headerYear(t: Theme): string;
     month(t: Theme): string;

package/components/Calendar/MonthView.styles.js

@@ -0,0 +1,47 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { memoizeGetStyles } from '../../lib/theming/Emotion.js';
+export var getStyles = memoizeGetStyles(function (_a) {
+    var css = _a.css;
+    return ({
+        headerMonth: function (t) {
+            return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      display: inline-block;\n      padding: ", " 0 ", ";\n    "], ["\n      display: inline-block;\n      padding: ", " 0 ", ";\n    "])), t.calendarMonthTitlePaddingTop, t.calendarMonthTitlePaddingBottom);
+        },
+        headerYear: function (t) {
+            return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      display: inline-block;\n      position: absolute;\n      right: 0;\n      padding: ", " 0 ", ";\n    "], ["\n      display: inline-block;\n      position: absolute;\n      right: 0;\n      padding: ", " 0 ", ";\n    "])), t.calendarMonthTitlePaddingTop, t.calendarMonthTitlePaddingBottom);
+        },
+        month: function (t) {
+            var width = parseInt(t.calendarCellWidth) * 7;
+            return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      position: absolute;\n      width: ", "px;\n    "], ["\n      position: absolute;\n      width: ", "px;\n    "])), width);
+        },
+        monthMobile: function () {
+            return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      width: 100%;\n    "], ["\n      width: 100%;\n    "])));
+        },
+        header: function () {
+            return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n      position: relative;\n    "], ["\n      position: relative;\n    "])));
+        },
+        headerSticky: function (t) {
+            return css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n      background-color: ", ";\n      z-index: 2;\n    "], ["\n      background-color: ", ";\n      z-index: 2;\n    "])), t.calendarMonthHeaderStickedBgColor);
+        },
+        monthTitle: function (t) {
+            return css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n      border-bottom: 1px solid ", ";\n      font-weight: ", ";\n      margin: 0 ", " ", ";\n      line-height: ", ";\n    "], ["\n      border-bottom: 1px solid ", ";\n      font-weight: ", ";\n      margin: 0 ", " ", ";\n      line-height: ", ";\n    "])), t.calendarMonthTitleBorderBottomColor, t.dateSelectFontWeight, t.calendarMonthTitleMarginX, t.calendarMonthTitleMarginBottom, t.calendarMonthTitleLineHeight);
+        },
+        /* Note: this could've been
+         * display: grid;
+         * grid-template-columns: repeat(7, minmax(0, 1fr));
+         */
+        monthDayGrid: function (t) {
+            return css(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n      line-height: ", ";\n      display: flex;\n      flex-direction: column;\n      padding: ", " 0px;\n    "], ["\n      line-height: ", ";\n      display: flex;\n      flex-direction: column;\n      padding: ", " 0px;\n    "])), t.calendarCellLineHeight, t.calendarGridRowSpacing);
+        },
+        monthDayRow: function (t) {
+            return css(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n      display: flex;\n      justify-content: space-between;\n\n      & + & {\n        margin-top: ", ";\n      }\n    "], ["\n      display: flex;\n      justify-content: space-between;\n\n      & + & {\n        margin-top: ", ";\n      }\n    "])), t.calendarGridRowSpacing);
+        },
+        nativeSelect: function () {
+            return css(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n      position: absolute;\n      top: -12px;\n      right: 0;\n      bottom: -8px;\n      left: 0;\n      cursor: pointer;\n      appearance: none;\n      opacity: 0;\n      border: none;\n    "], ["\n      position: absolute;\n      top: -12px;\n      right: 0;\n      bottom: -8px;\n      left: 0;\n      cursor: pointer;\n      appearance: none;\n      opacity: 0;\n      border: none;\n    "])));
+        },
+    });
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10;
+//# sourceMappingURL=MonthView.styles.js.map

package/components/Calendar/MonthView.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MonthView.styles.js","sourceRoot":"","sources":["../../../components/Calendar/MonthView.styles.ts"],"names":[],"mappings":";;;;AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAGhE,MAAM,CAAC,IAAM,SAAS,GAAG,gBAAgB,CAAC,UAAC,EAAgB;QAAd,GAAG,SAAA;IAAgB,OAAA,CAAC;QAC/D,WAAW,YAAC,CAAQ;YAClB,OAAO,GAAG,sIAAA,iDAEG,EAA8B,KAAM,EAAiC,SACjF,KADY,CAAC,CAAC,4BAA4B,EAAM,CAAC,CAAC,+BAA+B,EAChF;QACJ,CAAC;QAED,UAAU,YAAC,CAAQ;YACjB,OAAO,GAAG,kLAAA,6FAIG,EAA8B,KAAM,EAAiC,SACjF,KADY,CAAC,CAAC,4BAA4B,EAAM,CAAC,CAAC,+BAA+B,EAChF;QACJ,CAAC;QAED,KAAK,YAAC,CAAQ;YACZ,IAAM,KAAK,GAAG,QAAQ,CAAC,CAAC,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC;YAChD,OAAO,GAAG,4HAAA,4CAEC,EAAK,WACf,KADU,KAAK,EACd;QACJ,CAAC;QAED,WAAW;YACT,OAAO,GAAG,+FAAA,4BAET,KAAC;QACJ,CAAC;QAED,MAAM;YACJ,OAAO,GAAG,sGAAA,mCAET,KAAC;QACJ,CAAC;QAED,YAAY,YAAC,CAAQ;YACnB,OAAO,GAAG,6HAAA,4BACY,EAAmC,4BAExD,KAFqB,CAAC,CAAC,iCAAiC,EAEvD;QACJ,CAAC;QAED,UAAU,YAAC,CAAQ;YACjB,OAAO,GAAG,iMAAA,mCACmB,EAAqC,wBACjD,EAAsB,qBACzB,EAA2B,GAAI,EAAgC,wBAC5D,EAA8B,SAC9C,KAJ4B,CAAC,CAAC,mCAAmC,EACjD,CAAC,CAAC,oBAAoB,EACzB,CAAC,CAAC,yBAAyB,EAAI,CAAC,CAAC,8BAA8B,EAC5D,CAAC,CAAC,4BAA4B,EAC7C;QACJ,CAAC;QAED;;;WAGG;QACH,YAAY,YAAC,CAAQ;YACnB,OAAO,GAAG,oLAAA,uBACO,EAAwB,yEAG5B,EAAwB,aACpC,KAJgB,CAAC,CAAC,sBAAsB,EAG5B,CAAC,CAAC,sBAAsB,EACnC;QACJ,CAAC;QAED,WAAW,YAAC,CAAQ;YAClB,OAAO,GAAG,6LAAA,sGAKQ,EAAwB,kBAEzC,KAFiB,CAAC,CAAC,sBAAsB,EAExC;QACJ,CAAC;QAED,YAAY;YACV,OAAO,GAAG,0QAAA,qMAUT,KAAC;QACJ,CAAC;KACF,CAAC;AA1F8D,CA0F9D,CAAC,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles } from '../../lib/theming/Emotion.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\n  headerMonth(t: Theme) {\n    return css`\n      display: inline-block;\n      padding: ${t.calendarMonthTitlePaddingTop} 0 ${t.calendarMonthTitlePaddingBottom};\n    `;\n  },\n\n  headerYear(t: Theme) {\n    return css`\n      display: inline-block;\n      position: absolute;\n      right: 0;\n      padding: ${t.calendarMonthTitlePaddingTop} 0 ${t.calendarMonthTitlePaddingBottom};\n    `;\n  },\n\n  month(t: Theme) {\n    const width = parseInt(t.calendarCellWidth) * 7;\n    return css`\n      position: absolute;\n      width: ${width}px;\n    `;\n  },\n\n  monthMobile() {\n    return css`\n      width: 100%;\n    `;\n  },\n\n  header() {\n    return css`\n      position: relative;\n    `;\n  },\n\n  headerSticky(t: Theme) {\n    return css`\n      background-color: ${t.calendarMonthHeaderStickedBgColor};\n      z-index: 2;\n    `;\n  },\n\n  monthTitle(t: Theme) {\n    return css`\n      border-bottom: 1px solid ${t.calendarMonthTitleBorderBottomColor};\n      font-weight: ${t.dateSelectFontWeight};\n      margin: 0 ${t.calendarMonthTitleMarginX} ${t.calendarMonthTitleMarginBottom};\n      line-height: ${t.calendarMonthTitleLineHeight};\n    `;\n  },\n\n  /* Note: this could've been\n   * display: grid;\n   * grid-template-columns: repeat(7, minmax(0, 1fr));\n   */\n  monthDayGrid(t: Theme) {\n    return css`\n      line-height: ${t.calendarCellLineHeight};\n      display: flex;\n      flex-direction: column;\n      padding: ${t.calendarGridRowSpacing} 0px;\n    `;\n  },\n\n  monthDayRow(t: Theme) {\n    return css`\n      display: flex;\n      justify-content: space-between;\n\n      & + & {\n        margin-top: ${t.calendarGridRowSpacing};\n      }\n    `;\n  },\n\n  nativeSelect() {\n    return css`\n      position: absolute;\n      top: -12px;\n      right: 0;\n      bottom: -8px;\n      left: 0;\n      cursor: pointer;\n      appearance: none;\n      opacity: 0;\n      border: none;\n    `;\n  },\n}));\n"]}

package/components/Calendar/MonthViewModel.d.ts

@@ -1,5 +1,5 @@
-import type { Theme } from '../../lib/theming/Theme';
-import { DayCellViewModel } from './DayCellViewModel';
+import type { Theme } from '../../lib/theming/Theme.js';
+import { DayCellViewModel } from './DayCellViewModel.js';
 export declare class MonthViewModel {
     static create: (month: number, year: number) => MonthViewModel;
     readonly daysCount: number;

package/components/Calendar/MonthViewModel.js

@@ -0,0 +1,60 @@
+import { memo } from '../../lib/memo.js';
+import { getMonthInHumanFormat } from './CalendarUtils.js';
+import { themeConfig } from './config.js';
+import { DayCellViewModel } from './DayCellViewModel.js';
+var getCurrentYear = function (month, year) {
+    if (month < 0) {
+        return year - Math.ceil(-month / 12);
+    }
+    if (month > 11) {
+        return year + Math.floor(month / 12);
+    }
+    return year;
+};
+var getCurrentMonth = function (month) {
+    if (month < 0) {
+        return 12 + (month % 12);
+    }
+    if (month > 11) {
+        return month % 12;
+    }
+    return month;
+};
+var MonthViewModel = /** @class */ (function () {
+    function MonthViewModel(month, year) {
+        var currentYear = getCurrentYear(month, year);
+        var currentMonth = getCurrentMonth(month);
+        var daysCount = getMonthsDays(currentMonth, currentYear);
+        var offset = getMonthOffset(currentMonth, currentYear);
+        this.daysCount = daysCount;
+        this.offset = offset;
+        this.month = currentMonth;
+        this.year = currentYear;
+        this.isLastInYear = currentMonth === 11;
+        this.isFirstInYear = currentMonth === 0;
+        this.days = Array.from({ length: daysCount }, function (_, i) {
+            var isWeekend = (i + getMonthOffset(currentMonth, currentYear)) % 7 >= 5;
+            return DayCellViewModel.create(i + 1, currentMonth, currentYear, isWeekend);
+        });
+    }
+    MonthViewModel.prototype.getHeight = function (theme) {
+        var _a = themeConfig(theme), DAY_HEIGHT = _a.DAY_HEIGHT, MONTH_TITLE_OFFSET_HEIGHT = _a.MONTH_TITLE_OFFSET_HEIGHT, MONTH_BOTTOM_MARGIN = _a.MONTH_BOTTOM_MARGIN, CALENDAR_GRID_ROW_SPACING = _a.CALENDAR_GRID_ROW_SPACING;
+        return getMonthHeight(this.daysCount, this.offset, DAY_HEIGHT, MONTH_TITLE_OFFSET_HEIGHT, MONTH_BOTTOM_MARGIN, CALENDAR_GRID_ROW_SPACING);
+    };
+    MonthViewModel.create = memo(function (month, year) { return new MonthViewModel(month, year); });
+    return MonthViewModel;
+}());
+export { MonthViewModel };
+var getMonthHeight = memo(function (daysCount, offset, dayHeight, titleHeight, marginBottom, rowSpacing) {
+    var weeks = Math.ceil((daysCount + offset) / 7);
+    return weeks * dayHeight + titleHeight + marginBottom + rowSpacing * 2 + rowSpacing * (weeks - 1);
+});
+var getMonthsDays = memo(function (month, year) { return new Date(year, getMonthInHumanFormat(month), 0).getDate(); });
+var getMonthOffset = memo(function (month, year) {
+    var day = new Date(year, month, 1).getDay() - 1;
+    if (day === -1) {
+        return 6;
+    }
+    return day;
+});
+//# sourceMappingURL=MonthViewModel.js.map

package/components/Calendar/MonthViewModel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MonthViewModel.js","sourceRoot":"","sources":["../../../components/Calendar/MonthViewModel.ts"],"names":[],"mappings":"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","sourcesContent":["import { memo } from '../../lib/memo.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\n\nimport { getMonthInHumanFormat } from './CalendarUtils.js';\nimport { themeConfig } from './config.js';\nimport { DayCellViewModel } from './DayCellViewModel.js';\n\nconst getCurrentYear = (month: number, year: number) => {\n  if (month < 0) {\n    return year - Math.ceil(-month / 12);\n  }\n\n  if (month > 11) {\n    return year + Math.floor(month / 12);\n  }\n\n  return year;\n};\n\nconst getCurrentMonth = (month: number) => {\n  if (month < 0) {\n    return 12 + (month % 12);\n  }\n\n  if (month > 11) {\n    return month % 12;\n  }\n\n  return month;\n};\n\nexport class MonthViewModel {\n  public static create = memo((month: number, year: number): MonthViewModel => new MonthViewModel(month, year));\n\n  public readonly daysCount: number;\n\n  public readonly offset: number;\n\n  public readonly month: number;\n\n  public readonly year: number;\n\n  public readonly days: DayCellViewModel[];\n\n  // FIXME: shouldbe readonly\n  public isLastInYear: boolean;\n\n  // FIXME: shouldbe readonly\n  public isFirstInYear: boolean;\n\n  public getHeight(theme: Theme): number {\n    const { DAY_HEIGHT, MONTH_TITLE_OFFSET_HEIGHT, MONTH_BOTTOM_MARGIN, CALENDAR_GRID_ROW_SPACING } =\n      themeConfig(theme);\n    return getMonthHeight(\n      this.daysCount,\n      this.offset,\n      DAY_HEIGHT,\n      MONTH_TITLE_OFFSET_HEIGHT,\n      MONTH_BOTTOM_MARGIN,\n      CALENDAR_GRID_ROW_SPACING,\n    );\n  }\n\n  private constructor(month: number, year: number) {\n    const currentYear = getCurrentYear(month, year);\n    const currentMonth = getCurrentMonth(month);\n\n    const daysCount = getMonthsDays(currentMonth, currentYear);\n    const offset = getMonthOffset(currentMonth, currentYear);\n    this.daysCount = daysCount;\n    this.offset = offset;\n    this.month = currentMonth;\n    this.year = currentYear;\n    this.isLastInYear = currentMonth === 11;\n    this.isFirstInYear = currentMonth === 0;\n    this.days = Array.from({ length: daysCount }, (_, i) => {\n      const isWeekend = (i + getMonthOffset(currentMonth, currentYear)) % 7 >= 5;\n      return DayCellViewModel.create(i + 1, currentMonth, currentYear, isWeekend);\n    });\n  }\n}\n\nconst getMonthHeight = memo(\n  (\n    daysCount: number,\n    offset: number,\n    dayHeight: number,\n    titleHeight: number,\n    marginBottom: number,\n    rowSpacing: number,\n  ) => {\n    const weeks = Math.ceil((daysCount + offset) / 7);\n    return weeks * dayHeight + titleHeight + marginBottom + rowSpacing * 2 + rowSpacing * (weeks - 1);\n  },\n);\nconst getMonthsDays = memo((month: number, year: number) => new Date(year, getMonthInHumanFormat(month), 0).getDate());\n\nconst getMonthOffset = memo((month: number, year: number) => {\n  const day = new Date(year, month, 1).getDay() - 1;\n  if (day === -1) {\n    return 6;\n  }\n  return day;\n});\n"]}

package/components/Calendar/config.d.ts

@@ -1,4 +1,4 @@
-import type { Theme } from '../../lib/theming/Theme';
+import type { Theme } from '../../lib/theming/Theme.js';
 declare const getConfig: (monthTitleLineHeight: string, monthTitlePaddingTop: string, monthTitlePaddingBottom: string, monthTitleMarginBottom: string, cellWidth: string, cellHeight: string, wrapperHeight: string, monthMarginBottom: string, maxMonthsToAppendOnScroll: string, calendarGridRowSpacing: string) => {
     DAY_WIDTH: number;
     DAY_HEIGHT: number;

package/components/Calendar/config.js

@@ -0,0 +1,18 @@
+import { memo } from '../../lib/memo.js';
+var getConfig = memo(function (monthTitleLineHeight, monthTitlePaddingTop, monthTitlePaddingBottom, monthTitleMarginBottom, cellWidth, cellHeight, wrapperHeight, monthMarginBottom, maxMonthsToAppendOnScroll, calendarGridRowSpacing) {
+    var monthTitleHeight = parseInt(monthTitleLineHeight) + parseInt(monthTitlePaddingTop) + parseInt(monthTitlePaddingBottom);
+    return {
+        DAY_WIDTH: parseInt(cellWidth),
+        DAY_HEIGHT: parseInt(cellHeight),
+        MONTH_TITLE_HEIGHT: monthTitleHeight,
+        MONTH_TITLE_OFFSET_HEIGHT: monthTitleHeight + parseInt(monthTitleMarginBottom) + 1, // + 1px separator line
+        WRAPPER_HEIGHT: parseInt(wrapperHeight),
+        MONTH_BOTTOM_MARGIN: parseInt(monthMarginBottom),
+        MAX_MONTHS_TO_APPEND_ON_SCROLL: parseInt(maxMonthsToAppendOnScroll),
+        CALENDAR_GRID_ROW_SPACING: parseInt(calendarGridRowSpacing),
+    };
+});
+export var themeConfig = function (t) {
+    return getConfig(t.calendarMonthTitleLineHeight, t.calendarMonthTitlePaddingTop, t.calendarMonthTitlePaddingBottom, t.calendarMonthTitleMarginBottom, t.calendarCellWidth, t.calendarCellHeight, t.calendarWrapperHeight, t.calendarMonthMarginBottom, t.calendarMaxMonthsToAppendOnScroll, t.calendarGridRowSpacing);
+};
+//# sourceMappingURL=config.js.map

package/components/Calendar/config.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"config.js","sourceRoot":"","sources":["../../../components/Calendar/config.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAEzC,IAAM,SAAS,GAAG,IAAI,CACpB,UACE,oBAA4B,EAC5B,oBAA4B,EAC5B,uBAA+B,EAC/B,sBAA8B,EAC9B,SAAiB,EACjB,UAAkB,EAClB,aAAqB,EACrB,iBAAyB,EACzB,yBAAiC,EACjC,sBAA8B;IAE9B,IAAM,gBAAgB,GACpB,QAAQ,CAAC,oBAAoB,CAAC,GAAG,QAAQ,CAAC,oBAAoB,CAAC,GAAG,QAAQ,CAAC,uBAAuB,CAAC,CAAC;IACtG,OAAO;QACL,SAAS,EAAE,QAAQ,CAAC,SAAS,CAAC;QAC9B,UAAU,EAAE,QAAQ,CAAC,UAAU,CAAC;QAChC,kBAAkB,EAAE,gBAAgB;QACpC,yBAAyB,EAAE,gBAAgB,GAAG,QAAQ,CAAC,sBAAsB,CAAC,GAAG,CAAC,EAAE,uBAAuB;QAC3G,cAAc,EAAE,QAAQ,CAAC,aAAa,CAAC;QACvC,mBAAmB,EAAE,QAAQ,CAAC,iBAAiB,CAAC;QAChD,8BAA8B,EAAE,QAAQ,CAAC,yBAAyB,CAAC;QACnE,yBAAyB,EAAE,QAAQ,CAAC,sBAAsB,CAAC;KAC5D,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,IAAM,WAAW,GAAG,UAAC,CAAQ;IAClC,OAAA,SAAS,CACP,CAAC,CAAC,4BAA4B,EAC9B,CAAC,CAAC,4BAA4B,EAC9B,CAAC,CAAC,+BAA+B,EACjC,CAAC,CAAC,8BAA8B,EAChC,CAAC,CAAC,iBAAiB,EACnB,CAAC,CAAC,kBAAkB,EACpB,CAAC,CAAC,qBAAqB,EACvB,CAAC,CAAC,yBAAyB,EAC3B,CAAC,CAAC,iCAAiC,EACnC,CAAC,CAAC,sBAAsB,CACzB;AAXD,CAWC,CAAC","sourcesContent":["import type { Theme } from '../../lib/theming/Theme.js';\nimport { memo } from '../../lib/memo.js';\n\nconst getConfig = memo(\n  (\n    monthTitleLineHeight: string,\n    monthTitlePaddingTop: string,\n    monthTitlePaddingBottom: string,\n    monthTitleMarginBottom: string,\n    cellWidth: string,\n    cellHeight: string,\n    wrapperHeight: string,\n    monthMarginBottom: string,\n    maxMonthsToAppendOnScroll: string,\n    calendarGridRowSpacing: string,\n  ) => {\n    const monthTitleHeight =\n      parseInt(monthTitleLineHeight) + parseInt(monthTitlePaddingTop) + parseInt(monthTitlePaddingBottom);\n    return {\n      DAY_WIDTH: parseInt(cellWidth),\n      DAY_HEIGHT: parseInt(cellHeight),\n      MONTH_TITLE_HEIGHT: monthTitleHeight,\n      MONTH_TITLE_OFFSET_HEIGHT: monthTitleHeight + parseInt(monthTitleMarginBottom) + 1, // + 1px separator line\n      WRAPPER_HEIGHT: parseInt(wrapperHeight),\n      MONTH_BOTTOM_MARGIN: parseInt(monthMarginBottom),\n      MAX_MONTHS_TO_APPEND_ON_SCROLL: parseInt(maxMonthsToAppendOnScroll),\n      CALENDAR_GRID_ROW_SPACING: parseInt(calendarGridRowSpacing),\n    };\n  },\n);\n\nexport const themeConfig = (t: Theme): ReturnType<typeof getConfig> =>\n  getConfig(\n    t.calendarMonthTitleLineHeight,\n    t.calendarMonthTitlePaddingTop,\n    t.calendarMonthTitlePaddingBottom,\n    t.calendarMonthTitleMarginBottom,\n    t.calendarCellWidth,\n    t.calendarCellHeight,\n    t.calendarWrapperHeight,\n    t.calendarMonthMarginBottom,\n    t.calendarMaxMonthsToAppendOnScroll,\n    t.calendarGridRowSpacing,\n  );\n"]}

package/components/Calendar/index.d.ts

@@ -1,3 +1,3 @@
-export * from './Calendar';
-export * from './CalendarDateShape';
-export * from './CalendarDay';
+export * from './Calendar.js';
+export * from './CalendarDateShape.js';
+export * from './CalendarDay.js';

package/components/Calendar/index.js

@@ -0,0 +1,4 @@
+export * from './Calendar.js';
+export * from './CalendarDateShape.js';
+export * from './CalendarDay.js';
+//# sourceMappingURL=index.js.map

package/components/Calendar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/Calendar/index.tsx"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,wBAAwB,CAAC;AACvC,cAAc,kBAAkB,CAAC","sourcesContent":["export * from './Calendar.js';\nexport * from './CalendarDateShape.js';\nexport * from './CalendarDay.js';\n"]}

package/components/Calendar/locale/locales/en.d.ts

@@ -1,2 +1,2 @@
-import type { CalendarLocale } from '../types';
+import type { CalendarLocale } from '../types.js';
 export declare const componentsLocales: CalendarLocale;

package/components/Calendar/locale/locales/en.js

@@ -0,0 +1,18 @@
+export var componentsLocales = {
+    months: [
+        'January',
+        'February',
+        'March',
+        'April',
+        'May',
+        'June',
+        'July',
+        'August',
+        'September',
+        'October',
+        'November',
+        'December',
+    ],
+    dayCellChooseDateAriaLabel: 'Choose date',
+};
+//# sourceMappingURL=en.js.map

package/components/Calendar/locale/locales/en.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"en.js","sourceRoot":"","sources":["../../../../../components/Calendar/locale/locales/en.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,IAAM,iBAAiB,GAAmB;IAC/C,MAAM,EAAE;QACN,SAAS;QACT,UAAU;QACV,OAAO;QACP,OAAO;QACP,KAAK;QACL,MAAM;QACN,MAAM;QACN,QAAQ;QACR,WAAW;QACX,SAAS;QACT,UAAU;QACV,UAAU;KACX;IACD,0BAA0B,EAAE,aAAa;CAC1C,CAAC","sourcesContent":["import type { CalendarLocale } from '../types.js';\n\nexport const componentsLocales: CalendarLocale = {\n  months: [\n    'January',\n    'February',\n    'March',\n    'April',\n    'May',\n    'June',\n    'July',\n    'August',\n    'September',\n    'October',\n    'November',\n    'December',\n  ],\n  dayCellChooseDateAriaLabel: 'Choose date',\n};\n"]}

package/components/Calendar/locale/locales/ru.d.ts

@@ -1,2 +1,2 @@
-import type { CalendarLocale } from '../types';
+import type { CalendarLocale } from '../types.js';
 export declare const componentsLocales: CalendarLocale;

package/components/Calendar/locale/locales/ru.js

@@ -0,0 +1,18 @@
+export var componentsLocales = {
+    months: [
+        'Январь',
+        'Февраль',
+        'Март',
+        'Апрель',
+        'Май',
+        'Июнь',
+        'Июль',
+        'Август',
+        'Сентябрь',
+        'Октябрь',
+        'Ноябрь',
+        'Декабрь',
+    ],
+    dayCellChooseDateAriaLabel: 'Выбрать дату',
+};
+//# sourceMappingURL=ru.js.map

package/components/Calendar/locale/locales/ru.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ru.js","sourceRoot":"","sources":["../../../../../components/Calendar/locale/locales/ru.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,IAAM,iBAAiB,GAAmB;IAC/C,MAAM,EAAE;QACN,QAAQ;QACR,SAAS;QACT,MAAM;QACN,QAAQ;QACR,KAAK;QACL,MAAM;QACN,MAAM;QACN,QAAQ;QACR,UAAU;QACV,SAAS;QACT,QAAQ;QACR,SAAS;KACV;IACD,0BAA0B,EAAE,cAAc;CAC3C,CAAC","sourcesContent":["import type { CalendarLocale } from '../types.js';\n\nexport const componentsLocales: CalendarLocale = {\n  months: [\n    'Январь',\n    'Февраль',\n    'Март',\n    'Апрель',\n    'Май',\n    'Июнь',\n    'Июль',\n    'Август',\n    'Сентябрь',\n    'Октябрь',\n    'Ноябрь',\n    'Декабрь',\n  ],\n  dayCellChooseDateAriaLabel: 'Выбрать дату',\n};\n"]}

package/components/Calendar/locale/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/components/Calendar/locale/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../components/Calendar/locale/types.ts"],"names":[],"mappings":"","sourcesContent":["export interface CalendarLocale {\n  months?: string[];\n  selectMonthAriaLabel?: string;\n  selectYearAriaLabel?: string;\n  selectChosenAriaLabel?: string;\n  dayCellChooseDateAriaLabel?: string;\n}\n"]}

package/components/Center/Center.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import type { Override } from '../../typings/utility-types';
-import type { CommonProps } from '../../internal/CommonWrapper';
-import type { TGetRootNode } from '../../lib/rootNode';
+import type { Override } from '../../typings/utility-types.js';
+import type { CommonProps } from '../../internal/CommonWrapper/index.js';
+import type { TGetRootNode } from '../../lib/rootNode/index.js';
 export type HorizontalAlign = 'left' | 'center' | 'right';
 export interface CenterProps extends CommonProps, Override<React.HTMLAttributes<HTMLDivElement>, {
     /** Задает выравнивание контента по горизонтали */

package/components/Center/Center.js

@@ -0,0 +1,94 @@
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+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;
+};
+import React from 'react';
+import { CommonWrapper } from '../../internal/CommonWrapper/index.js';
+import { rootNode } from '../../lib/rootNode/index.js';
+import { createPropsGetter } from '../../lib/createPropsGetter.js';
+import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
+import { getStyles } from './Center.styles.js';
+export var CenterDataTids = {
+    root: 'Center__root',
+};
+/**
+ * `Center` — контейнер, который центрирует элементы внутри себя.
+ *
+ * Выравнивание задается пропом `align`.
+ */
+var Center = /** @class */ (function (_super) {
+    __extends(Center, _super);
+    function Center() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this.getProps = createPropsGetter(Center_1.defaultProps);
+        _this.renderMain = function (props) {
+            var _a;
+            var align = props.align, rest = __rest(props, ["align"]);
+            return (React.createElement("div", __assign({ "data-tid": CenterDataTids.root }, rest, { className: _this.cx((_a = {},
+                    _a[_this.styles.root()] = true,
+                    _a[_this.styles.rootAlignLeft()] = align === 'left',
+                    _a[_this.styles.rootAlignRight()] = align === 'right',
+                    _a)) }),
+                React.createElement("span", { className: _this.styles.spring() }),
+                React.createElement("span", { className: _this.styles.container() }, _this.props.children)));
+        };
+        return _this;
+    }
+    Center_1 = Center;
+    Center.prototype.render = function () {
+        this.styles = getStyles(this.emotion);
+        return (React.createElement(CommonWrapper, __assign({ rootNodeRef: this.setRootNode }, this.getProps()), this.renderMain));
+    };
+    var Center_1;
+    Center.__KONTUR_REACT_UI__ = 'Center';
+    Center.displayName = 'Center';
+    Center.defaultProps = {
+        align: 'center',
+    };
+    Center = Center_1 = __decorate([
+        withRenderEnvironment,
+        rootNode
+    ], Center);
+    return Center;
+}(React.Component));
+export { Center };
+//# sourceMappingURL=Center.js.map

package/components/Center/Center.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Center.js","sourceRoot":"","sources":["../../../components/Center/Center.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AAEtE,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAEvD,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAE7E,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAc/C,MAAM,CAAC,IAAM,cAAc,GAAG;IAC5B,IAAI,EAAE,cAAc;CACZ,CAAC;AAKX;;;;GAIG;AAGH;IAA4B,0BAA4B;IAAxD;;QAOU,cAAQ,GAAG,iBAAiB,CAAC,QAAM,CAAC,YAAY,CAAC,CAAC;QAiBlD,gBAAU,GAAG,UAAC,KAAqD;;YACjE,IAAA,KAAK,GAAc,KAAK,MAAnB,EAAK,IAAI,UAAK,KAAK,EAA1B,SAAkB,CAAF,CAAW;YAEjC,OAAO,CACL,kDACY,cAAc,CAAC,IAAI,IACzB,IAAI,IACR,SAAS,EAAE,KAAI,CAAC,EAAE;oBAChB,GAAC,KAAI,CAAC,MAAM,CAAC,IAAI,EAAE,IAAG,IAAI;oBAC1B,GAAC,KAAI,CAAC,MAAM,CAAC,aAAa,EAAE,IAAG,KAAK,KAAK,MAAM;oBAC/C,GAAC,KAAI,CAAC,MAAM,CAAC,cAAc,EAAE,IAAG,KAAK,KAAK,OAAO;wBACjD;gBAEF,8BAAM,SAAS,EAAE,KAAI,CAAC,MAAM,CAAC,MAAM,EAAE,GAAI;gBACzC,8BAAM,SAAS,EAAE,KAAI,CAAC,MAAM,CAAC,SAAS,EAAE,IAAG,KAAI,CAAC,KAAK,CAAC,QAAQ,CAAQ,CAClE,CACP,CAAC;QACJ,CAAC,CAAC;;IACJ,CAAC;eA1CY,MAAM;IAeV,uBAAM,GAAb;QACE,IAAI,CAAC,MAAM,GAAG,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAEtC,OAAO,CACL,oBAAC,aAAa,aAAC,WAAW,EAAE,IAAI,CAAC,WAAW,IAAM,IAAI,CAAC,QAAQ,EAAE,GAC9D,IAAI,CAAC,UAAU,CACF,CACjB,CAAC;IACJ,CAAC;;IAtBa,0BAAmB,GAAG,QAAQ,AAAX,CAAY;IAC/B,kBAAW,GAAG,QAAQ,AAAX,CAAY;IAEvB,mBAAY,GAAiB;QACzC,KAAK,EAAE,QAAQ;KAChB,AAFyB,CAExB;IANS,MAAM;QAFlB,qBAAqB;QACrB,QAAQ;OACI,MAAM,CA0ClB;IAAD,aAAC;CAAA,AA1CD,CAA4B,KAAK,CAAC,SAAS,GA0C1C;SA1CY,MAAM","sourcesContent":["import React from 'react';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport type { Override } from '../../typings/utility-types.js';\nimport type { CommonProps, CommonWrapperRestProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport type { DefaultizedProps } from '../../lib/createPropsGetter.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\n\nimport { getStyles } from './Center.styles.js';\n\nexport type HorizontalAlign = 'left' | 'center' | 'right';\n\nexport interface CenterProps\n  extends CommonProps,\n    Override<\n      React.HTMLAttributes<HTMLDivElement>,\n      {\n        /** Задает выравнивание контента по горизонтали */\n        align?: HorizontalAlign;\n      }\n    > {}\n\nexport const CenterDataTids = {\n  root: 'Center__root',\n} as const;\n\ntype DefaultProps = Required<Pick<CenterProps, 'align'>>;\ntype DefaultizedCenterProps = DefaultizedProps<CenterProps, DefaultProps>;\n\n/**\n * `Center` — контейнер, который центрирует элементы внутри себя.\n *\n * Выравнивание задается пропом `align`.\n */\n@withRenderEnvironment\n@rootNode\nexport class Center extends React.Component<CenterProps> {\n  public static __KONTUR_REACT_UI__ = 'Center';\n  public static displayName = 'Center';\n\n  public static defaultProps: DefaultProps = {\n    align: 'center',\n  };\n  private getProps = createPropsGetter(Center.defaultProps);\n\n  public getRootNode!: TGetRootNode;\n  private setRootNode!: TSetRootNode;\n  private emotion!: Emotion;\n  private cx!: Emotion['cx'];\n  private styles!: ReturnType<typeof getStyles>;\n\n  public render(): React.JSX.Element {\n    this.styles = getStyles(this.emotion);\n\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.getProps()}>\n        {this.renderMain}\n      </CommonWrapper>\n    );\n  }\n  private renderMain = (props: CommonWrapperRestProps<DefaultizedCenterProps>) => {\n    const { align, ...rest } = props;\n\n    return (\n      <div\n        data-tid={CenterDataTids.root}\n        {...rest}\n        className={this.cx({\n          [this.styles.root()]: true,\n          [this.styles.rootAlignLeft()]: align === 'left',\n          [this.styles.rootAlignRight()]: align === 'right',\n        })}\n      >\n        <span className={this.styles.spring()} />\n        <span className={this.styles.container()}>{this.props.children}</span>\n      </div>\n    );\n  };\n}\n"]}

package/components/Center/Center.styles.d.ts

@@ -1,4 +1,4 @@
-export declare const getStyles: import("../../lib/theming/Emotion").StylesGetter<{
+export declare const getStyles: import("../../lib/theming/Emotion.js").StylesGetter<{
     root(): string;
     rootAlignLeft(): string;
     rootAlignRight(): string;

package/components/Center/Center.styles.js

@@ -0,0 +1,27 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+import { memoizeGetStyles } from '../../lib/theming/Emotion.js';
+export var getStyles = memoizeGetStyles(function (_a) {
+    var css = _a.css;
+    return ({
+        root: function () {
+            return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      height: 100%;\n      text-align: center;\n    "], ["\n      height: 100%;\n      text-align: center;\n    "])));
+        },
+        rootAlignLeft: function () {
+            return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      text-align: left;\n    "], ["\n      text-align: left;\n    "])));
+        },
+        rootAlignRight: function () {
+            return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      text-align: right;\n    "], ["\n      text-align: right;\n    "])));
+        },
+        spring: function () {
+            return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      display: inline-block;\n      height: 100%;\n      vertical-align: middle;\n    "], ["\n      display: inline-block;\n      height: 100%;\n      vertical-align: middle;\n    "])));
+        },
+        container: function () {
+            return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n      display: inline-block;\n      text-align: left;\n      vertical-align: middle;\n    "], ["\n      display: inline-block;\n      text-align: left;\n      vertical-align: middle;\n    "])));
+        },
+    });
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;
+//# sourceMappingURL=Center.styles.js.map

package/components/Center/Center.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Center.styles.js","sourceRoot":"","sources":["../../../components/Center/Center.styles.ts"],"names":[],"mappings":";;;;AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAEhE,MAAM,CAAC,IAAM,SAAS,GAAG,gBAAgB,CAAC,UAAC,EAAgB;QAAd,GAAG,SAAA;IAAgB,OAAA,CAAC;QAC/D,IAAI;YACF,OAAO,GAAG,2HAAA,wDAGT,KAAC;QACJ,CAAC;QAED,aAAa;YACX,OAAO,GAAG,oGAAA,iCAET,KAAC;QACJ,CAAC;QAED,cAAc;YACZ,OAAO,GAAG,qGAAA,kCAET,KAAC;QACJ,CAAC;QAED,MAAM;YACJ,OAAO,GAAG,6JAAA,0FAIT,KAAC;QACJ,CAAC;QAED,SAAS;YACP,OAAO,GAAG,iKAAA,8FAIT,KAAC;QACJ,CAAC;KACF,CAAC;AAnC8D,CAmC9D,CAAC,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles } from '../../lib/theming/Emotion.js';\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\n  root() {\n    return css`\n      height: 100%;\n      text-align: center;\n    `;\n  },\n\n  rootAlignLeft() {\n    return css`\n      text-align: left;\n    `;\n  },\n\n  rootAlignRight() {\n    return css`\n      text-align: right;\n    `;\n  },\n\n  spring() {\n    return css`\n      display: inline-block;\n      height: 100%;\n      vertical-align: middle;\n    `;\n  },\n\n  container() {\n    return css`\n      display: inline-block;\n      text-align: left;\n      vertical-align: middle;\n    `;\n  },\n}));\n"]}

package/components/Center/index.d.ts

@@ -1 +1 @@
-export * from './Center';
+export * from './Center.js';

package/components/Center/index.js

@@ -0,0 +1,2 @@
+export * from './Center.js';
+//# sourceMappingURL=index.js.map

package/components/Center/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/Center/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC","sourcesContent":["export * from './Center.js';\n"]}

package/components/Checkbox/Checkbox.d.ts

@@ -1,9 +1,9 @@
 import type { AriaAttributes } from 'react';
 import React from 'react';
-import type { Override } from '../../typings/utility-types';
-import type { CommonProps } from '../../internal/CommonWrapper';
-import type { TGetRootNode } from '../../lib/rootNode';
-import type { SizeProp } from '../../lib/types/props';
+import type { Override } from '../../typings/utility-types.js';
+import type { CommonProps } from '../../internal/CommonWrapper/index.js';
+import type { TGetRootNode } from '../../lib/rootNode/index.js';
+import type { SizeProp } from '../../lib/types/props.js';
 export interface CheckboxProps extends CommonProps, Pick<AriaAttributes, 'aria-describedby' | 'aria-label'>, Override<React.InputHTMLAttributes<HTMLInputElement>, {
     /** @ignore */
     children?: React.ReactNode;