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

A responsive, highly-customizable datepicker component for SolidJS.

import { insert as l, createComponent as a, memo as I, effect as i, className as d, template as Y } from "solid-js/web";
import { createSignal as w, createEffect as P, Show as y } from "solid-js";
import { Button as v } from "../Button/index.js";
import { PrevIcon as j } from "../PrevIcon/index.js";
import { NextIcon as A } from "../NextIcon/index.js";
import { cn as c } from "../../utils/class.js";
var B = Y("<div data-type=selector-picker-top>"), k = Y("<div data-type=date-selector-trigger>");
function D(e) {
  const [C, S] = w(!1), [R, N] = w(!1);
  return P(() => {
    var t, r, s, u, m, g, x, o, b, h, f;
    S(!!((t = e.yearRange) != null && t.start) && !!((r = e.startYear) != null && r.call(e)) && !!((s = e.count) != null && s.call(e)) && ((u = e.startYear) == null ? void 0 : u.call(e)) - 1 < ((m = e.yearRange) == null ? void 0 : m.start) || (((g = e.startYear) == null ? void 0 : g.call(e)) || 0) - 20 <= 0), N(!!((x = e.yearRange) != null && x.end) && !!((o = e.endYear) != null && o.call(e)) && !!((b = e.count) != null && b.call(e)) && ((h = e.endYear) == null ? void 0 : h.call(e)) + 1 > ((f = e.yearRange) == null ? void 0 : f.end));
  }), n = B(), l(n, a(y, { get when() {
    return e.isYear;
  }, get children() {
    return a(v, { get class() {
      return c(`
            selector-prev-next-btn 
            selector-prev-btn 
            rn-text-black 
            disabled:rn-opacity-10 
            dark:rn-text-white
          `);
    }, "data-prev": !0, "data-type": "selector-prev-next-btn", "aria-label": "Show previous 20 years.", "data-scope": "button", "data-part": "root", get disabled() {
      return C();
    }, get onClick() {
      return e.handlePrev;
    }, get style() {
      return { ...e.arrowsColor && { color: e.arrowsColor } };
    }, get children() {
      return a(j, {});
    } });
  } }), null), l(n, (p = I(() => !!e.isYear), () => {
    return p() ? (r = k(), l(r, () => {
      var s;
      return (s = e.range) == null ? void 0 : s.call(e);
    }), i(() => d(r, c(`
            date-selector-trigger 
            rn-text-center 
            rn-text-[0.9375rem] 
            rn-font-medium
            dark:rn-text-white
          `))), r) : (t = k(), l(t, () => e.monthSelectorTopLabel || "Select A Month"), i(() => d(t, c(`
            date-selector-trigger 
            rn-w-full 
            rn-pt-[0.125rem] 
            rn-text-center 
            rn-text-[0.9375rem] 
            rn-font-medium
            dark:rn-text-white
          `))), t);
    var t, r;
  }), null), l(n, a(y, { get when() {
    return e.isYear;
  }, get children() {
    return a(v, { get class() {
      return c(`
            selector-prev-next-btn 
            selector-next-btn 
            rn-text-black 
            disabled:rn-opacity-10 
            dark:rn-text-white
           `);
    }, "data-next": !0, "aria-label": "Show next 20 years.", "data-scope": "button", "data-part": "root", "data-type": "selector-prev-next-btn", get onClick() {
      return e.handleNext;
    }, get disabled() {
      return R();
    }, get style() {
      return { ...e.arrowsColor && { color: e.arrowsColor } };
    }, get children() {
      return a(A, {});
    } });
  } }), null), i(() => d(n, c(`
          selector-picker-top 
          rn-mb-[0.3125rem] 
          rn-flex 
          rn-items-center 
          rn-justify-between 
          rn-px-2
        `))), n;
  var p, n;
}
export {
  D as default
};