@hywax/cms-console 1.0.0

package/dist/runtime/components/FormPanel.vue

@@ -0,0 +1,73 @@
+<template>
+  <UDashboardPanel
+    :ui="{
+  body: 'flex-row p-0 sm:p-0 gap-0 sm:gap-0'
+}"
+  >
+    <template #header>
+      <UDashboardNavbar :title="title" :ui="{ right: 'gap-2' }">
+        <template v-if="toBack" #leading>
+          <UButton :to="toBack" variant="link" :icon="appConfig.ui.icons.arrowLeft" />
+        </template>
+        <template #right>
+          <slot name="actions" />
+
+          <UButton
+            type="submit"
+            label="Сохранить"
+            :form="formId"
+            :loading="loading"
+            loading-auto
+          />
+        </template>
+      </UDashboardNavbar>
+    </template>
+    <template #body>
+      <UForm
+        :id="formId"
+        :state="state"
+        :schema="schema"
+        :class="ui.form({ class: props.ui?.form })"
+        @submit="submitHandler"
+      >
+        <div :class="ui.body({ class: props.ui?.body })">
+          <slot />
+        </div>
+        <div v-if="$slots.sidebar" :class="ui.sidebar({ class: props.ui?.sidebar })">
+          <slot name="sidebar" />
+        </div>
+      </UForm>
+    </template>
+  </UDashboardPanel>
+</template>
+
+<script>
+import theme from "#build/cms-console/form-panel";
+import { useAppConfig } from "#imports";
+import { computed, useId } from "vue";
+import { tv } from "../tv";
+</script>
+
+<script setup>
+const props = defineProps({
+  title: { type: String, required: false },
+  toBack: { type: null, required: false },
+  formId: { type: String, required: false },
+  schema: { type: null, required: true },
+  state: { type: Object, required: true },
+  loading: { type: Boolean, required: false },
+  handler: { type: Function, required: true },
+  asideDivide: { type: Boolean, required: false },
+  showReset: { type: Boolean, required: false },
+  class: { type: null, required: false },
+  ui: { type: null, required: false }
+});
+defineEmits(["update:state"]);
+defineSlots();
+const appConfig = useAppConfig();
+const formId = computed(() => props.formId ?? `form-${useId()}`);
+async function submitHandler(event) {
+  await props.handler?.(event);
+}
+const ui = computed(() => tv({ extend: tv(theme), ...appConfig.cms?.formPanel || {} })());
+</script>

package/dist/runtime/components/FormPanel.vue.d.ts

@@ -0,0 +1,47 @@
+import type { ComponentConfig } from '@hywax/cms-runtime';
+import type { AppConfig } from '@nuxt/schema';
+import type { FormData, FormSchema, FormSubmitEvent } from '@nuxt/ui';
+import type { RouteLocationRaw } from 'vue-router';
+import theme from '#build/cms-console/form-panel';
+type FormPanel = ComponentConfig<typeof theme, AppConfig, 'formPanel'>;
+export interface FormPanelProps<S extends FormSchema, T extends FormData<S> = FormData<S>> {
+    title?: string;
+    toBack?: RouteLocationRaw;
+    formId?: string;
+    schema: S;
+    state: Partial<T>;
+    loading?: boolean;
+    handler: (event: FormSubmitEvent<T>) => Promise<void>;
+    asideDivide?: boolean;
+    showReset?: boolean;
+    class?: any;
+    ui?: FormPanel['slots'];
+}
+export interface FormPanelEmits<S extends FormSchema, T extends FormData<S> = FormData<S>> {
+    'update:state': [value: T];
+}
+export interface FormPanelSlots {
+    default?: () => any;
+    sidebar?: () => any;
+    actions?: () => any;
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: <S extends FormSchema, T extends FormData<S> = FormData<S>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import("vue").PublicProps & __VLS_PrettifyLocal<FormPanelProps<S, T> & {
+        "onUpdate:state"?: ((value: T) => any) | undefined;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: {}) => void;
+    attrs: any;
+    slots: FormPanelSlots;
+    emit: (evt: "update:state", value: T) => void;
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};

package/dist/runtime/components/FormPanelAsideSection.d.vue.ts

@@ -0,0 +1,24 @@
+import type { ComponentConfig } from '@hywax/cms-runtime';
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/cms-console/form-panel-aside-section';
+type FormPanelAsideSection = ComponentConfig<typeof theme, AppConfig, 'formPanelAsideSection'>;
+export interface FormPanelAsideSectionProps {
+    title?: string;
+    icon?: string;
+    divide?: boolean;
+    class?: any;
+    ui?: FormPanelAsideSection['slots'];
+}
+export interface FormPanelAsideSectionSlots {
+    default?: () => any;
+    icon?: () => any;
+    title?: () => any;
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<FormPanelAsideSectionProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<FormPanelAsideSectionProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, FormPanelAsideSectionSlots>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/FormPanelAsideSection.vue

@@ -0,0 +1,41 @@
+<template>
+  <UCollapsible :class="ui.root({ class: [props.ui?.root, props.class] })" default-open>
+    <div v-if="title || $slots.title || icon || $slots.icon" :class="ui.header({ class: props.ui?.header })">
+      <div v-if="icon || $slots.icon" :class="ui.icon({ class: props.ui?.icon })">
+        <slot name="icon">
+          <UIcon v-if="icon" :name="icon" />
+        </slot>
+      </div>
+      <div v-if="title || $slots.title" :class="ui.title({ class: props.ui?.title })">
+        <slot name="title">
+          {{ title }}
+        </slot>
+      </div>
+    </div>
+
+    <template #content>
+      <div :class="ui.body({ class: props.ui?.body })">
+        <slot />
+      </div>
+    </template>
+  </UCollapsible>
+</template>
+
+<script>
+import theme from "#build/cms-console/form-panel-aside-section";
+import { computed, useAppConfig } from "#imports";
+import { tv } from "../tv";
+</script>
+
+<script setup>
+const props = defineProps({
+  title: { type: String, required: false },
+  icon: { type: String, required: false },
+  divide: { type: Boolean, required: false },
+  class: { type: null, required: false },
+  ui: { type: null, required: false }
+});
+defineSlots();
+const appConfig = useAppConfig();
+const ui = computed(() => tv({ extend: tv(theme), ...appConfig.cms?.formPanelAsideSection || {} })());
+</script>

package/dist/runtime/components/FormPanelAsideSection.vue.d.ts

@@ -0,0 +1,24 @@
+import type { ComponentConfig } from '@hywax/cms-runtime';
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/cms-console/form-panel-aside-section';
+type FormPanelAsideSection = ComponentConfig<typeof theme, AppConfig, 'formPanelAsideSection'>;
+export interface FormPanelAsideSectionProps {
+    title?: string;
+    icon?: string;
+    divide?: boolean;
+    class?: any;
+    ui?: FormPanelAsideSection['slots'];
+}
+export interface FormPanelAsideSectionSlots {
+    default?: () => any;
+    icon?: () => any;
+    title?: () => any;
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<FormPanelAsideSectionProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<FormPanelAsideSectionProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, FormPanelAsideSectionSlots>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/FormPanelSection.d.vue.ts

@@ -0,0 +1,21 @@
+import type { ComponentConfig } from '@hywax/cms-runtime';
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/cms-console/form-panel-section';
+type FormPanelSection = ComponentConfig<typeof theme, AppConfig, 'formPanelSection'>;
+export interface FormPanelSectionProps {
+    title?: string;
+    description?: string;
+    class?: any;
+    ui?: FormPanelSection['slots'];
+}
+export interface FormPanelSectionSlots {
+    default?: () => any;
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<FormPanelSectionProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<FormPanelSectionProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, FormPanelSectionSlots>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/FormPanelSection.vue

@@ -0,0 +1,31 @@
+<template>
+  <div :class="ui.root({ class: [props.ui?.root, props.class] })">
+    <div v-if="title" :class="ui.title({ class: props.ui?.title })">
+      {{ title }}
+    </div>
+    <div v-if="description" :class="ui.description({ class: props.ui?.description })">
+      {{ description }}
+    </div>
+    <div :class="ui.body({ class: props.ui?.body })">
+      <slot />
+    </div>
+  </div>
+</template>
+
+<script>
+import theme from "#build/cms-console/form-panel-section";
+import { computed, useAppConfig } from "#imports";
+import { tv } from "../tv";
+</script>
+
+<script setup>
+const props = defineProps({
+  title: { type: String, required: false },
+  description: { type: String, required: false },
+  class: { type: null, required: false },
+  ui: { type: null, required: false }
+});
+defineSlots();
+const appConfig = useAppConfig();
+const ui = computed(() => tv({ extend: tv(theme), ...appConfig.cms?.formPanelSection || {} })());
+</script>

package/dist/runtime/components/FormPanelSection.vue.d.ts

@@ -0,0 +1,21 @@
+import type { ComponentConfig } from '@hywax/cms-runtime';
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/cms-console/form-panel-section';
+type FormPanelSection = ComponentConfig<typeof theme, AppConfig, 'formPanelSection'>;
+export interface FormPanelSectionProps {
+    title?: string;
+    description?: string;
+    class?: any;
+    ui?: FormPanelSection['slots'];
+}
+export interface FormPanelSectionSlots {
+    default?: () => any;
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<FormPanelSectionProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<FormPanelSectionProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, FormPanelSectionSlots>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/InputSeo.d.vue.ts

@@ -0,0 +1,21 @@
+import type { ComponentConfig } from '@hywax/cms-runtime';
+import type { AppConfig } from '@nuxt/schema';
+import type { SEO } from '../types';
+import theme from '#build/cms-console/input-seo';
+type InputSeo = ComponentConfig<typeof theme, AppConfig, 'inputSeo'>;
+export interface InputSeoProps {
+    as?: any;
+    class?: any;
+    ui?: InputSeo['slots'];
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<InputSeoProps & {
+    modelValue?: SEO;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: SEO) => any;
+}, string, import("vue").PublicProps, Readonly<InputSeoProps & {
+    modelValue?: SEO;
+}> & Readonly<{
+    "onUpdate:modelValue"?: ((value: SEO) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/InputSeo.vue

@@ -0,0 +1,73 @@
+<template>
+  <Primitive :as="as" :class="ui.root({ class: [props.ui?.root, props.class] })">
+    <UFormField
+      name="seo.title"
+      label="Заголовок"
+      :hint="`${model.title.length}/60`"
+      :ui="{ hint: 'text-xs' }"
+    >
+      <UInput v-model="model.title" placeholder="Введите заголовок..." class="w-full" />
+
+      <template #help>
+        <p class="text-xs mb-2">
+          Рекомендуемая длина: 45-60 символов
+        </p>
+        <UProgress
+          :model-value="title.progress"
+          :color="title.color"
+          size="sm"
+        />
+      </template>
+    </UFormField>
+
+    <UFormField
+      name="seo.description"
+      label="Описание"
+      :hint="`${model.description.length}/160`"
+      :ui="{ hint: 'text-xs' }"
+    >
+      <UTextarea
+        v-model="model.description"
+        placeholder="Введите описание..."
+        class="w-full"
+        autoresize
+      />
+
+      <template #help>
+        <p class="text-xs mb-2">
+          Рекомендуемая длина: 130-160 символов
+        </p>
+        <UProgress
+          :model-value="description.progress"
+          :color="description.color"
+          size="sm"
+        />
+      </template>
+    </UFormField>
+  </Primitive>
+</template>
+
+<script>
+import theme from "#build/cms-console/input-seo";
+import { computed, useAppConfig } from "#imports";
+import { Primitive } from "reka-ui";
+import { useSeoStats } from "../composables/useSeoStats";
+import { tv } from "../tv";
+</script>
+
+<script setup>
+const props = defineProps({
+  as: { type: null, required: false },
+  class: { type: null, required: false },
+  ui: { type: null, required: false }
+});
+const model = defineModel({ type: Object, ...{
+  default: () => ({
+    title: "",
+    description: ""
+  })
+} });
+const appConfig = useAppConfig();
+const { title, description } = useSeoStats(model);
+const ui = computed(() => tv({ extend: tv(theme), ...appConfig.cms?.inputSeo || {} })());
+</script>

package/dist/runtime/components/InputSeo.vue.d.ts

@@ -0,0 +1,21 @@
+import type { ComponentConfig } from '@hywax/cms-runtime';
+import type { AppConfig } from '@nuxt/schema';
+import type { SEO } from '../types';
+import theme from '#build/cms-console/input-seo';
+type InputSeo = ComponentConfig<typeof theme, AppConfig, 'inputSeo'>;
+export interface InputSeoProps {
+    as?: any;
+    class?: any;
+    ui?: InputSeo['slots'];
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<InputSeoProps & {
+    modelValue?: SEO;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: SEO) => any;
+}, string, import("vue").PublicProps, Readonly<InputSeoProps & {
+    modelValue?: SEO;
+}> & Readonly<{
+    "onUpdate:modelValue"?: ((value: SEO) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/InputSlug.d.vue.ts

@@ -0,0 +1,30 @@
+import type { ComponentConfig } from '@hywax/cms-runtime';
+import type { AppConfig } from '@nuxt/schema';
+import type { InputProps } from '@nuxt/ui';
+import theme from '#build/cms-console/input-slug';
+type InputSlug = ComponentConfig<typeof theme, AppConfig, 'inputSlug'>;
+export interface InputSlugProps {
+    regenerate?: boolean;
+    label?: string;
+    titleKey?: string;
+    slugKey?: string;
+    inputProps?: Omit<InputProps, 'modelModifiers'>;
+    as?: any;
+    class?: any;
+    ui?: InputSlug['slots'];
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<InputSlugProps & {
+    title?: string;
+    slug?: string;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:title": (value: string | undefined) => any;
+    "update:slug": (value: string | undefined) => any;
+}, string, import("vue").PublicProps, Readonly<InputSlugProps & {
+    title?: string;
+    slug?: string;
+}> & Readonly<{
+    "onUpdate:title"?: ((value: string | undefined) => any) | undefined;
+    "onUpdate:slug"?: ((value: string | undefined) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/InputSlug.vue

@@ -0,0 +1,70 @@
+<template>
+  <Primitive :as="as" :class="ui.root({ class: [props.ui?.root, props.class] })">
+    <UFormField
+      :label="label"
+      :name="titleKey"
+    >
+      <UInput
+        v-model="title"
+        v-bind="inputProps"
+        class="w-full"
+      />
+    </UFormField>
+    <UFormField :name="slugKey" class="-mt-3" eager-validation>
+      <UInput
+        v-model="slug"
+        class="w-full"
+        size="xs"
+        variant="none"
+        :placeholder="isRegenerate ? '\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0437\u0430\u0433\u043E\u043B\u043E\u0432\u043E\u043A' : '\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0441\u043B\u0430\u0433'"
+        :disabled="isRegenerate"
+        :ui="{
+  base: 'text-muted'
+}"
+      >
+        <template #leading>
+          <UButton
+            size="xs"
+            variant="link"
+            :icon="appConfig.ui.icons.link"
+            class="p-0"
+            :color="isRegenerate ? 'success' : 'neutral'"
+            @click="isRegenerate = !isRegenerate"
+          />
+        </template>
+      </UInput>
+    </UFormField>
+  </Primitive>
+</template>
+
+<script>
+import theme from "#build/cms-console/input-slug";
+import { computed, ref, useAppConfig, watch } from "#imports";
+import { Primitive } from "reka-ui";
+import { tv } from "../tv";
+import { slugify } from "../utils/slugify";
+</script>
+
+<script setup>
+const props = defineProps({
+  regenerate: { type: Boolean, required: false },
+  label: { type: String, required: false },
+  titleKey: { type: String, required: false },
+  slugKey: { type: String, required: false },
+  inputProps: { type: Object, required: false },
+  as: { type: null, required: false },
+  class: { type: null, required: false },
+  ui: { type: null, required: false }
+});
+const title = defineModel("title", { type: String });
+const slug = defineModel("slug", { type: String });
+const appConfig = useAppConfig();
+const isRegenerate = ref(props.regenerate);
+watch(title, () => {
+  if (!isRegenerate.value) {
+    return;
+  }
+  slug.value = slugify(title.value);
+});
+const ui = computed(() => tv({ extend: tv(theme), ...appConfig.cms?.inputSlug || {} })());
+</script>

package/dist/runtime/components/InputSlug.vue.d.ts

@@ -0,0 +1,30 @@
+import type { ComponentConfig } from '@hywax/cms-runtime';
+import type { AppConfig } from '@nuxt/schema';
+import type { InputProps } from '@nuxt/ui';
+import theme from '#build/cms-console/input-slug';
+type InputSlug = ComponentConfig<typeof theme, AppConfig, 'inputSlug'>;
+export interface InputSlugProps {
+    regenerate?: boolean;
+    label?: string;
+    titleKey?: string;
+    slugKey?: string;
+    inputProps?: Omit<InputProps, 'modelModifiers'>;
+    as?: any;
+    class?: any;
+    ui?: InputSlug['slots'];
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<InputSlugProps & {
+    title?: string;
+    slug?: string;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:title": (value: string | undefined) => any;
+    "update:slug": (value: string | undefined) => any;
+}, string, import("vue").PublicProps, Readonly<InputSlugProps & {
+    title?: string;
+    slug?: string;
+}> & Readonly<{
+    "onUpdate:title"?: ((value: string | undefined) => any) | undefined;
+    "onUpdate:slug"?: ((value: string | undefined) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/runtime/components/InputUploraImage.d.vue.ts

@@ -0,0 +1,39 @@
+import type { ComponentConfig } from '@hywax/cms-runtime';
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/cms-console/input-uplora-image';
+type InputUploraImage = ComponentConfig<typeof theme, AppConfig, 'inputUploraImage'>;
+export interface InputUploraImageProps {
+    showExtensions?: boolean;
+    id?: string;
+    name?: string;
+    disabled?: boolean;
+    as?: any;
+    class?: any;
+    ui?: InputUploraImage['slots'];
+}
+export interface InputUploraImageEmits {
+    upload: [InputUploraImageModelValue];
+    delete: [];
+}
+export interface InputUploraImageModelValue {
+    image: string;
+    alt: string;
+    lqip?: string;
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<InputUploraImageProps & {
+    modelValue?: InputUploraImageModelValue;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    delete: () => any;
+    "update:modelValue": (value: InputUploraImageModelValue) => any;
+    upload: (args_0: InputUploraImageModelValue) => any;
+}, string, import("vue").PublicProps, Readonly<InputUploraImageProps & {
+    modelValue?: InputUploraImageModelValue;
+}> & Readonly<{
+    onDelete?: (() => any) | undefined;
+    "onUpdate:modelValue"?: ((value: InputUploraImageModelValue) => any) | undefined;
+    onUpload?: ((args_0: InputUploraImageModelValue) => any) | undefined;
+}>, {
+    showExtensions: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;