@frigear-nu/ui 0.0.9 → 0.1.0

package/dist/runtime/components/global/TablePagination.vue

@@ -0,0 +1,51 @@
+<script setup>
+import { tablePageRange } from "../../utils/table";
+const props = defineProps({
+  total: { type: Number, required: true },
+  pageSizes: { type: Array, required: false, default: () => [20, 50, 100] }
+});
+const page = defineModel("page", { type: Number, ...{ default: 1 } });
+const pageSize = defineModel("pageSize", { type: Number, ...{ default: 20 } });
+const t = useUiT("patterns");
+const range = computed(() => tablePageRange(page.value, pageSize.value, props.total));
+const sizes = computed(() => [.../* @__PURE__ */ new Set([...props.pageSizes, pageSize.value])].sort((a, b) => a - b));
+const paged = computed(() => props.total > Math.min(...sizes.value));
+const pages = computed(() => props.total > pageSize.value || page.value > 1);
+function setPageSize(value) {
+  pageSize.value = Number(value);
+  page.value = 1;
+}
+</script>
+
+<template>
+  <div class="flex w-full flex-wrap items-center justify-between gap-3">
+    <p class="tabular-nums">
+      <slot :range="range">
+        {{ range.to ? t("range", "{from}\u2013{to} of {total}", { from: range.from, to: range.to, total }) : t("noRows", "No rows") }}
+      </slot>
+    </p>
+    <div class="flex flex-wrap items-center gap-3">
+      <label
+        v-if="paged"
+        class="flex items-center gap-2"
+      >
+        <span class="max-sm:sr-only">{{ t("rowsPerPage", "Rows per page") }}</span>
+        <USelect
+          :model-value="pageSize"
+          :items="sizes"
+          size="sm"
+          class="w-20"
+          @update:model-value="setPageSize"
+        />
+      </label>
+      <UPagination
+        v-if="pages"
+        v-model:page="page"
+        :items-per-page="pageSize"
+        :total="total"
+        :sibling-count="1"
+        size="sm"
+      />
+    </div>
+  </div>
+</template>

package/dist/runtime/components/global/TablePagination.vue.d.ts

@@ -0,0 +1,36 @@
+/**
+ * The footer of a paginated list, inside `TableCard #footer`: "21–40 of 132", rows per page and the pages. Pages
+ * and the page-size select hide while everything fits on one page. Changing the page size goes back to page 1.
+ */
+type __VLS_Props = {
+    total: number;
+    pageSizes?: number[];
+};
+type __VLS_ModelProps = {
+    'page'?: number;
+    'pageSize'?: number;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare var __VLS_1: {
+    range: any;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:page": (value: number) => any;
+    "update:pageSize": (value: number) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:page"?: ((value: number) => any) | undefined;
+    "onUpdate:pageSize"?: ((value: number) => any) | undefined;
+}>, {
+    pageSizes: number[];
+}, {}, {}, {}, 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;
+    };
+};

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

@@ -1,2 +1,10 @@
+export * from './useAction.ts.js';
 export * from './useConfirmDialog.ts.js';
+export * from './useCopyToClipboard.ts.js';
+export * from './useErrorToast.ts.js';
+export * from './useFormat.ts.js';
+export * from './useLocaleLink.ts.js';
+export * from './useNavLinks.ts.js';
+export * from './useTableQuery.ts.js';
+export * from './useTableSort.ts.js';
 export * from './useTranslatedLocales.ts.js';

package/dist/runtime/composables/index.js

@@ -1,2 +1,10 @@
+export * from "./useAction.ts";
 export * from "./useConfirmDialog.ts";
+export * from "./useCopyToClipboard.ts";
+export * from "./useErrorToast.ts";
+export * from "./useFormat.ts";
+export * from "./useLocaleLink.ts";
+export * from "./useNavLinks.ts";
+export * from "./useTableQuery.ts";
+export * from "./useTableSort.ts";
 export * from "./useTranslatedLocales.ts";

package/dist/runtime/composables/useAction.d.ts

@@ -0,0 +1,14 @@
+import type { ActionOptions } from '../types.js';
+/**
+ * Runs an async action with a `busy` flag and toasts: `success` once it worked, the error (titled `error`) when it
+ * failed. Errors are swallowed: `run` then resolves with `undefined`.
+ *
+ * ```ts
+ * const { busy, run } = useAction()
+ * const saved = await run(() => $fetch('/api/events', { method: 'POST', body }), { success: 'Event created' })
+ * ```
+ */
+export declare function useAction(): {
+    busy: any;
+    run: <T>(fn: () => Promise<T>, options?: ActionOptions) => Promise<T | undefined>;
+};

package/dist/runtime/composables/useAction.js

@@ -0,0 +1,20 @@
+import { useErrorToast } from "./useErrorToast.js";
+export function useAction() {
+  const busy = ref(false);
+  const toast = useToast();
+  const showError = useErrorToast();
+  async function run(fn, options = {}) {
+    busy.value = true;
+    try {
+      const result = await fn();
+      if (options.success) toast.add({ title: options.success, color: "success", icon: "i-lucide-check" });
+      return result;
+    } catch (e) {
+      showError(e, options.error);
+      return void 0;
+    } finally {
+      busy.value = false;
+    }
+  }
+  return { busy, run };
+}

package/dist/runtime/composables/useCopyToClipboard.d.ts

@@ -0,0 +1,4 @@
+/** Copies text to the clipboard and confirms it with a toast ("Copied", or `message`). Resolves `false` on failure. */
+export declare function useCopyToClipboard(): {
+    copy: (text: string, message?: string) => Promise<boolean>;
+};

package/dist/runtime/composables/useCopyToClipboard.js

@@ -0,0 +1,20 @@
+import { useClipboard } from "@vueuse/core";
+import { useErrorToast } from "./useErrorToast.js";
+import { useUiT } from "./useTranslatedLocales.js";
+export function useCopyToClipboard() {
+  const { copy: write } = useClipboard({ legacy: true });
+  const toast = useToast();
+  const showError = useErrorToast();
+  const t = useUiT("patterns");
+  async function copy(text, message) {
+    try {
+      await write(text);
+      toast.add({ title: message ?? t("copied", "Copied"), color: "success", icon: "i-lucide-clipboard-check" });
+      return true;
+    } catch (e) {
+      showError(e);
+      return false;
+    }
+  }
+  return { copy };
+}

package/dist/runtime/composables/useErrorToast.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Shows an error as a red toast: `title` (default "Something went wrong.") with the error's message as description.
+ *
+ * ```ts
+ * const showError = useErrorToast()
+ * try { await save() } catch (e) { showError(e, 'Could not save the event') }
+ * ```
+ */
+export declare function useErrorToast(): (e: unknown, title?: string) => void;

package/dist/runtime/composables/useErrorToast.js

@@ -0,0 +1,9 @@
+import { errorToToast } from "../utils/errors.js";
+import { useUiT } from "./useTranslatedLocales.js";
+export function useErrorToast() {
+  const toast = useToast();
+  const t = useUiT("patterns");
+  return (e, title) => {
+    toast.add(errorToToast(e, { title: title ?? t("genericError", "Something went wrong.") }));
+  };
+}

package/dist/runtime/composables/useFormat.d.ts

@@ -0,0 +1,23 @@
+import type { DateValue } from '../types.js';
+/**
+ * The date and money formatters bound to the active locale (`@nuxtjs/i18n`'s when installed, otherwise `en`) and to
+ * the app's time zone (`appConfig.frigearUi.timeZone`, e.g. `Europe/Copenhagen`), so server and client render the
+ * same text. Without a configured time zone the runtime's own is used, which differs between a UTC server and a
+ * visitor's browser: set it in the host app.
+ *
+ * ```ts
+ * const format = useFormat()
+ * format.date(event.startsAt) // "15 Oct 2026"
+ * format.money(15000, 'DKK') // "DKK 150.00"
+ * ```
+ */
+export declare function useFormat(): {
+    locale: any;
+    timeZone: string | undefined;
+    date: (value: DateValue | null | undefined, options?: Intl.DateTimeFormatOptions) => string;
+    dateTime: (value: DateValue | null | undefined, options?: Intl.DateTimeFormatOptions) => string;
+    time: (value: DateValue | null | undefined, options?: Intl.DateTimeFormatOptions) => string;
+    dateRange: (start: DateValue | null | undefined, end: DateValue | null | undefined, options?: Intl.DateTimeFormatOptions) => string;
+    /** An amount in minor units (cents, øre) of `currency`. */
+    money: (amount: number, currency: string) => string;
+};

package/dist/runtime/composables/useFormat.js

@@ -0,0 +1,19 @@
+import { useAppConfig } from "#imports";
+import { formatDate, formatDateRange, formatDateTime, formatTime } from "../utils/format.js";
+import { formatMoney } from "../shared/money.js";
+import { useTranslatedLocale } from "./useTranslatedLocales.js";
+export function useFormat() {
+  const locale = useTranslatedLocale();
+  const timeZone = useAppConfig().frigearUi?.timeZone;
+  const withZone = (options) => timeZone ? { timeZone, ...options } : { ...options };
+  return {
+    locale,
+    timeZone,
+    date: (value, options) => formatDate(value, locale.value, withZone(options)),
+    dateTime: (value, options) => formatDateTime(value, locale.value, withZone(options)),
+    time: (value, options) => formatTime(value, locale.value, withZone(options)),
+    dateRange: (start, end, options) => formatDateRange(start, end, locale.value, withZone(options)),
+    /** An amount in minor units (cents, øre) of `currency`. */
+    money: (amount, currency) => formatMoney(amount, currency, locale.value)
+  };
+}

package/dist/runtime/composables/useLocaleLink.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Locale-aware paths that work with and without `@nuxtjs/i18n`: `localize` adds the active locale's prefix
+ * (identity without i18n), `strip` removes one, `isActive` compares a target with the current route regardless of
+ * prefixes (`exact` for targets like a dashboard at an area's base path). Named so it does not clash with i18n's
+ * own `useLocalePath`.
+ */
+export declare function useLocaleLink(): {
+    localize: (path: string) => string;
+    strip: (path: string) => string;
+    isActive: (to: string | undefined, options?: {
+        exact?: boolean;
+    }) => boolean;
+};

package/dist/runtime/composables/useLocaleLink.js

@@ -0,0 +1,19 @@
+import { isExternalPath, stripLocale } from "../utils/locale.js";
+export function useLocaleLink() {
+  const nuxtApp = useNuxtApp();
+  const route = useRoute();
+  const codes = () => (nuxtApp.$i18n?.locales?.value ?? []).map((locale) => typeof locale === "string" ? locale : locale.code);
+  const strip = (path) => stripLocale(path, codes());
+  const localize = (path) => {
+    if (!nuxtApp.$localePath || !path.startsWith("/") || isExternalPath(path)) return path;
+    return nuxtApp.$localePath(strip(path)) || path;
+  };
+  const isActive = (to, options = {}) => {
+    if (!to || isExternalPath(to)) return false;
+    const target = strip(to);
+    const current = strip(route.path);
+    if (options.exact || target === "/") return current === target;
+    return current === target || current.startsWith(`${target}/`);
+  };
+  return { localize, strip, isActive };
+}

package/dist/runtime/composables/useNavLinks.d.ts

@@ -0,0 +1,13 @@
+import type { NavigationMenuItem } from '@nuxt/ui';
+import type { ComputedRef, MaybeRefOrGetter } from 'vue';
+import type { NavLinkSource, NavLinksOptions } from '../types.js';
+/**
+ * Turns menu items (e.g. `useMenu('admin.nav')`) into `UNavigationMenu` links: `to` gets the active locale's prefix
+ * and `active` follows the current route (prefix-insensitive; targets listed in `exact` only match exactly).
+ *
+ * ```ts
+ * const { data } = await useMenu('account')
+ * const links = useNavLinks(() => data.value ?? [], { exact: ['/account'] })
+ * ```
+ */
+export declare function useNavLinks(items: MaybeRefOrGetter<NavLinkSource[] | null | undefined>, options?: NavLinksOptions): ComputedRef<NavigationMenuItem[]>;

package/dist/runtime/composables/useNavLinks.js

@@ -0,0 +1,15 @@
+import { useLocaleLink } from "./useLocaleLink.js";
+export function useNavLinks(items, options = {}) {
+  const { localize, isActive, strip } = useLocaleLink();
+  const exact = new Set((options.exact ?? []).map((path) => strip(path)));
+  return computed(() => (toValue(items) ?? []).map((item) => {
+    const link = { label: item.label, icon: item.icon };
+    if (item.badge !== void 0) link.badge = item.badge;
+    if (item.to) {
+      link.to = item.external ? item.to : localize(item.to);
+      link.external = item.external;
+      link.active = !item.external && isActive(item.to, { exact: exact.has(strip(item.to)) });
+    }
+    return link;
+  }));
+}

package/dist/runtime/composables/useTableQuery.d.ts

@@ -0,0 +1,34 @@
+import type { Ref } from 'vue';
+import type { TableSortState } from '../utils/table.js';
+export interface TableQueryOptions<F extends Record<string, string>> {
+    /** Rows per page when the URL has none. */
+    pageSize?: number;
+    /** The sort when the URL has none; `null` for unsorted. */
+    sort?: TableSortState | null;
+    /** Filters and their defaults; a filter at its default is left out of the URL. */
+    filters?: F;
+    /** How long typing in the search waits before `q` follows, in ms. */
+    debounce?: number;
+}
+/**
+ * The state of a paginated list (page, page size, search, sort, filters), kept in the URL so a list can be linked,
+ * reloaded and navigated back to. `search` is what the input binds; `q` follows it after a short pause, so the API
+ * is not hit on every keystroke. Any change to the search, a filter, the sort or the page size goes back to page 1.
+ *
+ * ```ts
+ * const list = useTableQuery({ sort: { id: 'createdAt', desc: true }, filters: { role: 'all' } })
+ * const sort = useTableSort(null, list.sort)
+ * const { data } = await useFetch('/api/things', { query: list.query })
+ * ```
+ */
+export declare function useTableQuery<F extends Record<string, string> = Record<string, never>>(options?: TableQueryOptions<F>): {
+    page: any;
+    pageSize: any;
+    search: any;
+    q: any;
+    sort: Ref<TableSortState | null, TableSortState | null>;
+    filters: F;
+    query: any;
+    filtered: any;
+    reset: () => void;
+};

package/dist/runtime/composables/useTableQuery.js

@@ -0,0 +1,70 @@
+const single = (value) => {
+  const first = Array.isArray(value) ? value[0] : value;
+  return typeof first === "string" && first !== "" ? first : void 0;
+};
+const positive = (value, fallback) => {
+  const number = Number(single(value));
+  return Number.isInteger(number) && number > 0 ? number : fallback;
+};
+export function useTableQuery(options = {}) {
+  const route = useRoute();
+  const router = useRouter();
+  const defaultPageSize = options.pageSize ?? 20;
+  const defaultSort = options.sort ?? null;
+  const defaultFilters = options.filters ?? {};
+  const readSort = () => {
+    const id = single(route.query.sort);
+    if (!id) return defaultSort;
+    if (id === "-") return null;
+    return { id, desc: single(route.query.order) === "desc" };
+  };
+  const page = ref(positive(route.query.page, 1));
+  const pageSize = ref(positive(route.query.pageSize, defaultPageSize));
+  const q = ref(single(route.query.q) ?? "");
+  const search = ref(q.value);
+  const sort = ref(readSort());
+  const filters = reactive(Object.fromEntries(
+    Object.entries(defaultFilters).map(([key, fallback]) => [key, single(route.query[key]) ?? fallback])
+  ));
+  let timer;
+  watch(search, (value) => {
+    clearTimeout(timer);
+    timer = setTimeout(() => {
+      q.value = value.trim();
+    }, options.debounce ?? 300);
+  });
+  if (getCurrentInstance()) onBeforeUnmount(() => clearTimeout(timer));
+  watch([q, pageSize, sort, () => ({ ...filters })], () => {
+    page.value = 1;
+  }, { deep: true });
+  const urlQuery = computed(() => {
+    const sameSort = sort.value?.id === defaultSort?.id && sort.value?.desc === defaultSort?.desc;
+    return {
+      page: page.value > 1 ? String(page.value) : void 0,
+      pageSize: pageSize.value !== defaultPageSize ? String(pageSize.value) : void 0,
+      q: q.value || void 0,
+      sort: sameSort ? void 0 : sort.value?.id ?? "-",
+      order: sameSort || !sort.value ? void 0 : sort.value.desc ? "desc" : "asc",
+      ...Object.fromEntries(Object.entries(filters).map(([key, value]) => [key, value === defaultFilters[key] ? void 0 : value]))
+    };
+  });
+  watch(urlQuery, (value) => {
+    const next = Object.entries({ ...route.query, ...value }).filter(([, entry]) => entry !== void 0);
+    router.replace({ query: Object.fromEntries(next) });
+  });
+  const query = computed(() => ({
+    page: page.value,
+    pageSize: pageSize.value,
+    q: q.value || void 0,
+    sort: sort.value?.id,
+    order: sort.value ? sort.value.desc ? "desc" : "asc" : void 0,
+    ...Object.fromEntries(Object.entries(filters).map(([key, value]) => [key, value === defaultFilters[key] ? void 0 : value]))
+  }));
+  const filtered = computed(() => !!search.value || Object.entries(filters).some(([key, value]) => value !== defaultFilters[key]));
+  function reset() {
+    search.value = "";
+    q.value = "";
+    Object.assign(filters, defaultFilters);
+  }
+  return { page, pageSize, search, q, sort, filters, query, filtered, reset };
+}

package/dist/runtime/composables/useTableSort.d.ts

@@ -0,0 +1,21 @@
+import type { Ref } from 'vue';
+import { type TableSortState } from '../utils/table.js';
+/**
+ * Sortable column headers that look and behave the same in every list: a ghost button that cycles ascending,
+ * descending, unsorted. `sorting` is in `UTable`'s shape, so a client-sorted list binds it with
+ * `v-model:sorting`; a server-sorted list sends `query` (`{ sort, order }`) instead.
+ *
+ * ```ts
+ * const sort = useTableSort({ id: 'createdAt', desc: true })
+ * const columns = [{ accessorKey: 'name', header: sort.header('name', t('name', 'Name')) }]
+ * ```
+ *
+ * Pass `state` to keep the sort somewhere else, such as the URL (see `useTableQuery`).
+ */
+export declare function useTableSort(initial?: TableSortState | null, state?: Ref<TableSortState | null>): {
+    sort: any;
+    sorting: any;
+    query: any;
+    toggle: (id: string) => void;
+    header: (id: string, label: string) => () => any;
+};

package/dist/runtime/composables/useTableSort.js

@@ -0,0 +1,40 @@
+import { UButton } from "#components";
+import { nextTableSort, tableSortQuery } from "../utils/table.js";
+import { useUiT } from "./useTranslatedLocales.js";
+const SORT_ICONS = {
+  none: "i-lucide-arrow-up-down",
+  asc: "i-lucide-arrow-up-narrow-wide",
+  desc: "i-lucide-arrow-down-wide-narrow"
+};
+export function useTableSort(initial = null, state) {
+  const t = useUiT("patterns");
+  const current = state ?? ref(initial);
+  const sorting = computed({
+    get: () => current.value ? [current.value] : [],
+    set: (value) => {
+      current.value = value[0] ?? null;
+    }
+  });
+  const query = computed(() => tableSortQuery(current.value));
+  function toggle(id) {
+    current.value = nextTableSort(current.value, id);
+  }
+  function header(id, label) {
+    return () => {
+      const direction = current.value?.id === id ? current.value.desc ? "desc" : "asc" : "none";
+      return h(UButton, {
+        "label": label,
+        "color": "neutral",
+        "variant": "ghost",
+        "size": "xs",
+        "class": "-mx-2.5 text-xs font-normal text-muted data-[sorted=true]:text-highlighted",
+        "data-sorted": direction !== "none",
+        "icon": SORT_ICONS[direction],
+        "trailing": true,
+        "aria-label": direction === "none" ? t("sortBy", "Sort by {column}", { column: label }) : t(direction === "asc" ? "sortedAsc" : "sortedDesc", direction === "asc" ? "Sort by {column}, now ascending" : "Sort by {column}, now descending", { column: label }),
+        "onClick": () => toggle(id)
+      });
+    };
+  }
+  return { sort: current, sorting, query, toggle, header };
+}

package/dist/runtime/i18n/lang/da.json

@@ -33,5 +33,24 @@
     "write": "Skriv",
     "preview": "Vis",
     "empty": "Intet at vise"
+  },
+  "patterns": {
+    "notSet": "Ikke angivet",
+    "moreActions": "Flere handlinger",
+    "actionsFor": "Handlinger for {subject}",
+    "viewAll": "Se alle",
+    "copied": "Kopieret",
+    "genericError": "Noget gik galt.",
+    "open": "Åbn",
+    "edit": "Redigér",
+    "delete": "Slet",
+    "confirm": "Bekræft",
+    "breadcrumb": "Brødkrummesti",
+    "sortBy": "Sortér efter {column}",
+    "sortedAsc": "Sortér efter {column}, nu stigende",
+    "sortedDesc": "Sortér efter {column}, nu faldende",
+    "range": "{from}–{to} af {total}",
+    "noRows": "Ingen rækker",
+    "rowsPerPage": "Rækker pr. side"
   }
 }

package/dist/runtime/i18n/lang/en.json

@@ -33,5 +33,24 @@
     "write": "Write",
     "preview": "Preview",
     "empty": "Nothing to preview"
+  },
+  "patterns": {
+    "notSet": "Not set",
+    "moreActions": "More actions",
+    "actionsFor": "Actions for {subject}",
+    "viewAll": "View all",
+    "copied": "Copied",
+    "genericError": "Something went wrong.",
+    "open": "Open",
+    "edit": "Edit",
+    "delete": "Delete",
+    "confirm": "Confirm",
+    "breadcrumb": "Breadcrumb",
+    "sortBy": "Sort by {column}",
+    "sortedAsc": "Sort by {column}, now ascending",
+    "sortedDesc": "Sort by {column}, now descending",
+    "range": "{from}–{to} of {total}",
+    "noRows": "No rows",
+    "rowsPerPage": "Rows per page"
   }
 }

package/dist/runtime/types.d.ts

@@ -0,0 +1,34 @@
+import type { NavigationMenuItem } from '@nuxt/ui';
+/** A row of `DescriptionList`. Without `value` the slot named after `key` (or `label`) renders it. */
+export interface DescriptionItem {
+    key?: string;
+    label: string;
+    value?: string | number | null;
+}
+/** An item of `PageTabs`: a link (`to`) in link mode, or a `value` in state mode (`v-model`). */
+export type PageTabItem = NavigationMenuItem & {
+    value?: string;
+};
+/** The colours `statusColor` maps a status to (a subset of Nuxt UI's badge colours). */
+export type StatusColor = 'success' | 'warning' | 'error' | 'neutral' | 'info' | 'primary';
+/** Anything the date helpers accept: a `Date`, an ISO string or a timestamp. */
+export type DateValue = string | number | Date;
+/** The shape `useNavLinks` reads: `@frigear-nu/menu`'s `MenuItem` fits, as does any object with these fields. */
+export interface NavLinkSource {
+    id?: string;
+    label: string;
+    icon?: string;
+    to?: string;
+    external?: boolean;
+    badge?: string | number;
+}
+export interface NavLinksOptions {
+    /** Targets that are only active on an exact match (e.g. a dashboard at the area's base path). */
+    exact?: string[];
+}
+export interface ActionOptions {
+    /** Toast title shown once the action succeeded; no toast without it. */
+    success?: string;
+    /** Toast title shown when the action failed; defaults to "Something went wrong.". */
+    error?: string;
+}

package/dist/runtime/utils/errors.d.ts

@@ -0,0 +1,9 @@
+import type { ToastProps } from '@nuxt/ui';
+/**
+ * The most useful message of an error thrown by `$fetch`, `createError` or plain code: the server's message
+ * (`data.message`, `data.statusMessage`, `response._data.message`), then `statusMessage`, then `message`.
+ * `fallback` when none is set.
+ */
+export declare function errorMessage(e: unknown, fallback: string): string;
+/** A Nuxt UI toast for an error: red, with the error's message as description. `overrides` win. */
+export declare function errorToToast(e: unknown, overrides?: Partial<ToastProps>): Partial<ToastProps>;

package/dist/runtime/utils/errors.js

@@ -0,0 +1,18 @@
+const text = (value) => typeof value === "string" && value.trim() ? value.trim() : void 0;
+const field = (value, key) => value && typeof value === "object" ? text(value[key]) : void 0;
+export function errorMessage(e, fallback) {
+  if (typeof e === "string") return text(e) ?? fallback;
+  if (!e || typeof e !== "object") return fallback;
+  const error = e;
+  return field(error.data, "message") ?? field(error.data, "statusMessage") ?? field(error.response?._data, "message") ?? text(error.statusMessage) ?? text(error.message) ?? fallback;
+}
+export function errorToToast(e, overrides = {}) {
+  const description = errorMessage(e, "");
+  return {
+    title: "Something went wrong.",
+    ...description ? { description } : {},
+    color: "error",
+    icon: "i-lucide-circle-alert",
+    ...overrides
+  };
+}

package/dist/runtime/utils/format.d.ts

@@ -0,0 +1,12 @@
+import type { DateValue } from '../types.js';
+/** "15 Oct 2026" */
+export declare function formatDate(value: DateValue | null | undefined, locale?: string, options?: Intl.DateTimeFormatOptions): string;
+/** "15 Oct 2026, 10:00" */
+export declare function formatDateTime(value: DateValue | null | undefined, locale?: string, options?: Intl.DateTimeFormatOptions): string;
+/** "10:00" */
+export declare function formatTime(value: DateValue | null | undefined, locale?: string, options?: Intl.DateTimeFormatOptions): string;
+/**
+ * "15–17 Oct 2026", collapsing the parts both ends share. Without `end` (or with an invalid one) it is
+ * `formatDate(start)`. Pass `{ dateStyle: 'medium', timeStyle: 'short' }` to include times.
+ */
+export declare function formatDateRange(start: DateValue | null | undefined, end: DateValue | null | undefined, locale?: string, options?: Intl.DateTimeFormatOptions): string;

package/dist/runtime/utils/format.js

@@ -0,0 +1,26 @@
+const asDate = (value) => {
+  if (value === null || value === void 0 || value === "") return void 0;
+  const date = value instanceof Date ? value : new Date(value);
+  return Number.isNaN(date.getTime()) ? void 0 : date;
+};
+const format = (value, locale, options) => {
+  const date = asDate(value);
+  return date ? new Intl.DateTimeFormat(locale, options).format(date) : "";
+};
+export function formatDate(value, locale, options = {}) {
+  return format(value, locale, { dateStyle: "medium", ...options });
+}
+export function formatDateTime(value, locale, options = {}) {
+  return format(value, locale, { dateStyle: "medium", timeStyle: "short", ...options });
+}
+export function formatTime(value, locale, options = {}) {
+  return format(value, locale, { timeStyle: "short", ...options });
+}
+export function formatDateRange(start, end, locale, options = {}) {
+  const from = asDate(start);
+  const to = asDate(end);
+  const resolved = { dateStyle: "medium", ...options };
+  if (!from) return to ? format(to, locale, resolved) : "";
+  if (!to || to.getTime() < from.getTime()) return format(from, locale, resolved);
+  return new Intl.DateTimeFormat(locale, resolved).formatRange(from, to);
+}

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

@@ -0,0 +1,6 @@
+export * from './errors.js';
+export * from './format.js';
+export * from './locale.js';
+export * from './status.js';
+export * from './surface.js';
+export * from './table.js';