katecms 0.0.0-stage → 1.0.0-beta.1

package/dist/runtime/internal/admin/EntryRevisions.vue

@@ -0,0 +1,125 @@
+<script setup>
+import { collectionStatusLabel } from "../../utils/collections";
+defineProps({
+  items: { type: Array, required: true },
+  loading: { type: Boolean, required: false },
+  error: { type: String, required: false },
+  canRestore: { type: Boolean, required: false },
+  disabled: { type: Boolean, required: false }
+});
+const emit = defineEmits(["restore"]);
+const rootClass = "katecms-entry-revisions";
+function when(value) {
+  const date = new Date(value);
+  if (Number.isNaN(date.getTime())) {
+    return value;
+  }
+  return date.toLocaleString("en-GB", {
+    day: "numeric",
+    month: "short",
+    year: "numeric",
+    hour: "2-digit",
+    minute: "2-digit"
+  });
+}
+</script>
+
+<template>
+  <div :class="rootClass">
+    <div :class="`${rootClass}__title`">
+      Revisions
+    </div>
+    <p :class="`${rootClass}__hint`">
+      A revision is saved each time this entry changes.
+    </p>
+    <p
+      v-if="loading"
+      :class="`${rootClass}__hint`"
+    >
+      Loading…
+    </p>
+    <p
+      v-else-if="error"
+      :class="`${rootClass}__hint`"
+    >
+      {{ error }}
+    </p>
+    <p
+      v-else-if="!items.length"
+      :class="`${rootClass}__hint`"
+    >
+      No revisions yet.
+    </p>
+    <ul
+      v-else
+      :class="`${rootClass}__list`"
+    >
+      <li
+        v-for="item in items"
+        :key="item.id"
+        :class="`${rootClass}__item`"
+      >
+        <div :class="`${rootClass}__when`">
+          {{ when(item.createdAt) }}
+        </div>
+        <div :class="`${rootClass}__meta`">
+          {{ item.authorName }}
+        </div>
+        <div :class="`${rootClass}__summary`">
+          {{ item.title }} · {{ collectionStatusLabel(item.status) }}
+        </div>
+        <KateCmsUiButton
+          v-if="canRestore"
+          tag="button"
+          type="button"
+          :variant="['secondary', 'small']"
+          :disabled="disabled"
+          :aria-label="`Restore revision from ${when(item.createdAt)}`"
+          @click="emit('restore', item.id)"
+        >
+          Restore
+        </KateCmsUiButton>
+      </li>
+    </ul>
+  </div>
+</template>
+
+<style scoped>
+body#katecms-body .katecms-entry-revisions {
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+}
+body#katecms-body .katecms-entry-revisions__title {
+  margin: 0;
+  font-size: 0.875rem;
+  font-weight: 600;
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+  color: var(--katecms-color-ink);
+}
+body#katecms-body .katecms-entry-revisions__hint, body#katecms-body .katecms-entry-revisions__meta, body#katecms-body .katecms-entry-revisions__summary {
+  margin: 0;
+  color: var(--katecms-color-muted);
+  font-size: 0.8125rem;
+  line-height: 1.4;
+}
+body#katecms-body .katecms-entry-revisions__list {
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+body#katecms-body .katecms-entry-revisions__item {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 0.125rem;
+}
+body#katecms-body .katecms-entry-revisions__when {
+  font-size: 0.8125rem;
+  font-weight: 600;
+}
+</style>

package/dist/runtime/internal/admin/EntryRevisions.vue.d.ts

@@ -0,0 +1,15 @@
+import type { EntryRevisionItem } from '../../utils/collections.js';
+type __VLS_Props = {
+    items: EntryRevisionItem[];
+    loading?: boolean;
+    error?: string;
+    canRestore?: boolean;
+    disabled?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    restore: (id: number) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onRestore?: ((id: number) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/internal/admin/MediaLibraryFilters.d.vue.ts

@@ -0,0 +1,16 @@
+import type { MediaLibraryFilterState } from '../../utils/media-library-query.js';
+type __VLS_Props = {
+    filters: MediaLibraryFilterState;
+    months?: string[];
+    idPrefix?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:filters": (filters: MediaLibraryFilterState) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:filters"?: ((filters: MediaLibraryFilterState) => any) | undefined;
+}>, {
+    months: string[];
+    idPrefix: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/internal/admin/MediaLibraryFilters.vue

@@ -0,0 +1,153 @@
+<script setup>
+import { computed, onBeforeUnmount, ref, watch } from "vue";
+import {
+  MEDIA_SORT_CHOICES,
+  MEDIA_TYPE_CHOICES,
+  isMediaSort,
+  isMediaTypeFilter,
+  monthLabel,
+  searchNeedle
+} from "../../utils/media-library-query";
+const props = defineProps({
+  filters: { type: Object, required: true },
+  months: { type: Array, required: false, default: () => [] },
+  idPrefix: { type: String, required: false, default: "media" }
+});
+const emit = defineEmits(["update:filters"]);
+const rootClass = "katecms-media-filters";
+const searchDraft = ref(props.filters.search);
+let searchTimer;
+const typeChoices = MEDIA_TYPE_CHOICES;
+const monthChoices = computed(() => {
+  const values = [...props.months];
+  if (props.filters.month !== "all" && !values.includes(props.filters.month)) {
+    values.push(props.filters.month);
+  }
+  values.sort((a, b) => b.localeCompare(a));
+  return [
+    { val: "all", lbl: "All dates" },
+    ...values.map((value) => ({ val: value, lbl: monthLabel(value) }))
+  ];
+});
+const typeModel = computed({
+  get() {
+    return props.filters.type;
+  },
+  set(value) {
+    const raw = typeof value === "string" ? value : "all";
+    const type = isMediaTypeFilter(raw) ? raw : "all";
+    emitChange({ ...props.filters, type, search: searchDraft.value });
+  }
+});
+const monthModel = computed({
+  get() {
+    return props.filters.month;
+  },
+  set(value) {
+    const raw = typeof value === "string" ? value : "all";
+    const month = raw === "all" || /^\d{4}-(0[1-9]|1[0-2])$/.test(raw) ? raw : "all";
+    emitChange({ ...props.filters, month, search: searchDraft.value });
+  }
+});
+const sortModel = computed({
+  get() {
+    return isMediaSort(props.filters.sort) ? props.filters.sort : "date-desc";
+  },
+  set(value) {
+    const raw = typeof value === "string" ? value : "date-desc";
+    const sort = isMediaSort(raw) ? raw : "date-desc";
+    emitChange({ ...props.filters, sort, search: searchDraft.value });
+  }
+});
+watch(() => props.filters.search, (value) => {
+  searchDraft.value = value;
+});
+watch(searchDraft, (value) => {
+  if (searchNeedle(value) === searchNeedle(props.filters.search) && value.trim() === props.filters.search.trim()) {
+    return;
+  }
+  window.clearTimeout(searchTimer);
+  searchTimer = setTimeout(() => {
+    emitChange({ ...props.filters, search: value });
+  }, 300);
+});
+onBeforeUnmount(() => {
+  window.clearTimeout(searchTimer);
+});
+function emitChange(next) {
+  if (next.type === props.filters.type && next.month === props.filters.month && next.search === props.filters.search && next.sort === props.filters.sort) {
+    return;
+  }
+  emit("update:filters", next);
+}
+function flushSearch() {
+  window.clearTimeout(searchTimer);
+  emitChange({ ...props.filters, search: searchDraft.value });
+}
+</script>
+
+<template>
+  <div :class="rootClass">
+    <div :class="`${rootClass}__field`">
+      <KateCmsUiSelect
+        :id="`${idPrefix}-type`"
+        v-model="typeModel"
+        :choices="typeChoices"
+        aria-label="Media type"
+      />
+    </div>
+    <div :class="`${rootClass}__field`">
+      <KateCmsUiSelect
+        :id="`${idPrefix}-month`"
+        v-model="monthModel"
+        :choices="monthChoices"
+        aria-label="Date"
+      />
+    </div>
+    <div :class="[`${rootClass}__field`, `${rootClass}__field--sort`]">
+      <KateCmsUiSelect
+        :id="`${idPrefix}-sort`"
+        v-model="sortModel"
+        :choices="MEDIA_SORT_CHOICES"
+        aria-label="Sort"
+        max-height="400px"
+      />
+    </div>
+    <form
+      :class="`${rootClass}__search`"
+      @submit.prevent="flushSearch"
+    >
+      <KateCmsInputControl
+        v-model="searchDraft"
+        :field-key="`${idPrefix}-search`"
+        :field="{ placeholder: 'Search media' }"
+      />
+    </form>
+  </div>
+</template>
+
+<style scoped>
+.katecms-media-filters {
+  display: flex;
+  flex-shrink: 0;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 0.5rem;
+}
+.katecms-media-filters__field {
+  flex: 1 1 12.5rem;
+  min-width: 11.25rem;
+  max-width: 16.25rem;
+}
+.katecms-media-filters__field--sort {
+  max-width: 17.5rem;
+}
+.katecms-media-filters__search {
+  flex: 1 1 13.75rem;
+  min-width: 11.25rem;
+  max-width: 22.5rem;
+}
+.katecms-media-filters__search :deep(.katecms-input-control) {
+  width: 100%;
+}
+</style>

package/dist/runtime/internal/admin/MediaLibraryFilters.vue.d.ts

@@ -0,0 +1,16 @@
+import type { MediaLibraryFilterState } from '../../utils/media-library-query.js';
+type __VLS_Props = {
+    filters: MediaLibraryFilterState;
+    months?: string[];
+    idPrefix?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:filters": (filters: MediaLibraryFilterState) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:filters"?: ((filters: MediaLibraryFilterState) => any) | undefined;
+}>, {
+    months: string[];
+    idPrefix: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/internal/admin/MediaLibraryModal.d.vue.ts

@@ -0,0 +1,65 @@
+import type { MediaItem } from '@katecms/core';
+import type { MediaLibraryFilterState } from '../../utils/media-library-query.js';
+type __VLS_Props = {
+    open?: boolean;
+    mediaKind?: 'file' | 'image';
+    libraryEnabled?: boolean;
+    library?: MediaItem[];
+    selectedId?: number;
+    selectedIds?: number[];
+    multiple?: boolean;
+    loading?: boolean;
+    loadingMore?: boolean;
+    hasMore?: boolean;
+    filters?: MediaLibraryFilterState;
+    months?: string[];
+    error?: string | null;
+    uploading?: boolean;
+    processing?: boolean;
+    cropping?: boolean;
+};
+declare const __VLS_template: () => {
+    __VLS_Slots: {
+        default?: (props: {}) => any;
+    };
+};
+type __VLS_Slots = ReturnType<typeof __VLS_template>['__VLS_Slots'];
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    close: () => any;
+    "update:filters": (filters: MediaLibraryFilterState) => any;
+    choose: (item: MediaItem) => any;
+    confirm: (items: MediaItem[]) => any;
+    upload: () => any;
+    loadMore: () => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClose?: (() => any) | undefined;
+    "onUpdate:filters"?: ((filters: MediaLibraryFilterState) => any) | undefined;
+    onChoose?: ((item: MediaItem) => any) | undefined;
+    onConfirm?: ((items: MediaItem[]) => any) | undefined;
+    onUpload?: (() => any) | undefined;
+    onLoadMore?: (() => any) | undefined;
+}>, {
+    multiple: boolean;
+    months: string[];
+    error: string | null;
+    library: MediaItem[];
+    filters: MediaLibraryFilterState;
+    open: boolean;
+    loading: boolean;
+    mediaKind: "image" | "file";
+    libraryEnabled: boolean;
+    selectedIds: number[];
+    loadingMore: boolean;
+    hasMore: boolean;
+    uploading: boolean;
+    processing: boolean;
+    cropping: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, 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;
+    };
+};