1import { Component, For } from "solid-js";
 2import moment from "moment";
 3// import "moment/dist/locale/ro"; // if you need to change the locale
 4// moment.locale("ro");
 5
 6const FullCalendar: Component = () => {
 7  const weekdays = moment.weekdaysMin();
 8  const months = moment.months();
 9  const fullYear = Object.fromEntries(
10    months.map((monthName, monthIndex) => {
11      return [
12        monthName,
13        new Array(6).fill(1).map((i, rowIndex) => {
14          return weekdays.map((dayName, colIndex) => {
15            const day = moment()
16              // .year(2024) // if you need to change the year
17              .month(monthIndex)
18              .date(rowIndex * 7)
19              .weekday(colIndex);
20            return day.month() == monthIndex ? day.format("D") : "";
21          });
22        }),
23      ];
24    })
25  );
26
27  return (
28    <div class="solidcalendar-container">
29      <For each={Object.keys(fullYear)}>
30        {(monthName) => (
31          <div class="solidcalendar-month">
32            <div class="solidcalendar-monthname">{monthName}</div>
33            <div class="solidcalendar-weekdays">
34              <For each={weekdays}>
35                {(weekDayName) => (
36                  <div class="solidcalendar-weekday solidcalendar-column">
37                    {weekDayName}
38                  </div>
39                )}
40              </For>
41            </div>
42            
43            <For each={fullYear[monthName]}>
44              {(days) => (
45                <div class="solidcalendar-week">
46                  <For each={days}>
47                    {(day) => (
48                      <div class="solidcalendar-weekday solidcalendar-column">
49                        {day}
50                      </div>
51                    )}
52                  </For>
53                </div>
54              )}
55            </For>
56          </div>
57        )}
58      </For>
59    </div>
60  );
61};
62
63export default FullCalendar;