nuxt-hs-ui 2.0.30 → 2.0.31

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": ">=3.15.0"
   },
-  "version": "2.0.30",
+  "version": "2.0.31",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
     "unbuild": "2.0.0"

package/dist/runtime/components/form/datepicker.vue

@@ -9,7 +9,8 @@
 // [ node-modules ]
 import dayjs from "dayjs/esm/index";
 // flatpickr cdn 経由で使用する
-// import flatpickr from "flatpickr";
+import flatpickr from "flatpickr";
+import monthSelectPlugin from "flatpickr/dist/plugins/monthSelect";
 // [ vueuse ]
 import { useMounted } from "@vueuse/core";
 // [ NUXT ]
@@ -22,12 +23,16 @@ import {
   onMounted,
   nextTick,
   onUnmounted,
-  useHead,
+  // useHead,
 } from "#imports";
 // [ utils ]
 import { Sleep } from "../../utils/com";
 import type { ClassType } from "../../utils/class-style";
 import { GetTimeShiftValue, Dayjs, DayjsInit } from "../../utils/dayjs";
+// [ utils ]
+
+import { ja } from "../../types/flatpickr/ja";
+import { en } from "../../types/flatpickr/default";
 // [ composables ]
 import { useHsMisc } from "../../composables/use-hs-misc";
 import { useHsFocus } from "../../composables/use-hs-focus";
@@ -36,16 +41,16 @@ import { useHsMultiLang } from "../../composables/use-hs-multi-lang";
 // [ Components ]
 import InputFrame from "./input-frame.vue";
 
-useHead({
-  script: [
-    //
-    // https://npmcdn.com/flatpickr@4.6.13/dist/plugins/monthSelect/index.js
-    { src: `https://npmcdn.com/flatpickr/dist/flatpickr.min.js` },
-    { src: `https://npmcdn.com/flatpickr/dist/plugins/monthSelect` },
-    { src: `https://npmcdn.com/flatpickr/dist/l10n/ja.js` },
-    { src: `https://npmcdn.com/flatpickr/dist/l10n/default.js` },
-  ],
-});
+// useHead({
+//   script: [
+//     //
+//     // https://npmcdn.com/flatpickr@4.6.13/dist/plugins/monthSelect/index.js
+//     //{ src: `https://npmcdn.com/flatpickr/dist/flatpickr.min.js` },
+//     { src: `https://npmcdn.com/flatpickr/dist/plugins/monthSelect` },
+//     { src: `https://npmcdn.com/flatpickr/dist/l10n/ja.js` },
+//     { src: `https://npmcdn.com/flatpickr/dist/l10n/default.js` },
+//   ],
+// });
 
 // ----------------------------------------------------------------------------
 // [ nac-stroe ]
@@ -59,7 +64,6 @@ const hsMisc = useHsMisc();
 const isMounted = useMounted();
 // ----------------------------------------------------------------------------
 // flatpickr
-// const MonthSelectPlugin: any = monthSelectPlugin;
 const timeDateFormat = "YYYY-MM-DD HH:mm:ss.SSS";
 const timeOutputDateFormat = "HH:mm:ss.SSS";
 const timeShowDateFormat = "HH:mm";
@@ -209,7 +213,7 @@ const state = reactive<State>({
   date: null,
   option: {
     dateFormat: "Z",
-    locale: "ja",
+    locale: ja,
     time_24hr: true,
     minDate: undefined,
     maxDate: undefined,
@@ -355,9 +359,8 @@ const initFlatPickerOption = () => {
     state.option.disableMobile = true;
   }
   if (props.mode === "month") {
-    const monthSelectPlugin = (window as any).monthSelectPlugin;
     state.option.plugins = [
-      new monthSelectPlugin({
+      new (monthSelectPlugin as any)({
         shorthand: true, // デフォルトはfalse
         dateFormat: "m.y", // デフォルトは"F Y"
         altFormat: "F Y", // デフォルトは"F Y"
@@ -401,15 +404,14 @@ const generateFlatPickerOption = () => {
     switch (multiLang.state.lang) {
       case "jp":
       case "ja":
-        state.option.locale = "ja";
+        state.option.locale = ja;
         break;
       default:
-        state.option.locale = "en";
+        state.option.locale = en;
         break;
     }
     // state.option.position = 'above';
     // state.option.static = true;
-    const flatpickr = (window as any).flatpickr;
     state.picker = flatpickr(inputElement.value, state.option);
     state.picker.config.onChange.push(onChange);
     state.picker.config.onOpen.push(onOpen);
@@ -846,7 +848,7 @@ const computedIsFocusOpenBtn = computed(() => {
         {{ props.mode === "month" ? "Now" : "Today" }}
       </span>
     </div>
-    <template v-if="slots['right-icons']" #right-icons>
+    <template #right-icons>
       <template v-if="!props.hideDeleteBtn && !props.readonly">
         <div
           :class="

package/dist/runtime/types/flatpickr/default.d.ts

@@ -0,0 +1 @@
+export declare const en: any;

package/dist/runtime/types/flatpickr/default.js

@@ -0,0 +1,70 @@
+export const en = {
+  weekdays: {
+    shorthand: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
+    longhand: [
+      "Sunday",
+      "Monday",
+      "Tuesday",
+      "Wednesday",
+      "Thursday",
+      "Friday",
+      "Saturday"
+    ]
+  },
+  months: {
+    shorthand: [
+      "Jan",
+      "Feb",
+      "Mar",
+      "Apr",
+      "May",
+      "Jun",
+      "Jul",
+      "Aug",
+      "Sep",
+      "Oct",
+      "Nov",
+      "Dec"
+    ],
+    longhand: [
+      "January",
+      "February",
+      "March",
+      "April",
+      "May",
+      "June",
+      "July",
+      "August",
+      "September",
+      "October",
+      "November",
+      "December"
+    ]
+  },
+  daysInMonth: [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31],
+  firstDayOfWeek: 0,
+  ordinal: (nth) => {
+    const s = nth % 100;
+    if (s > 3 && s < 21) return "th";
+    switch (s % 10) {
+      case 1:
+        return "st";
+      case 2:
+        return "nd";
+      case 3:
+        return "rd";
+      default:
+        return "th";
+    }
+  },
+  rangeSeparator: " to ",
+  weekAbbreviation: "Wk",
+  scrollTitle: "Scroll to increment",
+  toggleTitle: "Click to toggle",
+  amPM: ["AM", "PM"],
+  yearAriaLabel: "Year",
+  monthAriaLabel: "Month",
+  hourAriaLabel: "Hour",
+  minuteAriaLabel: "Minute",
+  time_24hr: false
+};

package/dist/runtime/types/flatpickr/ja.d.ts

@@ -0,0 +1,17 @@
+export declare const ja: {
+    weekdays: {
+        shorthand: string[];
+        longhand: string[];
+    };
+    months: {
+        shorthand: string[];
+        longhand: string[];
+    };
+    time_24hr: boolean;
+    rangeSeparator: string;
+    monthAriaLabel: string;
+    amPM: string[];
+    yearAriaLabel: string;
+    hourAriaLabel: string;
+    minuteAriaLabel: string;
+};

package/dist/runtime/types/flatpickr/ja.js

@@ -0,0 +1,51 @@
+export const ja = {
+  weekdays: {
+    shorthand: ["\u65E5", "\u6708", "\u706B", "\u6C34", "\u6728", "\u91D1", "\u571F"],
+    longhand: [
+      "\u65E5\u66DC\u65E5",
+      "\u6708\u66DC\u65E5",
+      "\u706B\u66DC\u65E5",
+      "\u6C34\u66DC\u65E5",
+      "\u6728\u66DC\u65E5",
+      "\u91D1\u66DC\u65E5",
+      "\u571F\u66DC\u65E5"
+    ]
+  },
+  months: {
+    shorthand: [
+      "1\u6708",
+      "2\u6708",
+      "3\u6708",
+      "4\u6708",
+      "5\u6708",
+      "6\u6708",
+      "7\u6708",
+      "8\u6708",
+      "9\u6708",
+      "10\u6708",
+      "11\u6708",
+      "12\u6708"
+    ],
+    longhand: [
+      "1\u6708",
+      "2\u6708",
+      "3\u6708",
+      "4\u6708",
+      "5\u6708",
+      "6\u6708",
+      "7\u6708",
+      "8\u6708",
+      "9\u6708",
+      "10\u6708",
+      "11\u6708",
+      "12\u6708"
+    ]
+  },
+  time_24hr: true,
+  rangeSeparator: " \u304B\u3089 ",
+  monthAriaLabel: "\u6708",
+  amPM: ["\u5348\u524D", "\u5348\u5F8C"],
+  yearAriaLabel: "\u5E74",
+  hourAriaLabel: "\u6642\u9593",
+  minuteAriaLabel: "\u5206"
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nuxt-hs-ui",
-  "version": "2.0.30",
+  "version": "2.0.31",
   "description": "My new Nuxt module",
   "repository": "https://github.com/hare-systems-ryo/nuxt-hs-ui",
   "license": "MIT",