@rnwonder/solid-date-picker/dist/src/components/DatePickerMonthAndYearSelector/index.js

A responsive, highly-customizable datepicker component for SolidJS.

import { insert as h, createComponent as r, mergeProps as c, effect as y, className as d, template as p } from "solid-js/web";
import { createSignal as s, createEffect as i, Show as n } from "solid-js";
import { MonthSelector as S } from "../MonthSelector/index.js";
import { YearSelector as x } from "../YearSelector/index.js";
import { cn as f } from "../../utils/class.js";
var C = p("<div data-type=date-month-year-selector-area>");
const X = (e) => {
  const [m, g] = s(), [a, u] = s();
  return i(() => {
    var t;
    m() && ((t = e.setAllowedComponents) == null || t.call(e, (l) => [...l, m()]));
  }), i(() => {
    var t;
    a() && ((t = e.setAllowedComponents) == null || t.call(e, (l) => [...l, a()]));
  }), o = C(), h(o, r(n, { get when() {
    return e.render();
  }, keyed: !0, get children() {
    return [r(n, { get when() {
      return e.monthSelectorJSX;
    }, keyed: !0, get children() {
      return e.monthSelectorJSX;
    } }), r(n, { get when() {
      return !e.monthSelectorJSX;
    }, keyed: !0, get children() {
      return r(S, c(e, { ref: g, get month() {
        return e.month;
      }, get setMonth() {
        return e.setMonth;
      }, get monthSelectorFormat() {
        return e.monthSelectorFormat;
      }, get zIndex() {
        return e.zIndex;
      }, get locale() {
        return e.locale;
      }, get primaryColor() {
        return e.primaryColor;
      }, get primaryTextColor() {
        return e.primaryTextColor;
      }, get minDate() {
        return e.minDate;
      }, get maxDate() {
        return e.maxDate;
      }, get twoMonthsDisplay() {
        return e.twoMonthsDisplay;
      } }));
    } }), r(n, { get when() {
      return e.yearSelectorJSX;
    }, keyed: !0, get children() {
      return e.yearSelectorJSX;
    } }), r(n, { get when() {
      return !e.yearSelectorJSX;
    }, keyed: !0, get children() {
      return r(x, c(e, { ref: u, get year() {
        return e.year;
      }, get setYear() {
        return e.setYear;
      }, get zIndex() {
        return e.zIndex;
      }, get yearRange() {
        return e.yearRange;
      }, get primaryColor() {
        return e.primaryColor;
      }, get primaryTextColor() {
        return e.primaryTextColor;
      }, get minDate() {
        return e.minDate;
      }, get maxDate() {
        return e.maxDate;
      } }));
    } })];
  } })), y(() => d(o, f("date-month-year-selector-area rn-flex rn-items-center rn-justify-center " + (e.monthYearSelectorFlexDirection === "column" ? "rn-flex-col" : ""), e.datePickerTopMonthYearAreaClass))), o;
  var o;
};
export {
  X as DatePickerMonthAndYearSelector
};