nuxt-hs-ui 2.6.0 → 2.7.0

package/dist/module.json

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

package/dist/runtime/components/form/check-list.vue

@@ -31,7 +31,7 @@ type Props = {
   // Input 種類別
   list: SelectItem[] | readonly SelectItem[];
   image?: boolean;
-  nullText?: string;
+  nullText?: MultiLang;
   classRow?: ClassType;
   classCol?: ClassType;
   classItem?: ClassType;
@@ -59,7 +59,7 @@ type Props = {
   label?: string;
   // 表示-副情報
   require?: boolean;
-  requireText?: string;
+  requireText?: MultiLang;
   warn?: string;
   warnTimeOut?: number;
   // ----------------------------------------------------------------------------
@@ -72,7 +72,7 @@ const props = withDefaults(defineProps<Props>(), {
   // Input 種類別
   order: false,
   image: false,
-  nullText: "選択してください",
+  nullText: () => ({ ja: "選択してください", en: "" }),
   nullable: true,
   classRow: "",
   classCol: "",
@@ -102,7 +102,7 @@ const props = withDefaults(defineProps<Props>(), {
   label: "",
   // 表示-副情報
   require: false,
-  requireText: "必須",
+  requireText: () => ({ ja: "必須", en: "" }),
   warn: "",
   warnTimeOut: 3000,
   // ----------------------------------------------------------------------------
@@ -314,7 +314,7 @@ const itemClass = computed(() => {
     :readonly="props.readonly"
     :label="props.label"
     :require="props.require"
-    :require-text="props.requireText"
+    :require-text="tx(props.requireText).value"
     :warn="props.warn"
     :warn-time-out="props.warnTimeOut"
     :size="props.size"

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

@@ -29,6 +29,7 @@ import {
 import { Sleep } from "../../utils/com";
 import type { ClassType } from "../../utils/class-style";
 import { GetTimeShiftValue, Dayjs, DayjsInit } from "../../utils/dayjs";
+import type { MultiLang } from "../../utils/multi-lang";
 // [ utils ]
 
 import { ja } from "../../types/flatpickr/ja";
@@ -59,6 +60,7 @@ const hsFocus = useHsFocus();
 const Toast = useHsToast();
 const multiLang = useHsMultiLang();
 const hsMisc = useHsMisc();
+const tx = multiLang.tx;
 // ----------------------------------------------------------------------------
 // [ vueuse ]
 const isMounted = useMounted();
@@ -108,7 +110,7 @@ type Props = {
   label?: string;
   // 表示-副情報
   require?: boolean;
-  requireText?: string;
+  requireText?: MultiLang;
   warn?: string;
   warnTimeOut?: number;
   // ----------------------------------------------------------------------------
@@ -158,7 +160,7 @@ const props = withDefaults(defineProps<Props>(), {
   label: "",
   // 表示-副情報
   require: false,
-  requireText: "必須",
+  requireText: () => ({ ja: "必須", en: "Required" }),
   warn: "",
   warnTimeOut: 3000,
   // ----------------------------------------------------------------------------
@@ -751,7 +753,7 @@ const computedIsFocusOpenBtn = computed(() => {
     :readonly="props.readonly"
     :label="props.label"
     :require="props.require"
-    :require-text="props.requireText"
+    :require-text="tx(props.requireText).value"
     :warn="props.warn"
     :warn-time-out="props.warnTimeOut"
     :size="props.size"

package/dist/runtime/components/form/input-frame.vue

@@ -12,8 +12,10 @@ import { twMerge } from "tailwind-merge";
 import { computed, useSlots } from "#imports";
 // [ utils ]
 import { type ClassType, ClassTypeToString } from "../../utils/class-style";
+import type { MultiLang } from "../../utils/multi-lang";
 // [ composables ]
 import { useHsToast } from "../../composables/use-hs-toast";
+import { useHsMultiLang } from "../../composables/use-hs-multi-lang";
 // ----------------------------------------------------------------------------
 // [ Props ]
 type Props = {
@@ -37,7 +39,7 @@ type Props = {
   label?: string;
   // 表示-副情報
   require?: boolean;
-  requireText?: string;
+  requireText?: MultiLang;
   warn?: string;
   warnTimeOut?: number;
   // ----------------------------------------------------------------------------
@@ -64,7 +66,7 @@ const props = withDefaults(defineProps<Props>(), {
   label: "",
   // 表示-副情報
   require: false,
-  requireText: "必須",
+  requireText: () => ({ ja: "必須", en: "Required" }),
   warn: "",
   warnTimeOut: 3000,
   // ----------------------------------------------------------------------------
@@ -82,6 +84,8 @@ const emit = defineEmits<Emits>();
 
 const toast = useHsToast();
 
+const multiLang = useHsMultiLang();
+const tx = multiLang.tx;
 // ----------------------------------------------------------------------------
 const baseClass = computed(() => {
   return [
@@ -205,7 +209,7 @@ const hasHeader = computed(() => {
             :class="headerIconClass"
             class="text-white bg-error"
           >
-            <span data-type="require">{{ props.requireText }}</span>
+            <span data-type="require">{{ tx(props.requireText) }}</span>
           </div>
         </div>
       </div>

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

@@ -14,6 +14,8 @@ import { reactive, ref, watch, computed, useId } from "#imports";
 import { type ClassType, ClassTypeToString } from "../../utils/class-style";
 import type { SelectItem } from "../../utils/select-item";
 import { useDisplayList, type DisplaySelectItem } from "../../utils/select";
+import type { MultiLang } from "../../utils/multi-lang";
+
 // [ composables ]
 import { useHsFocus } from "../../composables/use-hs-focus";
 import { useHsMultiLang } from "../../composables/use-hs-multi-lang";
@@ -35,7 +37,7 @@ type Props = {
   order?: boolean;
   image?: boolean;
   loading?: boolean;
-  nullText?: string;
+  nullText?: MultiLang;
   classCol?: ClassType;
   classRow?: ClassType;
   classImg?: ClassType;
@@ -65,7 +67,7 @@ type Props = {
   label?: string;
   // 表示-副情報
   require?: boolean;
-  requireText?: string;
+  requireText?: MultiLang;
   warn?: string;
   warnTimeOut?: number;
   // ----------------------------------------------------------------------------
@@ -79,7 +81,7 @@ const props = withDefaults(defineProps<Props>(), {
   order: false,
   image: false,
   loading: false,
-  nullText: "選択してください",
+  nullText: () => ({ ja: "選択してください", en: "Select..." }),
   nullable: false,
   classCol: "",
   classRow: "",
@@ -108,7 +110,7 @@ const props = withDefaults(defineProps<Props>(), {
   label: "",
   // 表示-副情報
   require: false,
-  requireText: "必須",
+  requireText: () => ({ ja: "必須", en: "Required" }),
   warn: "",
   warnTimeOut: 3000,
   // ----------------------------------------------------------------------------
@@ -211,7 +213,7 @@ const displayList = computed<SelectItemShow[]>(() => {
     unKnownSelected: unKnownSelected.value,
     isShowHidden: isShowHidden.value,
     require: props.require || !props.nullable,
-    nullText: props.nullText,
+    nullText: tx(props.nullText).value,
   }).map((row, index) => {
     return {
       ...row,
@@ -391,7 +393,7 @@ const inputClass = computed(() => {
     :readonly="props.readonly"
     :label="props.label"
     :require="props.require"
-    :require-text="props.requireText"
+    :require-text="tx(props.requireText).value"
     :warn="props.warn"
     :warn-time-out="props.warnTimeOut"
     :size="props.size"
@@ -455,7 +457,7 @@ const inputClass = computed(() => {
                 :class-img="props.classImg"
                 :class-img-tag="props.classImgTag"
               />
-              <div class="radio-text truncate">{{ nullText }}</div>
+              <div class="radio-text truncate">{{ tx(nullText) }}</div>
             </div>
           </div>
         </div>

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

@@ -13,6 +13,7 @@ import { reactive, ref, watch, computed, useId } from "#imports";
 import type { ClassType } from "../../utils/class-style";
 import type { SelectItem } from "../../utils/select-item";
 import { useDisplayList, type DisplaySelectItem } from "../../utils/select";
+import type { MultiLang } from "../../utils/multi-lang";
 // [ composables ]
 import { useHsFocus } from "../../composables/use-hs-focus";
 import { useHsMultiLang } from "../../composables/use-hs-multi-lang";
@@ -34,7 +35,7 @@ type Props = {
   list: SelectItem<IdType>[];
   order?: boolean;
   loading?: boolean;
-  nullText?: string;
+  nullText?: MultiLang;
   image?: boolean;
   classImg?: ClassType;
   classImgTag?: ClassType;
@@ -63,7 +64,7 @@ type Props = {
   label?: string;
   // 表示-副情報
   require?: boolean;
-  requireText?: string;
+  requireText?: MultiLang;
   warn?: string;
   warnTimeOut?: number;
   // ----------------------------------------------------------------------------
@@ -76,7 +77,7 @@ const props = withDefaults(defineProps<Props>(), {
   // Input 種類別
   order: false,
   loading: false,
-  nullText: "選択してください",
+  nullText: () => ({ ja: "選択してください", en: "Select..." }),
   nullable: false,
   image: false,
   classImg: "",
@@ -104,7 +105,7 @@ const props = withDefaults(defineProps<Props>(), {
   label: "",
   // 表示-副情報
   require: false,
-  requireText: "必須",
+  requireText: () => ({ ja: "必須", en: "Required" }),
   warn: "",
   warnTimeOut: 3000,
   // ----------------------------------------------------------------------------
@@ -200,7 +201,7 @@ const displayList = computed(() => {
     unKnownSelected: unKnownSelected.value,
     isShowHidden: isShowHidden.value,
     require: props.require || !props.nullable,
-    nullText: props.nullText,
+    nullText: tx(props.nullText).value,
   });
 });
 // ----------------------------------------------------------------------------
@@ -290,7 +291,7 @@ const selectClose = () => {
     :readonly="props.readonly"
     :label="props.label"
     :require="props.require"
-    :require-text="props.requireText"
+    :require-text="tx(props.requireText).value"
     :warn="props.warn"
     :warn-time-out="props.warnTimeOut"
     :size="props.size"
@@ -309,7 +310,7 @@ const selectClose = () => {
       class="absolute inset-0 flex items-center px-1 pointer-events-none text-[0.9em]"
       :class="[computedActivate ? 'opacity-30' : '']"
     >
-      {{ props.nullText }}
+      {{ tx(props.nullText) }}
     </div>
     <v-select
       ref="inputElement"

package/dist/runtime/components/form/text-box.vue

@@ -14,6 +14,7 @@ import { reactive, ref, watch, computed, nextTick, useId } from "#imports";
 
 // [ utils ]
 import type { ClassType } from "../../utils/class-style";
+import type { MultiLang } from "../../utils/multi-lang";
 // [ composables ]
 import { useHsFocus } from "../../composables/use-hs-focus";
 // [ Components ]
@@ -65,7 +66,7 @@ type Props = {
   label?: string;
   // 表示-副情報
   require?: boolean;
-  requireText?: string;
+  requireText?: MultiLang;
   warn?: string;
   warnTimeOut?: number;
   // ----------------------------------------------------------------------------
@@ -105,7 +106,7 @@ const props = withDefaults(defineProps<Props>(), {
   label: "",
   // 表示-副情報
   require: false,
-  requireText: "必須",
+  requireText: () => ({ ja: "必須", en: "Required" }),
   warn: "",
   warnTimeOut: 3000,
   // ----------------------------------------------------------------------------

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

@@ -12,6 +12,7 @@ import { twMerge } from "tailwind-merge";
 import { reactive, ref, watch, computed, useId, nextTick } from "#imports";
 // [ utils ]
 import type { ClassType } from "../../utils/class-style";
+import type { MultiLang } from "../../utils/multi-lang";
 // [ composables ]
 import { useHsFocus } from "../../composables/use-hs-focus";
 import { useHsMisc } from "../../composables/use-hs-misc";
@@ -52,7 +53,7 @@ type Props = {
   label?: string;
   // 表示-副情報
   require?: boolean;
-  requireText?: string;
+  requireText?: MultiLang;
   warn?: string;
   warnTimeOut?: number;
   // ----------------------------------------------------------------------------
@@ -92,7 +93,7 @@ const props = withDefaults(defineProps<Props>(), {
   label: "",
   // 表示-副情報
   require: false,
-  requireText: "必須",
+  requireText: () => ({ ja: "必須", en: "Required" }),
   warn: "",
   warnTimeOut: 3000,
   // ----------------------------------------------------------------------------

package/dist/runtime/components/form/value-box.vue

@@ -22,10 +22,12 @@ import {
 import type { ClassType } from "../../utils/class-style";
 import { InsertComma } from "../../utils/number";
 import { FloatNullable } from "../../utils/float";
+import type { MultiLang } from "../../utils/multi-lang";
 // [ composables ]
 import { useHsFocus } from "../../composables/use-hs-focus";
 import { useHsToast } from "../../composables/use-hs-toast";
 import { useHsMisc } from "../../composables/use-hs-misc";
+import { useHsMultiLang } from "../../composables/use-hs-multi-lang";
 // [ Components ]
 import InputFrame from "./input-frame.vue";
 // ----------------------------------------------------------------------------
@@ -35,6 +37,9 @@ import InputFrame from "./input-frame.vue";
 const hsFocus = useHsFocus();
 const hsMisc = useHsMisc();
 const Toast = useHsToast();
+const multiLang = useHsMultiLang();
+const gt = multiLang.gt;
+
 // ----------------------------------------------------------------------------
 // [ Props ]
 type Props = {
@@ -73,7 +78,7 @@ type Props = {
   label?: string;
   // 表示-副情報
   require?: boolean;
-  requireText?: string;
+  requireText?: MultiLang;
   warn?: string;
   warnTimeOut?: number;
   // ----------------------------------------------------------------------------
@@ -82,10 +87,10 @@ type Props = {
   // ----------------------------------------------------------------------------
   uiText?: {
     validError: {
-      title: string;
-      nullValue: string;
-      minValue: string;
-      maxValue: string;
+      title: MultiLang;
+      nullValue: MultiLang;
+      minValue: MultiLang;
+      maxValue: MultiLang;
     };
   };
 };
@@ -125,7 +130,7 @@ const props = withDefaults(defineProps<Props>(), {
   label: "",
   // 表示-副情報
   require: false,
-  requireText: "必須",
+  requireText: () => ({ ja: "必須", en: "Required" }),
   warn: "",
   warnTimeOut: 3000,
   // ----------------------------------------------------------------------------
@@ -135,10 +140,19 @@ const props = withDefaults(defineProps<Props>(), {
   uiText: () => {
     return {
       validError: {
-        title: "入力値の警告",
-        nullValue: "数値以外は許可されていません。",
-        minValue: "[{value}]以下の数値は入力できません",
-        maxValue: "[{value}]以上の数値は入力できません",
+        title: { ja: "入力値の警告", en: "Input Value Warning" },
+        nullValue: {
+          ja: "数値以外は許可されていません。",
+          en: "Non-numeric values are not allowed.",
+        },
+        minValue: {
+          ja: "[{value}]以下の数値は入力できません",
+          en: "You cannot enter a number below {value}.",
+        },
+        maxValue: {
+          ja: "[{value}]以上の数値は入力できません",
+          en: "You cannot enter a number greater than {value}.",
+        },
       },
     };
   },
@@ -211,7 +225,7 @@ const validCheck = (
       return {
         result: false,
         value: 0,
-        message: props.uiText.validError.nullValue,
+        message: gt(props.uiText.validError.nullValue),
       };
     } else {
       return { result: true, value: null, message: "" };
@@ -221,7 +235,7 @@ const validCheck = (
     return {
       result: false,
       value: props.min,
-      message: props.uiText.validError.minValue.replace(
+      message: gt(props.uiText.validError.minValue).replace(
         /\{value\}/g,
         String(props.min)
       ),
@@ -231,7 +245,7 @@ const validCheck = (
     return {
       result: false,
       value: props.max,
-      message: props.uiText.validError.maxValue.replace(
+      message: gt(props.uiText.validError.maxValue).replace(
         /\{value\}/g,
         String(props.min)
       ),

package/package.json

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