@gcsa/console-vue 0.1.0

package/dist/components/GcsaDateRangeMonthPanel.vue.js

@@ -0,0 +1,110 @@
+import { defineComponent as w, computed as i, openBlock as e, createElementBlock as n, createElementVNode as h, createBlock as c, unref as a, withCtx as t, createVNode as l, toDisplayString as g, Fragment as f, renderList as p, createTextVNode as v } from "vue";
+import { DatePicker as s } from "@ark-ui/vue/date-picker";
+import m from "./GcsaIcon.vue.js";
+const x = { class: "gcsa-date-range-picker__panel" }, L = { class: "gcsa-date-range-picker__panel-header" }, B = {
+  key: 1,
+  class: "gcsa-date-range-picker__nav-spacer",
+  "aria-hidden": "true"
+}, N = { class: "gcsa-date-range-picker__panel-label" }, P = {
+  key: 3,
+  class: "gcsa-date-range-picker__nav-spacer",
+  "aria-hidden": "true"
+}, V = /* @__PURE__ */ w({
+  name: "GcsaDateRangeMonthPanel",
+  __name: "GcsaDateRangeMonthPanel",
+  props: {
+    dp: {},
+    monthOffset: {},
+    showPrev: { type: Boolean },
+    showNext: { type: Boolean },
+    navLabels: {}
+  },
+  setup(r) {
+    const d = r, k = i(() => d.dp.getOffset({ months: d.monthOffset })), b = i(() => k.value.weeks), y = i(() => k.value.visibleRangeText.start), T = i(() => d.dp.weekDays);
+    return (D, R) => (e(), n("div", x, [
+      h("div", L, [
+        r.showPrev ? (e(), c(a(s).PrevTrigger, {
+          key: 0,
+          class: "gcsa-date-picker__nav gcsa-focus-ring",
+          "aria-label": r.navLabels.prevMonth
+        }, {
+          default: t(() => [
+            l(m, {
+              name: "chevronLeft",
+              size: "sm"
+            })
+          ]),
+          _: 1
+        }, 8, ["aria-label"])) : (e(), n("span", B)),
+        h("div", N, g(y.value), 1),
+        r.showNext ? (e(), c(a(s).NextTrigger, {
+          key: 2,
+          class: "gcsa-date-picker__nav gcsa-focus-ring",
+          "aria-label": r.navLabels.nextMonth
+        }, {
+          default: t(() => [
+            l(m, {
+              name: "chevronLeft",
+              size: "sm",
+              class: "gcsa-date-picker__nav-icon--next"
+            })
+          ]),
+          _: 1
+        }, 8, ["aria-label"])) : (e(), n("span", P))
+      ]),
+      l(a(s).Table, { class: "gcsa-date-picker__table" }, {
+        default: t(() => [
+          l(a(s).TableHead, null, {
+            default: t(() => [
+              l(a(s).TableRow, null, {
+                default: t(() => [
+                  (e(!0), n(f, null, p(T.value, (o, _) => (e(), c(a(s).TableHeader, {
+                    key: o.short ?? _,
+                    class: "gcsa-date-picker__weekday"
+                  }, {
+                    default: t(() => [
+                      v(g(o.short), 1)
+                    ]),
+                    _: 2
+                  }, 1024))), 128))
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          }),
+          l(a(s).TableBody, null, {
+            default: t(() => [
+              (e(!0), n(f, null, p(b.value, (o, _) => (e(), c(a(s).TableRow, { key: _ }, {
+                default: t(() => [
+                  (e(!0), n(f, null, p(o, (u) => (e(), c(a(s).TableCell, {
+                    key: u.toString(),
+                    value: u,
+                    class: "gcsa-date-picker__cell"
+                  }, {
+                    default: t(() => [
+                      l(a(s).TableCellTrigger, { class: "gcsa-date-picker__day gcsa-focus-ring" }, {
+                        default: t(() => [
+                          v(g(u.day), 1)
+                        ]),
+                        _: 2
+                      }, 1024)
+                    ]),
+                    _: 2
+                  }, 1032, ["value"]))), 128))
+                ]),
+                _: 2
+              }, 1024))), 128))
+            ]),
+            _: 1
+          })
+        ]),
+        _: 1
+      })
+    ]));
+  }
+});
+export {
+  V as default
+};
+//# sourceMappingURL=GcsaDateRangeMonthPanel.vue.js.map

package/dist/components/GcsaDateRangeMonthPanel.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GcsaDateRangeMonthPanel.vue.js","sources":["../../src/components/GcsaDateRangeMonthPanel.vue"],"sourcesContent":["<template>\n  <div class=\"gcsa-date-range-picker__panel\">\n    <div class=\"gcsa-date-range-picker__panel-header\">\n      <DatePicker.PrevTrigger\n        v-if=\"showPrev\"\n        class=\"gcsa-date-picker__nav gcsa-focus-ring\"\n        :aria-label=\"navLabels.prevMonth\"\n      >\n        <GcsaIcon name=\"chevronLeft\" size=\"sm\" />\n      </DatePicker.PrevTrigger>\n      <span v-else class=\"gcsa-date-range-picker__nav-spacer\" aria-hidden=\"true\" />\n      <div class=\"gcsa-date-range-picker__panel-label\">{{ monthLabel }}</div>\n      <DatePicker.NextTrigger\n        v-if=\"showNext\"\n        class=\"gcsa-date-picker__nav gcsa-focus-ring\"\n        :aria-label=\"navLabels.nextMonth\"\n      >\n        <GcsaIcon name=\"chevronLeft\" size=\"sm\" class=\"gcsa-date-picker__nav-icon--next\" />\n      </DatePicker.NextTrigger>\n      <span v-else class=\"gcsa-date-range-picker__nav-spacer\" aria-hidden=\"true\" />\n    </div>\n    <DatePicker.Table class=\"gcsa-date-picker__table\">\n      <DatePicker.TableHead>\n        <DatePicker.TableRow>\n          <DatePicker.TableHeader\n            v-for=\"(weekDay, weekDayIndex) in weekDays\"\n            :key=\"weekDay.short ?? weekDayIndex\"\n            class=\"gcsa-date-picker__weekday\"\n          >\n            {{ weekDay.short }}\n          </DatePicker.TableHeader>\n        </DatePicker.TableRow>\n      </DatePicker.TableHead>\n      <DatePicker.TableBody>\n        <DatePicker.TableRow v-for=\"(week, weekIndex) in weeks\" :key=\"weekIndex\">\n          <DatePicker.TableCell\n            v-for=\"day in week\"\n            :key=\"day.toString()\"\n            :value=\"day\"\n            class=\"gcsa-date-picker__cell\"\n          >\n            <DatePicker.TableCellTrigger class=\"gcsa-date-picker__day gcsa-focus-ring\">\n              {{ day.day }}\n            </DatePicker.TableCellTrigger>\n          </DatePicker.TableCell>\n        </DatePicker.TableRow>\n      </DatePicker.TableBody>\n    </DatePicker.Table>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport { DatePicker } from '@ark-ui/vue/date-picker';\nimport type { GcsaDateRangeMonthPanelProps } from '../types/componentProps';\nimport GcsaIcon from './GcsaIcon.vue';\n\ndefineOptions({ name: 'GcsaDateRangeMonthPanel' });\n\nconst props = defineProps<GcsaDateRangeMonthPanelProps>();\n\nconst offset = computed(() => props.dp.getOffset({ months: props.monthOffset }));\nconst weeks = computed(() => offset.value.weeks);\nconst monthLabel = computed(() => offset.value.visibleRangeText.start);\nconst weekDays = computed(() => props.dp.weekDays);\n</script>\n"],"names":["props","__props","offset","computed","weeks","monthLabel","weekDays","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_hoisted_2","_createBlock","_unref","DatePicker","_createVNode","GcsaIcon","_hoisted_3","_hoisted_4","_toDisplayString","_hoisted_5","_Fragment","_renderList","weekDay","weekDayIndex","_createTextVNode","week","weekIndex","day"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA2DA,UAAMA,IAAQC,GAERC,IAASC,EAAS,MAAMH,EAAM,GAAG,UAAU,EAAE,QAAQA,EAAM,YAAA,CAAa,CAAC,GACzEI,IAAQD,EAAS,MAAMD,EAAO,MAAM,KAAK,GACzCG,IAAaF,EAAS,MAAMD,EAAO,MAAM,iBAAiB,KAAK,GAC/DI,IAAWH,EAAS,MAAMH,EAAM,GAAG,QAAQ;sBA/D/CO,EAAA,GAAAC,EA+CM,OA/CNC,GA+CM;AAAA,MA9CJC,EAkBM,OAlBNC,GAkBM;AAAA,QAhBIV,EAAA,iBADRW,EAMyBC,EAAAC,CAAA,EAAA,aAAA;AAAA;UAJvB,OAAM;AAAA,UACL,cAAYb,EAAA,UAAU;AAAA,QAAA;qBAEvB,MAAyC;AAAA,YAAzCc,EAAyCC,GAAA;AAAA,cAA/B,MAAK;AAAA,cAAc,MAAK;AAAA,YAAA;;;kCAEpCT,EAAA,GAAAC,EAA6E,QAA7ES,CAA6E;AAAA,QAC7EP,EAAuE,OAAvEQ,GAAuEC,EAAnBd,EAAA,KAAU,GAAA,CAAA;AAAA,QAEtDJ,EAAA,iBADRW,EAMyBC,EAAAC,CAAA,EAAA,aAAA;AAAA;UAJvB,OAAM;AAAA,UACL,cAAYb,EAAA,UAAU;AAAA,QAAA;qBAEvB,MAAkF;AAAA,YAAlFc,EAAkFC,GAAA;AAAA,cAAxE,MAAK;AAAA,cAAc,MAAK;AAAA,cAAK,OAAM;AAAA,YAAA;;;kCAE/CT,EAAA,GAAAC,EAA6E,QAA7EY,CAA6E;AAAA,MAAA;MAE/EL,EA0BmBF,EAAAC,CAAA,EAAA,OAAA,EA1BD,OAAM,6BAAyB;AAAA,mBAC/C,MAUuB;AAAA,UAVvBC,EAUuBF,EAAAC,CAAA,EAAA,WAAA,MAAA;AAAA,uBATrB,MAQsB;AAAA,cARtBC,EAQsBF,EAAAC,CAAA,EAAA,UAAA,MAAA;AAAA,2BANlB,MAA2C;AAAA,mBAD7CP,EAAA,EAAA,GAAAC,EAMyBa,GAAA,MAAAC,EALWhB,EAAA,OAAQ,CAAlCiB,GAASC,YADnBZ,EAMyBC,EAAAC,CAAA,EAAA,aAAA;AAAA,oBAJtB,KAAKS,EAAQ,SAASC;AAAA,oBACvB,OAAM;AAAA,kBAAA;+BAEN,MAAmB;AAAA,sBAAhBC,EAAAN,EAAAI,EAAQ,KAAK,GAAA,CAAA;AAAA,oBAAA;;;;;;;;;UAItBR,EAauBF,EAAAC,CAAA,EAAA,WAAA,MAAA;AAAA,uBAZA,MAAkC;AAAA,eAAvDP,EAAA,EAAA,GAAAC,EAWsBa,GAAA,MAAAC,EAX2BlB,EAAA,OAAK,CAAzBsB,GAAMC,YAAnCf,EAWsBC,EAAAC,CAAA,EAAA,UAAA,EAXmC,KAAKa,KAAS;AAAA,2BAEnE,MAAmB;AAAA,0BADrBnB,EASuBa,GAAA,MAAAC,EARPI,GAAI,CAAXE,YADThB,EASuBC,EAAAC,CAAA,EAAA,WAAA;AAAA,oBAPpB,KAAKc,EAAI,SAAA;AAAA,oBACT,OAAOA;AAAA,oBACR,OAAM;AAAA,kBAAA;+BAEN,MAE8B;AAAA,sBAF9Bb,EAE8BF,EAAAC,CAAA,EAAA,kBAAA,EAFD,OAAM,2CAAuC;AAAA,mCACxE,MAAa;AAAA,0BAAVW,EAAAN,EAAAS,EAAI,GAAG,GAAA,CAAA;AAAA,wBAAA;;;;;;;;;;;;;;;;;;"}

package/dist/components/GcsaDateRangeMonthPanel2.vue.js

@@ -0,0 +1,5 @@
+import f from "./GcsaDateRangeMonthPanel.vue.js";
+export {
+  f as default
+};
+//# sourceMappingURL=GcsaDateRangeMonthPanel2.vue.js.map

package/dist/components/GcsaDateRangeMonthPanel2.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GcsaDateRangeMonthPanel2.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/GcsaDateRangePicker.vue.d.ts

@@ -0,0 +1,10 @@
+import { GcsaDatePickerMode, GcsaDateRangeValue, GcsaMonthRangeValue } from '@gcsa/console-core';
+import { GcsaDateRangePickerProps } from '../types/componentProps';
+declare const _default: import('vue').DefineComponent<GcsaDateRangePickerProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: GcsaDateRangeValue | GcsaMonthRangeValue) => any;
+}, string, import('vue').PublicProps, Readonly<GcsaDateRangePickerProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: GcsaDateRangeValue | GcsaMonthRangeValue) => any) | undefined;
+}>, {
+    picker: GcsaDatePickerMode;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/components/GcsaDateRangePicker.vue.js

@@ -0,0 +1,252 @@
+import { defineComponent as $, computed as c, openBlock as i, createBlock as k, unref as a, withCtx as t, createVNode as e, createElementVNode as d, toDisplayString as h, normalizeClass as U, createElementBlock as g, Fragment as b, renderList as w, createTextVNode as F } from "vue";
+import { parseDate as x, DatePicker as l } from "@ark-ui/vue/date-picker";
+import { createGcsaPopupPositioning as I, getGcsaLocaleMessages as W, getGcsaStartOfWeek as j } from "@gcsa/console-core";
+import V from "./GcsaIcon.vue.js";
+import q from "./GcsaPortal.vue.js";
+import A from "./GcsaSelect.vue.js";
+import P from "./GcsaDateRangeMonthPanel.vue.js";
+import { useGcsaLocale as H } from "../composables/useGcsaLocale.js";
+import { gcsaDateRangeToDateValues as J, gcsaNormalizeDateBoundary as y, gcsaDatePickerCellsToOptions as K, gcsaDatePickerFormat as Q, gcsaDatePickerParse as X, gcsaDateValuesToRange as Z } from "../utils/gcsaDateValue.js";
+const ee = {
+  class: "gcsa-date-range-picker__separator",
+  "aria-hidden": "true"
+}, ae = {
+  key: 0,
+  class: "gcsa-date-range-picker__panel gcsa-date-range-picker__panel--month"
+}, le = { class: "gcsa-date-range-picker__panel-header" }, te = { class: "gcsa-date-picker__selects gcsa-date-range-picker__year-select" }, oe = { class: "gcsa-date-picker__filter gcsa-date-picker__filter--year" }, re = {
+  key: 1,
+  class: "gcsa-date-range-picker__panels"
+}, _e = /* @__PURE__ */ $({
+  name: "GcsaDateRangePicker",
+  __name: "GcsaDateRangePicker",
+  props: {
+    modelValue: {},
+    picker: { default: "date" },
+    placeholderStart: {},
+    placeholderEnd: {},
+    locale: {},
+    disabled: { type: Boolean },
+    invalid: { type: Boolean },
+    min: {},
+    max: {},
+    clearable: { type: Boolean }
+  },
+  emits: ["update:modelValue"],
+  setup(m, { emit: C }) {
+    const T = I({ fitViewport: !0 }), o = m, D = C, B = H(), _ = c(() => o.locale ?? B.value), n = c(() => W(_.value).datePicker), S = c(() => j(_.value)), s = c(() => o.picker === "month"), M = c(
+      () => o.placeholderStart ?? (s.value ? n.value.placeholderStartMonth : n.value.placeholderStart)
+    ), E = c(
+      () => o.placeholderEnd ?? (s.value ? n.value.placeholderEndMonth : n.value.placeholderEnd)
+    ), G = c(() => J(o.modelValue, o.picker)), L = c(() => {
+      const r = y(o.min, o.picker);
+      return r ? x(r) : void 0;
+    }), z = c(() => {
+      const r = y(o.max, o.picker);
+      return r ? x(r) : void 0;
+    });
+    function N(r, u) {
+      return Q(r, u, o.picker);
+    }
+    function R(r, u) {
+      return X(r, u, o.picker);
+    }
+    function O(r) {
+      D("update:modelValue", Z(r, o.picker));
+    }
+    return (r, u) => (i(), k(a(l).Root, {
+      "model-value": G.value,
+      locale: _.value,
+      "start-of-week": S.value,
+      positioning: a(T),
+      "selection-mode": "range",
+      "num-of-months": s.value ? 1 : 2,
+      "open-on-click": "",
+      "close-on-select": "",
+      disabled: m.disabled,
+      invalid: m.invalid,
+      min: L.value,
+      max: z.value,
+      "min-view": s.value ? "month" : void 0,
+      "max-view": s.value ? "month" : void 0,
+      "default-view": s.value ? "month" : void 0,
+      format: N,
+      parse: R,
+      "onUpdate:modelValue": O
+    }, {
+      default: t(() => [
+        e(a(l).Control, {
+          class: "gcsa-date-range-picker__control gcsa-date-picker__control",
+          "data-invalid": m.invalid || void 0
+        }, {
+          default: t(() => [
+            e(a(l).Input, {
+              index: 0,
+              class: "gcsa-date-picker__input gcsa-input",
+              placeholder: M.value
+            }, null, 8, ["placeholder"]),
+            d("span", ee, h(n.value.rangeSeparator), 1),
+            e(a(l).Input, {
+              index: 1,
+              class: "gcsa-date-picker__input gcsa-input",
+              placeholder: E.value
+            }, null, 8, ["placeholder"]),
+            e(a(l).Trigger, {
+              class: "gcsa-date-picker__trigger gcsa-focus-ring",
+              "aria-label": n.value.openCalendar
+            }, {
+              default: t(() => [...u[0] || (u[0] = [
+                d("svg", {
+                  width: "16",
+                  height: "16",
+                  viewBox: "0 0 16 16",
+                  fill: "none",
+                  "aria-hidden": "true"
+                }, [
+                  d("rect", {
+                    x: "2",
+                    y: "3",
+                    width: "12",
+                    height: "11",
+                    rx: "1.5",
+                    stroke: "currentColor",
+                    "stroke-width": "1.2"
+                  }),
+                  d("path", {
+                    d: "M2 6.5h12M5.5 1.5v2M10.5 1.5v2",
+                    stroke: "currentColor",
+                    "stroke-width": "1.2",
+                    "stroke-linecap": "round"
+                  })
+                ], -1)
+              ])]),
+              _: 1
+            }, 8, ["aria-label"])
+          ]),
+          _: 1
+        }, 8, ["data-invalid"]),
+        e(q, null, {
+          default: t(() => [
+            e(a(l).Positioner, { class: "gcsa-date-picker__positioner" }, {
+              default: t(() => [
+                e(a(l).Content, {
+                  class: U(["gcsa-date-range-picker__content gcsa-date-picker__content gcsa-ui-surface", { "gcsa-date-range-picker__content--month": s.value }])
+                }, {
+                  default: t(() => [
+                    e(a(l).View, {
+                      view: s.value ? "month" : "day"
+                    }, {
+                      default: t(() => [
+                        e(a(l).Context, null, {
+                          default: t((p) => [
+                            s.value ? (i(), g("div", ae, [
+                              d("div", le, [
+                                e(a(l).PrevTrigger, {
+                                  class: "gcsa-date-picker__nav gcsa-focus-ring",
+                                  "aria-label": n.value.prevYear
+                                }, {
+                                  default: t(() => [
+                                    e(V, {
+                                      name: "chevronLeft",
+                                      size: "sm"
+                                    })
+                                  ]),
+                                  _: 1
+                                }, 8, ["aria-label"]),
+                                d("div", te, [
+                                  d("div", oe, [
+                                    e(A, {
+                                      "model-value": String(p.focusedValue.year),
+                                      options: a(K)(p.getYears()),
+                                      portalled: !1,
+                                      "same-width": !1,
+                                      "list-max-height": 240,
+                                      "list-hint-threshold": 100,
+                                      "onUpdate:modelValue": (v) => p.focusYear(Number(v))
+                                    }, null, 8, ["model-value", "options", "onUpdate:modelValue"])
+                                  ])
+                                ]),
+                                e(a(l).NextTrigger, {
+                                  class: "gcsa-date-picker__nav gcsa-focus-ring",
+                                  "aria-label": n.value.nextYear
+                                }, {
+                                  default: t(() => [
+                                    e(V, {
+                                      name: "chevronLeft",
+                                      size: "sm",
+                                      class: "gcsa-date-picker__nav-icon--next"
+                                    })
+                                  ]),
+                                  _: 1
+                                }, 8, ["aria-label"])
+                              ]),
+                              e(a(l).Table, {
+                                class: "gcsa-date-picker__table gcsa-date-picker__table--month",
+                                columns: 3
+                              }, {
+                                default: t(() => [
+                                  e(a(l).TableBody, null, {
+                                    default: t(() => [
+                                      (i(!0), g(b, null, w(p.getMonthsGrid({ columns: 3 }), (v, Y) => (i(), k(a(l).TableRow, { key: Y }, {
+                                        default: t(() => [
+                                          (i(!0), g(b, null, w(v, (f) => (i(), k(a(l).TableCell, {
+                                            key: f.value,
+                                            value: f.value,
+                                            class: "gcsa-date-picker__cell"
+                                          }, {
+                                            default: t(() => [
+                                              e(a(l).TableCellTrigger, { class: "gcsa-date-picker__month gcsa-focus-ring" }, {
+                                                default: t(() => [
+                                                  F(h(f.label), 1)
+                                                ]),
+                                                _: 2
+                                              }, 1024)
+                                            ]),
+                                            _: 2
+                                          }, 1032, ["value"]))), 128))
+                                        ]),
+                                        _: 2
+                                      }, 1024))), 128))
+                                    ]),
+                                    _: 2
+                                  }, 1024)
+                                ]),
+                                _: 2
+                              }, 1024)
+                            ])) : (i(), g("div", re, [
+                              e(P, {
+                                dp: p,
+                                "month-offset": 0,
+                                "show-prev": "",
+                                "nav-labels": n.value
+                              }, null, 8, ["dp", "nav-labels"]),
+                              e(P, {
+                                dp: p,
+                                "month-offset": 1,
+                                "show-next": "",
+                                "nav-labels": n.value
+                              }, null, 8, ["dp", "nav-labels"])
+                            ]))
+                          ]),
+                          _: 1
+                        })
+                      ]),
+                      _: 1
+                    }, 8, ["view"])
+                  ]),
+                  _: 1
+                }, 8, ["class"])
+              ]),
+              _: 1
+            })
+          ]),
+          _: 1
+        })
+      ]),
+      _: 1
+    }, 8, ["model-value", "locale", "start-of-week", "positioning", "num-of-months", "disabled", "invalid", "min", "max", "min-view", "max-view", "default-view"]));
+  }
+});
+export {
+  _e as default
+};
+//# sourceMappingURL=GcsaDateRangePicker.vue.js.map

package/dist/components/GcsaDateRangePicker.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GcsaDateRangePicker.vue.js","sources":["../../src/components/GcsaDateRangePicker.vue"],"sourcesContent":["<template>\n  <DatePicker.Root\n    :model-value=\"pickerValue\"\n    :locale=\"resolvedLocale\"\n    :start-of-week=\"startOfWeek\"\n    :positioning=\"positioningOptions\"\n    selection-mode=\"range\"\n    :num-of-months=\"isMonthPicker ? 1 : 2\"\n    open-on-click\n    close-on-select\n    :disabled=\"disabled\"\n    :invalid=\"invalid\"\n    :min=\"minValue\"\n    :max=\"maxValue\"\n    :min-view=\"isMonthPicker ? 'month' : undefined\"\n    :max-view=\"isMonthPicker ? 'month' : undefined\"\n    :default-view=\"isMonthPicker ? 'month' : undefined\"\n    :format=\"formatValue\"\n    :parse=\"parseValue\"\n    @update:model-value=\"onPickerChange\"\n  >\n    <DatePicker.Control\n      class=\"gcsa-date-range-picker__control gcsa-date-picker__control\"\n      :data-invalid=\"invalid || undefined\"\n    >\n      <DatePicker.Input\n        :index=\"0\"\n        class=\"gcsa-date-picker__input gcsa-input\"\n        :placeholder=\"resolvedPlaceholderStart\"\n      />\n      <span class=\"gcsa-date-range-picker__separator\" aria-hidden=\"true\">\n        {{ messages.rangeSeparator }}\n      </span>\n      <DatePicker.Input\n        :index=\"1\"\n        class=\"gcsa-date-picker__input gcsa-input\"\n        :placeholder=\"resolvedPlaceholderEnd\"\n      />\n      <DatePicker.Trigger\n        class=\"gcsa-date-picker__trigger gcsa-focus-ring\"\n        :aria-label=\"messages.openCalendar\"\n      >\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" aria-hidden=\"true\">\n          <rect x=\"2\" y=\"3\" width=\"12\" height=\"11\" rx=\"1.5\" stroke=\"currentColor\" stroke-width=\"1.2\" />\n          <path d=\"M2 6.5h12M5.5 1.5v2M10.5 1.5v2\" stroke=\"currentColor\" stroke-width=\"1.2\" stroke-linecap=\"round\" />\n        </svg>\n      </DatePicker.Trigger>\n    </DatePicker.Control>\n    <GcsaPortal>\n      <DatePicker.Positioner class=\"gcsa-date-picker__positioner\">\n        <DatePicker.Content\n          class=\"gcsa-date-range-picker__content gcsa-date-picker__content gcsa-ui-surface\"\n          :class=\"{ 'gcsa-date-range-picker__content--month': isMonthPicker }\"\n        >\n          <DatePicker.View :view=\"isMonthPicker ? 'month' : 'day'\">\n            <DatePicker.Context v-slot=\"dp\">\n              <template v-if=\"isMonthPicker\">\n                <div class=\"gcsa-date-range-picker__panel gcsa-date-range-picker__panel--month\">\n                  <div class=\"gcsa-date-range-picker__panel-header\">\n                    <DatePicker.PrevTrigger\n                      class=\"gcsa-date-picker__nav gcsa-focus-ring\"\n                      :aria-label=\"messages.prevYear\"\n                    >\n                      <GcsaIcon name=\"chevronLeft\" size=\"sm\" />\n                    </DatePicker.PrevTrigger>\n                    <div class=\"gcsa-date-picker__selects gcsa-date-range-picker__year-select\">\n                      <div class=\"gcsa-date-picker__filter gcsa-date-picker__filter--year\">\n                        <GcsaSelect\n                          :model-value=\"String(dp.focusedValue.year)\"\n                          :options=\"gcsaDatePickerCellsToOptions(dp.getYears())\"\n                          :portalled=\"false\"\n                          :same-width=\"false\"\n                          :list-max-height=\"240\"\n                          :list-hint-threshold=\"100\"\n                          @update:model-value=\"(v) => dp.focusYear(Number(v))\"\n                        />\n                      </div>\n                    </div>\n                    <DatePicker.NextTrigger\n                      class=\"gcsa-date-picker__nav gcsa-focus-ring\"\n                      :aria-label=\"messages.nextYear\"\n                    >\n                      <GcsaIcon name=\"chevronLeft\" size=\"sm\" class=\"gcsa-date-picker__nav-icon--next\" />\n                    </DatePicker.NextTrigger>\n                  </div>\n                  <DatePicker.Table class=\"gcsa-date-picker__table gcsa-date-picker__table--month\" :columns=\"3\">\n                    <DatePicker.TableBody>\n                      <DatePicker.TableRow\n                        v-for=\"(row, rowIndex) in dp.getMonthsGrid({ columns: 3 })\"\n                        :key=\"rowIndex\"\n                      >\n                        <DatePicker.TableCell\n                          v-for=\"month in row\"\n                          :key=\"month.value\"\n                          :value=\"month.value\"\n                          class=\"gcsa-date-picker__cell\"\n                        >\n                          <DatePicker.TableCellTrigger class=\"gcsa-date-picker__month gcsa-focus-ring\">\n                            {{ month.label }}\n                          </DatePicker.TableCellTrigger>\n                        </DatePicker.TableCell>\n                      </DatePicker.TableRow>\n                    </DatePicker.TableBody>\n                  </DatePicker.Table>\n                </div>\n              </template>\n              <div v-else class=\"gcsa-date-range-picker__panels\">\n                <GcsaDateRangeMonthPanel\n                  :dp=\"dp\"\n                  :month-offset=\"0\"\n                  show-prev\n                  :nav-labels=\"messages\"\n                />\n                <GcsaDateRangeMonthPanel\n                  :dp=\"dp\"\n                  :month-offset=\"1\"\n                  show-next\n                  :nav-labels=\"messages\"\n                />\n              </div>\n            </DatePicker.Context>\n          </DatePicker.View>\n        </DatePicker.Content>\n      </DatePicker.Positioner>\n    </GcsaPortal>\n  </DatePicker.Root>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport { DatePicker, parseDate } from '@ark-ui/vue/date-picker';\nimport type { DateValue } from '@ark-ui/vue/date-picker';\nimport {\n  getGcsaLocaleMessages,\n  getGcsaStartOfWeek,\n  createGcsaPopupPositioning,\n  type GcsaConsoleLocale,\n  type GcsaDatePickerMode,\n  type GcsaDateRangeValue,\n  type GcsaMonthRangeValue\n} from '@gcsa/console-core';\nimport type { GcsaDateRangePickerProps } from '../types/componentProps';\nimport GcsaIcon from './GcsaIcon.vue';\nimport GcsaPortal from './GcsaPortal.vue';\nimport GcsaSelect from './GcsaSelect.vue';\nimport GcsaDateRangeMonthPanel from './GcsaDateRangeMonthPanel.vue';\nimport { useGcsaLocale } from '../composables/useGcsaLocale';\nimport {\n  gcsaDatePickerCellsToOptions,\n  gcsaDatePickerFormat,\n  gcsaDatePickerParse,\n  gcsaDateRangeToDateValues,\n  gcsaDateValuesToRange,\n  gcsaNormalizeDateBoundary\n} from '../utils/gcsaDateValue';\n\ndefineOptions({ name: 'GcsaDateRangePicker' });\n\nconst positioningOptions = createGcsaPopupPositioning({ fitViewport: true });\n\nconst props = withDefaults(\n  defineProps<GcsaDateRangePickerProps>(),\n  { picker: 'date' }\n);\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: GcsaDateRangeValue | GcsaMonthRangeValue];\n}>();\n\nconst configLocale = useGcsaLocale();\nconst resolvedLocale = computed(() => props.locale ?? configLocale.value);\nconst messages = computed(() => getGcsaLocaleMessages(resolvedLocale.value).datePicker);\nconst startOfWeek = computed(() => getGcsaStartOfWeek(resolvedLocale.value));\nconst isMonthPicker = computed(() => props.picker === 'month');\nconst resolvedPlaceholderStart = computed(\n  () =>\n    props.placeholderStart ??\n    (isMonthPicker.value ? messages.value.placeholderStartMonth : messages.value.placeholderStart)\n);\nconst resolvedPlaceholderEnd = computed(\n  () =>\n    props.placeholderEnd ??\n    (isMonthPicker.value ? messages.value.placeholderEndMonth : messages.value.placeholderEnd)\n);\n\nconst pickerValue = computed(() => gcsaDateRangeToDateValues(props.modelValue, props.picker));\n\nconst minValue = computed(() => {\n  const normalized = gcsaNormalizeDateBoundary(props.min, props.picker);\n  return normalized ? parseDate(normalized) : undefined;\n});\nconst maxValue = computed(() => {\n  const normalized = gcsaNormalizeDateBoundary(props.max, props.picker);\n  return normalized ? parseDate(normalized) : undefined;\n});\n\nfunction formatValue(date: DateValue, details: { locale: string; timeZone: string }) {\n  return gcsaDatePickerFormat(date, details, props.picker);\n}\n\nfunction parseValue(value: string, details: { locale: string; timeZone: string }) {\n  return gcsaDatePickerParse(value, details, props.picker);\n}\n\nfunction onPickerChange(value: DateValue[]) {\n  emit('update:modelValue', gcsaDateValuesToRange(value, props.picker));\n}\n</script>\n"],"names":["positioningOptions","createGcsaPopupPositioning","props","__props","emit","__emit","configLocale","useGcsaLocale","resolvedLocale","computed","messages","getGcsaLocaleMessages","startOfWeek","getGcsaStartOfWeek","isMonthPicker","resolvedPlaceholderStart","resolvedPlaceholderEnd","pickerValue","gcsaDateRangeToDateValues","minValue","normalized","gcsaNormalizeDateBoundary","parseDate","maxValue","formatValue","date","details","gcsaDatePickerFormat","parseValue","value","gcsaDatePickerParse","onPickerChange","gcsaDateValuesToRange","_createBlock","_unref","DatePicker","_createVNode","_createElementVNode","_hoisted_1","_toDisplayString","_cache","GcsaPortal","_normalizeClass","_withCtx","dp","_openBlock","_createElementBlock","_hoisted_2","_hoisted_3","GcsaIcon","_hoisted_4","_hoisted_5","GcsaSelect","gcsaDatePickerCellsToOptions","_Fragment","row","rowIndex","_renderList","month","_createTextVNode","_hoisted_6","GcsaDateRangeMonthPanel"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8JA,UAAMA,IAAqBC,EAA2B,EAAE,aAAa,IAAM,GAErEC,IAAQC,GAKRC,IAAOC,GAIPC,IAAeC,EAAA,GACfC,IAAiBC,EAAS,MAAMP,EAAM,UAAUI,EAAa,KAAK,GAClEI,IAAWD,EAAS,MAAME,EAAsBH,EAAe,KAAK,EAAE,UAAU,GAChFI,IAAcH,EAAS,MAAMI,EAAmBL,EAAe,KAAK,CAAC,GACrEM,IAAgBL,EAAS,MAAMP,EAAM,WAAW,OAAO,GACvDa,IAA2BN;AAAA,MAC/B,MACEP,EAAM,qBACLY,EAAc,QAAQJ,EAAS,MAAM,wBAAwBA,EAAS,MAAM;AAAA,IAAA,GAE3EM,IAAyBP;AAAA,MAC7B,MACEP,EAAM,mBACLY,EAAc,QAAQJ,EAAS,MAAM,sBAAsBA,EAAS,MAAM;AAAA,IAAA,GAGzEO,IAAcR,EAAS,MAAMS,EAA0BhB,EAAM,YAAYA,EAAM,MAAM,CAAC,GAEtFiB,IAAWV,EAAS,MAAM;AAC9B,YAAMW,IAAaC,EAA0BnB,EAAM,KAAKA,EAAM,MAAM;AACpE,aAAOkB,IAAaE,EAAUF,CAAU,IAAI;AAAA,IAC9C,CAAC,GACKG,IAAWd,EAAS,MAAM;AAC9B,YAAMW,IAAaC,EAA0BnB,EAAM,KAAKA,EAAM,MAAM;AACpE,aAAOkB,IAAaE,EAAUF,CAAU,IAAI;AAAA,IAC9C,CAAC;AAED,aAASI,EAAYC,GAAiBC,GAA+C;AACnF,aAAOC,EAAqBF,GAAMC,GAASxB,EAAM,MAAM;AAAA,IACzD;AAEA,aAAS0B,EAAWC,GAAeH,GAA+C;AAChF,aAAOI,EAAoBD,GAAOH,GAASxB,EAAM,MAAM;AAAA,IACzD;AAEA,aAAS6B,EAAeF,GAAoB;AAC1C,MAAAzB,EAAK,qBAAqB4B,EAAsBH,GAAO3B,EAAM,MAAM,CAAC;AAAA,IACtE;2BA7ME+B,EA4HkBC,EAAAC,CAAA,EAAA,MAAA;AAAA,MA3Hf,eAAalB,EAAA;AAAA,MACb,QAAQT,EAAA;AAAA,MACR,iBAAeI,EAAA;AAAA,MACf,aAAasB,EAAAlC,CAAA;AAAA,MACd,kBAAe;AAAA,MACd,iBAAec,EAAA,QAAa,IAAA;AAAA,MAC7B,iBAAA;AAAA,MACA,mBAAA;AAAA,MACC,UAAUX,EAAA;AAAA,MACV,SAASA,EAAA;AAAA,MACT,KAAKgB,EAAA;AAAA,MACL,KAAKI,EAAA;AAAA,MACL,YAAUT,EAAA,QAAa,UAAa;AAAA,MACpC,YAAUA,EAAA,QAAa,UAAa;AAAA,MACpC,gBAAcA,EAAA,QAAa,UAAa;AAAA,MACxC,QAAQU;AAAA,MACR,OAAOI;AAAA,MACP,uBAAoBG;AAAA,IAAA;iBAErB,MA0BqB;AAAA,QA1BrBK,EA0BqBF,EAAAC,CAAA,EAAA,SAAA;AAAA,UAzBnB,OAAM;AAAA,UACL,gBAAchC,EAAA,WAAW;AAAA,QAAA;qBAE1B,MAIE;AAAA,YAJFiC,EAIEF,EAAAC,CAAA,EAAA,OAAA;AAAA,cAHC,OAAO;AAAA,cACR,OAAM;AAAA,cACL,aAAapB,EAAA;AAAA,YAAA;YAEhBsB,EAEO,QAFPC,IAEOC,EADF7B,EAAA,MAAS,cAAc,GAAA,CAAA;AAAA,YAE5B0B,EAIEF,EAAAC,CAAA,EAAA,OAAA;AAAA,cAHC,OAAO;AAAA,cACR,OAAM;AAAA,cACL,aAAanB,EAAA;AAAA,YAAA;YAEhBoB,EAQqBF,EAAAC,CAAA,EAAA,SAAA;AAAA,cAPnB,OAAM;AAAA,cACL,cAAYzB,EAAA,MAAS;AAAA,YAAA;yBAEtB,MAGM,CAAA,GAAA8B,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA;AAAA,gBAHNH,EAGM,OAAA;AAAA,kBAHD,OAAM;AAAA,kBAAK,QAAO;AAAA,kBAAK,SAAQ;AAAA,kBAAY,MAAK;AAAA,kBAAO,eAAY;AAAA,gBAAA;kBACtEA,EAA6F,QAAA;AAAA,oBAAvF,GAAE;AAAA,oBAAI,GAAE;AAAA,oBAAI,OAAM;AAAA,oBAAK,QAAO;AAAA,oBAAK,IAAG;AAAA,oBAAM,QAAO;AAAA,oBAAe,gBAAa;AAAA,kBAAA;kBACrFA,EAA2G,QAAA;AAAA,oBAArG,GAAE;AAAA,oBAAiC,QAAO;AAAA,oBAAe,gBAAa;AAAA,oBAAM,kBAAe;AAAA,kBAAA;;;;;;;;QAIvGD,EA4EaK,GAAA,MAAA;AAAA,qBA3EX,MA0EwB;AAAA,YA1ExBL,EA0EwBF,EAAAC,CAAA,EAAA,YAAA,EA1ED,OAAM,kCAA8B;AAAA,yBACzD,MAwEqB;AAAA,gBAxErBC,EAwEqBF,EAAAC,CAAA,EAAA,SAAA;AAAA,kBAvEnB,OAAKO,EAAA,CAAC,6EAA2E,EAAA,0CAC7B5B,EAAA,OAAa,CAAA;AAAA,gBAAA;6BAEjE,MAmEkB;AAAA,oBAnElBsB,EAmEkBF,EAAAC,CAAA,EAAA,MAAA;AAAA,sBAnEA,MAAMrB,EAAA,QAAa,UAAA;AAAA,oBAAA;iCACnC,MAiEqB;AAAA,wBAjErBsB,EAiEqBF,EAAAC,CAAA,EAAA,SAAA,MAAA;AAAA,0BAhEnB,SAAAQ,EAAA,CAD0BC,MAAE;AAAA,4BACZ9B,EAAA,SACd+B,EAAA,GAAAC,EA+CM,OA/CNC,IA+CM;AAAA,8BA9CJV,EA0BM,OA1BNW,IA0BM;AAAA,gCAzBJZ,EAKyBF,EAAAC,CAAA,EAAA,aAAA;AAAA,kCAJvB,OAAM;AAAA,kCACL,cAAYzB,EAAA,MAAS;AAAA,gCAAA;6CAEtB,MAAyC;AAAA,oCAAzC0B,EAAyCa,GAAA;AAAA,sCAA/B,MAAK;AAAA,sCAAc,MAAK;AAAA,oCAAA;;;;gCAEpCZ,EAYM,OAZNa,IAYM;AAAA,kCAXJb,EAUM,OAVNc,IAUM;AAAA,oCATJf,EAQEgB,GAAA;AAAA,sCAPC,eAAa,OAAOR,EAAG,aAAa,IAAI;AAAA,sCACxC,SAASV,EAAAmB,CAAA,EAA6BT,EAAG,UAAQ;AAAA,sCACjD,WAAW;AAAA,sCACX,cAAY;AAAA,sCACZ,mBAAiB;AAAA,sCACjB,uBAAqB;AAAA,sCACrB,uBAAkB,CAAG,MAAMA,EAAG,UAAU,OAAO,CAAC,CAAA;AAAA,oCAAA;;;gCAIvDR,EAKyBF,EAAAC,CAAA,EAAA,aAAA;AAAA,kCAJvB,OAAM;AAAA,kCACL,cAAYzB,EAAA,MAAS;AAAA,gCAAA;6CAEtB,MAAkF;AAAA,oCAAlF0B,EAAkFa,GAAA;AAAA,sCAAxE,MAAK;AAAA,sCAAc,MAAK;AAAA,sCAAK,OAAM;AAAA,oCAAA;;;;;8BAGjDb,EAkBmBF,EAAAC,CAAA,EAAA,OAAA;AAAA,gCAlBD,OAAM;AAAA,gCAA0D,SAAS;AAAA,8BAAA;2CACzF,MAgBuB;AAAA,kCAhBvBC,EAgBuBF,EAAAC,CAAA,EAAA,WAAA,MAAA;AAAA,+CAdnB,MAA2D;AAAA,uCAD7DU,EAAA,EAAA,GAAAC,EAcsBQ,WAbMV,EAAG,cAAa,EAAA,SAAA,EAAA,CAAA,GAAA,CAAlCW,GAAKC,YADfvB,EAcsBC,EAAAC,CAAA,EAAA,UAAA,EAZnB,KAAKqB,KAAQ;AAAA,mDAGZ,MAAoB;AAAA,kDADtBV,EASuBQ,GAAA,MAAAG,EARLF,GAAG,CAAZG,YADTzB,EASuBC,EAAAC,CAAA,EAAA,WAAA;AAAA,4CAPpB,KAAKuB,EAAM;AAAA,4CACX,OAAOA,EAAM;AAAA,4CACd,OAAM;AAAA,0CAAA;uDAEN,MAE8B;AAAA,8CAF9BtB,EAE8BF,EAAAC,CAAA,EAAA,kBAAA,EAFD,OAAM,6CAAyC;AAAA,2DAC1E,MAAiB;AAAA,kDAAdwB,EAAApB,EAAAmB,EAAM,KAAK,GAAA,CAAA;AAAA,gDAAA;;;;;;;;;;;;;;;mCAQ5Bb,EAAA,GAAAC,EAaM,OAbNc,IAaM;AAAA,8BAZJxB,EAKEyB,GAAA;AAAA,gCAJC,IAAAjB;AAAA,gCACA,gBAAc;AAAA,gCACf,aAAA;AAAA,gCACC,cAAYlC,EAAA;AAAA,8BAAA;8BAEf0B,EAKEyB,GAAA;AAAA,gCAJC,IAAAjB;AAAA,gCACA,gBAAc;AAAA,gCACf,aAAA;AAAA,gCACC,cAAYlC,EAAA;AAAA,8BAAA;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/GcsaDateRangePicker2.vue.js

@@ -0,0 +1,5 @@
+import f from "./GcsaDateRangePicker.vue.js";
+export {
+  f as default
+};
+//# sourceMappingURL=GcsaDateRangePicker2.vue.js.map

package/dist/components/GcsaDateRangePicker2.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GcsaDateRangePicker2.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/GcsaDateTimePicker.vue.d.ts

@@ -0,0 +1,11 @@
+import { GcsaDateTimePickerProps } from '../types/componentProps';
+declare const _default: import('vue').DefineComponent<GcsaDateTimePickerProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => any;
+}, string, import('vue').PublicProps, Readonly<GcsaDateTimePickerProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    hourColumn: HTMLDivElement;
+    minuteColumn: HTMLDivElement;
+    secondColumn: HTMLDivElement;
+}, any>;
+export default _default;