@kirby-tools/licensing 0.3.2 → 0.4.0

package/dist/components/LicensingButtonGroup.vue

@@ -0,0 +1,83 @@
+<script setup lang="ts">
+import type { ComponentPublicInstance, PropType } from 'vue'
+import type { LicenseStatus } from '../types'
+import { onMounted, ref } from 'kirbyuse'
+import { useLicense } from '../license'
+import { t } from '../utils'
+
+const props = defineProps({
+  label: {
+    type: String,
+    required: true,
+  },
+  apiNamespace: {
+    type: String,
+    required: true,
+  },
+  licenseStatus: {
+    type: String as PropType<LicenseStatus>,
+    required: true,
+  },
+  pricingUrl: {
+    type: String,
+    required: true,
+  },
+})
+
+const { openLicenseModal, assertActivationIntegrity } = useLicense({
+  label: props.label,
+  apiNamespace: props.apiNamespace,
+})
+
+const currentLicenseStatus = ref(props.licenseStatus)
+const licenseButtonGroup = ref<ComponentPublicInstance | undefined>()
+
+onMounted(() => {
+  assertActivationIntegrity({
+    component: licenseButtonGroup,
+    licenseStatus: props.licenseStatus,
+  })
+})
+
+async function handleRegistration() {
+  const { isRegistered } = await openLicenseModal()
+  if (isRegistered) {
+    currentLicenseStatus.value = 'active'
+  }
+}
+</script>
+
+<template>
+  <k-button-group
+    v-if="currentLicenseStatus !== 'active'"
+    ref="licenseButtonGroup"
+    layout="collapsed"
+  >
+    <k-button
+      v-if="currentLicenseStatus === 'upgradeable'"
+      theme="notice"
+      variant="filled"
+      size="xs"
+      link="https://hub.kirby.tools"
+      target="_blank"
+      :text="t('upgrade')"
+    />
+    <k-button
+      v-else
+      theme="love"
+      variant="filled"
+      size="xs"
+      :link="pricingUrl"
+      target="_blank"
+      :text="t('buy')"
+    />
+    <k-button
+      theme="love"
+      variant="filled"
+      size="xs"
+      icon="key"
+      :text="t('activate')"
+      @click="handleRegistration()"
+    />
+  </k-button-group>
+</template>

package/dist/components/index.d.ts

@@ -0,0 +1 @@
+export { default as LicensingButtonGroup } from './LicensingButtonGroup.vue';

package/dist/components/index.mjs

@@ -0,0 +1 @@
+export { default as LicensingButtonGroup } from "./LicensingButtonGroup.vue";

package/dist/constants.d.ts

@@ -0,0 +1,4 @@
+export type Locale = string;
+export type Message = string;
+export type Messages = Record<string, Message>;
+export declare const TRANSLATIONS: Record<Locale, Messages>;

package/dist/constants.mjs

@@ -0,0 +1,58 @@
+export const TRANSLATIONS = {
+  en: {
+    "modal.info": "Thanks for purchasing {label}! Please enter your email address and order ID to activate your license.",
+    "modal.fields.orderId.help": '<a href="https://app.lemonsqueezy.com/my-orders" target="_blank">Find your order number</a> on Lemon Squeezy or <a href="mailto:hello@kirby.tools">contact us</a> if you cannot find it.',
+    "modal.error.required.fields": "Email address and order ID are required",
+    "modal.error.invalid.unauthorized": "Email address or order ID is incorrect",
+    "modal.error.invalid.licenseKey": "License key invalid for this plugin",
+    "modal.error.incompatible": "License key invalid for this plugin version",
+    "modal.error.upgradeable": "License key invalid for this plugin version. Upgrade now on https://hub.kirby.tools.",
+    "modal.error.registered": "License key already registered",
+    "activate": "Activate",
+    "activated": "Plugin activated",
+    "buy": "Buy a license",
+    "upgrade": "Upgrade"
+  },
+  de: {
+    "modal.info": "Dankesch\xF6n f\xFCr den Kauf von {label}! Bitte gib deine E-Mail-Adresse und Bestellnummer ein, um deine Lizenz zu aktivieren.",
+    "modal.fields.orderId.help": '<a href="https://app.lemonsqueezy.com/my-orders" target="_blank">Finde deine Bestellnummer</a> bei Lemon Squeezy oder <a href="mailto:hello@kirby.tools">kontaktiere uns</a>, wenn du sie nicht finden kannst.',
+    "modal.error.required.fields": "E-Mail-Adresse und Bestellnummer sind notwendig",
+    "modal.error.invalid.unauthorized": "E-Mail-Adresse oder Bestellnummer ist falsch",
+    "modal.error.invalid.licenseKey": "Lizenzschl\xFCssel ung\xFCltig f\xFCr dieses Plugin",
+    "modal.error.incompatible": "Lizenzschl\xFCssel ung\xFCltig f\xFCr diese Plugin-Version",
+    "modal.error.upgradeable": "Lizenzschl\xFCssel ung\xFCltig f\xFCr diese Plugin-Version. Aktualisiere jetzt auf https://hub.kirby.tools.",
+    "modal.error.registered": "Lizenzschl\xFCssel bereits registriert",
+    "activate": "Aktivieren",
+    "activated": "Plugin aktiviert",
+    "buy": "Lizenz kaufen",
+    "upgrade": "Upgrade"
+  },
+  fr: {
+    "modal.info": "Merci d'avoir achet\xE9 {label} ! Veuillez saisir votre adresse e-mail et votre num\xE9ro de commande pour activer votre licence.",
+    "modal.fields.orderId.help": '<a href="https://app.lemonsqueezy.com/my-orders" target="_blank">Trouvez votre num\xE9ro de commande</a> sur Lemon Squeezy ou <a href="mailto:hello@kirby.tools">contactez-nous</a> si vous ne le trouvez pas.',
+    "modal.error.required.fields": "Adresse e-mail et num\xE9ro de commande requis",
+    "modal.error.invalid.unauthorized": "Adresse e-mail ou num\xE9ro de commande incorrect",
+    "modal.error.invalid.licenseKey": "Cl\xE9 de licence invalide pour ce plugin",
+    "modal.error.incompatible": "Cl\xE9 de licence invalide pour cette version du plugin",
+    "modal.error.upgradeable": "Cl\xE9 de licence invalide pour cette version du plugin. Mettez \xE0 niveau maintenant sur https://hub.kirby.tools.",
+    "modal.error.registered": "Cl\xE9 de licence d\xE9j\xE0 enregistr\xE9e",
+    "activate": "Activer",
+    "activated": "Plugin activ\xE9",
+    "buy": "Acheter une licence",
+    "upgrade": "Upgrade"
+  },
+  nl: {
+    "modal.info": "Bedankt voor het kopen van {label}! Voer je e-mailadres en bestelnummer in om je licentie te activeren.",
+    "modal.fields.orderId.help": '<a href="https://app.lemonsqueezy.com/my-orders" target="_blank">Vind je bestelnummer</a> op Lemon Squeezy of <a href="mailto:hello@kirby.tools">neem contact met ons op</a> als je het niet kunt vinden.',
+    "modal.error.required.fields": "E-mailadres en bestelnummer zijn verplicht",
+    "modal.error.invalid.unauthorized": "E-mailadres of bestelnummer is onjuist",
+    "modal.error.invalid.licenseKey": "Licentiesleutel ongeldig voor dit plug-in",
+    "modal.error.incompatible": "Licentiesleutel ongeldig voor deze plug-inversie",
+    "modal.error.upgradeable": "Licentiesleutel ongeldig voor deze plug-inversie. Upgrade nu op https://hub.kirby.tools.",
+    "modal.error.registered": "Licentiesleutel al geregistreerd",
+    "activate": "Activeren",
+    "activated": "Plugin geactiveerd",
+    "buy": "Koop een licentie",
+    "upgrade": "Upgrade"
+  }
+};

package/dist/index.d.ts

@@ -1,28 +1,2 @@
-import { Ref, ComponentPublicInstance } from 'vue';
-
-type MaybeRef<T = any> = T | Ref<T>;
-type LicenseKey = string;
-type LicenseStatus = 'active' | 'inactive' | 'invalid' | 'incompatible';
-interface License {
-    key: LicenseKey;
-    version: number;
-    compatibility: string;
-}
-
-interface LicenseOptions {
-    label: string;
-    apiNamespace: string;
-}
-interface LicenseModalResult {
-    isRegistered: boolean;
-}
-declare function useLicense({ label, apiNamespace, }: LicenseOptions): {
-    isLocalhost: boolean;
-    assertActivationIntegrity: ({ component, licenseStatus }: {
-        component: MaybeRef<ComponentPublicInstance | null | undefined>;
-        licenseStatus: MaybeRef<LicenseStatus>;
-    }) => Promise<void>;
-    openLicenseModal: () => Promise<LicenseModalResult>;
-};
-
-export { type License, type LicenseKey, useLicense };
+export * from './license';
+export type { License, LicenseKey, LicenseStatus } from './types';

package/dist/index.mjs

@@ -1,158 +1 @@
-import { usePanel, useApi, unref, nextTick } from 'kirbyuse';
-
-const TRANSLATIONS = {
-  en: {
-    "modal.info": "Thanks for purchasing {label}! Please enter your email address and order ID to activate your license.",
-    "modal.fields.orderId.help": '<a href="https://app.lemonsqueezy.com/my-orders" target="_blank">Find your order number</a> on Lemon Squeezy or <a href="mailto:hello@kirby.tools">contact us</a> if you cannot find it.',
-    "modal.error.required.fields": "Email address and order ID are required",
-    "modal.error.invalid.unauthorized": "Email address or order ID is incorrect",
-    "modal.error.invalid.licenseKey": "License key invalid for this plugin",
-    "modal.error.incompatible.licenseKey": "License key invalid for this plugin version",
-    "modal.error.registered": "License key already registered",
-    "activate": "Activate",
-    "activated": "Plugin activated"
-  },
-  de: {
-    "modal.info": "Dankesch\xF6n f\xFCr den Kauf von {label}! Bitte gib deine E-Mail-Adresse und Bestellnummer ein, um deine Lizenz zu aktivieren.",
-    "modal.fields.orderId.help": '<a href="https://app.lemonsqueezy.com/my-orders" target="_blank">Finde deine Bestellnummer</a> bei Lemon Squeezy oder <a href="mailto:hello@kirby.tools">kontaktiere uns</a>, wenn du sie nicht finden kannst.',
-    "modal.error.required.fields": "E-Mail-Adresse und Bestellnummer sind notwendig",
-    "modal.error.invalid.unauthorized": "E-Mail-Adresse oder Bestellnummer ist falsch",
-    "modal.error.invalid.licenseKey": "Lizenzschl\xFCssel ung\xFCltig f\xFCr dieses Plugin",
-    "modal.error.incompatible.licenseKey": "Lizenzschl\xFCssel ung\xFCltig f\xFCr diese Plugin-Version",
-    "modal.error.registered": "Lizenzschl\xFCssel bereits registriert",
-    "activate": "Aktivieren",
-    "activated": "Plugin aktiviert"
-  },
-  fr: {
-    "modal.info": "Merci d'avoir achet\xE9 {label} ! Veuillez saisir votre adresse e-mail et votre num\xE9ro de commande pour activer votre licence.",
-    "modal.fields.orderId.help": '<a href="https://app.lemonsqueezy.com/my-orders" target="_blank">Trouvez votre num\xE9ro de commande</a> sur Lemon Squeezy ou <a href="mailto:hello@kirby.tools">contactez-nous</a> si vous ne le trouvez pas.',
-    "modal.error.required.fields": "Adresse e-mail et num\xE9ro de commande requis",
-    "modal.error.invalid.unauthorized": "Adresse e-mail ou num\xE9ro de commande incorrect",
-    "modal.error.invalid.licenseKey": "Cl\xE9 de licence invalide pour ce plugin",
-    "modal.error.incompatible.licenseKey": "Cl\xE9 de licence invalide pour cette version du plugin",
-    "modal.error.registered": "Cl\xE9 de licence d\xE9j\xE0 enregistr\xE9e",
-    "activate": "Activer",
-    "activated": "Plugin activ\xE9"
-  }
-};
-
-function t(key, data, fallback) {
-  const panel = usePanel();
-  const languageCode = panel.translation.code;
-  const translation = TRANSLATIONS?.[languageCode]?.[key] ?? fallback;
-  if (!translation)
-    return;
-  return data ? template(translation, data) : translation;
-}
-function template(input, values, fallback) {
-  return input.replace(
-    /\{(\w+)\}/g,
-    (_, key) => values[key] || (key)
-  );
-}
-
-const LOCALHOST_HOSTNAMES = ["localhost", "127.0.0.1", "[::1]"];
-const LOCAL_DOMAINS = ["local", "test", "ddev.site"];
-function useLicense({
-  label,
-  apiNamespace
-}) {
-  const panel = usePanel();
-  const api = useApi();
-  const isLocalhost = isLocal();
-  const register = async (email, orderId) => {
-    if (!email || !orderId) {
-      throw new Error("Email and order ID are required");
-    }
-    const response = await api.post(`${apiNamespace}/register`, { email, orderId });
-    if (response?.status !== "ok") {
-      throw new Error("Registration failed");
-    }
-    return true;
-  };
-  const openLicenseModal = () => {
-    let isRegistered = false;
-    return new Promise((resolve) => {
-      panel.dialog.open({
-        component: "k-form-dialog",
-        props: {
-          submitButton: {
-            icon: "check",
-            theme: "love",
-            text: t("activate", { label })
-          },
-          fields: {
-            info: {
-              type: "info",
-              text: t("modal.info", { label })
-            },
-            email: {
-              label: panel.t("email"),
-              type: "email"
-            },
-            orderId: {
-              label: "Order ID",
-              type: "text",
-              help: t("modal.fields.orderId.help", { label })
-            }
-          }
-        },
-        on: {
-          // Close event will always be triggered, even on submit
-          close: () => {
-            resolve({ isRegistered });
-          },
-          submit: async (event) => {
-            const { email, orderId } = event;
-            if (!email || !orderId) {
-              panel.notification.error(t("modal.error.required.fields"));
-              return;
-            }
-            try {
-              await register(email, Number(orderId));
-            } catch (error) {
-              let message = error.message;
-              if (message === "Unauthorized") {
-                message = t("modal.error.invalid.unauthorized");
-              } else if (message === "License key not valid for this plugin") {
-                message = t("modal.error.invalid.licenseKey");
-              } else if (message === "License key not valid for this plugin version") {
-                message = t("modal.error.incompatible.licenseKey");
-              } else if (message === "License key already registered") {
-                message = t("modal.error.registered");
-              }
-              panel.notification.error(message);
-              return;
-            }
-            isRegistered = true;
-            panel.dialog.close();
-            panel.notification.success(t("activated"));
-          }
-        }
-      });
-    });
-  };
-  const assertActivationIntegrity = async ({ component, licenseStatus }) => {
-    if (unref(licenseStatus) === "active") {
-      return;
-    }
-    await nextTick();
-    const _component = unref(component);
-    if (!_component?.$el || window.getComputedStyle(_component.$el).display === "none" || window.getComputedStyle(_component.$el).visibility === "hidden" || window.getComputedStyle(_component.$el).opacity === "0") {
-      throw new Error("Are you trying to hide the activation buttons? Please buy a license.");
-    }
-  };
-  return {
-    isLocalhost,
-    assertActivationIntegrity,
-    openLicenseModal
-  };
-}
-function isLocal() {
-  const { hostname } = window.location;
-  const isLocalhost = LOCALHOST_HOSTNAMES.includes(hostname);
-  const isLocalDomain = LOCAL_DOMAINS.some((domain) => hostname.endsWith(`.${domain}`));
-  return isLocalhost || isLocalDomain;
-}
-
-export { useLicense };
+export * from "./license.mjs";

package/dist/license.d.ts

@@ -0,0 +1,17 @@
+import type { ComponentPublicInstance } from 'vue';
+import type { LicenseStatus, MaybeRef } from './types';
+export interface LicenseOptions {
+    label: string;
+    apiNamespace: string;
+}
+export interface LicenseModalResult {
+    isRegistered: boolean;
+}
+export declare function useLicense(licenseOptions: LicenseOptions): {
+    isLocalhost: any;
+    assertActivationIntegrity: ({ component, licenseStatus }: {
+        component: MaybeRef<ComponentPublicInstance | null | undefined>;
+        licenseStatus: MaybeRef<LicenseStatus>;
+    }) => Promise<void>;
+    openLicenseModal: () => any;
+};

package/dist/license.mjs

@@ -0,0 +1,102 @@
+import { unref, usePanel } from "kirbyuse";
+import { t } from "./utils.mjs";
+const LOCALHOST_HOSTNAMES = ["localhost", "127.0.0.1", "[::1]"];
+const LOCAL_DOMAINS = ["local", "test", "ddev.site"];
+const ERROR_MESSAGE_TRANSLATIONS = {
+  "Unauthorized": "modal.error.invalid.unauthorized",
+  "License key not valid for this plugin": "modal.error.invalid.licenseKey",
+  "License key not valid for this plugin version": "modal.error.incompatible",
+  "License key not valid for this plugin version, please upgrade your license": "modal.error.upgradeable",
+  "License key already registered": "modal.error.registered"
+};
+export function useLicense(licenseOptions) {
+  const panel = usePanel();
+  const isLocalhost = isLocal();
+  const openLicenseModal = () => {
+    let isRegistered = false;
+    const { label } = licenseOptions;
+    const fields = {
+      info: {
+        type: "info",
+        text: t("modal.info", { label })
+      },
+      email: {
+        label: panel.t("email"),
+        type: "email"
+      },
+      orderId: {
+        label: "Order ID",
+        type: "text",
+        help: t("modal.fields.orderId.help", { label })
+      }
+    };
+    return new Promise((resolve) => {
+      panel.dialog.open({
+        component: "k-form-dialog",
+        props: {
+          submitButton: {
+            icon: "check",
+            theme: "love",
+            text: t("activate", { label })
+          },
+          fields
+        },
+        on: {
+          // Close event will always be triggered, even on submit
+          close: () => {
+            resolve({ isRegistered });
+          },
+          submit: async (event) => {
+            isRegistered = await registerLicense(event, licenseOptions);
+            if (isRegistered) {
+              panel.dialog.close();
+              panel.notification.success(t("activated"));
+            }
+          }
+        }
+      });
+    });
+  };
+  const assertActivationIntegrity = async ({ component, licenseStatus }) => {
+    if (unref(licenseStatus) === "active") {
+      return;
+    }
+    const _component = unref(component);
+    if (!_component?.$el || window.getComputedStyle(_component.$el).display === "none" || window.getComputedStyle(_component.$el).visibility === "hidden" || window.getComputedStyle(_component.$el).opacity === "0") {
+      throw new Error("Are you trying to hide the activation buttons? Please buy a license.");
+    }
+  };
+  return {
+    isLocalhost,
+    assertActivationIntegrity,
+    openLicenseModal
+  };
+}
+async function registerLicense(event, licenseOptions) {
+  const panel = usePanel();
+  const { email, orderId } = event;
+  if (!email || !orderId) {
+    panel.notification.error(t("modal.error.required.fields"));
+    return false;
+  }
+  try {
+    const response = await panel.api.post(`${licenseOptions.apiNamespace}/register`, {
+      email,
+      orderId: Number(orderId)
+    });
+    if (response?.status !== "ok") {
+      throw new Error("Failed to register license");
+    }
+    return true;
+  } catch (error) {
+    const message = error.message;
+    panel.notification.error(ERROR_MESSAGE_TRANSLATIONS[message] ? t(ERROR_MESSAGE_TRANSLATIONS[message]) : message);
+    return false;
+  }
+}
+function isLocal() {
+  const { hostname } = window.location;
+  const isLocalhost = LOCALHOST_HOSTNAMES.includes(hostname);
+  const isLocalDomain = LOCAL_DOMAINS.some((domain) => hostname.endsWith(`.${domain}`));
+  return isLocalhost || isLocalDomain;
+}

package/dist/types.d.ts

@@ -0,0 +1,9 @@
+import type { Ref } from 'vue';
+export type MaybeRef<T = any> = T | Ref<T>;
+export type LicenseKey = string;
+export type LicenseStatus = 'active' | 'inactive' | 'invalid' | 'incompatible' | 'upgradeable';
+export interface License {
+    key: LicenseKey;
+    version: number;
+    compatibility: string;
+}

package/dist/utils.d.ts

@@ -0,0 +1,2 @@
+export declare function t(key?: string, data?: Record<string, string>): string;
+export declare function template(input: string, values: Record<string, string>, fallback?: string | ((key: string) => string)): string;

package/dist/utils.mjs

@@ -0,0 +1,12 @@
+import { TRANSLATIONS } from "./constants.mjs";
+export function t(key = "", data) {
+  const languageCode = window.panel.translation.code;
+  const translation = TRANSLATIONS?.[languageCode]?.[key] ?? key;
+  return data ? template(translation, data) : translation;
+}
+export function template(input, values, fallback) {
+  return input.replace(
+    /\{(\w+)\}/g,
+    (_, key) => values[key] || ((typeof fallback === "function" ? fallback(key) : fallback) ?? key)
+  );
+}

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@kirby-tools/licensing",
   "type": "module",
-  "version": "0.3.2",
-  "packageManager": "pnpm@9.10.0",
-  "description": "Shared tooling for licensing in the Panel",
+  "version": "0.4.0",
+  "packageManager": "pnpm@9.15.0",
+  "description": "Shared tooling for Kirby Tools licensing in the Kirby Panel",
   "author": "Johann Schopplich <hello@johannschopplich.com>",
   "license": "AGPL-3.0-or-later",
   "homepage": "https://github.com/kirby-tools/licensing-panel#readme",
@@ -17,8 +17,12 @@
   "sideEffects": false,
   "exports": {
     ".": {
-      "types": "./dist/index.d.mts",
+      "types": "./dist/index.d.ts",
       "default": "./dist/index.mjs"
+    },
+    "./components": {
+      "types": "./dist/components/index.d.ts",
+      "import": "./dist/components/index.mjs"
     }
   },
   "types": "./dist/index.d.ts",
@@ -31,15 +35,18 @@
     "lint:fix": "eslint . --fix",
     "release": "bumpp"
   },
+  "peerDependencies": {
+    "kirbyuse": "*"
+  },
   "dependencies": {
-    "kirbyuse": "^0.7.1",
     "vue": "^2.7.16"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "^3.5.1",
-    "bumpp": "^9.5.2",
-    "eslint": "^9.10.0",
-    "typescript": "^5.5.4",
-    "unbuild": "^3.0.0-rc.7"
+    "@antfu/eslint-config": "^3.11.2",
+    "bumpp": "^9.9.0",
+    "eslint": "^9.16.0",
+    "kirbyuse": "^0.9.1",
+    "typescript": "^5.7.2",
+    "unbuild": "^3.0.0-rc.11"
   }
 }

package/dist/index.d.mts

@@ -1,28 +0,0 @@
-import { Ref, ComponentPublicInstance } from 'vue';
-
-type MaybeRef<T = any> = T | Ref<T>;
-type LicenseKey = string;
-type LicenseStatus = 'active' | 'inactive' | 'invalid' | 'incompatible';
-interface License {
-    key: LicenseKey;
-    version: number;
-    compatibility: string;
-}
-
-interface LicenseOptions {
-    label: string;
-    apiNamespace: string;
-}
-interface LicenseModalResult {
-    isRegistered: boolean;
-}
-declare function useLicense({ label, apiNamespace, }: LicenseOptions): {
-    isLocalhost: boolean;
-    assertActivationIntegrity: ({ component, licenseStatus }: {
-        component: MaybeRef<ComponentPublicInstance | null | undefined>;
-        licenseStatus: MaybeRef<LicenseStatus>;
-    }) => Promise<void>;
-    openLicenseModal: () => Promise<LicenseModalResult>;
-};
-
-export { type License, type LicenseKey, useLicense };