@karibsen/eponyme 0.8.0 → 0.8.11

package/dist/eponyme.d.mts

@@ -1,8 +1,9 @@
 import { EponymeConfig, EponymeSchema, EponymeCollectionOptions, CollectionSlugField, EponymeCollectionDefinition, EponymeFormSchema, EponymeFormOptions, EponymeFormDefinition } from '../dist/runtime/types/index.js';
-export { ArrayFieldDefinition, ArrayFieldOptions, ArrayItemDefinition, ArrayItemFieldDefinition, ArrayItemSchema, ArrayItemValue, BooleanFieldDefinition, BooleanFieldOptions, CheckboxGroupFieldDefinition, CheckboxGroupFieldOptions, CollectionSlugField, ColorFieldDefinition, ColorFieldOptions, DateFieldDefinition, DateFieldOptions, EmailFieldDefinition, EmailFieldOptions, EponymeAuthSession, EponymeAuthUser, EponymeCollectionDataByName, EponymeCollectionDefinition, EponymeCollectionDefinitionBase, EponymeCollectionName, EponymeCollectionOptions, EponymeConfig, EponymeData, EponymeDataByName, EponymeFormDataByName, EponymeFormDefinition, EponymeFormDefinitionBase, EponymeFormFieldDefinition, EponymeFormMode, EponymeFormName, EponymeFormOptions, EponymeFormSchema, EponymeManagedUserResult, EponymeName, EponymeRole, EponymeSchema, EponymeVariableDefinition, EponymeVariableSummary, EponymeVariableValue, EponymeVariables, FieldDefinition, FieldValidationResult, FieldValidator, FieldVisibilityCondition, ImageFieldDefinition, ImageFieldOptions, NumberFieldDefinition, NumberFieldOptions, RadioFieldDefinition, RadioFieldOptions, RichTextFieldDefinition, RichTextFieldOptions, SectionFieldDefinition, SectionFieldOptions, SectionItemFieldDefinition, SectionItemValue, SectionSchema, SectionValue, SelectFieldDefinition, SelectFieldOptions, SelectOption, SlugFieldDefinition, SlugFieldOptions, StringFieldDefinition, StringFieldOptions, TabDefinition, TabFieldDefinition, TabFieldOptions, TabsSchema, TabsValue, TextareaFieldDefinition, TextareaFieldOptions, TodayDateDefault, UrlFieldDefinition, UrlFieldOptions, UrlType, UrlValue } from '../dist/runtime/types/index.js';
+export { ArrayFieldDefinition, ArrayFieldOptions, ArrayItemDefinition, ArrayItemFieldDefinition, ArrayItemSchema, ArrayItemValue, BooleanFieldDefinition, BooleanFieldOptions, CheckboxGroupFieldDefinition, CheckboxGroupFieldOptions, CollectionSlugField, ColorFieldDefinition, ColorFieldOptions, DateFieldDefinition, DateFieldOptions, EmailFieldDefinition, EmailFieldOptions, EponymeAuthSession, EponymeAuthUser, EponymeCollectionDataByName, EponymeCollectionDefinition, EponymeCollectionDefinitionBase, EponymeCollectionName, EponymeCollectionOptions, EponymeConfig, EponymeData, EponymeDataByName, EponymeFormDataByName, EponymeFormDefinition, EponymeFormDefinitionBase, EponymeFormFieldDefinition, EponymeFormMode, EponymeFormName, EponymeFormOptions, EponymeFormSchema, EponymeManagedUserResult, EponymeName, EponymeRole, EponymeSchema, EponymeVariableDefinition, EponymeVariableSummary, EponymeVariableValue, EponymeVariables, FieldDefinition, FieldValidationResult, FieldValidator, FieldVisibilityCondition, ImageFieldDefinition, ImageFieldOptions, MediaPlayerFieldDefinition, MediaPlayerFieldOptions, MediaPlayerProvider, MediaPlayerValue, NumberFieldDefinition, NumberFieldOptions, RadioFieldDefinition, RadioFieldOptions, RichTextFieldDefinition, RichTextFieldOptions, SectionFieldDefinition, SectionFieldOptions, SectionItemFieldDefinition, SectionItemValue, SectionSchema, SectionValue, SelectFieldDefinition, SelectFieldOptions, SelectOption, SlugFieldDefinition, SlugFieldOptions, StringFieldDefinition, StringFieldOptions, TabDefinition, TabFieldDefinition, TabFieldOptions, TabsSchema, TabsValue, TextareaFieldDefinition, TextareaFieldOptions, TodayDateDefault, UrlFieldDefinition, UrlFieldOptions, UrlType, UrlValue } from '../dist/runtime/types/index.js';
 import { EponymeVariables } from '../dist/runtime/types/variables.js';
 export { field, today } from '../dist/runtime/fields/index.js';
 export { EPONYME_ROLES, canEditEponyme, isEponymeRole } from '../dist/runtime/types/auth.js';
+export { eponymeMediaEmbedUrl, eponymeMediaThumbnailUrl, parseEponymeMediaUrl } from '../dist/runtime/utils/media-player.js';
 
 declare function defineEponymeConfig<const T extends EponymeConfig>(config: T): T;
 

package/dist/eponyme.mjs

@@ -1,5 +1,6 @@
 export { field, today } from '../dist/runtime/fields/index.js';
 export { EPONYME_ROLES, canEditEponyme, isEponymeRole } from '../dist/runtime/types/auth.js';
+export { eponymeMediaEmbedUrl, eponymeMediaThumbnailUrl, parseEponymeMediaUrl } from '../dist/runtime/utils/media-player.js';
 
 function defineEponymeConfig(config) {
   return config;

package/dist/module.d.mts

@@ -2,7 +2,8 @@ import * as _nuxt_schema from '@nuxt/schema';
 export { collection, defineEponymeConfig, defineEponymeVariables, form } from './eponyme.mjs';
 export { field, today } from '../dist/runtime/fields/index.js';
 export { EPONYME_ROLES, canEditEponyme, isEponymeRole } from '../dist/runtime/types/auth.js';
-export { ArrayFieldDefinition, ArrayFieldOptions, ArrayItemDefinition, ArrayItemFieldDefinition, ArrayItemSchema, ArrayItemValue, BooleanFieldDefinition, BooleanFieldOptions, CheckboxGroupFieldDefinition, CheckboxGroupFieldOptions, CollectionSlugField, ColorFieldDefinition, ColorFieldOptions, DateFieldDefinition, DateFieldOptions, EmailFieldDefinition, EmailFieldOptions, EponymeAuthSession, EponymeAuthUser, EponymeCollectionDataByName, EponymeCollectionDefinition, EponymeCollectionDefinitionBase, EponymeCollectionName, EponymeCollectionOptions, EponymeConfig, EponymeData, EponymeDataByName, EponymeFormDataByName, EponymeFormDefinition, EponymeFormDefinitionBase, EponymeFormFieldDefinition, EponymeFormMode, EponymeFormName, EponymeFormOptions, EponymeFormSchema, EponymeManagedUserResult, EponymeName, EponymeRole, EponymeSchema, EponymeVariableDefinition, EponymeVariableSummary, EponymeVariableValue, EponymeVariables, FieldDefinition, FieldValidationResult, FieldValidator, FieldVisibilityCondition, ImageFieldDefinition, ImageFieldOptions, NumberFieldDefinition, NumberFieldOptions, RadioFieldDefinition, RadioFieldOptions, RichTextFieldDefinition, RichTextFieldOptions, SectionFieldDefinition, SectionFieldOptions, SectionItemFieldDefinition, SectionItemValue, SectionSchema, SectionValue, SelectFieldDefinition, SelectFieldOptions, SelectOption, SlugFieldDefinition, SlugFieldOptions, StringFieldDefinition, StringFieldOptions, TabDefinition, TabFieldDefinition, TabFieldOptions, TabsSchema, TabsValue, TextareaFieldDefinition, TextareaFieldOptions, TodayDateDefault, UrlFieldDefinition, UrlFieldOptions, UrlType, UrlValue } from '../dist/runtime/types/index.js';
+export { eponymeMediaEmbedUrl, eponymeMediaThumbnailUrl, parseEponymeMediaUrl } from '../dist/runtime/utils/media-player.js';
+export { ArrayFieldDefinition, ArrayFieldOptions, ArrayItemDefinition, ArrayItemFieldDefinition, ArrayItemSchema, ArrayItemValue, BooleanFieldDefinition, BooleanFieldOptions, CheckboxGroupFieldDefinition, CheckboxGroupFieldOptions, CollectionSlugField, ColorFieldDefinition, ColorFieldOptions, DateFieldDefinition, DateFieldOptions, EmailFieldDefinition, EmailFieldOptions, EponymeAuthSession, EponymeAuthUser, EponymeCollectionDataByName, EponymeCollectionDefinition, EponymeCollectionDefinitionBase, EponymeCollectionName, EponymeCollectionOptions, EponymeConfig, EponymeData, EponymeDataByName, EponymeFormDataByName, EponymeFormDefinition, EponymeFormDefinitionBase, EponymeFormFieldDefinition, EponymeFormMode, EponymeFormName, EponymeFormOptions, EponymeFormSchema, EponymeManagedUserResult, EponymeName, EponymeRole, EponymeSchema, EponymeVariableDefinition, EponymeVariableSummary, EponymeVariableValue, EponymeVariables, FieldDefinition, FieldValidationResult, FieldValidator, FieldVisibilityCondition, ImageFieldDefinition, ImageFieldOptions, MediaPlayerFieldDefinition, MediaPlayerFieldOptions, MediaPlayerProvider, MediaPlayerValue, NumberFieldDefinition, NumberFieldOptions, RadioFieldDefinition, RadioFieldOptions, RichTextFieldDefinition, RichTextFieldOptions, SectionFieldDefinition, SectionFieldOptions, SectionItemFieldDefinition, SectionItemValue, SectionSchema, SectionValue, SelectFieldDefinition, SelectFieldOptions, SelectOption, SlugFieldDefinition, SlugFieldOptions, StringFieldDefinition, StringFieldOptions, TabDefinition, TabFieldDefinition, TabFieldOptions, TabsSchema, TabsValue, TextareaFieldDefinition, TextareaFieldOptions, TodayDateDefault, UrlFieldDefinition, UrlFieldOptions, UrlType, UrlValue } from '../dist/runtime/types/index.js';
 import '../dist/runtime/types/variables.js';
 
 /**

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@karibsen/eponyme",
   "configKey": "eponyme",
-  "version": "0.8.0",
+  "version": "0.8.11",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/module.mjs

@@ -68,7 +68,11 @@ const module$1 = defineNuxtModule({
             "mingcute:back-2-line",
             "mingcute:forward-2-line",
             "mingcute:download-2-line",
-            "mingcute:upload-2-line"
+            "mingcute:upload-2-line",
+            "mingcute:youtube-line",
+            "mingcute:movie-line",
+            "mingcute:film-line",
+            "mingcute:alert-line"
           ]
         }
       }
@@ -123,7 +127,11 @@ Note that '~/' points at ${nuxt.options.srcDir}, so a server module needs '~~/'.
       { name: "form", from: resolver.resolve("./config/form") },
       { name: "defineEponymeVariables", from: resolver.resolve("./config/variables") },
       { name: "field", from: resolver.resolve("./runtime/fields") },
-      { name: "today", from: resolver.resolve("./runtime/fields") }
+      { name: "today", from: resolver.resolve("./runtime/fields") },
+      // What a page needs to render a `field.mediaPlayer()` value: the embed address is
+      // derived from the stored URL rather than stored next to it.
+      { name: "eponymeMediaEmbedUrl", from: resolver.resolve("./runtime/utils/media-player") },
+      { name: "eponymeMediaThumbnailUrl", from: resolver.resolve("./runtime/utils/media-player") }
     ]);
     addImportsDir(resolver.resolve("./runtime/composables"));
     addServerImports([

package/dist/runtime/components/fields/FieldRenderer.vue

@@ -4,6 +4,7 @@ import BooleanField from "./BooleanField.vue";
 import CheckboxGroupField from "./CheckboxGroupField.vue";
 import ColorField from "./ColorField.vue";
 import DateField from "./DateField.vue";
+import MediaPlayerField from "./MediaPlayerField.vue";
 import NumberField from "./NumberField.vue";
 import PhoneField from "./PhoneField.vue";
 import RadioField from "./RadioField.vue";
@@ -61,6 +62,8 @@ const component = computed(() => {
       return ColorField;
     case "url":
       return UrlField;
+    case "mediaPlayer":
+      return MediaPlayerField;
     case "phone":
       return PhoneField;
     case "tags":
@@ -109,6 +112,8 @@ const specificProps = computed(() => {
       return { presets: field.options.presets };
     case "url":
       return { placeholder: field.options.placeholder };
+    case "mediaPlayer":
+      return { placeholder: field.options.placeholder, providers: field.options.providers };
     case "phone":
       return {
         placeholder: field.options.placeholder,

package/dist/runtime/components/fields/MediaPlayerField.d.vue.ts

@@ -0,0 +1,19 @@
+import type { MediaPlayerProvider, MediaPlayerValue } from '../../types/index.js';
+type __VLS_Props = {
+    id: string;
+    modelValue?: unknown;
+    label: string;
+    description?: string;
+    required?: boolean;
+    placeholder?: string;
+    providers?: readonly MediaPlayerProvider[];
+    errors?: string[];
+    disabled?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: MediaPlayerValue) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: MediaPlayerValue) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/fields/MediaPlayerField.vue

@@ -0,0 +1,70 @@
+<script setup>
+import { computed } from "vue";
+import EPFormField from "../ui/EPFormField.vue";
+import EPInputText from "../ui/EPInputText.vue";
+import EPMediaPreview from "../ui/EPMediaPreview.vue";
+import { mediaPlayerProviders, parseEponymeMediaUrl, toMediaPlayerValue } from "../../utils/media-player";
+const props = defineProps({
+  id: { type: String, required: true },
+  modelValue: { type: null, required: false },
+  label: { type: String, required: true },
+  description: { type: String, required: false },
+  required: { type: Boolean, required: false },
+  placeholder: { type: String, required: false },
+  providers: { type: Array, required: false },
+  errors: { type: Array, required: false, default: () => [] },
+  disabled: { type: Boolean, required: false }
+});
+const emit = defineEmits(["update:modelValue"]);
+const PROVIDER_LABELS = {
+  youtube: { label: "YouTube", icon: "mingcute:youtube-line" },
+  // mingcute has no Vimeo mark, so the generic video icon stands in for it.
+  vimeo: { label: "Vimeo", icon: "mingcute:movie-line" },
+  url: { label: "Direct video", icon: "mingcute:film-line" }
+};
+const value = computed(() => toMediaPlayerValue(props.modelValue));
+const providers = computed(() => mediaPlayerProviders({ providers: props.providers }));
+const detected = computed(() => value.value.provider ? PROVIDER_LABELS[value.value.provider] : void 0);
+const placeholder = computed(() => props.placeholder ?? `${providers.value.map((provider) => PROVIDER_LABELS[provider]?.label).join(", ")} address`);
+function update(url) {
+  emit("update:modelValue", parseEponymeMediaUrl(String(url), { providers: props.providers }));
+}
+</script>
+
+<template>
+  <EPFormField
+    :id="id"
+    :label="label"
+    :description="description"
+    :required="required"
+    :errors="errors"
+  >
+    <EPInputText
+      :id="id"
+      :model-value="value.url"
+      type="url"
+      :placeholder="placeholder"
+      :required="required"
+      :invalid="Boolean(errors.length)"
+      :disabled="disabled"
+      @update:model-value="update"
+    />
+    <p
+      v-if="value.url"
+      class="ep:mt-1.5 ep:mb-0 ep:flex ep:items-center ep:gap-1.5 ep:text-[11px] ep:text-muted-ep"
+    >
+      <Icon
+        :name="detected ? detected.icon : 'mingcute:alert-line'"
+        size="14"
+        aria-hidden="true"
+      />
+      {{ detected ? detected.label : "Unrecognized address" }}
+    </p>
+    <EPMediaPreview
+      v-if="detected"
+      :model-value="value"
+      :label="label"
+      class="ep:mt-3"
+    />
+  </EPFormField>
+</template>

package/dist/runtime/components/fields/MediaPlayerField.vue.d.ts

@@ -0,0 +1,19 @@
+import type { MediaPlayerProvider, MediaPlayerValue } from '../../types/index.js';
+type __VLS_Props = {
+    id: string;
+    modelValue?: unknown;
+    label: string;
+    description?: string;
+    required?: boolean;
+    placeholder?: string;
+    providers?: readonly MediaPlayerProvider[];
+    errors?: string[];
+    disabled?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: MediaPlayerValue) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: MediaPlayerValue) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/EPMediaPreview.d.vue.ts

@@ -0,0 +1,7 @@
+type __VLS_Props = {
+    modelValue?: unknown;
+    label?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/ui/EPMediaPreview.vue

@@ -0,0 +1,34 @@
+<script setup>
+import { computed } from "vue";
+import { eponymeMediaEmbedUrl, toMediaPlayerValue } from "../../utils/media-player";
+const props = defineProps({
+  modelValue: { type: null, required: false },
+  label: { type: String, required: false }
+});
+const media = computed(() => toMediaPlayerValue(props.modelValue));
+const embedUrl = computed(() => eponymeMediaEmbedUrl(media.value));
+</script>
+
+<template>
+  <div class="ep:aspect-video ep:w-full ep:overflow-hidden ep:rounded-xl ep:border ep:border-border-ep ep:bg-black">
+    <video
+      v-if="media.provider === 'url'"
+      :key="embedUrl"
+      :src="embedUrl"
+      controls
+      preload="metadata"
+      class="ep:h-full ep:w-full ep:object-contain"
+    />
+    <iframe
+      v-else
+      :key="embedUrl"
+      :src="embedUrl"
+      :title="label || 'Video preview'"
+      loading="lazy"
+      referrerpolicy="strict-origin-when-cross-origin"
+      allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; fullscreen"
+      allowfullscreen
+      class="ep:h-full ep:w-full ep:border-0"
+    />
+  </div>
+</template>

package/dist/runtime/components/ui/EPMediaPreview.vue.d.ts

@@ -0,0 +1,7 @@
+type __VLS_Props = {
+    modelValue?: unknown;
+    label?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/fields/index.d.ts

@@ -5,6 +5,7 @@ import { color } from './color.js';
 import { date, today } from './date.js';
 import { email } from './email.js';
 import { image } from './image.js';
+import { mediaPlayer } from './media-player.js';
 import { number } from './number.js';
 import { phone } from './phone.js';
 import { radio } from './radio.js';
@@ -23,6 +24,7 @@ export declare const field: {
     email: typeof email;
     phone: typeof phone;
     url: typeof url;
+    mediaPlayer: typeof mediaPlayer;
     textarea: typeof textarea;
     richText: typeof richText;
     number: typeof number;

package/dist/runtime/fields/index.js

@@ -5,6 +5,7 @@ import { color } from "./color.js";
 import { date, today } from "./date.js";
 import { email } from "./email.js";
 import { image } from "./image.js";
+import { mediaPlayer } from "./media-player.js";
 import { number } from "./number.js";
 import { phone } from "./phone.js";
 import { radio } from "./radio.js";
@@ -17,5 +18,5 @@ import { tags } from "./tags.js";
 import { tab } from "./tab.js";
 import { textarea } from "./textarea.js";
 import { url } from "./url.js";
-export const field = { string, slug, email, phone, url, textarea, richText, number, boolean, image, select, radio, checkboxGroup, tags, date, color, array, section, tab };
+export const field = { string, slug, email, phone, url, mediaPlayer, textarea, richText, number, boolean, image, select, radio, checkboxGroup, tags, date, color, array, section, tab };
 export { today };

package/dist/runtime/fields/media-player.d.ts

@@ -0,0 +1,2 @@
+import type { MediaPlayerFieldDefinition, MediaPlayerFieldOptions } from '../types/field.js';
+export declare function mediaPlayer(options?: MediaPlayerFieldOptions): MediaPlayerFieldDefinition;

package/dist/runtime/fields/media-player.js

@@ -0,0 +1,3 @@
+export function mediaPlayer(options = {}) {
+  return { type: "mediaPlayer", options };
+}

package/dist/runtime/types/eponyme.d.ts

@@ -1,4 +1,4 @@
-import type { ArrayFieldDefinition, ArrayItemValue, BooleanFieldDefinition, CheckboxGroupFieldDefinition, EmailFieldDefinition, FieldDefinition, NumberFieldDefinition, PhoneFieldDefinition, RadioFieldDefinition, SectionFieldDefinition, SectionValue, SelectFieldDefinition, SlugFieldDefinition, StringFieldDefinition, TabFieldDefinition, TagsFieldDefinition, TagsValueOf, TabsValue, TextareaFieldDefinition, UrlFieldDefinition, UrlValue } from './field.js';
+import type { ArrayFieldDefinition, ArrayItemValue, BooleanFieldDefinition, CheckboxGroupFieldDefinition, EmailFieldDefinition, FieldDefinition, MediaPlayerFieldDefinition, MediaPlayerValue, NumberFieldDefinition, PhoneFieldDefinition, RadioFieldDefinition, SectionFieldDefinition, SectionValue, SelectFieldDefinition, SlugFieldDefinition, StringFieldDefinition, TabFieldDefinition, TagsFieldDefinition, TagsValueOf, TabsValue, TextareaFieldDefinition, UrlFieldDefinition, UrlValue } from './field.js';
 export type EponymeSchema = Record<string, FieldDefinition>;
 export interface EponymeCollectionDefinitionBase {
     __eponymeCollection: true;
@@ -65,7 +65,7 @@ export type FieldValue<T extends FieldDefinition> = T extends {
     type: 'number';
 } ? number : T extends {
     type: 'boolean';
-} ? boolean : T extends UrlFieldDefinition ? UrlValue : T extends ArrayFieldDefinition<infer Item> ? Array<ArrayItemValue<Item>> : T extends CheckboxGroupFieldDefinition<infer Value> ? Value[] : T extends TagsFieldDefinition<infer Options> ? Array<TagsValueOf<Options>> : T extends SectionFieldDefinition<infer Section> ? SectionValue<Section> : T extends TabFieldDefinition<infer Tabs> ? TabsValue<Tabs> : string;
+} ? boolean : T extends UrlFieldDefinition ? UrlValue : T extends MediaPlayerFieldDefinition ? MediaPlayerValue : T extends ArrayFieldDefinition<infer Item> ? Array<ArrayItemValue<Item>> : T extends CheckboxGroupFieldDefinition<infer Value> ? Value[] : T extends TagsFieldDefinition<infer Options> ? Array<TagsValueOf<Options>> : T extends SectionFieldDefinition<infer Section> ? SectionValue<Section> : T extends TabFieldDefinition<infer Tabs> ? TabsValue<Tabs> : string;
 export type EponymeData<T extends EponymeSchema> = {
     [K in keyof T]: T[K] extends FieldDefinition ? FieldValue<T[K]> : never;
 };

package/dist/runtime/types/field.d.ts

@@ -1,5 +1,5 @@
 import type { CountryCode } from 'libphonenumber-js/min';
-export type EponymeFieldType = 'string' | 'slug' | 'email' | 'phone' | 'url' | 'textarea' | 'richText' | 'number' | 'boolean' | 'image' | 'select' | 'radio' | 'checkboxGroup' | 'tags' | 'date' | 'color' | 'array' | 'section' | 'tabs';
+export type EponymeFieldType = 'string' | 'slug' | 'email' | 'phone' | 'url' | 'mediaPlayer' | 'textarea' | 'richText' | 'number' | 'boolean' | 'image' | 'select' | 'radio' | 'checkboxGroup' | 'tags' | 'date' | 'color' | 'array' | 'section' | 'tabs';
 export type FieldVisibilityCondition = {
     field: string;
     equals: unknown;
@@ -124,6 +124,33 @@ export interface UrlFieldDefinition {
     type: 'url';
     options: UrlFieldOptions;
 }
+/**
+ * Where a video comes from. `youtube` and `vimeo` are embedded in an iframe; `url` is a file
+ * the browser plays directly in a `<video>` element.
+ */
+export type MediaPlayerProvider = 'youtube' | 'vimeo' | 'url';
+export interface MediaPlayerValue {
+    /** Detected from `url`. Empty while nothing has been entered, or when nothing recognised it. */
+    provider: MediaPlayerProvider | '';
+    /** Address as it was entered. */
+    url: string;
+    /** Video id at its provider. Empty for `url`, which has none. */
+    id: string;
+}
+export interface MediaPlayerFieldOptions extends DefaultFieldOptions<MediaPlayerValue> {
+    placeholder?: string;
+    /**
+     * Sources this field accepts. A video from any other one is refused rather than stored as
+     * an address nothing can play.
+     *
+     * @default ['youtube', 'vimeo', 'url']
+     */
+    providers?: readonly MediaPlayerProvider[];
+}
+export interface MediaPlayerFieldDefinition {
+    type: 'mediaPlayer';
+    options: MediaPlayerFieldOptions;
+}
 export interface NumberFieldOptions extends DefaultFieldOptions<number> {
     min?: number;
     max?: number;
@@ -233,10 +260,10 @@ export interface ColorFieldDefinition {
     type: 'color';
     options: ColorFieldOptions;
 }
-export type ArrayItemFieldDefinition = StringFieldDefinition | SlugFieldDefinition | EmailFieldDefinition | PhoneFieldDefinition | UrlFieldDefinition | TextareaFieldDefinition | RichTextFieldDefinition | NumberFieldDefinition | BooleanFieldDefinition | ImageFieldDefinition | SelectFieldDefinition | RadioFieldDefinition | CheckboxGroupFieldDefinition | TagsFieldDefinition | DateFieldDefinition | ColorFieldDefinition;
+export type ArrayItemFieldDefinition = StringFieldDefinition | SlugFieldDefinition | EmailFieldDefinition | PhoneFieldDefinition | UrlFieldDefinition | MediaPlayerFieldDefinition | TextareaFieldDefinition | RichTextFieldDefinition | NumberFieldDefinition | BooleanFieldDefinition | ImageFieldDefinition | SelectFieldDefinition | RadioFieldDefinition | CheckboxGroupFieldDefinition | TagsFieldDefinition | DateFieldDefinition | ColorFieldDefinition;
 export type ArrayItemSchema = Record<string, ArrayItemFieldDefinition>;
 export type ArrayItemDefinition = ArrayItemFieldDefinition | ArrayItemSchema;
-export type ArrayItemValue<T extends ArrayItemDefinition> = T extends NumberFieldDefinition ? number : T extends BooleanFieldDefinition ? boolean : T extends UrlFieldDefinition ? UrlValue : T extends CheckboxGroupFieldDefinition<infer Value> ? Value[] : T extends ArrayItemFieldDefinition ? string : T extends ArrayItemSchema ? {
+export type ArrayItemValue<T extends ArrayItemDefinition> = T extends NumberFieldDefinition ? number : T extends BooleanFieldDefinition ? boolean : T extends UrlFieldDefinition ? UrlValue : T extends MediaPlayerFieldDefinition ? MediaPlayerValue : T extends CheckboxGroupFieldDefinition<infer Value> ? Value[] : T extends ArrayItemFieldDefinition ? string : T extends ArrayItemSchema ? {
     [K in keyof T]: ArrayItemValue<T[K]>;
 } : never;
 export interface ArrayFieldOptions<T extends ArrayItemDefinition> extends DefaultFieldOptions<Array<ArrayItemValue<T>>> {

package/dist/runtime/utils/get-field-default-value.js

@@ -34,6 +34,8 @@ export function getFieldDefaultValue(definition) {
       return 0;
     case "url":
       return { href: "", type: "external", openInNewTab: false, download: false };
+    case "mediaPlayer":
+      return { provider: "", url: "", id: "" };
     case "boolean":
       return false;
     default:

package/dist/runtime/utils/media-player.d.ts

@@ -0,0 +1,34 @@
+import type { MediaPlayerFieldOptions, MediaPlayerProvider, MediaPlayerValue } from '../types/field.js';
+export declare const MEDIA_PLAYER_PROVIDERS: readonly MediaPlayerProvider[];
+export declare const EMPTY_MEDIA_PLAYER_VALUE: MediaPlayerValue;
+/** Providers a field accepts, in detection order, with the default applied. */
+export declare function mediaPlayerProviders(options?: Pick<MediaPlayerFieldOptions, 'providers'>): MediaPlayerProvider[];
+/**
+ * Reads a pasted address into the value the field stores.
+ *
+ * The provider is detected rather than picked in the interface: an editor pastes the address
+ * they have, and a provider chosen by hand is one more thing that can contradict the URL.
+ * `url` is the fallback for a file served directly — anything the browser can play in a
+ * `<video>` — so it only answers once the hosted providers have declined.
+ *
+ * `provider` is empty when nothing recognised it, which is what validation reports. The parse
+ * never throws, so an address still being typed simply reads as unrecognised.
+ */
+export declare function parseEponymeMediaUrl(url: unknown, options?: Pick<MediaPlayerFieldOptions, 'providers'>): MediaPlayerValue;
+/**
+ * Rereads a stored value, so `provider` and `id` always describe the URL they sit next to.
+ * The API accepts any JSON, so a client is never what decides which provider a value claims.
+ */
+export declare function normalizeEponymeMediaPlayer(value: unknown, options?: Pick<MediaPlayerFieldOptions, 'providers'>): unknown;
+/**
+ * Address to put in an `iframe` for a hosted provider, or the file itself for `url` — which
+ * belongs in a `<video>` instead. Empty when the value carries nothing playable.
+ *
+ * Derived on read rather than stored: an embed address is the provider's contract, not the
+ * editor's input, and a stored copy would keep serving yesterday's parameters.
+ */
+export declare function eponymeMediaEmbedUrl(value: unknown): string;
+/** Poster image for a hosted provider. Vimeo has no address-only thumbnail, so it has none. */
+export declare function eponymeMediaThumbnailUrl(value: unknown): string;
+/** Reads unknown input into the value shape, so a partial or absent value still renders. */
+export declare function toMediaPlayerValue(value: unknown): MediaPlayerValue;

package/dist/runtime/utils/media-player.js

@@ -0,0 +1,107 @@
+export const MEDIA_PLAYER_PROVIDERS = ["youtube", "vimeo", "url"];
+const YOUTUBE_HOSTS = ["youtube.com", "www.youtube.com", "m.youtube.com", "music.youtube.com", "youtube-nocookie.com", "www.youtube-nocookie.com"];
+const YOUTUBE_SHORT_HOSTS = ["youtu.be", "www.youtu.be"];
+const VIMEO_HOSTS = ["vimeo.com", "www.vimeo.com", "player.vimeo.com"];
+const YOUTUBE_ID = /^[\w-]{6,20}$/;
+const VIMEO_ID = /^\d+$/;
+export const EMPTY_MEDIA_PLAYER_VALUE = { provider: "", url: "", id: "" };
+export function mediaPlayerProviders(options = {}) {
+  const providers = options.providers?.filter((provider) => MEDIA_PLAYER_PROVIDERS.includes(provider));
+  return providers?.length ? [...new Set(providers)] : [...MEDIA_PLAYER_PROVIDERS];
+}
+export function parseEponymeMediaUrl(url, options = {}) {
+  const raw = typeof url === "string" ? url.trim() : "";
+  if (!raw) return { ...EMPTY_MEDIA_PLAYER_VALUE };
+  const allowed = mediaPlayerProviders(options);
+  const parsed = parseUrl(raw);
+  if (!parsed) return { provider: "", url: raw, id: "" };
+  const host = parsed.hostname.toLowerCase();
+  if (allowed.includes("youtube")) {
+    const id = youtubeId(parsed, host);
+    if (id) return { provider: "youtube", url: raw, id };
+  }
+  if (allowed.includes("vimeo")) {
+    const id = vimeoId(parsed, host);
+    if (id) return { provider: "vimeo", url: raw, id };
+  }
+  if (isHostedHost(host)) return { provider: "", url: raw, id: "" };
+  if (allowed.includes("url") && (parsed.protocol === "http:" || parsed.protocol === "https:"))
+    return { provider: "url", url: raw, id: "" };
+  return { provider: "", url: raw, id: "" };
+}
+export function normalizeEponymeMediaPlayer(value, options = {}) {
+  if (typeof value === "string") return parseEponymeMediaUrl(value, options);
+  if (!value || typeof value !== "object" || Array.isArray(value)) return value;
+  const url = value.url;
+  if (typeof url !== "string") return value;
+  return parseEponymeMediaUrl(url, options);
+}
+export function eponymeMediaEmbedUrl(value) {
+  const media = toMediaPlayerValue(value);
+  if (!media.url) return "";
+  if (media.provider === "url") return media.url;
+  if (!media.id) return "";
+  if (media.provider === "youtube")
+    return `https://www.youtube-nocookie.com/embed/${encodeURIComponent(media.id)}`;
+  if (media.provider === "vimeo") {
+    const hash = vimeoPrivacyHash(media.url);
+    return `https://player.vimeo.com/video/${encodeURIComponent(media.id)}${hash ? `?h=${encodeURIComponent(hash)}` : ""}`;
+  }
+  return "";
+}
+export function eponymeMediaThumbnailUrl(value) {
+  const media = toMediaPlayerValue(value);
+  if (media.provider === "youtube" && media.id) return `https://i.ytimg.com/vi/${encodeURIComponent(media.id)}/hqdefault.jpg`;
+  return "";
+}
+export function toMediaPlayerValue(value) {
+  if (!value || typeof value !== "object" || Array.isArray(value)) return { ...EMPTY_MEDIA_PLAYER_VALUE };
+  const media = value;
+  const provider = typeof media.provider === "string" && MEDIA_PLAYER_PROVIDERS.includes(media.provider) ? media.provider : "";
+  return {
+    provider,
+    url: typeof media.url === "string" ? media.url : "",
+    id: typeof media.id === "string" ? media.id : ""
+  };
+}
+function parseUrl(raw) {
+  try {
+    return new URL(raw);
+  } catch {
+    return void 0;
+  }
+}
+function isHostedHost(host) {
+  return YOUTUBE_HOSTS.includes(host) || YOUTUBE_SHORT_HOSTS.includes(host) || VIMEO_HOSTS.includes(host);
+}
+function youtubeId(url, host) {
+  if (YOUTUBE_SHORT_HOSTS.includes(host)) return validId(segments(url)[0], YOUTUBE_ID);
+  if (!YOUTUBE_HOSTS.includes(host)) return "";
+  const parts = segments(url);
+  if (parts[0] === "watch") return validId(url.searchParams.get("v"), YOUTUBE_ID);
+  if (parts[0] && ["embed", "shorts", "live", "v"].includes(parts[0])) return validId(parts[1], YOUTUBE_ID);
+  return "";
+}
+function vimeoId(url, host) {
+  if (!VIMEO_HOSTS.includes(host)) return "";
+  const parts = segments(url);
+  if (host === "player.vimeo.com") return parts[0] === "video" ? validId(parts[1], VIMEO_ID) : "";
+  const numeric = [...parts].reverse().find((part) => VIMEO_ID.test(part));
+  return validId(numeric, VIMEO_ID);
+}
+function vimeoPrivacyHash(raw) {
+  const url = parseUrl(raw);
+  if (!url) return "";
+  const query = url.searchParams.get("h");
+  if (query) return query;
+  const parts = segments(url);
+  const index = parts.findIndex((part) => VIMEO_ID.test(part));
+  const hash = index >= 0 ? parts[index + 1] : void 0;
+  return hash && /^[\da-z]+$/i.test(hash) ? hash : "";
+}
+function segments(url) {
+  return url.pathname.split("/").filter(Boolean);
+}
+function validId(candidate, pattern) {
+  return candidate && pattern.test(candidate) ? candidate : "";
+}

package/dist/runtime/utils/normalize-eponyme-values.js

@@ -1,4 +1,5 @@
 import { isArrayItemFieldDefinition } from "./get-field-default-value.js";
+import { normalizeEponymeMediaPlayer } from "./media-player.js";
 import { toEponymePhoneValue } from "./normalize-phone.js";
 import { normalizeEponymeTags } from "./normalize-tags.js";
 export function normalizeEponymeValues(schema, data) {
@@ -12,6 +13,7 @@ export function normalizeEponymeValues(schema, data) {
 function normalizeField(definition, value) {
   if (definition.type === "phone") return toEponymePhoneValue(value, definition.options);
   if (definition.type === "tags") return Array.isArray(value) ? normalizeEponymeTags(value, definition.options) : value;
+  if (definition.type === "mediaPlayer") return normalizeEponymeMediaPlayer(value, definition.options);
   if (definition.type === "section")
     return normalizeNested(definition.options.fields, value);
   if (definition.type === "tabs") {

package/dist/runtime/utils/validate-eponyme-data.js

@@ -1,5 +1,6 @@
 import { isArrayItemFieldDefinition } from "./get-field-default-value.js";
 import { isFieldVisible } from "./is-field-visible.js";
+import { MEDIA_PLAYER_PROVIDERS, mediaPlayerProviders, parseEponymeMediaUrl } from "./media-player.js";
 import { normalizeEponymePhone } from "./normalize-phone.js";
 import { normalizeEponymeTags } from "./normalize-tags.js";
 const urlPattern = /^https?:\/\//i;
@@ -158,6 +159,23 @@ function validateFieldRules(name, definition, value, errors, mode, _context) {
     if (link.type === "internal" && !href.startsWith("/") && !href.startsWith("#")) addError(errors, name, "Internal links must start with / or #.");
     return;
   }
+  if (definition.type === "mediaPlayer") {
+    if (!value || typeof value !== "object" || Array.isArray(value)) {
+      addError(errors, name, "Must be a video.");
+      return;
+    }
+    const media = value;
+    if (typeof media.url !== "string" || media.id !== void 0 && typeof media.id !== "string" || media.provider !== void 0 && media.provider !== "" && !MEDIA_PLAYER_PROVIDERS.includes(media.provider)) {
+      addError(errors, name, "Must be a valid video.");
+      return;
+    }
+    const address = media.url.trim();
+    if (mode === "publish" && options.required && !address) addError(errors, name, "This field is required.");
+    if (!address) return;
+    const parsed = parseEponymeMediaUrl(address, definition.options);
+    if (!parsed.provider) addError(errors, name, mediaPlayerError(definition.options));
+    return;
+  }
   if (typeof value !== "string") {
     addError(errors, name, "Must be a string.");
     return;
@@ -224,6 +242,16 @@ function isAllowedProtocol(href, protocols) {
   const scheme = schemePattern.exec(href)?.[1]?.toLowerCase();
   return Boolean(scheme) && normalizeProtocols(protocols).includes(scheme);
 }
+const MEDIA_PLAYER_LABELS = {
+  youtube: "a YouTube link",
+  vimeo: "a Vimeo link",
+  url: "a direct video URL"
+};
+function mediaPlayerError(options) {
+  const accepted = mediaPlayerProviders(options).map((provider) => MEDIA_PLAYER_LABELS[provider]);
+  const last = accepted.pop();
+  return `Must be ${accepted.length ? `${accepted.join(", ")} or ${last}` : last}.`;
+}
 function getRichTextContent(value) {
   return value.replace(/<br\s*\/?>/gi, " ").replace(/<\/p>|<\/h[1-6]>|<\/li>|<\/blockquote>/gi, " ").replace(/<[^>]+>/g, "").replace(/&nbsp;|&#160;/gi, " ").replace(/&amp;/gi, "&").replace(/&lt;/gi, "<").replace(/&gt;/gi, ">").replace(/\s+/g, " ").trim();
 }

package/dist/types.d.mts

@@ -4,7 +4,9 @@ export { type field, type today } from '../dist/runtime/fields/index.js'
 
 export { type EPONYME_ROLES, type canEditEponyme, type isEponymeRole } from '../dist/runtime/types/auth.js'
 
-export { type ArrayFieldDefinition, type ArrayFieldOptions, type ArrayItemDefinition, type ArrayItemFieldDefinition, type ArrayItemSchema, type ArrayItemValue, type BooleanFieldDefinition, type BooleanFieldOptions, type CheckboxGroupFieldDefinition, type CheckboxGroupFieldOptions, type CollectionSlugField, type ColorFieldDefinition, type ColorFieldOptions, type DateFieldDefinition, type DateFieldOptions, type EmailFieldDefinition, type EmailFieldOptions, type EponymeAuthSession, type EponymeAuthUser, type EponymeCollectionDataByName, type EponymeCollectionDefinition, type EponymeCollectionDefinitionBase, type EponymeCollectionName, type EponymeCollectionOptions, type EponymeConfig, type EponymeData, type EponymeDataByName, type EponymeFormDataByName, type EponymeFormDefinition, type EponymeFormDefinitionBase, type EponymeFormFieldDefinition, type EponymeFormMode, type EponymeFormName, type EponymeFormOptions, type EponymeFormSchema, type EponymeManagedUserResult, type EponymeName, type EponymeRole, type EponymeSchema, type EponymeVariableDefinition, type EponymeVariableSummary, type EponymeVariableValue, type EponymeVariables, type FieldDefinition, type FieldValidationResult, type FieldValidator, type FieldVisibilityCondition, type ImageFieldDefinition, type ImageFieldOptions, type NumberFieldDefinition, type NumberFieldOptions, type RadioFieldDefinition, type RadioFieldOptions, type RichTextFieldDefinition, type RichTextFieldOptions, type SectionFieldDefinition, type SectionFieldOptions, type SectionItemFieldDefinition, type SectionItemValue, type SectionSchema, type SectionValue, type SelectFieldDefinition, type SelectFieldOptions, type SelectOption, type SlugFieldDefinition, type SlugFieldOptions, type StringFieldDefinition, type StringFieldOptions, type TabDefinition, type TabFieldDefinition, type TabFieldOptions, type TabsSchema, type TabsValue, type TextareaFieldDefinition, type TextareaFieldOptions, type TodayDateDefault, type UrlFieldDefinition, type UrlFieldOptions, type UrlType, type UrlValue } from '../dist/runtime/types/index.js'
+export { type eponymeMediaEmbedUrl, type eponymeMediaThumbnailUrl, type parseEponymeMediaUrl } from '../dist/runtime/utils/media-player.js'
+
+export { type ArrayFieldDefinition, type ArrayFieldOptions, type ArrayItemDefinition, type ArrayItemFieldDefinition, type ArrayItemSchema, type ArrayItemValue, type BooleanFieldDefinition, type BooleanFieldOptions, type CheckboxGroupFieldDefinition, type CheckboxGroupFieldOptions, type CollectionSlugField, type ColorFieldDefinition, type ColorFieldOptions, type DateFieldDefinition, type DateFieldOptions, type EmailFieldDefinition, type EmailFieldOptions, type EponymeAuthSession, type EponymeAuthUser, type EponymeCollectionDataByName, type EponymeCollectionDefinition, type EponymeCollectionDefinitionBase, type EponymeCollectionName, type EponymeCollectionOptions, type EponymeConfig, type EponymeData, type EponymeDataByName, type EponymeFormDataByName, type EponymeFormDefinition, type EponymeFormDefinitionBase, type EponymeFormFieldDefinition, type EponymeFormMode, type EponymeFormName, type EponymeFormOptions, type EponymeFormSchema, type EponymeManagedUserResult, type EponymeName, type EponymeRole, type EponymeSchema, type EponymeVariableDefinition, type EponymeVariableSummary, type EponymeVariableValue, type EponymeVariables, type FieldDefinition, type FieldValidationResult, type FieldValidator, type FieldVisibilityCondition, type ImageFieldDefinition, type ImageFieldOptions, type MediaPlayerFieldDefinition, type MediaPlayerFieldOptions, type MediaPlayerProvider, type MediaPlayerValue, type NumberFieldDefinition, type NumberFieldOptions, type RadioFieldDefinition, type RadioFieldOptions, type RichTextFieldDefinition, type RichTextFieldOptions, type SectionFieldDefinition, type SectionFieldOptions, type SectionItemFieldDefinition, type SectionItemValue, type SectionSchema, type SectionValue, type SelectFieldDefinition, type SelectFieldOptions, type SelectOption, type SlugFieldDefinition, type SlugFieldOptions, type StringFieldDefinition, type StringFieldOptions, type TabDefinition, type TabFieldDefinition, type TabFieldOptions, type TabsSchema, type TabsValue, type TextareaFieldDefinition, type TextareaFieldOptions, type TodayDateDefault, type UrlFieldDefinition, type UrlFieldOptions, type UrlType, type UrlValue } from '../dist/runtime/types/index.js'
 
 export { default } from './module.mjs'
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@karibsen/eponyme",
-  "version": "0.8.0",
+  "version": "0.8.11",
   "description": "A lightweight, type-safe content manager for Nuxt.",
   "license": "MIT",
   "type": "module",