katecms 0.0.0-stage → 1.0.0-beta.1

package/dist/runtime/pages/admin/media.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/pages/admin/options/[page].d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/pages/admin/options/[page].vue

@@ -0,0 +1,151 @@
+<script setup>
+import { computed, nextTick, onMounted, reactive, ref, watch } from "vue";
+import { $fetch, useHead, useRoute } from "#imports";
+import { parseAuthError } from "../../../utils/auth-error";
+import { optionApi } from "../../../utils/options";
+const route = useRoute();
+const rootClass = "katecms-options-page";
+const formId = "cms-options-form";
+const pageSlug = computed(() => String(route.params.page ?? ""));
+const page = ref(null);
+const found = ref(false);
+const loading = ref(true);
+const saving = ref(false);
+const error = ref(null);
+const savedNoticeId = ref(0);
+const canRead = ref(false);
+const canUpdate = ref(false);
+const entryForm = ref(null);
+const form = reactive({});
+const pageTitle = computed(() => page.value?.label || "Options");
+useHead({ title: pageTitle });
+function applyPage(res) {
+  page.value = res.page;
+  canRead.value = res.canRead;
+  canUpdate.value = res.canUpdate;
+  replaceForm(res.values ?? {});
+  found.value = true;
+}
+function replaceForm(next) {
+  for (const key of Object.keys(form)) {
+    Reflect.deleteProperty(form, key);
+  }
+  Object.assign(form, next);
+}
+async function load() {
+  loading.value = true;
+  error.value = null;
+  found.value = false;
+  try {
+    const res = await $fetch(optionApi(pageSlug.value));
+    applyPage(res);
+    if (!res.canRead) {
+      found.value = false;
+      error.value = "Insufficient permissions.";
+    }
+  } catch (err) {
+    error.value = parseAuthError(err, "Could not load the options.").message;
+  } finally {
+    loading.value = false;
+  }
+}
+async function submit() {
+  if (saving.value || !page.value || !canUpdate.value) {
+    return;
+  }
+  if (!entryForm.value?.validateForSubmit()) {
+    return;
+  }
+  saving.value = true;
+  error.value = null;
+  try {
+    const res = await $fetch(optionApi(pageSlug.value), {
+      method: "PATCH",
+      body: { fields: { ...form } }
+    });
+    applyPage(res);
+    await nextTick();
+    savedNoticeId.value += 1;
+  } catch (err) {
+    error.value = parseAuthError(err, "Could not save the options.").message;
+  } finally {
+    saving.value = false;
+  }
+}
+onMounted(load);
+watch(pageSlug, load);
+</script>
+
+<template>
+  <div :class="rootClass">
+    <KateCmsAdminHeader :title="pageTitle">
+      <KateCmsUiButton
+        v-if="found && canUpdate"
+        tag="button"
+        type="submit"
+        :form="formId"
+        :disabled="saving"
+      >
+        {{ saving ? "Saving\u2026" : "Save" }}
+      </KateCmsUiButton>
+    </KateCmsAdminHeader>
+
+    <KateCmsUiNotice
+      v-if="savedNoticeId"
+      :key="savedNoticeId"
+      placement="fixed"
+      message="Changes saved."
+      @close="savedNoticeId = 0"
+    />
+    <KateCmsUiNotice
+      v-if="loading"
+      placement="static"
+      variant="info"
+      message="Loading…"
+      :closable="false"
+    />
+    <KateCmsUiNotice
+      v-else-if="!found"
+      placement="static"
+      variant="danger"
+      :message="error || 'Options page not found.'"
+      :closable="false"
+    />
+
+    <div
+      v-else-if="page"
+      :class="`${rootClass}__fields`"
+    >
+      <KateCmsOptionPageForm
+        ref="entryForm"
+        :form-id="formId"
+        :page="page"
+        :model-value="form"
+        :saving="saving"
+        :error="error"
+        :can-update="canUpdate"
+        @update:model-value="replaceForm"
+        @submit="submit"
+      />
+    </div>
+  </div>
+</template>
+
+<style scoped>
+body#katecms-body .katecms-options-page {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+  padding: 0;
+  height: 100%;
+}
+body#katecms-body .katecms-options-page__fields {
+  padding: 0 0.5rem 0.5rem;
+  flex-grow: 1;
+  min-height: 0;
+  overflow: auto;
+}
+body#katecms-body .katecms-options-page :deep(.katecms-admin-header) {
+  padding: 0.5rem;
+}
+</style>

package/dist/runtime/pages/admin/options/[page].vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/pages/admin/register.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/pages/admin/register.vue

@@ -0,0 +1,391 @@
+<script setup>
+import { computed, ref } from "vue";
+import { $fetch, navigateTo, useHead } from "#imports";
+import { parseAuthError } from "../../utils/auth-error";
+import { useAuth } from "../../composables/useAuth";
+import { useAuthCooldown } from "../../composables/useAuthCooldown";
+import { useCmsPaths } from "../../composables/useCmsPaths";
+const rootClass = "katecms-auth";
+const { authState } = useAuth();
+const isFirstUser = computed(() => authState.value?.hasUsers === false);
+useHead({
+  bodyAttrs: {
+    id: "katecms-body"
+  },
+  title: () => isFirstUser.value ? "Create owner" : "Register"
+});
+const paths = useCmsPaths();
+const { remainingSec, locked, start: startCooldown } = useAuthCooldown();
+const emailField = { label: "Email", required: true };
+const passwordField = { type: "password", label: "Password", required: true };
+const passwordConfirmField = { type: "password", label: "Confirm password", required: true };
+const email = ref("");
+const password = ref("");
+const passwordConfirm = ref("");
+const loading = ref(false);
+const error = ref(null);
+const canSubmit = computed(
+  () => !loading.value && !locked.value && email.value.trim().length > 0 && password.value.length > 0 && passwordConfirm.value.length > 0
+);
+const submitLabel = computed(() => {
+  if (loading.value) {
+    return "Creating\u2026";
+  }
+  if (locked.value) {
+    return `Wait ${remainingSec.value} sec.`;
+  }
+  return "Register";
+});
+async function submit() {
+  if (!canSubmit.value) {
+    return;
+  }
+  loading.value = true;
+  error.value = null;
+  try {
+    await $fetch("/api/_katecms/auth/register", {
+      method: "POST",
+      body: {
+        email: email.value.trim(),
+        password: password.value,
+        passwordConfirm: passwordConfirm.value
+      }
+    });
+    await navigateTo(paths.admin);
+  } catch (err) {
+    const parsed = parseAuthError(err, "Could not register.");
+    error.value = parsed.message;
+    startCooldown(parsed.retryAfterMs, () => {
+      error.value = null;
+    });
+  } finally {
+    loading.value = false;
+  }
+}
+</script>
+
+<template>
+  <div :class="rootClass">
+    <div :class="`${rootClass}__card`">
+      <img
+        :class="`${rootClass}__logo`"
+        src="../../assets/img/katecms-logo.svg"
+        alt="KateCMS"
+      >
+      <div :class="`${rootClass}__title`">
+        {{ isFirstUser ? "Create owner" : "Register" }}
+      </div>
+      <div :class="`${rootClass}__subtitle`">
+        <template v-if="isFirstUser">
+          This is the first account — it will automatically receive the owner role.
+        </template>
+        <template v-else>
+          Fill in the form to create an account. New users are assigned the subscriber role.
+        </template>
+      </div>
+
+      <form
+        :class="`${rootClass}__form`"
+        @submit.prevent="submit"
+      >
+        <KateCmsFieldWrapper
+          field-key="cms-register-email"
+          :field="emailField"
+        >
+          <KateCmsInputControl
+            v-model="email"
+            type="email"
+            field-key="cms-register-email"
+            :field="emailField"
+            autocomplete="email"
+          />
+        </KateCmsFieldWrapper>
+
+        <KateCmsPasswordField
+          v-model="password"
+          field-key="cms-register-password"
+          :field="passwordField"
+          autocomplete="new-password"
+          minlength="8"
+        />
+
+        <KateCmsPasswordField
+          v-model="passwordConfirm"
+          field-key="cms-register-password-confirm"
+          :field="passwordConfirmField"
+          autocomplete="new-password"
+        />
+
+        <div :class="`${rootClass}__actions`">
+          <KateCmsUiButton
+            tag="button"
+            type="submit"
+            :disabled="!canSubmit"
+            :aria-label="submitLabel"
+          >
+            {{ submitLabel }}
+          </KateCmsUiButton>
+        </div>
+      </form>
+
+      <div
+        v-if="error"
+        :class="`${rootClass}__error`"
+      >
+        Error: {{ error }}
+      </div>
+
+      <div
+        v-if="!isFirstUser"
+        :class="`${rootClass}__footer`"
+      >
+        Already have an account?
+        <NuxtLink :to="paths.login">
+          Sign in
+        </NuxtLink>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style>
+body#katecms-body {
+  --katecms-color-accent: #2F6FED;
+  --katecms-color-accent-hover: #1E58D4;
+  --katecms-color-accent-wash: #EAF1FD;
+  --katecms-color-ink: #141A2A;
+  --katecms-color-muted: #6B7280;
+  --katecms-color-bg: #F6F7F8;
+  --katecms-color-surface: #FFFFFF;
+  --katecms-color-border: #E6E8EB;
+  --katecms-color-on-accent: #FFFFFF;
+  --katecms-color-overlay: rgba(20, 26, 42, 0.45);
+  --katecms-color-success: #2A9A66;
+  --katecms-color-success-bg: #E7F6EE;
+  --katecms-color-info: #2A7BBD;
+  --katecms-color-info-bg: #E7F2FA;
+  --katecms-color-warning: #C4851A;
+  --katecms-color-warning-bg: #FBF3E3;
+  --katecms-color-danger: #D64545;
+  --katecms-color-danger-bg: #FDECEC;
+  --katecms-shadow-sm: 0 1px 2px rgba(20, 26, 42, 0.05);
+  --katecms-shadow-md: 0 8px 24px rgba(20, 26, 42, 0.08);
+  color-scheme: light;
+  color-scheme: light dark;
+  --katecms-border-radius: 0.375rem;
+  --katecms-border-radius-inter: 0.3125rem;
+  --katecms-sidebar-w: 15.625rem;
+  --katecms-topbar-h: 3.375rem;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-text-size-adjust: 100%;
+  -webkit-tap-highlight-color: transparent;
+  font-family: system-ui, sans-serif;
+  font-size: 0.9375rem;
+  font-weight: 400;
+  font-style: normal;
+  font-variant: normal;
+  font-stretch: normal;
+  line-height: 1.5;
+  letter-spacing: normal;
+  word-spacing: normal;
+  text-align: start;
+  text-indent: 0;
+  text-transform: none;
+  text-shadow: none;
+  text-rendering: optimizeLegibility;
+  color: var(--katecms-color-ink);
+  background-color: var(--katecms-color-surface);
+  background-image: none;
+  caret-color: var(--katecms-color-ink);
+  accent-color: var(--katecms-color-accent);
+  tab-size: 4;
+  hyphens: none;
+  word-break: normal;
+  overflow-wrap: break-word;
+  direction: ltr;
+  margin: 0;
+  padding: 0;
+  border: 0;
+  min-height: 100%;
+  overflow: hidden;
+}
+body#katecms-body *,
+body#katecms-body *::before,
+body#katecms-body *::after {
+  box-sizing: border-box;
+}
+body#katecms-body * {
+  scrollbar-width: thin;
+  scrollbar-color: var(--katecms-color-muted) transparent;
+  font-family: inherit;
+}
+body#katecms-body img,
+body#katecms-body svg,
+body#katecms-body video,
+body#katecms-body canvas {
+  max-width: 100%;
+  height: auto;
+}
+body#katecms-body form {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  background: none;
+  color: inherit;
+  font: inherit;
+  min-width: 0;
+}
+body#katecms-body.katecms-theme-light {
+  --katecms-color-accent: #2F6FED;
+  --katecms-color-accent-hover: #1E58D4;
+  --katecms-color-accent-wash: #EAF1FD;
+  --katecms-color-ink: #141A2A;
+  --katecms-color-muted: #6B7280;
+  --katecms-color-bg: #F6F7F8;
+  --katecms-color-surface: #FFFFFF;
+  --katecms-color-border: #E6E8EB;
+  --katecms-color-on-accent: #FFFFFF;
+  --katecms-color-overlay: rgba(20, 26, 42, 0.45);
+  --katecms-color-success: #2A9A66;
+  --katecms-color-success-bg: #E7F6EE;
+  --katecms-color-info: #2A7BBD;
+  --katecms-color-info-bg: #E7F2FA;
+  --katecms-color-warning: #C4851A;
+  --katecms-color-warning-bg: #FBF3E3;
+  --katecms-color-danger: #D64545;
+  --katecms-color-danger-bg: #FDECEC;
+  --katecms-shadow-sm: 0 1px 2px rgba(20, 26, 42, 0.05);
+  --katecms-shadow-md: 0 8px 24px rgba(20, 26, 42, 0.08);
+  color-scheme: light;
+}
+body#katecms-body.katecms-theme-dark {
+  --katecms-color-accent: #2F6FED;
+  --katecms-color-accent-hover: #1E58D4;
+  --katecms-color-accent-wash: #243456;
+  --katecms-color-ink: #E8EBF3;
+  --katecms-color-muted: #98A2B6;
+  --katecms-color-bg: #10141C;
+  --katecms-color-surface: #1A2030;
+  --katecms-color-border: #313A4E;
+  --katecms-color-on-accent: #FFFFFF;
+  --katecms-color-overlay: rgba(0, 0, 0, 0.64);
+  --katecms-color-success: #4ECA8E;
+  --katecms-color-success-bg: #143226;
+  --katecms-color-info: #79B7E4;
+  --katecms-color-info-bg: #152A3E;
+  --katecms-color-warning: #E6B15A;
+  --katecms-color-warning-bg: #3A2C14;
+  --katecms-color-danger: #F08B8B;
+  --katecms-color-danger-bg: #3C1E1E;
+  --katecms-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.45);
+  --katecms-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.5);
+  color-scheme: dark;
+}
+
+@media (prefers-color-scheme: dark) {
+  body#katecms-body:not(.katecms-theme-light):not(.katecms-theme-dark) {
+    --katecms-color-accent: #2F6FED;
+    --katecms-color-accent-hover: #1E58D4;
+    --katecms-color-accent-wash: #243456;
+    --katecms-color-ink: #E8EBF3;
+    --katecms-color-muted: #98A2B6;
+    --katecms-color-bg: #10141C;
+    --katecms-color-surface: #1A2030;
+    --katecms-color-border: #313A4E;
+    --katecms-color-on-accent: #FFFFFF;
+    --katecms-color-overlay: rgba(0, 0, 0, 0.64);
+    --katecms-color-success: #4ECA8E;
+    --katecms-color-success-bg: #143226;
+    --katecms-color-info: #79B7E4;
+    --katecms-color-info-bg: #152A3E;
+    --katecms-color-warning: #E6B15A;
+    --katecms-color-warning-bg: #3A2C14;
+    --katecms-color-danger: #F08B8B;
+    --katecms-color-danger-bg: #3C1E1E;
+    --katecms-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.45);
+    --katecms-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.5);
+    color-scheme: dark;
+  }
+}
+html:has(> body#katecms-body) {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+}
+</style>
+
+<style scoped>
+body#katecms-body .katecms-auth {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-height: 100vh;
+  padding: 1.5rem;
+  background: var(--katecms-color-bg);
+  color: var(--katecms-color-ink);
+}
+body#katecms-body .katecms-auth__card {
+  width: 100%;
+  max-width: 25rem;
+  padding: 2rem;
+  background: var(--katecms-color-surface);
+  border: 1px solid var(--katecms-color-border);
+  border-radius: 0.625rem;
+  box-shadow: var(--katecms-shadow-md);
+}
+body#katecms-body .katecms-auth__logo {
+  display: block;
+  width: 9.375rem;
+  height: auto;
+  margin: 0 auto 1.5rem;
+}
+body#katecms-body .katecms-auth__title {
+  margin: 0 0 0.5rem;
+  font-size: 1.375rem;
+  font-weight: 600;
+  letter-spacing: -0.02em;
+  color: var(--katecms-color-ink);
+}
+body#katecms-body .katecms-auth__subtitle {
+  margin: 0 0 1.5rem;
+  font-size: 0.875rem;
+  line-height: 1.5;
+  color: var(--katecms-color-muted);
+}
+body#katecms-body .katecms-auth__form {
+  display: flex;
+  flex-direction: column;
+  gap: 0.875rem;
+}
+body#katecms-body .katecms-auth__actions {
+  margin-top: 0.375rem;
+}
+body#katecms-body .katecms-auth__actions :deep(.katecms-btn) {
+  width: 100%;
+}
+body#katecms-body .katecms-auth__error {
+  margin-top: 1rem;
+  padding: 0.75rem 0.875rem;
+  border-radius: var(--katecms-border-radius);
+  background: var(--katecms-color-danger-bg);
+  color: var(--katecms-color-danger);
+  font-size: 0.875rem;
+  line-height: 1.5;
+}
+body#katecms-body .katecms-auth__footer {
+  margin: 1.25rem 0 0;
+  font-size: 0.8125rem;
+  color: var(--katecms-color-muted);
+  text-align: center;
+}
+body#katecms-body .katecms-auth__footer a {
+  color: var(--katecms-color-accent);
+  font-weight: 600;
+  text-decoration: none;
+}
+body#katecms-body .katecms-auth__footer a:hover {
+  color: var(--katecms-color-accent-hover);
+  text-decoration: underline;
+}
+</style>

package/dist/runtime/pages/admin/register.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/pages/admin/users/[id].d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;