@merkaly/nuxt 0.10.0 → 0.10.2

package/README.md

@@ -35,6 +35,31 @@ On boot the module restores an existing session (user and token) and then runs t
 | store | optional | required | `merkaly:tenant` resolves the store from the host (public); a signed-in buyer is restored too; protected pages (account, checkout) ask for login. |
 | www | optional | not used | No hooks; anonymous or signed-in. |
 
+## SEO: robots and sitemap
+
+Every app gets `@nuxtjs/robots`. Apps are **private by default**: in production
+`robots.txt` answers `Disallow: /` and pages carry the noindex meta and the
+`X-Robots-Tag` header (admin, dashboard). Outside production nothing is indexable.
+
+Public apps (www, store) opt in, and can also get `@nuxtjs/sitemap`, with
+`hreflang` built from `merkaly.i18n` when the strategy has a locale prefix:
+
+```ts
+export default defineNuxtConfig({
+  merkaly: {
+    seo: {
+      indexable: true,
+      url: 'https://www.merkaly.io',
+      disallow: ['/en/auth', '/es/auth', '/pt/auth'], // robots.txt
+      sitemap: { exclude: ['/en/auth', '/es/auth', '/pt/auth'] }, // or `true`
+    },
+  },
+});
+```
+
+The sitemap is only installed for indexable apps and is served at `/sitemap.xml`
+(linked from `robots.txt`).
+
 ## Money formatting
 
 Money in Merkaly is stored as **integer cents**. `MKFormatMoney`, `MKInputMoney`,

package/dist/module.d.mts

@@ -57,6 +57,18 @@ interface MerkalyModuleOptions {
         project: string;
         token: string;
     };
+    seo?: {
+        /** robots.txt paths to block, e.g. the Auth0 callback. */
+        disallow?: string[];
+        /** Private apps (admin, dashboard) stay false: robots.txt Disallow, noindex meta and X-Robots-Tag. */
+        indexable?: boolean;
+        /** Generate /sitemap.xml from the pages, with hreflang from the i18n locales. */
+        sitemap?: boolean | {
+            exclude?: string[];
+        };
+        /** Public site URL, used in robots.txt and the sitemap. */
+        url?: string;
+    };
 }
 declare const _default: _nuxt_schema.NuxtModule<MerkalyModuleOptions, MerkalyModuleOptions, false>;
 

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": ">=3.14.0"
   },
-  "version": "0.10.0",
+  "version": "0.10.2",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/module.mjs

@@ -1,4 +1,4 @@
-import { defineNuxtModule, useLogger, createResolver, addPlugin, addServerHandler, addRouteMiddleware, addImportsDir, addComponentsDir, addTypeTemplate, addTemplate } from '@nuxt/kit';
+import { defineNuxtModule, useLogger, createResolver, installModule, addPlugin, addServerHandler, addRouteMiddleware, addImportsDir, addComponentsDir, addTypeTemplate, addTemplate } from '@nuxt/kit';
 import { existsSync, mkdirSync, writeFileSync } from 'node:fs';
 import { resolve, dirname } from 'node:path';
 import { defu } from 'defu';
@@ -42,6 +42,13 @@ const defaultOptions = {
     dsn: "",
     project: "",
     token: ""
+  },
+  seo: {
+    disallow: [],
+    indexable: false,
+    // private unless the app opts in
+    sitemap: false,
+    url: ""
   }
 };
 function hasI18nConfig(options) {
@@ -76,6 +83,10 @@ function buildModuleDependencies(nuxt, options) {
   if (hasPlausibleConfig(options)) {
     dependencies["@nuxtjs/plausible"] = {};
   }
+  configureSite(nuxt, options);
+  dependencies["@nuxtjs/robots"] = {
+    overrides: { disallow: options.seo?.disallow ?? [] }
+  };
   const logger = useLogger(MODULE_NAME);
   Object.keys(dependencies).forEach((dependency) => {
     logger.info(`Loaded ${dependency} module`);
@@ -126,6 +137,33 @@ function configureI18n(nuxt, options) {
     vueI18n
   };
 }
+function configureSite(nuxt, options) {
+  nuxt.options.site = defu({
+    indexable: Boolean(options.seo?.indexable),
+    url: options.seo?.url || void 0
+  }, nuxt.options.site || {});
+}
+function configureSitemap(options) {
+  const exclude = typeof options.seo?.sitemap === "object" ? options.seo.sitemap.exclude ?? [] : [];
+  const prefixed = hasI18nConfig(options) && options.i18n.strategy && options.i18n.strategy !== "no_prefix";
+  if (!prefixed) {
+    return { exclude };
+  }
+  return {
+    autoI18n: {
+      // locales are registered through a hook, so the sitemap module can't read them on its own
+      defaultLocale: options.i18n.defaultLocale,
+      locales: options.i18n.locales.map((locale) => ({
+        _hreflang: locale.language,
+        _sitemap: locale.language,
+        code: locale.code,
+        language: locale.language
+      })),
+      strategy: options.i18n.strategy
+    },
+    exclude
+  };
+}
 function configureRuntimeConfig(nuxt, options) {
   nuxt.options.runtimeConfig.merkaly = defu({
     sentry: {
@@ -278,6 +316,10 @@ const module$1 = defineNuxtModule({
     const resolver = createResolver(import.meta.url);
     configureNuxtOptions(nuxt, options);
     await configureExternalIntegrations(nuxt, logger);
+    if (options.seo?.indexable && options.seo.sitemap) {
+      await installModule("@nuxtjs/sitemap", configureSitemap(options));
+      logger.info("Loaded @nuxtjs/sitemap module");
+    }
     registerRuntimeFeatures(options, resolver);
   }
 });

package/dist/runtime/components/input/InputDropzone.d.vue.ts

@@ -1,4 +1,16 @@
-declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+export interface InputDropzoneRejection {
+    file: File;
+    reason: 'type' | 'size';
+}
+declare function openDialog(): void;
+declare var __VLS_1: {
+    dragging: boolean;
+    open: typeof openDialog;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     accept: {
         type: {
             (arrayLength: number): string[];
@@ -18,15 +30,31 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
         };
         default: () => never[];
     };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hint: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    maxSize: {
+        type: NumberConstructor;
+        default: number;
+    };
     multiple: {
         type: BooleanConstructor;
         default: boolean;
     };
-    modelValue: {
-        type: import("vue").PropType<unknown[]>;
+    title: {
+        type: StringConstructor;
+        default: undefined;
     };
-}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: unknown[]) => any;
+}>, {
+    open: typeof openDialog;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    select: (files: File[]) => any;
+    reject: (rejections: InputDropzoneRejection[]) => any;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     accept: {
         type: {
@@ -47,18 +75,42 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
         };
         default: () => never[];
     };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hint: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    maxSize: {
+        type: NumberConstructor;
+        default: number;
+    };
     multiple: {
         type: BooleanConstructor;
         default: boolean;
     };
-    modelValue: {
-        type: import("vue").PropType<unknown[]>;
+    title: {
+        type: StringConstructor;
+        default: undefined;
     };
 }>> & Readonly<{
-    "onUpdate:modelValue"?: ((value: unknown[]) => any) | undefined;
+    onSelect?: ((files: File[]) => any) | undefined;
+    onReject?: ((rejections: InputDropzoneRejection[]) => any) | undefined;
 }>, {
+    title: string;
+    disabled: boolean;
     accept: string[];
+    hint: string;
+    maxSize: number;
     multiple: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/input/InputDropzone.vue

@@ -1,80 +1,82 @@
 <script setup>
+import { useDropZone, useFileDialog } from "@vueuse/core";
 import { filesize } from "filesize";
+import { computed, useTemplateRef } from "vue";
+import { useI18n } from "vue-i18n";
 const props = defineProps({
   accept: { type: Array, default: () => [] },
-  multiple: { type: Boolean, default: false }
+  // MIME types, e.g. image/png; empty accepts anything
+  disabled: { type: Boolean, default: false },
+  hint: { type: String, default: void 0 },
+  maxSize: { type: Number, default: 0 },
+  // bytes; 0 means no limit
+  multiple: { type: Boolean, default: false },
+  title: { type: String, default: void 0 }
 });
-const dropZoneRef = ref();
-const fileInputRef = ref();
-const pictures = defineModel({ type: Array, default: () => [] });
-const { isOverDropZone } = useDropZone(dropZoneRef, {
-  dataTypes: props.accept,
+const emit = defineEmits(["reject", "select"]);
+const { t } = useI18n({ useScope: "local" });
+const dropZone = useTemplateRef("dropZone");
+const titleText = computed(() => props.title ?? t(props.multiple ? "titleMany" : "title"));
+const hintText = computed(() => props.hint ?? (props.maxSize ? t("hint", { size: filesize(props.maxSize) }) : ""));
+const { open, onChange } = useFileDialog({ accept: props.accept.join(","), multiple: props.multiple, reset: true });
+onChange((files) => pick(files ? [...files] : []));
+const { isOverDropZone } = useDropZone(dropZone, {
   multiple: props.multiple,
-  onDrop: handleFileChange,
-  preventDefaultForUnhandled: false
+  onDrop: (files) => pick(files ?? []),
+  preventDefaultForUnhandled: true
 });
-function removePicture(id) {
-  pictures.value = pictures.value.filter((picture) => picture._id !== id);
+function reasonOf(file) {
+  if (props.accept.length && !props.accept.includes(file.type)) return "type";
+  if (props.maxSize && file.size > props.maxSize) return "size";
 }
-function triggerInput() {
-  fileInputRef.value?.click();
+function pick(files) {
+  if (props.disabled || !files.length) return;
+  const checked = (props.multiple ? files : files.slice(0, 1)).map((file) => ({ file, reason: reasonOf(file) }));
+  const rejections = checked.filter((it) => Boolean(it.reason));
+  const accepted = checked.filter((it) => !it.reason).map((it) => it.file);
+  if (rejections.length) emit("reject", rejections);
+  if (accepted.length) emit("select", accepted);
 }
-function handleFileChange(files) {
-  if (!files.length) return;
-  const images = [...files].map((it) => ({
-    alt: it.name,
-    id: crypto.randomUUID(),
-    name: it.name,
-    size: it.size,
-    url: URL.createObjectURL(it)
-  }));
-  return pictures.value.push(...images);
+function openDialog() {
+  if (!props.disabled) open();
 }
+defineExpose({ open: openDialog });
 </script>
 
 <template>
-  <div ref="dropZoneRef" :class="{ 'dz-drag-hover': isOverDropZone }" class="dropzone dz-clickable text-start">
-    <input
-        ref="fileInputRef"
-        :accept="props.accept.join(',')"
-        :multiple="props.multiple"
-        class="d-none"
-        type="file"
-        @change="(e) => handleFileChange(e.target.files)"
-    >
+  <div
+      ref="dropZone"
+      :class="{ 'dz-drag-hover': isOverDropZone, 'opacity-50 pe-none': props.disabled }"
+      class="dropzone dz-clickable text-start"
+      @click="openDialog()">
+    <slot :dragging="isOverDropZone" :open="openDialog">
+      <div class="dz-message needsclick">
+        <i class="ki-duotone ki-file-up text-primary fs-3x">
+          <span class="path1" />
+          <span class="path2" />
+        </i>
 
-    <div class="dz-message needsclick" @click="triggerInput">
-      <i class="ki-duotone ki-file-up text-primary fs-3x">
-        <span class="path1" />
-        <span class="path2" />
-      </i>
+        <div class="ms-4">
+          <h3 class="fs-5 fw-bold text-gray-900 mb-1" v-text="titleText" />
 
-      <div class="ms-4">
-        <h3 class="fs-5 fw-bold text-gray-900 mb-1">Drop files here or click to upload.</h3>
-        <span class="fs-7 fw-semibold text-gray-400">Upload up to 10 files</span>
-      </div>
-    </div>
-
-    <template v-for="picture in pictures" :key="picture._id">
-      <div class="dz-preview border dz-image-preview">
-        <div class="dz-image">
-          <BImg :alt="picture.alt" :src="picture.url" class="w-100" />
-        </div>
-
-        <div class="dz-details">
-          <div class="dz-size">
-            <span v-text="filesize(picture.size)" />
-          </div>
-
-          <div class="dz-filename">
-            <span v-text="picture.name" />
-          </div>
+          <span v-if="hintText" class="fs-7 fw-semibold text-gray-500" v-text="hintText" />
         </div>
-
-        <span class="dz-remove" @click="removePicture(picture._id)">
-          <span>Remove file</span>
-        </span>
       </div>
-    </template>
+    </slot>
   </div>
 </template>
+
+<i18n lang="json">
+{
+  "en": {
+    "hint": "Up to {size}",
+    "title": "Drop a file here or click to choose",
+    "titleMany": "Drop files here or click to choose"
+  },
+  "pt": {
+    "hint": "Até {size}",
+    "title": "Solte um arquivo aqui ou clique para escolher",
+    "titleMany": "Solte os arquivos aqui ou clique para escolher"
+  }
+}
+</i18n>

package/dist/runtime/components/input/InputDropzone.vue.d.ts

@@ -1,4 +1,16 @@
-declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+export interface InputDropzoneRejection {
+    file: File;
+    reason: 'type' | 'size';
+}
+declare function openDialog(): void;
+declare var __VLS_1: {
+    dragging: boolean;
+    open: typeof openDialog;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     accept: {
         type: {
             (arrayLength: number): string[];
@@ -18,15 +30,31 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
         };
         default: () => never[];
     };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hint: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    maxSize: {
+        type: NumberConstructor;
+        default: number;
+    };
     multiple: {
         type: BooleanConstructor;
         default: boolean;
     };
-    modelValue: {
-        type: import("vue").PropType<unknown[]>;
+    title: {
+        type: StringConstructor;
+        default: undefined;
     };
-}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:modelValue": (value: unknown[]) => any;
+}>, {
+    open: typeof openDialog;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    select: (files: File[]) => any;
+    reject: (rejections: InputDropzoneRejection[]) => any;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     accept: {
         type: {
@@ -47,18 +75,42 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
         };
         default: () => never[];
     };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    hint: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    maxSize: {
+        type: NumberConstructor;
+        default: number;
+    };
     multiple: {
         type: BooleanConstructor;
         default: boolean;
     };
-    modelValue: {
-        type: import("vue").PropType<unknown[]>;
+    title: {
+        type: StringConstructor;
+        default: undefined;
     };
 }>> & Readonly<{
-    "onUpdate:modelValue"?: ((value: unknown[]) => any) | undefined;
+    onSelect?: ((files: File[]) => any) | undefined;
+    onReject?: ((rejections: InputDropzoneRejection[]) => any) | undefined;
 }>, {
+    title: string;
+    disabled: boolean;
     accept: string[];
+    hint: string;
+    maxSize: number;
     multiple: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@merkaly/nuxt",
-  "version": "0.10.0",
+  "version": "0.10.2",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/merkaly-io/nuxt.git"
@@ -28,7 +28,7 @@
     "dist"
   ],
   "dependencies": {
-    "@auth0/auth0-spa-js": "^2.29.0",
+    "@auth0/auth0-spa-js": "^2.30.0",
     "@bootstrap-vue-next/nuxt": "^1.0.0",
     "@nuxt/devtools": "^4.0.0",
     "@nuxt/eslint": "1.17.0",
@@ -38,7 +38,9 @@
     "@nuxt/kit": "^4.6.0",
     "@nuxtjs/i18n": "^10.6.0",
     "@nuxtjs/plausible": "^4.0.0",
-    "@sentry/nuxt": "^11.9.0",
+    "@nuxtjs/robots": "^7.0.2",
+    "@nuxtjs/sitemap": "^9.1.0",
+    "@sentry/nuxt": "^11.10.0",
     "@types/node": "latest",
     "@types/vue-select": "^3.16.8",
     "@vueuse/components": "^15.0.0",
@@ -50,13 +52,13 @@
     "change-case": "^5.4.4",
     "class-transformer": "^0.5.1",
     "class-validator": "^0.15.1",
-    "eslint": "^10.13.0",
+    "eslint": "^10.14.0",
     "filesize": "^11.0.17",
     "gsap": "^3.15.0",
     "notivue": "^2.4.5",
     "nuxt": "^4.6.3",
     "reflect-metadata": "^0.2.2",
-    "sass": "^1.106.1",
+    "sass": "^1.107.1",
     "typescript": "~5.9.3",
     "v-money3": "^3.26.1",
     "vite-svg-loader": "^5.1.1",