@xleddyl/443-components-vue 0.3.0 → 0.4.0

package/dist/components/templates/ListPage.vue

@@ -230,7 +230,7 @@ defineSlots();
 const page = defineModel("page", { type: Number, ...{ default: 1 } });
 const pageSize = defineModel("pageSize", { type: Number, ...{ default: 20 } });
 const search = defineModel("search", { type: String, ...{ default: "" } });
-const filter = defineModel("filter", { type: [String, Number, Array, null], ...{ default: null } });
+const filter = defineModel("filter", { type: null, ...{ default: null } });
 const sort = defineModel("sort", { type: [Object, null], ...{ default: null } });
 const selected = defineModel("selected", { type: Array, ...{ default: () => [] } });
 const slots = useSlots();

package/dist/components/templates/ListPage.vue.d.ts

@@ -45,7 +45,7 @@ declare const __VLS_export: <T extends object>(__VLS_props: NonNullable<Awaited<
         page?: number;
         pageSize?: number;
         search?: string;
-        filter?: (string | number) | (string | number)[] | null;
+        filter?: import("../data/types").FilterPillValue | import("../data/types").FilterPillValue[] | null;
         sort?: TableSort | null;
         selected?: RowKey[];
     }) & {
@@ -57,7 +57,7 @@ declare const __VLS_export: <T extends object>(__VLS_props: NonNullable<Awaited<
         "onUpdate:sort"?: ((value: TableSort | null) => any) | undefined;
         "onUpdate:selected"?: ((value: RowKey[]) => any) | undefined;
         "onUpdate:search"?: ((value: string) => any) | undefined;
-        "onUpdate:filter"?: ((value: string | number | (string | number)[] | null) => any) | undefined;
+        "onUpdate:filter"?: ((value: import("../data/types").FilterPillValue | import("../data/types").FilterPillValue[] | null) => any) | undefined;
     } & Partial<import("vue").HTMLAttributes & import("vue").ReservedProps>> & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;
     } ? P : {});
@@ -100,7 +100,7 @@ declare const __VLS_export: <T extends object>(__VLS_props: NonNullable<Awaited<
             retry: () => void;
         }) => unknown;
     };
-    emit: (((evt: "clear") => void) & ((evt: "retry") => void) & ((evt: "rowClick", row: T, index: number, event: MouseEvent) => void)) & (((event: "update:page", value: number) => void) & ((event: "update:pageSize", value: number) => void) & ((event: "update:sort", value: TableSort | null) => void) & ((event: "update:selected", value: RowKey[]) => void) & ((event: "update:search", value: string) => void) & ((event: "update:filter", value: string | number | (string | number)[] | null) => void));
+    emit: (((evt: "clear") => void) & ((evt: "retry") => void) & ((evt: "rowClick", row: T, index: number, event: MouseEvent) => void)) & (((event: "update:page", value: number) => void) & ((event: "update:pageSize", value: number) => void) & ((event: "update:sort", value: TableSort | null) => void) & ((event: "update:selected", value: RowKey[]) => void) & ((event: "update:search", value: string) => void) & ((event: "update:filter", value: import("../data/types").FilterPillValue | import("../data/types").FilterPillValue[] | null) => void));
 }>) => import("vue").VNode & {
     __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
 };

package/dist/components/templates/types.d.ts

@@ -2,7 +2,7 @@ import type { Component } from 'vue';
 import type { LinkTarget, Tone } from '../core/types';
 import type { DescriptionItem, StatTrend } from '../data/types';
 import type { BreadcrumbItem, NavItem, NavSection } from '../layout/types';
-import type { CommandGroup, MenuItems } from '../overlays/types';
+import type { CommandEmptyText, CommandGroup, MenuItems } from '../overlays/types';
 import type { ThemePreset } from '../../internal/core/preset-data';
 export type DashboardVariant = 'inset' | 'sidebar' | 'floating';
 export type ThemeSwitchPlacement = 'topbar' | 'sidebar' | false;
@@ -43,8 +43,8 @@ export interface DashboardBrand {
     logo?: string;
     to?: LinkTarget;
 }
-export type DashboardSearchFunction = (query: string, signal: AbortSignal) => CommandGroup[] | Promise<CommandGroup[]>;
-export type DashboardSearch = boolean | CommandGroup[] | DashboardSearchFunction;
+export type DashboardSearchFunction<T = unknown> = (query: string, signal: AbortSignal) => CommandGroup<T>[] | Promise<CommandGroup<T>[]>;
+export type DashboardSearch<T = unknown> = boolean | CommandGroup<T>[] | DashboardSearchFunction<T>;
 export interface DashboardSearchProps {
     label?: string;
     placeholder?: string;
@@ -55,7 +55,7 @@ export interface DashboardSearchProps {
     recentKey?: string;
     recentLimit?: number;
     recentLabel?: string;
-    emptyText?: string;
+    emptyText?: CommandEmptyText;
     minQueryText?: string;
     errorText?: string;
     loadingText?: string;

package/dist/composables/useField.d.ts

@@ -8,7 +8,9 @@ export interface FieldContext {
     required: ComputedRef<boolean>;
     disabled: ComputedRef<boolean>;
     setControlError: (message: string | undefined, source?: object) => void;
+    setLabelable?: (labelable: boolean | undefined, source: object) => void;
 }
+export type FieldControlRole = 'primary' | 'auxiliary';
 export declare function useField(): FieldContext | null;
 export interface FieldControlOptions {
     id?: MaybeRefOrGetter<string | undefined>;
@@ -16,9 +18,11 @@ export interface FieldControlOptions {
     required?: MaybeRefOrGetter<boolean | undefined>;
     disabled?: MaybeRefOrGetter<boolean | undefined>;
     describedBy?: MaybeRefOrGetter<string | undefined>;
+    role?: MaybeRefOrGetter<FieldControlRole | undefined>;
+    labelable?: MaybeRefOrGetter<boolean | undefined>;
 }
 export declare function useFieldControl(options?: FieldControlOptions): {
-    field: FieldContext | null;
+    readonly field: FieldContext | null;
     id: ComputedRef<string | undefined>;
     invalid: ComputedRef<boolean>;
     required: ComputedRef<boolean>;
@@ -32,5 +36,6 @@ export declare function useFieldControl(options?: FieldControlOptions): {
         'aria-required': "true" | undefined;
         disabled: true | undefined;
     }>;
+    auxiliary: ComputedRef<boolean>;
     setControlError: (message: string | undefined) => void | undefined;
 };

package/dist/composables/useField.mjs

@@ -1,28 +1,56 @@
-import { computed, getCurrentScope, inject, onScopeDispose, toValue } from "vue";
-import { FIELD_KEY } from "../internal/keys.mjs";
+import { computed, getCurrentScope, inject, onScopeDispose, toValue, watch } from "vue";
+import { FIELD_KEY, FIELD_ROLE_KEY } from "../internal/keys.mjs";
 export function useField() {
   return inject(FIELD_KEY, null);
 }
 export function useFieldControl(options = {}) {
-  const field = useField();
-  const id = computed(() => toValue(options.id) ?? field?.id);
-  const invalid = computed(() => Boolean(toValue(options.invalid) ?? field?.invalid.value));
-  const required = computed(() => Boolean(toValue(options.required) || field?.required.value));
-  const disabled = computed(() => Boolean(toValue(options.disabled) || field?.disabled.value));
+  const parent = useField();
+  const inheritedRole = inject(FIELD_ROLE_KEY, "primary");
+  const auxiliary = computed(() => (toValue(options.role) ?? inheritedRole) === "auxiliary");
+  const field = computed(() => auxiliary.value ? null : parent);
+  const id = computed(() => toValue(options.id) ?? field.value?.id);
+  const invalid = computed(() => Boolean(toValue(options.invalid) ?? field.value?.invalid.value));
+  const required = computed(
+    () => Boolean(toValue(options.required) || field.value?.required.value)
+  );
+  const disabled = computed(() => Boolean(toValue(options.disabled) || parent?.disabled.value));
   const describedBy = computed(() => {
-    const ids = [toValue(options.describedBy), field?.describedBy.value].filter(Boolean);
+    const ids = [toValue(options.describedBy), field.value?.describedBy.value].filter(Boolean);
     return ids.length ? ids.join(" ") : void 0;
   });
   const attrs = computed(() => ({
     id: id.value,
-    name: field?.name.value,
+    name: field.value?.name.value,
     "aria-invalid": invalid.value ? "true" : void 0,
     "aria-describedby": describedBy.value,
     "aria-required": required.value ? "true" : void 0,
     disabled: disabled.value || void 0
   }));
   const source = {};
-  const setControlError = (message) => field?.setControlError(message || void 0, source);
-  if (field && getCurrentScope()) onScopeDispose(() => field.setControlError(void 0, source));
-  return { field, id, invalid, required, disabled, describedBy, attrs, setControlError };
+  const setControlError = (message) => parent?.setControlError(message || void 0, source);
+  if (parent && getCurrentScope()) {
+    if (parent.setLabelable && options.labelable !== void 0)
+      watch(
+        () => auxiliary.value ? void 0 : toValue(options.labelable),
+        (labelable) => parent.setLabelable?.(labelable, source),
+        { immediate: true }
+      );
+    onScopeDispose(() => {
+      parent.setControlError(void 0, source);
+      parent.setLabelable?.(void 0, source);
+    });
+  }
+  return {
+    get field() {
+      return field.value;
+    },
+    id,
+    invalid,
+    required,
+    disabled,
+    describedBy,
+    attrs,
+    auxiliary,
+    setControlError
+  };
 }

package/dist/composables/useFieldBoundary.d.ts

@@ -1 +1,2 @@
 export declare function provideFieldBoundary(): void;
+export declare function provideAuxiliaryControls(): void;

package/dist/composables/useFieldBoundary.mjs

@@ -1,5 +1,9 @@
 import { provide } from "vue";
-import { FIELD_KEY } from "../internal/keys.mjs";
+import { FIELD_KEY, FIELD_ROLE_KEY } from "../internal/keys.mjs";
 export function provideFieldBoundary() {
   provide(FIELD_KEY, null);
+  provide(FIELD_ROLE_KEY, "primary");
+}
+export function provideAuxiliaryControls() {
+  provide(FIELD_ROLE_KEY, "auxiliary");
 }

package/dist/composables/useFileDrop.d.ts

@@ -8,7 +8,20 @@ export interface DroppedFile {
     file: File;
     path: string;
 }
-export declare function readDroppedFiles(transfer: DataTransfer | null | undefined): Promise<DroppedFile[]>;
+export interface DroppedTree {
+    files: DroppedFile[];
+    directories: string[];
+}
+export interface ReadDroppedFilesOptions {
+    directories?: boolean;
+    skipHidden?: boolean;
+}
+export declare function readDroppedFiles(transfer: DataTransfer | null | undefined, options: ReadDroppedFilesOptions & {
+    directories: true;
+}): Promise<DroppedTree>;
+export declare function readDroppedFiles(transfer: DataTransfer | null | undefined, options?: ReadDroppedFilesOptions & {
+    directories?: false;
+}): Promise<DroppedFile[]>;
 export declare function useFileDrop(target: MaybeRefOrGetter<HTMLElement | null | undefined>, options: UseFileDropOptions): {
     over: import("vue").Ref<boolean, boolean>;
     reset: () => void;

package/dist/composables/useFileDrop.mjs

@@ -1,4 +1,5 @@
 import { onScopeDispose, ref, toValue, watch } from "vue";
+import { filesTree, isHiddenName } from "../internal/forms/files.mjs";
 const claimedEvents = /* @__PURE__ */ new WeakSet();
 function carriesFiles(event) {
   return Array.from(event.dataTransfer?.types ?? []).includes("Files");
@@ -9,17 +10,20 @@ function readFileEntry(entry) {
 function readDirectoryBatch(reader) {
   return new Promise((resolve, reject) => reader.readEntries(resolve, reject));
 }
-async function walkEntry(entry, prefix, result) {
+async function walkEntry(entry, prefix, tree, skipHidden) {
+  if (skipHidden && isHiddenName(entry.name)) return;
+  const path = `${prefix}${entry.name}`;
   if (entry.isFile) {
     try {
       const file = await readFileEntry(entry);
-      result.push({ file, path: `${prefix}${entry.name}` });
+      tree.files.push({ file, path });
     } catch {
       return;
     }
     return;
   }
   if (!entry.isDirectory) return;
+  tree.directories.push(path);
   const reader = entry.createReader();
   const children = [];
   for (; ; ) {
@@ -32,10 +36,10 @@ async function walkEntry(entry, prefix, result) {
     if (!batch.length) break;
     children.push(...batch);
   }
-  for (const child of children) await walkEntry(child, `${prefix}${entry.name}/`, result);
+  for (const child of children) await walkEntry(child, `${path}/`, tree, skipHidden);
 }
-export function readDroppedFiles(transfer) {
-  if (!transfer) return Promise.resolve([]);
+async function readDroppedTree(transfer, skipHidden) {
+  if (!transfer) return { files: [], directories: [] };
   const pending = [];
   for (const item of Array.from(transfer.items ?? [])) {
     if (item.kind !== "file") continue;
@@ -44,21 +48,18 @@ export function readDroppedFiles(transfer) {
     if (entry) pending.push(entry);
     else if (fallback) pending.push(fallback);
   }
-  if (!pending.length)
-    return Promise.resolve(
-      Array.from(transfer.files ?? []).map((file) => ({
-        file,
-        path: file.webkitRelativePath || file.name
-      }))
-    );
-  return (async () => {
-    const result = [];
-    for (const entry of pending) {
-      if (entry instanceof File) result.push({ file: entry, path: entry.name });
-      else await walkEntry(entry, "", result);
-    }
-    return result;
-  })();
+  if (!pending.length) return filesTree(Array.from(transfer.files ?? []), { skipHidden });
+  const tree = { files: [], directories: [] };
+  for (const entry of pending) {
+    if (!(entry instanceof File)) await walkEntry(entry, "", tree, skipHidden);
+    else if (!skipHidden || !isHiddenName(entry.name))
+      tree.files.push({ file: entry, path: entry.name });
+  }
+  return tree;
+}
+export async function readDroppedFiles(transfer, options = {}) {
+  const tree = await readDroppedTree(transfer, Boolean(options.skipHidden));
+  return options.directories ? tree : tree.files;
 }
 export function useFileDrop(target, options) {
   const over = ref(false);

package/dist/composables/useForm.d.ts

@@ -58,6 +58,8 @@ export type FormErrors<S extends FormSchema = FormSchema> = Partial<Record<keyof
 export interface FormContext {
     errors: Readonly<FormMessageMap>;
     warnings?: Readonly<FormMessageMap>;
+    rootErrors?: Readonly<Ref<readonly string[]>>;
+    rootWarnings?: Readonly<Ref<readonly string[]>>;
     submitCount: Readonly<Ref<number>>;
     submitting: Readonly<Ref<boolean>>;
     touch: (name: string) => void;
@@ -80,6 +82,7 @@ export interface UseFormReturn<S extends FormSchema = FormSchema, V extends obje
     submitting: Ref<boolean>;
     isDirty: (name: keyof V & string) => boolean;
     validate: () => Promise<boolean>;
+    validateSync: () => boolean;
     validateField: (name: keyof V & string) => Promise<boolean>;
     setError: (name: FormPath<V>, message: string | undefined) => void;
     setErrors: (errors: FormErrors<S>) => void;
@@ -91,3 +94,4 @@ export interface UseFormReturn<S extends FormSchema = FormSchema, V extends obje
 export declare function isEmptyValue(value: unknown): boolean;
 export declare function useForm<S extends FormSchema = FormSchema, V extends object = FormValues<S>>(options: UseFormOptions<S, V>): UseFormReturn<S, V>;
 export declare function useFormContext(): FormContext | null;
+export declare function provideForm(form: FormContext): FormContext;

package/dist/composables/useForm.mjs

@@ -2,6 +2,7 @@ import {
   computed,
   inject,
   isRef,
+  provide,
   reactive,
   readonly,
   ref,
@@ -15,7 +16,6 @@ import {
   groupIssues,
   isStandardSchema,
   keyPath,
-  runStandardSchema,
   schemaIssues
 } from "../internal/forms/standard-schema.mjs";
 import { FORM_KEY } from "../internal/keys.mjs";
@@ -79,6 +79,9 @@ function settle(value, apply) {
   if (isThenable(value)) void value.then(apply);
   else apply(value);
 }
+function chain(value, next) {
+  return isThenable(value) ? value.then(next) : next(value);
+}
 function isWithin(key, name) {
   return key === name || key.startsWith(`${name}.`);
 }
@@ -145,13 +148,18 @@ export function useForm(options) {
     replaceEntries(errors, composeErrors(), inScope);
     if (!inScope) rootErrors.value = uniqueMessages(manualRoot, issueRoot);
   }
-  async function runValidator() {
+  function evaluateValidator() {
     const validator = toValue(options.validator);
     if (!validator) return groupIssues([]);
-    const issues = await runStandardSchema(validator, cloneValue(target()));
-    return groupIssues(schemaIssues(issues), issueKey);
+    return chain(
+      validator["~standard"].validate(cloneValue(target())),
+      (result) => groupIssues(schemaIssues(result.issues ?? []), issueKey)
+    );
   }
-  async function runRules(name) {
+  async function runValidator() {
+    return evaluateValidator();
+  }
+  function evaluateRules(name) {
     const definition = schema[name];
     if (!definition) return void 0;
     const value = readValue(name);
@@ -185,16 +193,22 @@ export function useForm(options) {
         if (!definition.pattern.test(value)) return fieldMessages.pattern(context);
       }
     }
-    if (definition.validate) {
-      const result = await definition.validate(value, target());
+    const runSchema = () => {
+      if (!definition.schema) return void 0;
+      return chain(definition.schema["~standard"].validate(value), (result) => {
+        const issues = result.issues ?? [];
+        return issues.length ? issues[0].message || fieldMessages.invalid(context) : void 0;
+      });
+    };
+    if (!definition.validate) return runSchema();
+    return chain(definition.validate(value, target()), (result) => {
       if (typeof result === "string" && result) return result;
       if (result === false) return fieldMessages.invalid(context);
-    }
-    if (definition.schema) {
-      const issues = await runStandardSchema(definition.schema, value);
-      if (issues.length) return issues[0].message || fieldMessages.invalid(context);
-    }
-    return void 0;
+      return runSchema();
+    });
+  }
+  async function runRules(name) {
+    return evaluateRules(name);
   }
   function hasErrorWithin(name) {
     return Object.entries(errors).some(([key, message]) => message && isWithin(key, name));
@@ -215,6 +229,18 @@ export function useForm(options) {
     syncErrors(submitCount.value > 0 ? void 0 : (key) => isWithin(key, name));
     return !hasErrorWithin(name);
   }
+  function applyValidation(fields, issues, results) {
+    issueErrors = issues.fields;
+    issueRoot = issues.root;
+    for (const key of Object.keys(ruleErrors)) delete ruleErrors[key];
+    fields.forEach((name, index) => ruleErrors[name] = results[index]);
+    for (const key of Object.keys(manualErrors)) delete manualErrors[key];
+    manualRoot = [];
+    syncErrors();
+  }
+  function isValidResult(issues, results) {
+    return results.every((message) => !message) && Object.keys(issues.fields).length === 0 && issues.root.length === 0;
+  }
   async function validate() {
     const run = ++validationRun;
     const fields = names.value;
@@ -222,16 +248,25 @@ export function useForm(options) {
       runValidator(),
       Promise.all(fields.map((name) => runRules(name)))
     ]);
-    if (run === validationRun) {
-      issueErrors = issues.fields;
-      issueRoot = issues.root;
-      for (const key of Object.keys(ruleErrors)) delete ruleErrors[key];
-      fields.forEach((name, index) => ruleErrors[name] = results[index]);
-      for (const key of Object.keys(manualErrors)) delete manualErrors[key];
-      manualRoot = [];
-      syncErrors();
+    if (run === validationRun) applyValidation(fields, issues, results);
+    return isValidResult(issues, results);
+  }
+  function validateSync() {
+    const fields = names.value;
+    const issues = evaluateValidator();
+    const results = fields.map((name) => evaluateRules(name));
+    if (isThenable(issues) || results.some((result) => isThenable(result))) {
+      for (const pending of [issues, ...results]) {
+        if (isThenable(pending)) void pending.catch(() => void 0);
+      }
+      throw new Error(
+        "[k] useForm: validateSync() found an async rule or validator. Use validate() instead."
+      );
     }
-    return results.every((message) => !message) && Object.keys(issues.fields).length === 0 && issues.root.length === 0;
+    const messages2 = results;
+    ++validationRun;
+    applyValidation(fields, issues, messages2);
+    return isValidResult(issues, messages2);
   }
   function setError(name, message) {
     if (name === "") {
@@ -374,6 +409,7 @@ export function useForm(options) {
     submitting,
     isDirty: (name) => dirtyFields.value.includes(name),
     validate,
+    validateSync,
     validateField,
     setError,
     setErrors,
@@ -387,3 +423,7 @@ export function useForm(options) {
 export function useFormContext() {
   return inject(FORM_KEY, null);
 }
+export function provideForm(form) {
+  provide(FORM_KEY, form);
+  return form;
+}

package/dist/editor/RichTextEditor.vue

@@ -126,7 +126,8 @@ const model = defineModel({ type: [String, Object, null], ...{ default: null } }
 const control = useFieldControl({
   invalid: () => props.invalid,
   disabled: () => props.disabled,
-  required: () => props.required
+  required: () => props.required,
+  labelable: false
 });
 const { locale } = useLocale();
 const text = computed(() => ({ ...locale.value.messages.editor, ...props.messages }));

package/dist/internal/core/ButtonElement.d.ts

@@ -0,0 +1,2 @@
+import type { ButtonHTMLAttributes, DefineComponent } from 'vue';
+export declare const ButtonElement: DefineComponent<Omit<ButtonHTMLAttributes, "onSelect">>;

package/dist/internal/core/ButtonElement.mjs

@@ -0,0 +1,8 @@
+import { defineComponent, h } from "vue";
+export const ButtonElement = defineComponent({
+  name: "KButtonElement",
+  inheritAttrs: false,
+  setup(_, { attrs, slots }) {
+    return () => h("button", attrs, slots.default?.());
+  }
+});

package/dist/internal/forms/files.d.ts

@@ -1,3 +1,4 @@
+import type { DroppedTree } from '../../composables/useFileDrop';
 export declare function parseAccept(accept: string | string[] | undefined): string[];
 export declare function matchesAccept(file: File, accept: string[]): boolean;
 export declare function formatBytes(bytes: number, locale?: string): string;
@@ -5,3 +6,9 @@ export declare function isImageFile(file: File): boolean;
 export declare function setFilePath(file: File, path: string): void;
 export declare function filePath(file: File): string;
 export declare function fileKey(file: File): string;
+export declare function isHiddenName(name: string): boolean;
+export declare function isHiddenPath(path: string): boolean;
+export declare function directoriesOf(paths: Iterable<string>): string[];
+export declare function filesTree(files: Iterable<File>, options?: {
+    skipHidden?: boolean;
+}): DroppedTree;

package/dist/internal/forms/files.mjs

@@ -37,3 +37,27 @@ export function filePath(file) {
 export function fileKey(file) {
   return `${filePath(file)}|${file.size}|${file.lastModified}`;
 }
+export function isHiddenName(name) {
+  return name.startsWith(".");
+}
+export function isHiddenPath(path) {
+  return path.split("/").some(isHiddenName);
+}
+export function directoriesOf(paths) {
+  const directories = /* @__PURE__ */ new Set();
+  for (const path of paths) {
+    const segments = path.split("/").filter(Boolean);
+    for (let depth = 1; depth < segments.length; depth++)
+      directories.add(segments.slice(0, depth).join("/"));
+  }
+  return [...directories];
+}
+export function filesTree(files, options = {}) {
+  const entries = [];
+  for (const file of files) {
+    const path = file.webkitRelativePath || file.name;
+    if (options.skipHidden && isHiddenPath(path)) continue;
+    entries.push({ file, path });
+  }
+  return { files: entries, directories: directoriesOf(entries.map((entry) => entry.path)) };
+}

package/dist/internal/keys.d.ts

@@ -1,5 +1,5 @@
 import type { Component, ComputedRef, InjectionKey, Ref } from 'vue';
-import type { FieldContext } from '../composables/useField';
+import type { FieldContext, FieldControlRole } from '../composables/useField';
 import type { FormContext } from '../composables/useForm';
 import type { IconRegistry } from '../composables/useIcons';
 import type { ThemePreference } from '../composables/useTheme';
@@ -11,6 +11,7 @@ export declare const THEME_KEY: InjectionKey<Ref<ThemePreference>>;
 export declare const PRESET_KEY: InjectionKey<Ref<ThemePreset>>;
 export declare const LINK_KEY: InjectionKey<Component>;
 export declare const FIELD_KEY: InjectionKey<FieldContext>;
+export declare const FIELD_ROLE_KEY: InjectionKey<FieldControlRole>;
 export declare const ROOT_KEY: InjectionKey<true>;
 export declare const FORM_KEY: InjectionKey<FormContext>;
 export declare const LOCALE_KEY: InjectionKey<ComputedRef<KLocale>>;

package/dist/internal/keys.mjs

@@ -4,6 +4,7 @@ export const THEME_KEY = Symbol("k-theme");
 export const PRESET_KEY = Symbol("k-preset");
 export const LINK_KEY = Symbol("k-link");
 export const FIELD_KEY = Symbol("k-field");
+export const FIELD_ROLE_KEY = Symbol("k-field-role");
 export const ROOT_KEY = Symbol("k-root");
 export const FORM_KEY = Symbol("k-form");
 export const LOCALE_KEY = Symbol("k-locale");

package/dist/locale/en.mjs

@@ -189,6 +189,8 @@ export const en = {
       list: "Selected files",
       selected: "{count} file selected | {count} files selected",
       directoryTitle: "Drop a folder here or click to browse",
+      mixedTitle: "Drop files or folders here or click to browse",
+      browseDirectory: "Upload a folder",
       loading: "Uploading",
       added: "{count} file added | {count} files added"
     },

package/dist/locale/it.mjs

@@ -189,6 +189,8 @@ export const it = {
       list: "File selezionati",
       selected: "{count} file selezionato | {count} file selezionati",
       directoryTitle: "Trascina una cartella qui o fai clic per sfogliare",
+      mixedTitle: "Trascina file o cartelle qui o fai clic per sfogliare",
+      browseDirectory: "Carica una cartella",
       loading: "Caricamento in corso",
       added: "{count} file aggiunto | {count} file aggiunti"
     },

package/dist/locale/types.d.ts

@@ -187,6 +187,8 @@ export interface KMessages {
         list: string;
         selected: string;
         directoryTitle: string;
+        mixedTitle: string;
+        browseDirectory: string;
         loading: string;
         added: string;
     };

package/dist/styles/core/button.css

@@ -64,7 +64,7 @@
 }
 
 .k-btn > .k-icon {
-   transition: transform var(--k-duration-lg) var(--k-ease-spring);
+   transition: transform var(--k-duration-lg) var(--k-ease-out);
 }
 
 .k-btn:hover > .k-icon[data-icon='arrow-right'],
@@ -77,18 +77,6 @@
    transform: translateX(-2px);
 }
 
-.k-btn:hover > .k-icon[data-icon='plus'] {
-   transform: rotate(90deg);
-}
-
-.k-btn:hover > .k-icon[data-icon='arrow-path'] {
-   transform: rotate(60deg);
-}
-
-.k-btn:hover > .k-icon[data-icon='arrow-up-tray'] {
-   transform: translateY(-1px);
-}
-
 .k-btn-xs {
    --k-btn-size: var(--k-size-xs);
    --k-icon-size: 0.875rem;

package/dist/styles/data/avatar.css

@@ -118,7 +118,7 @@
 
 .k-avatar-group > .k-avatar {
    box-shadow: 0 0 0 2px var(--k-surface);
-   transition: translate var(--k-duration-lg) var(--k-ease-spring);
+   transition: translate var(--k-duration-lg) var(--k-ease-out);
 }
 
 .k-avatar-group > .k-avatar + .k-avatar {

package/dist/styles/data/filter-pills.css

@@ -71,7 +71,6 @@
 }
 
 .k-filter-pill[aria-pressed='true'] .k-filter-pill-check > .k-icon {
-   animation: k-icon-pop 300ms var(--k-ease-spring);
 }
 
 .k-filter-pill-count {

package/dist/styles/data/pagination.css

@@ -94,7 +94,6 @@
    border-color: var(--k-field-line);
    box-shadow: var(--k-shadow-xs);
    color: var(--k-text);
-   animation: k-icon-pop 300ms var(--k-ease-spring);
 }
 
 .k-pagination-page:disabled {

package/dist/styles/data/selection-bar.css

@@ -3,6 +3,10 @@
    min-width: 0;
 }
 
+.k-selection-bar:not(.is-visible) {
+   display: contents;
+}
+
 .k-selection-bar-sticky {
    position: sticky;
    top: 0;