@simsustech/quasar-components 0.4.7 → 0.5.0

package/dist/form.js

@@ -1,5 +1,5 @@
-import { ref, defineComponent, useAttrs, withAsyncContext, watch, openBlock, createBlock, unref, mergeProps, normalizeProps, guardReactiveProps, withCtx, createVNode, createTextVNode, toDisplayString, computed, useSlots, renderSlot, createCommentVNode, toRefs, resolveDirective, createElementVNode, withDirectives, createElementBlock, Fragment } from "vue";
-import { useQuasar, QSelect, QItem, QItemSection, QItemLabel, QInput, QIcon, QBtn, QDate, QPopupProxy, QEditor } from "quasar";
+import { ref, defineComponent, useAttrs, withAsyncContext, watch, openBlock, createBlock, unref, mergeProps, normalizeProps, guardReactiveProps, withCtx, createVNode, createTextVNode, toDisplayString, computed, useSlots, renderSlot, createCommentVNode, toRefs, resolveDirective, createElementBlock, Fragment, renderList, resolveDynamicComponent, createElementVNode, withDirectives } from "vue";
+import { useQuasar, QSelect, QItem, QItemSection, QItemLabel, QInput, QDate, QIcon, QTooltip, QBtn, QPopupProxy, QField, QEditor } from "quasar";
 const lang$1 = {
   isoName: "en-US",
   yes: "Yes",
@@ -36,6 +36,9 @@ const lang$1 = {
   },
   datePicker: {
     placeholder: "YYYY/MM/DD",
+    YYYY: "YYYY",
+    MM: "MM",
+    DD: "DD",
     validations: {
       unavailableRange: "The selected period contains unavailable dates."
     }
@@ -45,10 +48,11 @@ const enUS = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty
   __proto__: null,
   default: lang$1
 }, Symbol.toStringTag, { value: "Module" }));
+var define_import_meta_env_default = { BASE_URL: "/", MODE: "production", DEV: false, PROD: true, SSR: false };
 const lang = ref(lang$1);
 const locales = /* @__PURE__ */ Object.assign({
   "./en-US.ts": () => Promise.resolve().then(() => enUS),
-  "./nl.ts": () => import("./nl-fa466587.js")
+  "./nl.ts": () => import("./nl-BjtwxTCz.js")
 });
 const useLang = () => {
   return lang;
@@ -63,7 +67,7 @@ const loadLang = async (isoName) => {
         lang.value = data;
       }
     } catch (e) {
-      if ({}.DEBUG)
+      if (define_import_meta_env_default.DEBUG)
         console.error(e);
       throw new Error(
         `[quasar-components] Failed to load ${isoName} language file.`
@@ -328,39 +332,128 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
   __name: "DateInput",
   props: {
     modelValue: {},
-    label: {},
+    format: { default: "YYYY-MM-DD" },
+    locale: { default: "en-US" },
+    label: { default: "" },
     required: { type: Boolean },
     clearable: { type: Boolean },
-    date: {}
+    date: { default: () => ({}) }
   },
   emits: ["update:modelValue"],
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emit = __emit;
-    const attrs = useAttrs();
     const lang2 = useLang();
-    const $q = useQuasar();
-    if (lang2.value.isoName !== $q.lang.isoName)
-      loadLang($q.lang.isoName);
-    watch($q.lang, () => {
-      loadLang($q.lang.isoName);
+    const { modelValue, format, locale } = toRefs(props);
+    const year = ref();
+    const month = ref();
+    const day = ref();
+    const setYear = (val) => {
+      const nr = Number(val);
+      if (nr && nr > 1e3 && nr < 1e4)
+        year.value = nr;
+    };
+    const setMonth = (val) => {
+      const nr = Number(val);
+      if (nr && nr > 0 && nr < 13)
+        month.value = nr;
+      else
+        month.value = void 0;
+    };
+    const setDay = (val) => {
+      const nr = Number(val);
+      if (nr && nr > 0 && nr < 32)
+        day.value = nr;
+      else
+        day.value = void 0;
+    };
+    const setInternalDate = (dateString, separator = "-") => {
+      if (dateString) {
+        const [yearPart, monthPart, dayPart] = dateString.split(separator);
+        if (yearPart && monthPart && dayPart) {
+          year.value = Number(yearPart);
+          month.value = Number(monthPart);
+          day.value = Number(dayPart);
+        }
+      }
+    };
+    const setDate = (value) => {
+      setInternalDate(value, "/");
+    };
+    watch([year, month, day], () => {
+      const date = `${year.value}-${String(month.value).padStart(2, "0")}-${String(day.value).padStart(2, "0")}`;
+      if (Date.parse(date)) {
+        emit("update:modelValue", date);
+      } else {
+        emit("update:modelValue", "");
+      }
     });
-    const { modelValue } = toRefs(props);
-    const update = (val) => {
-      if (typeof val === "string" || val === null)
-        emit("update:modelValue", val);
+    const formattedDate = computed(() => {
+      if (modelValue.value)
+        return new Date(Date.parse(modelValue.value)).toLocaleDateString(
+          locale.value,
+          {
+            weekday: "long",
+            year: "numeric",
+            month: "short",
+            day: "numeric"
+          }
+        );
+      return "";
+    });
+    watch(modelValue, (newVal) => {
+      if (newVal)
+        setInternalDate(newVal);
+      else if (newVal === null) {
+        year.value = void 0;
+        month.value = void 0;
+        day.value = void 0;
+      }
+    });
+    setInternalDate(modelValue.value);
+    const goToNextElement = (e) => {
+      var _a, _b, _c, _d;
+      if (["Minus", "Slash"].includes(e.code)) {
+        e.preventDefault();
+        const next = (_d = (_c = (_b = (_a = e.currentTarget.parentElement) == null ? void 0 : _a.parentElement) == null ? void 0 : _b.parentElement) == null ? void 0 : _c.parentElement) == null ? void 0 : _d.nextElementSibling;
+        if (next) {
+          next.focus();
+        }
+      }
     };
-    watch(
-      () => modelValue == null ? void 0 : modelValue.value,
-      (newVal) => {
-        if (newVal === "")
-          emit("update:modelValue", null);
+    const dateProps = computed(() => ({
+      YYYY: {
+        modelValue: year.value,
+        placeholder: lang2.value.datePicker.YYYY,
+        style: "max-width: 6ch",
+        suffix: format.value === "YYYY-MM-DD" ? "-" : void 0,
+        class: format.value !== "YYYY-MM-DD" ? "q-mb-none q-ml-xs" : void 0,
+        "onUpdate:modelValue": setYear,
+        onKeydown: goToNextElement
+      },
+      MM: {
+        modelValue: month.value ? String(month.value).padStart(2, "0") : "",
+        placeholder: lang2.value.datePicker.MM,
+        style: "max-width: 4ch",
+        suffix: "-",
+        class: "q-ml-xs",
+        "onUpdate:modelValue": setMonth,
+        onKeydown: goToNextElement
+      },
+      DD: {
+        modelValue: day.value ? String(day.value).padStart(2, "0") : "",
+        placeholder: lang2.value.datePicker.DD,
+        style: "max-width: 4ch",
+        suffix: format.value === "DD-MM-YYYY" ? "-" : void 0,
+        class: format.value === "YYYY-MM-DD" ? "q-ml-xs" : void 0,
+        "onUpdate:modelValue": setDay,
+        onKeydown: goToNextElement
       }
-    );
+    }));
     const validations = ref([
       (v) => {
         if (v !== null)
-          return /^\d{4}\/(0?[1-9]|1[012])\/(0?[1-9]|[12][0-9]|3[01])$/.test(v);
+          return /^\d{4}-(0[1-9]|1[012])-(0[1-9]|[12][0-9]|3[01])$/.test(v);
         return true;
       }
     ]);
@@ -370,55 +463,69 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
       );
     return (_ctx, _cache) => {
       const _component_q_icon = QIcon;
+      const _component_q_tooltip = QTooltip;
       const _component_q_btn = QBtn;
-      const _component_q_date = QDate;
       const _component_q_popup_proxy = QPopupProxy;
+      const _component_q_field = QField;
       const _directive_close_popup = resolveDirective("close-popup");
-      return openBlock(), createBlock(unref(QInput), mergeProps(unref(attrs), {
-        rules: validations.value,
+      return openBlock(), createBlock(_component_q_field, {
         "model-value": unref(modelValue),
-        label: `${_ctx.label}${_ctx.required ? "*" : ""}`,
-        placeholder: unref(lang2).datePicker.placeholder,
-        mask: "date",
-        class: "q-pr-md",
-        "onUpdate:modelValue": update
-      }), {
+        "bottom-slots": "",
+        rules: validations.value
+      }, {
+        control: withCtx(() => [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(unref(format).split("-"), (part) => {
+            return openBlock(), createBlock(resolveDynamicComponent(unref(QInput)), mergeProps({
+              key: part,
+              borderless: ""
+            }, dateProps.value[part]), null, 16);
+          }), 128))
+        ]),
         append: withCtx(() => [
           _ctx.clearable ? (openBlock(), createBlock(_component_q_icon, {
             key: 0,
             name: "clear",
             class: "cursor-pointer",
-            onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("update:modelValue", null))
+            onClick: _cache[0] || (_cache[0] = ($event) => emit("update:modelValue", null))
           })) : createCommentVNode("", true),
           createVNode(_component_q_icon, {
             name: "event",
             class: "cursor-pointer"
           }, {
             default: withCtx(() => [
+              formattedDate.value ? (openBlock(), createBlock(_component_q_tooltip, { key: 0 }, {
+                default: withCtx(() => [
+                  createTextVNode(toDisplayString(formattedDate.value), 1)
+                ]),
+                _: 1
+              })) : createCommentVNode("", true),
               createVNode(_component_q_popup_proxy, {
                 cover: "",
                 "transition-show": "scale",
                 "transition-hide": "scale"
               }, {
-                default: withCtx(() => [
-                  createVNode(_component_q_date, mergeProps(_ctx.date, {
-                    "model-value": unref(modelValue),
-                    "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.$emit("update:modelValue", $event))
-                  }), {
-                    default: withCtx(() => [
-                      createElementVNode("div", _hoisted_1, [
-                        withDirectives(createVNode(_component_q_btn, {
-                          label: unref(lang2).buttons.close,
-                          color: "primary",
-                          flat: ""
-                        }, null, 8, ["label"]), [
-                          [_directive_close_popup]
+                default: withCtx(() => {
+                  var _a;
+                  return [
+                    createVNode(unref(QDate), mergeProps(_ctx.date, {
+                      "model-value": (_a = unref(modelValue)) == null ? void 0 : _a.replaceAll("-", "/"),
+                      "onUpdate:modelValue": setDate
+                    }), {
+                      default: withCtx(() => [
+                        createElementVNode("div", _hoisted_1, [
+                          withDirectives(createVNode(_component_q_btn, {
+                            label: unref(lang2).buttons.close,
+                            color: "primary",
+                            flat: ""
+                          }, null, 8, ["label"]), [
+                            [_directive_close_popup]
+                          ])
                         ])
-                      ])
-                    ]),
-                    _: 1
-                  }, 16, ["model-value"])
-                ]),
+                      ]),
+                      _: 1
+                    }, 16, ["model-value"])
+                  ];
+                }),
                 _: 1
               })
             ]),
@@ -426,7 +533,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
           })
         ]),
         _: 1
-      }, 16, ["rules", "model-value", "label", "placeholder"]);
+      }, 8, ["model-value", "rules"]);
     };
   }
 });
@@ -479,7 +586,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
 const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   __name: "BooleanItem",
   props: {
-    modelValue: { type: Boolean },
+    modelValue: { type: [Boolean, null] },
     label: {}
   },
   setup(__props) {
@@ -504,7 +611,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
               }),
               createVNode(unref(QItemLabel), null, {
                 default: withCtx(() => [
-                  createTextVNode(toDisplayString(_ctx.modelValue ? unref(lang2).yes : unref(lang2).no), 1)
+                  createTextVNode(toDisplayString(_ctx.modelValue === null ? "-" : _ctx.modelValue ? unref(lang2).yes : unref(lang2).no), 1)
                 ]),
                 _: 1
               })
@@ -541,17 +648,15 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
       functions
     });
     return (_ctx, _cache) => {
-      const _component_q_input = QInput;
-      const _component_q_editor = QEditor;
       return openBlock(), createElementBlock(Fragment, null, [
-        createVNode(_component_q_input, {
+        createVNode(unref(QInput), {
           outlined: "",
           placeholder: unref(lang2).email.subject,
           "model-value": _ctx.subject,
           type: "text",
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => emit("update:subject", $event))
         }, null, 8, ["placeholder", "model-value"]),
-        createVNode(_component_q_editor, {
+        createVNode(unref(QEditor), {
           "model-value": _ctx.body,
           "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => emit("update:body", $event))
         }, null, 8, ["model-value"])

package/dist/general.js

@@ -1,7 +1,7 @@
-import { l as loadLang, u as useLang, _ as _sfc_main$4 } from "./QSubmitButton.vue_vue_type_script_setup_true_lang-77aece37.js";
+import { l as loadLang, u as useLang, _ as _sfc_main$4 } from "./QSubmitButton.vue_vue_type_script_setup_true_lang-DAnZaTMl.js";
 import { useQuasar, QCard, QCardSection, QCardActions, QDialog, QBtn, QToolbarTitle, QToolbar, QHeader, QPage, QPageContainer, QLayout, QSpace, QPageSticky, QSelect, QItemSection, QItemLabel, QItem } from "quasar";
 import { defineComponent, watch, ref, openBlock, createBlock, unref, withCtx, renderSlot, createVNode, createElementVNode, normalizeProps, guardReactiveProps, normalizeClass, createCommentVNode, toRefs, useAttrs, computed, mergeProps, createTextVNode, toDisplayString } from "vue";
-import { enUs, nl } from "./flags.js";
+import { e as enUs, n as nl } from "./en-US-Duo_j_eL.js";
 const _hoisted_1$1 = { class: "text-h6" };
 const _hoisted_2 = { class: "text-subtitle2" };
 const __default__$2 = {
@@ -70,7 +70,6 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const QStyledCard_vue_vue_type_style_index_0_scoped_302df27a_lang = "";
 const _export_sfc = (sfc, props) => {
   const target = sfc.__vccOpts || sfc;
   for (const [key, val] of props) {

package/dist/icons.js

@@ -1,6 +1,6 @@
 import { ref, h } from "vue";
 import { useQuasar, QIcon } from "quasar";
-const icon = "data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCmFyaWEtbGFiZWw9Ik1pY3Jvc29mdCIgcm9sZT0iaW1nIgp2aWV3Qm94PSIwIDAgNTEyIDUxMiI+PHJlY3QKd2lkdGg9IjUxMiIgaGVpZ2h0PSI1MTIiCnJ4PSIxNSUiCmZpbGw9IiNmZmYiLz48cGF0aApkPSJNNzUgNzV2MTcxaDE3MXYtMTcxeiIgZmlsbD0iI2YyNTAyMiIvPjxwYXRoCmQ9Ik0yNjYgNzV2MTcxaDE3MXYtMTcxeiIgZmlsbD0iIzdmYmEwMCIvPjxwYXRoCmQ9Ik03NSAyNjZ2MTcxaDE3MXYtMTcxeiIgZmlsbD0iIzAwYTRlZiIvPjxwYXRoCmQ9Ik0yNjYgMjY2djE3MWgxNzF2LTE3MXoiIGZpbGw9IiNmZmI5MDAiLz48L3N2Zz4=";
+const icon = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20aria-label='Microsoft'%20role='img'%20viewBox='0%200%20512%20512'%3e%3crect%20width='512'%20height='512'%20rx='15%25'%20fill='%23fff'/%3e%3cpath%20d='M75%2075v171h171v-171z'%20fill='%23f25022'/%3e%3cpath%20d='M266%2075v171h171v-171z'%20fill='%237fba00'/%3e%3cpath%20d='M75%20266v171h171v-171z'%20fill='%2300a4ef'/%3e%3cpath%20d='M266%20266v171h171v-171z'%20fill='%23ffb900'/%3e%3c/svg%3e";
 const labels = {
   microsoft: {
     name: "Microsoft"

package/dist/{nl-fa466587.js → nl-BjtwxTCz.js}

@@ -34,6 +34,9 @@ const lang = {
   },
   datePicker: {
     placeholder: "JJJJ/MM/DD",
+    YYYY: "JJJJ",
+    MM: "MM",
+    DD: "DD",
     validations: {
       unavailableRange: "De geselecteerde periode bevat ongeschikbare datums."
     }

package/dist/style.css

@@ -1,4 +1,14 @@
 .card[data-v-302df27a] {
   width: 100%;
   max-width: 300px;
-}
+}
+.q-field--auto-height .q-field__control,
+.q-field--auto-height .q-field__native {
+  min-height: 1em;
+}
+.q-field--borderless .q-field__bottom,
+.q-field--borderless.q-field--dense .q-field__control,
+.q-field--standard .q-field__bottom,
+.q-field--standard.q-field--dense .q-field__control {
+  padding-top: 0;
+}

package/dist/types/ui/form/BooleanItem.vue.d.ts

@@ -1,5 +1,5 @@
 export interface Props {
-    modelValue: boolean;
+    modelValue: boolean | null;
     label: string;
 }
 declare const _default: import("vue").DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>>, {}, {}>;

package/dist/types/ui/form/DateInput.vue.d.ts

@@ -1,16 +1,33 @@
-import { QDateProps } from 'quasar';
+import { QDateProps, QuasarLanguageCodes } from 'quasar';
 export interface Props {
-    modelValue?: string | null;
+    modelValue: string | null;
+    format?: 'YYYY-MM-DD' | 'DD-MM-YYYY' | 'MM-DD-YYYY';
+    locale?: QuasarLanguageCodes;
     label?: string;
     required?: boolean;
     clearable?: boolean;
     date?: Partial<QDateProps>;
 }
-declare const _default: import("vue").DefineComponent<__VLS_TypePropsToRuntimeProps<Props>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
+    format: string;
+    locale: string;
+    label: string;
+    date: () => {};
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (val: string | null) => void;
-}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToRuntimeProps<Props>>> & {
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
+    format: string;
+    locale: string;
+    label: string;
+    date: () => {};
+}>>> & {
     "onUpdate:modelValue"?: ((val: string | null) => any) | undefined;
-}, {}, {}>;
+}, {
+    label: string;
+    date: Partial<QDateProps>;
+    format: "YYYY-MM-DD" | "DD-MM-YYYY" | "MM-DD-YYYY";
+    locale: keyof import("quasar").QuasarLanguageCodesHolder;
+}, {}>;
 export default _default;
 type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
 type __VLS_TypePropsToRuntimeProps<T> = {
@@ -21,3 +38,11 @@ type __VLS_TypePropsToRuntimeProps<T> = {
         required: true;
     };
 };
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/dist/types/ui/form/lang/index.d.ts

@@ -34,6 +34,9 @@ export interface Language {
     };
     datePicker: {
         placeholder: string;
+        YYYY: string;
+        MM: string;
+        DD: string;
         validations: {
             unavailableRange: string;
         };
@@ -76,6 +79,9 @@ export declare const lang: Ref<{
     };
     datePicker: {
         placeholder: string;
+        YYYY: string;
+        MM: string;
+        DD: string;
         validations: {
             unavailableRange: string;
         };

package/dist/vite-plugin.js

@@ -37,17 +37,17 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
 import { promises } from 'fs';
 import { Icon, FlagIcon } from './virtualModules.js';
 var readFile = promises.readFile;
-export default function (_a) {
-    var _b = _a === void 0 ? {} : _a, buildFromSrc = _b.buildFromSrc;
-    return __awaiter(this, void 0, void 0, function () {
-        var pkgJson, _c, _d, exports, name;
+export default function () {
+    return __awaiter(this, arguments, void 0, function (_a) {
+        var pkgJson, _b, _c, exports, name;
+        var _d = _a === void 0 ? {} : _a, buildFromSrc = _d.buildFromSrc;
         return __generator(this, function (_e) {
             switch (_e.label) {
                 case 0:
-                    _d = (_c = JSON).parse;
+                    _c = (_b = JSON).parse;
                     return [4 /*yield*/, readFile(new URL('../package.json', import.meta.url).pathname, 'utf-8')];
                 case 1:
-                    pkgJson = _d.apply(_c, [_e.sent()]);
+                    pkgJson = _c.apply(_b, [_e.sent()]);
                     exports = pkgJson.exports;
                     name = pkgJson.name;
                     return [2 /*return*/, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@simsustech/quasar-components",
-  "version": "0.4.7",
+  "version": "0.5.0",
   "author": "Stefan van Herwijnen",
   "description": "High level components for Quasar Framework",
   "license": "MIT",
@@ -46,34 +46,34 @@
   },
   "bugs": "https://github.com/simsusech/quasar-components/issues",
   "dependencies": {
-    "validator": "^13.9.0"
+    "validator": "^13.11.0"
   },
   "peerDependencies": {
     "quasar": "^2.9.2"
   },
   "devDependencies": {
-    "@types/node": "^20.4.5",
-    "@types/validator": "^13.9.0",
-    "@types/ws": "^8.5.5",
-    "@typescript-eslint/eslint-plugin": "^6.2.1",
-    "@typescript-eslint/parser": "^6.2.1",
-    "@vitejs/plugin-vue": "^4.2.3",
-    "@vue/server-renderer": "^3.3.4",
-    "eslint": "^8.46.0",
-    "eslint-config-prettier": "^8.9.0",
-    "eslint-plugin-prettier-vue": "^4.2.0",
-    "eslint-plugin-vue": "^9.16.1",
-    "glob": "^10.3.3",
-    "local-pkg": "^0.4.3",
-    "prettier": "^3.0.0",
-    "quasar": "^2.12.3",
-    "rimraf": "^5.0.1",
-    "typescript": "^5.1.6",
-    "unplugin-vue-components": "^0.25.1",
-    "vite": "^4.4.8",
-    "vue": "^3.3.4",
-    "vue-router": "^4.2.4",
-    "vue-tsc": "^1.8.8"
+    "@types/node": "^20.11.19",
+    "@types/validator": "^13.11.9",
+    "@types/ws": "^8.5.10",
+    "@typescript-eslint/eslint-plugin": "^7.0.1",
+    "@typescript-eslint/parser": "^7.0.1",
+    "@vitejs/plugin-vue": "^5.0.4",
+    "@vue/server-renderer": "^3.4.19",
+    "eslint": "^8.56.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-prettier-vue": "^5.0.0",
+    "eslint-plugin-vue": "^9.21.1",
+    "glob": "^10.3.10",
+    "local-pkg": "^0.5.0",
+    "prettier": "^3.2.5",
+    "quasar": "^2.14.4",
+    "rimraf": "^5.0.5",
+    "typescript": "^5.3.3",
+    "unplugin-vue-components": "^0.26.0",
+    "vite": "^5.1.3",
+    "vue": "^3.4.19",
+    "vue-router": "^4.2.5",
+    "vue-tsc": "^1.8.27"
   },
   "scripts": {
     "build:plugin": "vite build",

package/src/ui/authentication/LoginForm.vue

@@ -15,6 +15,7 @@
       bottom-slots
       :rules="validations['email']"
       lazy-rules
+      autcomplete="email"
     />
     <q-input
       v-if="useUsername"
@@ -26,6 +27,7 @@
       bottom-slots
       :rules="validations['username']"
       lazy-rules
+      autocomplete="username"
     />
     <q-input
       id="password"
@@ -38,6 +40,7 @@
       :rules="validations['password']"
       lazy-rules
       bottom-slots
+      autcomplete="current-password"
     >
       <template #append>
         <q-icon

package/src/ui/form/BooleanItem.vue

@@ -5,7 +5,7 @@
         {{ label }}
       </q-item-label>
       <q-item-label>
-        {{ modelValue ? lang.yes : lang.no }}
+        {{ modelValue === null ? '-' : modelValue ? lang.yes : lang.no }}
       </q-item-label>
     </q-item-section>
   </q-item>
@@ -17,7 +17,7 @@ import { QItem, QItemLabel, QItemSection, useQuasar } from 'quasar'
 import { useLang, loadLang } from './lang'
 
 export interface Props {
-  modelValue: boolean
+  modelValue: boolean | null
   label: string
 }
 defineProps<Props>()