@sewadah/selaras 0.1.1

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

@@ -0,0 +1,28 @@
+import type { TooltipThemeSlots } from '../theme/tooltip.js';
+import type { UiProp } from '../utils/ui.js';
+export interface TooltipProps {
+    text?: string;
+    side?: 'top' | 'right' | 'bottom' | 'left';
+    delayDuration?: number;
+    /** Keyboard shortcut hint shown alongside the text, e.g. `['⌘', 'K']` - each entry renders as its own small key badge. Takes the literal display strings, not semantic key names - there's no platform-specific symbol mapping. */
+    kbds?: string[];
+    /** Set `false` to hide the little pointer triangle. */
+    arrow?: boolean;
+    disabled?: boolean;
+    ui?: UiProp<TooltipThemeSlots>;
+}
+declare var __VLS_14: {}, __VLS_28: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_14) => any;
+} & {
+    content?: (props: typeof __VLS_28) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<TooltipProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<TooltipProps> & Readonly<{}>, {}, {}, {}, {}, 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/components/Tree.d.vue.ts

@@ -0,0 +1,64 @@
+import type { VariantProps } from 'tailwind-variants';
+import type { TreeThemeSlots } from '../theme/tree.js';
+import type { UiProp } from '../utils/ui.js';
+import { treeTheme } from '../theme/tree.js';
+type TreeVariants = VariantProps<typeof treeTheme>;
+export interface TreeItemType {
+    label: string;
+    value?: string;
+    icon?: string;
+    disabled?: boolean;
+    children?: TreeItemType[];
+    [key: string]: unknown;
+}
+type __VLS_Slots = TreeSlots;
+export interface TreeProps {
+    items: TreeItemType[];
+    modelValue?: TreeItemType | TreeItemType[];
+    defaultValue?: TreeItemType | TreeItemType[];
+    expanded?: string[];
+    defaultExpanded?: string[];
+    multiple?: boolean;
+    /** Shows a tri-state checkbox per row (reusing Checkbox.vue's own boolean|'indeterminate' model) - also turns on `multiple`/`propagateSelect`/`bubbleSelect` together, since checkbox mode's whole point is parent<->children selection propagation. */
+    checkbox?: boolean;
+    /** Selecting a parent also selects/deselects every one of its descendants. */
+    propagateSelect?: boolean;
+    /** Selecting all of a parent's children also selects the parent (and marks it indeterminate for a partial selection). */
+    bubbleSelect?: boolean;
+    disabled?: boolean;
+    /** @default item => item.value ?? item.label */
+    getKey?: (item: TreeItemType) => string;
+    /** @default item => item.children */
+    getChildren?: (item: TreeItemType) => TreeItemType[] | undefined;
+    size?: TreeVariants['size'];
+    ui?: UiProp<TreeThemeSlots>;
+}
+export interface TreeEmits {
+    'update:modelValue': [value: TreeItemType | TreeItemType[]];
+    'update:expanded': [value: string[]];
+}
+export interface TreeSlots {
+    /** Replaces a row's default icon+label content - scoped with the node itself plus its live expanded/selected/indeterminate state. */
+    item?: (props: {
+        item: TreeItemType;
+        level: number;
+        expanded: boolean;
+        selected: boolean;
+        indeterminate: boolean;
+    }) => any;
+}
+declare const __VLS_base: import("vue").DefineComponent<TreeProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: TreeItemType | TreeItemType[]) => any;
+    "update:expanded": (value: string[]) => any;
+}, string, import("vue").PublicProps, Readonly<TreeProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: TreeItemType | TreeItemType[]) => any) | undefined;
+    "onUpdate:expanded"?: ((value: string[]) => any) | undefined;
+}>, {}, {}, {}, {}, 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/components/Tree.vue

@@ -0,0 +1,139 @@
+<script setup>
+import { TreeItem, TreeRoot } from "reka-ui";
+import { computed, mergeProps, ref, watch } from "vue";
+import { useIcons } from "../composables/use-icons";
+import { treeTheme } from "../theme/tree";
+import { resolveSlot, useComponentTheme, useRootProps } from "../utils/ui";
+import Checkbox from "./Checkbox.vue";
+import Icon from "./Icon.vue";
+defineOptions({ inheritAttrs: false });
+const props = defineProps({
+  items: { type: Array, required: true },
+  modelValue: { type: [Object, Array], required: false },
+  defaultValue: { type: [Object, Array], required: false },
+  expanded: { type: Array, required: false },
+  defaultExpanded: { type: Array, required: false },
+  multiple: { type: Boolean, required: false },
+  checkbox: { type: Boolean, required: false },
+  propagateSelect: { type: Boolean, required: false },
+  bubbleSelect: { type: Boolean, required: false },
+  disabled: { type: Boolean, required: false },
+  getKey: { type: Function, required: false },
+  getChildren: { type: Function, required: false },
+  size: { type: null, required: false },
+  ui: { type: Object, required: false }
+});
+const emit = defineEmits(["update:modelValue", "update:expanded"]);
+defineSlots();
+const icons = useIcons();
+const getKey = props.getKey ?? ((item) => item.value ?? item.label);
+const getChildren = props.getChildren ?? ((item) => item.children);
+const isMultiple = computed(() => props.multiple || props.checkbox || false);
+const propagateSelect = computed(() => props.propagateSelect || props.checkbox || false);
+const bubbleSelect = computed(() => props.bubbleSelect || props.checkbox || false);
+const internalModelValue = ref(props.modelValue ?? props.defaultValue ?? (isMultiple.value ? [] : void 0));
+watch(() => props.modelValue, (value) => {
+  if (value !== void 0)
+    internalModelValue.value = value;
+});
+const internalExpanded = ref(props.expanded ?? props.defaultExpanded ?? []);
+watch(() => props.expanded, (value) => {
+  if (value !== void 0)
+    internalExpanded.value = value;
+});
+function onUpdateModelValue(value) {
+  internalModelValue.value = value;
+  emit("update:modelValue", value);
+}
+function onUpdateExpanded(value) {
+  internalExpanded.value = value;
+  emit("update:expanded", value);
+}
+const theme = useComponentTheme("tree", treeTheme);
+const ui = computed(() => theme.value({ size: props.size }));
+const rootProps = useRootProps(() => ui.value.root, () => props.ui?.root);
+const itemProps = computed(() => resolveSlot(ui.value.item, props.ui?.item));
+const toggleProps = computed(() => resolveSlot(ui.value.toggle, props.ui?.toggle));
+const spacerProps = computed(() => resolveSlot(ui.value.spacer, props.ui?.spacer));
+const checkboxProps = computed(() => resolveSlot(ui.value.checkbox, props.ui?.checkbox));
+const iconProps = computed(() => resolveSlot(ui.value.icon, props.ui?.icon));
+const labelProps = computed(() => resolveSlot(ui.value.label, props.ui?.label));
+function indentStyle(level) {
+  return { paddingInlineStart: `${(level - 1) * 1.25}rem` };
+}
+function treeItemProps(entry, level) {
+  return mergeProps(entry.bind, itemProps.value, { style: indentStyle(level) });
+}
+</script>
+
+<template>
+  <TreeRoot
+    :items="items"
+    :get-key="getKey"
+    :get-children="getChildren"
+    :model-value="internalModelValue"
+    :expanded="internalExpanded"
+    :multiple="isMultiple"
+    :propagate-select="propagateSelect"
+    :bubble-select="bubbleSelect"
+    :disabled="disabled"
+    v-bind="rootProps"
+    @update:model-value="onUpdateModelValue"
+    @update:expanded="onUpdateExpanded"
+  >
+    <template #default="{ flattenItems }">
+      <TreeItem
+        v-for="entry in flattenItems"
+        :key="entry._id"
+        v-slot="{ isExpanded, isSelected, isIndeterminate }"
+        :disabled="entry.value.disabled"
+        v-bind="treeItemProps(entry, entry.level)"
+      >
+        <Icon
+          v-if="entry.hasChildren"
+          :name="icons.chevronRight"
+          :data-expanded="isExpanded ? '' : void 0"
+          v-bind="toggleProps"
+        />
+        <span v-else v-bind="spacerProps" />
+
+        <!--
+            A read-only echo of TreeItem's own isSelected/isIndeterminate,
+            not a second control of its own - the row itself (TreeItem's
+            own rendered root, already the roving-tabindex/click target
+            via Reka) is the one real way to select. pointer-events-none
+            makes a real mouse click pass through to that row instead of
+            toggling the checkbox in place; Checkbox.vue has no prop of
+            its own to also pull its inner CheckboxRoot out of tab order
+            (a real, if minor, gap - out of scope to add here), so it
+            stays independently focusable via keyboard. Harmless if
+            reached that way: modelValue is always a concrete value
+            (never left undefined), so Reka's own controlled-mode getter
+            keeps reading it straight from this prop regardless of what
+            the inner control tries to toggle locally - nothing to
+            observably desync.
+          -->
+        <Checkbox
+          v-if="checkbox"
+          :model-value="isIndeterminate ? 'indeterminate' : isSelected"
+          v-bind="checkboxProps"
+        />
+
+        <Icon v-if="entry.value.icon" :name="entry.value.icon" v-bind="iconProps" />
+
+        <span v-bind="labelProps">
+          <slot
+            name="item"
+            :item="entry.value"
+            :level="entry.level"
+            :expanded="isExpanded"
+            :selected="isSelected"
+            :indeterminate="isIndeterminate ?? false"
+          >
+            {{ entry.value.label }}
+          </slot>
+        </span>
+      </TreeItem>
+    </template>
+  </TreeRoot>
+</template>

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

@@ -0,0 +1,64 @@
+import type { VariantProps } from 'tailwind-variants';
+import type { TreeThemeSlots } from '../theme/tree.js';
+import type { UiProp } from '../utils/ui.js';
+import { treeTheme } from '../theme/tree.js';
+type TreeVariants = VariantProps<typeof treeTheme>;
+export interface TreeItemType {
+    label: string;
+    value?: string;
+    icon?: string;
+    disabled?: boolean;
+    children?: TreeItemType[];
+    [key: string]: unknown;
+}
+type __VLS_Slots = TreeSlots;
+export interface TreeProps {
+    items: TreeItemType[];
+    modelValue?: TreeItemType | TreeItemType[];
+    defaultValue?: TreeItemType | TreeItemType[];
+    expanded?: string[];
+    defaultExpanded?: string[];
+    multiple?: boolean;
+    /** Shows a tri-state checkbox per row (reusing Checkbox.vue's own boolean|'indeterminate' model) - also turns on `multiple`/`propagateSelect`/`bubbleSelect` together, since checkbox mode's whole point is parent<->children selection propagation. */
+    checkbox?: boolean;
+    /** Selecting a parent also selects/deselects every one of its descendants. */
+    propagateSelect?: boolean;
+    /** Selecting all of a parent's children also selects the parent (and marks it indeterminate for a partial selection). */
+    bubbleSelect?: boolean;
+    disabled?: boolean;
+    /** @default item => item.value ?? item.label */
+    getKey?: (item: TreeItemType) => string;
+    /** @default item => item.children */
+    getChildren?: (item: TreeItemType) => TreeItemType[] | undefined;
+    size?: TreeVariants['size'];
+    ui?: UiProp<TreeThemeSlots>;
+}
+export interface TreeEmits {
+    'update:modelValue': [value: TreeItemType | TreeItemType[]];
+    'update:expanded': [value: string[]];
+}
+export interface TreeSlots {
+    /** Replaces a row's default icon+label content - scoped with the node itself plus its live expanded/selected/indeterminate state. */
+    item?: (props: {
+        item: TreeItemType;
+        level: number;
+        expanded: boolean;
+        selected: boolean;
+        indeterminate: boolean;
+    }) => any;
+}
+declare const __VLS_base: import("vue").DefineComponent<TreeProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: TreeItemType | TreeItemType[]) => any;
+    "update:expanded": (value: string[]) => any;
+}, string, import("vue").PublicProps, Readonly<TreeProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: TreeItemType | TreeItemType[]) => any) | undefined;
+    "onUpdate:expanded"?: ((value: string[]) => any) | undefined;
+}>, {}, {}, {}, {}, 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/use-combobox-select.d.ts

@@ -0,0 +1,45 @@
+import type { ComputedRef } from 'vue';
+export interface SelectOption {
+    [key: string]: unknown;
+    disabled?: boolean;
+}
+export interface SelectOptionGroup {
+    label: string;
+    items: SelectOption[];
+}
+export type SelectItems = (SelectOption | SelectOptionGroup)[];
+export declare function isOptionGroup(entry: SelectOption | SelectOptionGroup): entry is SelectOptionGroup;
+/** Flattens groups into a plain option list - groups lose their header when virtualized. */
+export declare function flattenItems(items: SelectItems): SelectOption[];
+interface SelectLikeProps {
+    items: SelectItems;
+    valueKey?: string;
+    labelKey?: string;
+    modelValue?: string | string[];
+    multiple?: boolean;
+    displayMode?: 'comma' | 'chip';
+    maxChips?: number;
+}
+export interface ResolvedOption {
+    value: string;
+    label: string;
+    disabled: boolean;
+    raw: SelectOption;
+}
+export declare function useComboboxSelect(props: SelectLikeProps, emit: (event: 'update:modelValue', value: string | string[] | undefined) => void, { creatable }?: {
+    creatable?: boolean;
+}): {
+    flatOptions: ComputedRef<ResolvedOption[]>;
+    selectedValues: ComputedRef<string[]>;
+    selectedOptions: ComputedRef<ResolvedOption[]>;
+    visibleOptions: ComputedRef<ResolvedOption[]>;
+    overflowOptions: ComputedRef<ResolvedOption[]>;
+    commaText: ComputedRef<string>;
+    resolveOption: (value: string) => ResolvedOption;
+    toOption: (raw: SelectOption) => ResolvedOption;
+    setValue: (value: string | string[] | undefined) => void;
+    removeValue: (value: string) => void;
+    hasMatchingOption: (text: string) => boolean;
+    commitCreatableText: (rawText: string) => boolean;
+};
+export {};

package/dist/runtime/composables/use-combobox-select.js

@@ -0,0 +1,80 @@
+import { computed } from "vue";
+export function isOptionGroup(entry) {
+  return "items" in entry && Array.isArray(entry.items);
+}
+export function flattenItems(items) {
+  return items.flatMap((entry) => isOptionGroup(entry) ? entry.items : [entry]);
+}
+export function useComboboxSelect(props, emit, { creatable = false } = {}) {
+  const valueKey = computed(() => props.valueKey ?? "value");
+  const labelKey = computed(() => props.labelKey ?? "label");
+  const flatOptions = computed(() => flattenItems(props.items).map((raw) => ({
+    value: String(raw[valueKey.value] ?? ""),
+    label: String(raw[labelKey.value] ?? raw[valueKey.value] ?? ""),
+    disabled: !!raw.disabled,
+    raw
+  })));
+  const selectedValues = computed(() => {
+    const v = props.modelValue;
+    if (v === void 0)
+      return [];
+    return Array.isArray(v) ? v : [v];
+  });
+  function resolveOption(value) {
+    return flatOptions.value.find((o) => o.value === value) ?? { value, label: value, disabled: false, raw: { [valueKey.value]: value, [labelKey.value]: value } };
+  }
+  function toOption(raw) {
+    return {
+      value: String(raw[valueKey.value] ?? ""),
+      label: String(raw[labelKey.value] ?? raw[valueKey.value] ?? ""),
+      disabled: !!raw.disabled,
+      raw
+    };
+  }
+  const selectedOptions = computed(() => selectedValues.value.map(resolveOption));
+  const maxChips = computed(() => props.maxChips ?? 3);
+  const visibleOptions = computed(() => selectedOptions.value.slice(0, maxChips.value));
+  const overflowOptions = computed(() => selectedOptions.value.slice(maxChips.value));
+  const commaText = computed(() => visibleOptions.value.map((o) => o.label).join(", "));
+  function setValue(value) {
+    emit("update:modelValue", value);
+  }
+  function removeValue(value) {
+    if (!props.multiple) {
+      setValue(void 0);
+      return;
+    }
+    setValue(selectedValues.value.filter((v) => v !== value));
+  }
+  function hasMatchingOption(text) {
+    const lower = text.toLowerCase();
+    return flatOptions.value.some((o) => o.value.toLowerCase().includes(lower) || o.label.toLowerCase().includes(lower));
+  }
+  function commitCreatableText(rawText) {
+    const text = rawText.trim();
+    if (!creatable || !text || hasMatchingOption(text))
+      return false;
+    if (props.multiple) {
+      if (selectedValues.value.some((v) => v.toLowerCase() === text.toLowerCase()))
+        return false;
+      setValue([...selectedValues.value, text]);
+    } else {
+      setValue(text);
+    }
+    return true;
+  }
+  return {
+    flatOptions,
+    selectedValues,
+    selectedOptions,
+    visibleOptions,
+    overflowOptions,
+    commaText,
+    resolveOption,
+    toOption,
+    setValue,
+    removeValue,
+    hasMatchingOption,
+    commitCreatableText
+  };
+}

package/dist/runtime/composables/use-command-palette.d.ts

@@ -0,0 +1,8 @@
+import type { Ref } from 'vue';
+export interface UseCommandPaletteReturn {
+    isOpen: Ref<boolean>;
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+}
+export declare function useCommandPalette(): UseCommandPaletteReturn;

package/dist/runtime/composables/use-command-palette.js

@@ -0,0 +1,14 @@
+import { useState } from "#imports";
+export function useCommandPalette() {
+  const isOpen = useState("selaras-command-palette-open", () => false);
+  function open() {
+    isOpen.value = true;
+  }
+  function close() {
+    isOpen.value = false;
+  }
+  function toggle() {
+    isOpen.value = !isOpen.value;
+  }
+  return { isOpen, open, close, toggle };
+}

package/dist/runtime/composables/use-drawer.d.ts

@@ -0,0 +1,42 @@
+import type { Component, Ref } from 'vue';
+export interface DrawerInstance {
+    id: number;
+    component: Component;
+    props: Record<string, unknown>;
+    isOpen: boolean;
+    title?: string;
+    description?: string;
+    side?: 'top' | 'right' | 'bottom' | 'left';
+    handle?: boolean;
+    snapPoints?: (number | string)[];
+    snapPoint?: number | string | null;
+    snapToSequentialPoints?: boolean;
+    dismissible?: boolean;
+    modal?: boolean | 'trap-focus';
+    overlay?: boolean;
+    transition?: boolean;
+    resolve: (value: unknown) => void;
+}
+export interface UseDrawerOpenOptions {
+    props?: Record<string, unknown>;
+    /** Registered with Reka as the drawer's accessible name, visually hidden - the opened component still supplies its own visible header via the content slot. */
+    title?: string;
+    /** Registered with Reka as the drawer's accessible description, visually hidden. */
+    description?: string;
+    side?: 'top' | 'right' | 'bottom' | 'left';
+    handle?: boolean;
+    snapPoints?: (number | string)[];
+    snapPoint?: number | string | null;
+    snapToSequentialPoints?: boolean;
+    dismissible?: boolean;
+    modal?: boolean | 'trap-focus';
+    overlay?: boolean;
+    transition?: boolean;
+}
+export interface UseDrawerReturn {
+    drawers: Ref<DrawerInstance[]>;
+    open: <T = void>(component: Component, options?: UseDrawerOpenOptions) => Promise<T | undefined>;
+    close: (id: number, value?: unknown) => void;
+    remove: (id: number) => void;
+}
+export declare function useDrawer(): UseDrawerReturn;

package/dist/runtime/composables/use-drawer.js

@@ -0,0 +1,44 @@
+import { markRaw, ref } from "vue";
+const drawers = ref([]);
+let counter = 0;
+export function useDrawer() {
+  function open(component, options) {
+    return new Promise((resolve) => {
+      drawers.value.push({
+        id: counter++,
+        // Vue components are meant to stay an opaque, non-reactive value -
+        // without this, pushing one into this reactive array wraps it in
+        // a reactive proxy too, which Vue's own dev warning flags as
+        // wasted overhead for no benefit.
+        component: markRaw(component),
+        props: options?.props ?? {},
+        isOpen: true,
+        title: options?.title,
+        description: options?.description,
+        side: options?.side,
+        handle: options?.handle,
+        snapPoints: options?.snapPoints,
+        snapPoint: options?.snapPoint,
+        snapToSequentialPoints: options?.snapToSequentialPoints,
+        dismissible: options?.dismissible,
+        modal: options?.modal,
+        overlay: options?.overlay,
+        transition: options?.transition,
+        resolve
+      });
+    });
+  }
+  function close(id, value) {
+    const instance = drawers.value.find((d) => d.id === id);
+    if (!instance)
+      return;
+    instance.isOpen = false;
+    instance.resolve(value);
+  }
+  function remove(id) {
+    const index = drawers.value.findIndex((d) => d.id === id);
+    if (index !== -1)
+      drawers.value.splice(index, 1);
+  }
+  return { drawers, open, close, remove };
+}

package/dist/runtime/composables/use-form-field.d.ts

@@ -0,0 +1,10 @@
+import type { ComputedRef } from 'vue';
+export interface FormFieldContext {
+    id: string;
+    name?: string;
+    size?: 'sm' | 'md' | 'lg';
+    invalid: ComputedRef<boolean>;
+    describedBy: ComputedRef<string | undefined>;
+}
+export declare function provideFormField(context: FormFieldContext): void;
+export declare function useFormField(): FormFieldContext | undefined;

package/dist/runtime/composables/use-form-field.js

@@ -0,0 +1,8 @@
+import { inject, provide } from "vue";
+const formFieldInjectionKey = Symbol("selaras-form-field");
+export function provideFormField(context) {
+  provide(formFieldInjectionKey, context);
+}
+export function useFormField() {
+  return inject(formFieldInjectionKey, void 0);
+}

package/dist/runtime/composables/use-icons.d.ts

@@ -0,0 +1,10 @@
+import type { ComputedRef } from 'vue';
+import type { IconRegistry } from '../utils/icons.js';
+/**
+ * Merges a consumer's app.config.icons override onto the default (Hugeicons)
+ * registry - mirrors useComponentTheme's app.config.ui.<key> merge (see
+ * ../utils/ui.ts), just for icon name strings instead of tv() themes, so a
+ * single semantic key (e.g. close) can be overridden once for every
+ * component that uses it rather than per component.
+ */
+export declare function useIcons(): ComputedRef<IconRegistry>;

package/dist/runtime/composables/use-icons.js

@@ -0,0 +1,7 @@
+import { computed } from "vue";
+import { useAppConfig } from "#imports";
+import { defaultIcons } from "../utils/icons.js";
+export function useIcons() {
+  const appConfig = useAppConfig();
+  return computed(() => ({ ...defaultIcons, ...appConfig.icons }));
+}

package/dist/runtime/composables/use-locale.d.ts

@@ -0,0 +1,12 @@
+import type { ComputedRef } from 'vue';
+/**
+ * The app-wide default BCP-47 locale code, overridable via
+ * `app.config.locale` - mirrors useIcons()/useMessages()'s own
+ * app.config.<key> merge (see use-icons.ts), just for a single string
+ * instead of a registry. DatePicker/InputNumber/TimeStepper each read
+ * this as their own `locale` prop's fallback instead of hardcoding
+ * 'en-US' independently, so a consumer sets the locale once instead of
+ * repeating it on every instance - an explicit per-instance `locale`
+ * prop still overrides this.
+ */
+export declare function useLocale(): ComputedRef<string>;

package/dist/runtime/composables/use-locale.js

@@ -0,0 +1,6 @@
+import { computed } from "vue";
+import { useAppConfig } from "#imports";
+export function useLocale() {
+  const appConfig = useAppConfig();
+  return computed(() => appConfig.locale ?? "en-US");
+}

package/dist/runtime/composables/use-media-query.d.ts

@@ -0,0 +1,11 @@
+import type { Ref } from 'vue';
+/**
+ * Whether the viewport is currently at or below `breakpoint` px wide.
+ * Defaults to `false` on SSR/first render (no `window` there) - corrected
+ * once mounted, the same "safer default, corrected client-side" precedent
+ * DashboardGroup's own inline version of this (and ReadMore's `truncated`
+ * default) already use. Tracks a `matchMedia` `change` listener rather
+ * than a one-off check, so a live resize across the breakpoint updates
+ * reactively instead of only being read once at mount.
+ */
+export declare function useIsMobile(breakpoint?: number): Ref<boolean>;

package/dist/runtime/composables/use-media-query.js

@@ -0,0 +1,15 @@
+import { onMounted, onUnmounted, ref } from "vue";
+export function useIsMobile(breakpoint = 768) {
+  const isMobile = ref(false);
+  let mediaQuery;
+  function update() {
+    isMobile.value = mediaQuery?.matches ?? false;
+  }
+  onMounted(() => {
+    mediaQuery = window.matchMedia(`(max-width: ${breakpoint - 1}px)`);
+    update();
+    mediaQuery.addEventListener("change", update);
+  });
+  onUnmounted(() => mediaQuery?.removeEventListener("change", update));
+  return isMobile;
+}

package/dist/runtime/composables/use-messages.d.ts

@@ -0,0 +1,12 @@
+import type { ComputedRef } from 'vue';
+import type { MessageRegistry } from '../utils/messages.js';
+/**
+ * Merges a consumer's app.config.messages override onto the default
+ * (English) registry - mirrors useIcons' own app.config.icons merge (see
+ * use-icons.ts), just for UI copy instead of icon names. This is where a
+ * consuming app wires up real translation: override every key with
+ * locale-aware text (or functions, for the interpolated ones), typically
+ * computed from whatever i18n library the app itself already uses -
+ * this library doesn't ship one itself, just the override surface.
+ */
+export declare function useMessages(): ComputedRef<MessageRegistry>;

package/dist/runtime/composables/use-messages.js

@@ -0,0 +1,7 @@
+import { computed } from "vue";
+import { useAppConfig } from "#imports";
+import { defaultMessages } from "../utils/messages.js";
+export function useMessages() {
+  const appConfig = useAppConfig();
+  return computed(() => ({ ...defaultMessages, ...appConfig.messages }));
+}