@daryasidorovich/modsen-datepicker 1.0.1 → 1.0.2

package/src/stories/header.css

@@ -1,32 +0,0 @@
-.storybook-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
-  padding: 15px 20px;
-  font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
-}
-
-.storybook-header svg {
-  display: inline-block;
-  vertical-align: top;
-}
-
-.storybook-header h1 {
-  display: inline-block;
-  vertical-align: top;
-  margin: 6px 0 6px 10px;
-  font-weight: 700;
-  font-size: 20px;
-  line-height: 1;
-}
-
-.storybook-header button + button {
-  margin-left: 10px;
-}
-
-.storybook-header .welcome {
-  margin-right: 10px;
-  color: #333;
-  font-size: 14px;
-}

package/src/stories/page.css

@@ -1,68 +0,0 @@
-.storybook-page {
-  margin: 0 auto;
-  padding: 48px 20px;
-  max-width: 600px;
-  color: #333;
-  font-size: 14px;
-  line-height: 24px;
-  font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
-}
-
-.storybook-page h2 {
-  display: inline-block;
-  vertical-align: top;
-  margin: 0 0 4px;
-  font-weight: 700;
-  font-size: 32px;
-  line-height: 1;
-}
-
-.storybook-page p {
-  margin: 1em 0;
-}
-
-.storybook-page a {
-  color: inherit;
-}
-
-.storybook-page ul {
-  margin: 1em 0;
-  padding-left: 30px;
-}
-
-.storybook-page li {
-  margin-bottom: 8px;
-}
-
-.storybook-page .tip {
-  display: inline-block;
-  vertical-align: top;
-  margin-right: 10px;
-  border-radius: 1em;
-  background: #e7fdd8;
-  padding: 4px 12px;
-  color: #357a14;
-  font-weight: 700;
-  font-size: 11px;
-  line-height: 12px;
-}
-
-.storybook-page .tip-wrapper {
-  margin-top: 40px;
-  margin-bottom: 40px;
-  font-size: 13px;
-  line-height: 20px;
-}
-
-.storybook-page .tip-wrapper svg {
-  display: inline-block;
-  vertical-align: top;
-  margin-top: 3px;
-  margin-right: 4px;
-  width: 12px;
-  height: 12px;
-}
-
-.storybook-page .tip-wrapper svg path {
-  fill: #1ea7fd;
-}

package/src/styles/_border.scss

@@ -1,9 +0,0 @@
-$radius-8: 8px;
-
-$border-width: 1px;
-$border-solid: solid;
-
-@mixin border {
-  border-style: $border-solid;
-  border-width: $border-width;
-}

package/src/styles/_colors.scss

@@ -1,53 +0,0 @@
-@use 'sass:map';
-
-$colors: (
-  color-blue: #2f80ed,
-  color-blue-60: #2f81ed93,
-  color-blue-10: #2f81ed2a,
-
-  color-white: #ffffff,
-  color-black: #333333,
-
-  color-red: #ff383c,
-  color-green: #62d0a2,
-  color-light-gray: #e1e1e1,
-  color-gray: #aaaaaa,
-  color-dark-gray: #2c314466,
-);
-
-@function color($key) {
-  @return map.get($colors, $key);
-}
-
-$themes: (
-  light: (
-    border: color(color-light-gray),
-    background: color(color-white),
-    text: color(color-black),
-    middle-blue: color(color-blue-60),
-    light-blue: color(color-blue-10),
-    blue: color(color-blue),
-    disabled: color(color-gray),
-    selected: color(color-blue),
-    accent: color(color-red),
-    marker: color(color-green),
-    white-color: color(color-white),
-    button-hover: color(color-blue-60),
-    overlay: color(color-dark-gray),
-  ),
-  dark: (
-    border: color(color-gray),
-    background: color(color-black),
-    text: color(color-white),
-    middle-blue: color(color-blue-60),
-    light-blue: color(color-blue-10),
-    blue: color(color-blue),
-    disabled: color(color-gray),
-    selected: color(color-blue),
-    accent: color(color-red),
-    marker: color(color-green),
-    white-color: color(color-light-gray),
-    button-hover: color(color-gray),
-    overlay: color(color-dark-gray),
-  ),
-);

package/src/styles/_gap.scss

@@ -1,4 +0,0 @@
-$gap-5: 5px;
-$gap-8: 8px;
-$gap-10: 10px;
-$gap-24: 24px;

package/src/styles/_globals.scss

@@ -1,61 +0,0 @@
-@use './colors' as *;
-@use './typography' as *;
-@use './border' as *;
-@use './variables' as *;
-@use './mixins' as *;
-@use './theme-mixins' as *;
-
-html {
-  &.is-lock {
-    overflow: hidden;
-  }
-}
-
-body {
-  font-weight: $font-weight-regular;
-  font-family: $font-family-base;
-  font-size: $font-size-14;
-
-  @include themify($themes) {
-    color: themed('text');
-    background: themed('gradient');
-  }
-}
-
-h1,
-h2 {
-  margin: 0;
-}
-
-h1 {
-  font-size: $font-size-15;
-  font-weight: $font-weight-semibold;
-}
-
-h2 {
-  font-weight: $font-weight-bold;
-}
-
-a,
-button,
-label,
-input,
-textarea,
-select,
-svg * {
-  transition:
-    color $transition-duration $easing,
-    background-color $transition-duration $easing,
-    border-color $transition-duration $easing,
-    fill $transition-duration $easing,
-    opacity $transition-duration $easing;
-}
-
-a,
-button {
-  &:has(svg) {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-  }
-}

package/src/styles/_grid.scss

@@ -1,9 +0,0 @@
-@use './mixins' as *;
-@use './gap' as *;
-
-.grid {
-  display: grid;
-  width: 100%;
-
-  grid-template-columns: repeat(7, 1fr);
-}

package/src/styles/_mixins.scss

@@ -1,6 +0,0 @@
-@use 'sass:map';
-
-@mixin square($size) {
-  width: $size;
-  height: $size;
-}

package/src/styles/_reset.scss

@@ -1,98 +0,0 @@
-*,
-::before,
-::after {
-  box-sizing: border-box;
-}
-
-:where(ul, ol):where([class]) {
-  padding-left: 0;
-}
-
-body,
-:where(blockquote, figure):where([class]) {
-  margin: 0;
-}
-
-:where(h1, h2, h3, h4, h5, h6, p, ul, ol, dl):where([class]) {
-  margin-block: 0;
-}
-
-:where(dd[class]) {
-  margin-left: 0;
-}
-
-:where(fieldset[class]) {
-  margin-left: 0;
-  padding: 0;
-  border: none;
-}
-
-:where(ul[class]) {
-  list-style: none;
-}
-
-:where(address[class]) {
-  font-style: normal;
-}
-
-p {
-  margin-block: 0;
-}
-
-img,
-video {
-  display: block;
-  max-width: 100%;
-  height: auto;
-}
-
-input,
-textarea,
-select,
-button {
-  font: inherit;
-}
-
-html {
-  height: 100%;
-
-  scrollbar-gutter: stable;
-}
-
-html,
-:has(:target) {
-  scroll-behavior: smooth;
-}
-
-body {
-  min-height: 100%;
-
-  line-height: 1.5;
-}
-
-a:where([class]) {
-  display: inline-flex;
-}
-
-button,
-label {
-  cursor: pointer;
-}
-
-[stroke] {
-  stroke: currentColor;
-}
-
-svg * {
-  transition-property: fill, stroke;
-}
-
-@media (prefers-reduced-motion: reduce) {
-  *,
-  ::before,
-  ::after {
-    animation-duration: 0.01ms !important;
-    animation-iteration-count: 1 !important;
-    scroll-behavior: auto !important;
-  }
-}

package/src/styles/_theme-mixins.scss

@@ -1,51 +0,0 @@
-@use 'sass:map';
-@use './colors' as *;
-
-$theme-map: null;
-
-@mixin themify-modules($themes) {
-  @each $theme, $map in $themes {
-    :global(.theme-#{$theme}) & {
-      $theme-map: () !global;
-
-      @each $key, $value in $map {
-        $theme-map: map.merge(
-          $theme-map,
-          (
-            $key: $value,
-          )
-        ) !global;
-      }
-
-      @content;
-
-      $theme-map: null !global;
-    }
-  }
-}
-
-@mixin themify($themes) {
-  @each $theme, $map in $themes {
-    .theme-#{$theme} & {
-      $theme-map: () !global;
-
-      @each $key, $submap in $map {
-        $value: map.get(map.get($themes, $theme), $key);
-        $theme-map: map.merge(
-          $theme-map,
-          (
-            $key: $value,
-          )
-        ) !global;
-      }
-
-      @content;
-
-      $theme-map: null !global;
-    }
-  }
-}
-
-@function themed($key) {
-  @return map.get($theme-map, $key);
-}

package/src/styles/_typography.scss

@@ -1,10 +0,0 @@
-$font-family-base: 'Open Sans', sans-serif;
-
-$font-size-13: 13px;
-$font-size-14: 14px;
-$font-size-15: 15px;
-$font-size-18: 18px;
-
-$font-weight-regular: 400;
-$font-weight-semibold: 600;
-$font-weight-bold: 700;

package/src/styles/_variables.scss

@@ -1,8 +0,0 @@
-$input-height: 42px;
-$button-heght: 36px;
-$icon-size: 16px;
-
-$easing: ease;
-$transition-duration: 0.2s;
-
-$z-index-10: 10;

package/src/styles/main.scss

@@ -1,3 +0,0 @@
-@use './reset';
-@use './globals';
-@use './grid';

package/src/types/types.d.ts

@@ -1,15 +0,0 @@
-declare module '*.module.css' {
-  const classes: { [key: string]: string };
-  export default classes;
-}
-
-declare module '*.module.scss' {
-  const classes: { [key: string]: string };
-  export default classes;
-}
-
-declare module '*.svg?react' {
-  import React from 'react';
-  const SVG: React.FC<React.SVGProps<SVGSVGElement>>;
-  export default SVG;
-}

package/src/utils/calendar.test.ts

@@ -1,154 +0,0 @@
-import {
-  getDaysInMonth,
-  getFirstDayOfMonth,
-  getLastDayOfMonth,
-  getMonthDays,
-  getWeekDayIndex,
-  getWeekDays,
-  getWeeksFromDays,
-} from './calendar';
-
-describe('getFirstDayOfMonth:', () => {
-  it('returns the first day of month', () => {
-    const result = getFirstDayOfMonth(new Date(2026, 8, 18));
-    expect(result.getMonth()).toBe(8);
-    expect(result.getDate()).toBe(1);
-  });
-});
-
-describe('getLastDayOfMonth:', () => {
-  it('returns the last day of month', () => {
-    const result = getLastDayOfMonth(new Date(2026, 0, 10));
-    expect(result.getDate()).toBe(31);
-    expect(result.getMonth()).toBe(0);
-  });
-
-  it('handles February in a leap year', () => {
-    const result = getLastDayOfMonth(new Date(2024, 1, 1));
-    expect(result.getDate()).toBe(29);
-  });
-
-  it('handles February in a non-leap year', () => {
-    const result = getLastDayOfMonth(new Date(2025, 1, 1));
-    expect(result.getDate()).toBe(28);
-  });
-});
-
-describe('getDaysInMonth:', () => {
-  it('returns count of days in the month', () => {
-    expect(getDaysInMonth(new Date(2026, 8, 1))).toBe(30);
-    expect(getDaysInMonth(new Date(2026, 7, 1))).toBe(31);
-    expect(getDaysInMonth(new Date(2026, 6, 1))).toBe(31);
-    expect(getDaysInMonth(new Date(2023, 5, 1))).toBe(30);
-  });
-});
-
-describe('getWeekDayIndex:', () => {
-  it('return 0 for Sunday if the first of week is 0', () => {
-    const sunday = new Date(2026, 8, 6);
-    expect(getWeekDayIndex(sunday, 0)).toBe(0);
-  });
-
-  it('return 1 for Monday if the first of week is 0', () => {
-    const monday = new Date(2026, 8, 7);
-    expect(getWeekDayIndex(monday, 0)).toBe(1);
-  });
-
-  it('return 6 for Sunday if the first of week is 1', () => {
-    const sunday = new Date(2026, 8, 6);
-    expect(getWeekDayIndex(sunday, 1)).toBe(6);
-  });
-
-  it('return 0 for Monday if the first of week is 1', () => {
-    const monday = new Date(2026, 8, 7);
-    expect(getWeekDayIndex(monday, 1)).toBe(0);
-  });
-
-  it('uses firstDayOfWeek = 1 by default', () => {
-    const monday = new Date(2026, 8, 7);
-    expect(getWeekDayIndex(monday)).toBe(0);
-  });
-});
-
-describe('getMonthDays:', () => {
-  it('returns a grid with a step of 7', () => {
-    const result = getMonthDays(new Date(2026, 8, 1));
-    expect(result.length % 7).toBe(0);
-  });
-
-  it('includes all month days', () => {
-    const result = getMonthDays(new Date(2026, 8, 1));
-    const daysInCurrentMonth = result.filter(
-      (day) => day.getMonth() === 8 && day.getFullYear() === 2026
-    );
-    expect(daysInCurrentMonth.length).toBe(30);
-  });
-
-  it('the first day of a grid is Monday if firstDayOfWeek = 1', () => {
-    const result = getMonthDays(new Date(2026, 8, 1), 1);
-    expect(result[0].getDay()).toBe(1);
-  });
-
-  it('the first day of a grid is Sunday if firstDayOfWeek = 0', () => {
-    const result = getMonthDays(new Date(2026, 8, 1), 0);
-    expect(result[0].getDay()).toBe(0);
-  });
-
-  it('correctly adds days of the previous and the next monthes', () => {
-    const result = getMonthDays(new Date(2026, 7, 1), 1);
-    expect(result[0].getMonth()).toBe(6);
-    expect(result[4].getMonth()).toBe(6);
-    expect(result[result.length - 1].getMonth()).toBe(8);
-    expect(result[result.length - 6].getMonth()).toBe(8);
-  });
-});
-
-describe('getWeeksFromDays:', () => {
-  const mockDays: Date[] = Array.from(
-    { length: 30 },
-    (_, i) => new Date(2026, 8, i + 1)
-  );
-
-  it('splits the array of days into weeks of 7', () => {
-    const weeks = getWeeksFromDays(mockDays, 7);
-    expect(weeks.length).toBe(5);
-    expect(weeks[0].length).toBe(7);
-    expect(weeks[3].length).toBe(7);
-  });
-
-  it('splits the array of days into weeks of 5', () => {
-    const weeks = getWeeksFromDays(mockDays, 5);
-    weeks.forEach((week) => expect(week.length).toBe(5));
-  });
-
-  it('handles correctly the last incomplete week', () => {
-    const weeks = getWeeksFromDays(mockDays);
-    expect(weeks[0].length).toBe(7);
-    expect(weeks[4].length).toBe(2);
-  });
-
-  it('returns emply array for an empty entry array', () => {
-    expect(getWeeksFromDays([], 7)).toEqual([]);
-  });
-});
-
-describe('getWeekDays:', () => {
-  it('return 7 days', () => {
-    const result = getWeekDays(new Date(2026, 8, 16));
-    expect(result.length).toBe(7);
-  });
-
-  it('starts from Monday if firstDayOfWeek = 1', () => {
-    const wednesday = new Date(2026, 8, 16);
-    const result = getWeekDays(wednesday, 1);
-    expect(result[0].getDay()).toBe(1);
-    expect(result[0].getDate()).toBe(14);
-  });
-
-  it('starts from Sunday if firstDayOfWeek = 0', () => {
-    const wednesday = new Date(2026, 8, 16);
-    const result = getWeekDays(wednesday, 0);
-    expect(result[0].getDay()).toBe(0);
-    expect(result[0].getDate()).toBe(13);
-  });
-});

package/src/utils/calendar.ts

@@ -1,82 +0,0 @@
-export const getFirstDayOfMonth = (date: Date): Date => {
-  return new Date(date.getFullYear(), date.getMonth(), 1);
-};
-
-export const getLastDayOfMonth = (date: Date): Date => {
-  return new Date(date.getFullYear(), date.getMonth() + 1, 0);
-};
-
-export const getDaysInMonth = (date: Date): number => {
-  return getLastDayOfMonth(date).getDate();
-};
-
-export const getWeekDayIndex = (
-  date: Date,
-  firstDayOfWeek: 0 | 1 = 1
-): number => {
-  let index = date.getDay();
-  if (firstDayOfWeek === 1) {
-    index = index === 0 ? 6 : index - 1;
-  }
-  return index;
-};
-
-export const getMonthDays = (date: Date, firstDayOfWeek: 0 | 1 = 1): Date[] => {
-  const year = date.getFullYear();
-  const month = date.getMonth();
-
-  const firstDay = getFirstDayOfMonth(date);
-  const daysInMonth = getDaysInMonth(date);
-  const firstDayIndex = getWeekDayIndex(firstDay, firstDayOfWeek);
-
-  const totalDays = Math.ceil((firstDayIndex + daysInMonth) / 7) * 7;
-  const days: Date[] = [];
-
-  for (let i = 0; i < firstDayIndex; i++) {
-    days.push(new Date(year, month, 1 - firstDayIndex + i));
-  }
-
-  for (let i = 1; i <= daysInMonth; i++) {
-    days.push(new Date(year, month, i));
-  }
-
-  const remaining = totalDays - days.length;
-  for (let i = 1; i <= remaining; i++) {
-    days.push(new Date(year, month + 1, i));
-  }
-
-  return days;
-};
-
-export const getWeeksFromDays = (
-  days: Date[],
-  weekLength: 5 | 7 = 7
-): Date[][] => {
-  const weeks: Date[][] = [];
-  for (let i = 0; i < days.length; i += weekLength) {
-    weeks.push(days.slice(i, i + weekLength));
-  }
-  return weeks;
-};
-
-export const getWeekDays = (date: Date, firstDayOfWeek: 0 | 1 = 1): Date[] => {
-  const year = date.getFullYear();
-  const month = date.getMonth();
-  const day = date.getDate();
-
-  const currentDayOfWeek = date.getDay();
-
-  const offset =
-    firstDayOfWeek === 1 ? (currentDayOfWeek + 6) % 7 : currentDayOfWeek;
-
-  const startDate = new Date(year, month, day - offset);
-
-  const weekDays: Date[] = [];
-  for (let i = 0; i < 7; i++) {
-    const newDate = new Date(startDate);
-    newDate.setDate(startDate.getDate() + i);
-    weekDays.push(newDate);
-  }
-
-  return weekDays;
-};

package/src/utils/controlDate.ts

@@ -1,3 +0,0 @@
-export const setControlDate = (date: Date | undefined) => {
-  return date ? new Date(date) : undefined;
-};