@xleddyl/443-components-vue 0.0.0 → 0.2.0

package/dist/components/forms/Calendar.vue.d.ts

@@ -17,14 +17,16 @@ declare const __VLS_base: import("vue").DefineComponent<{
     modelValue?: string | CalendarRange | null | undefined;
     month?: string | undefined;
     key?: PropertyKey | undefined;
-    ref?: import("vue").VNodeRef | undefined;
+    prefix?: string | undefined | undefined;
+    title?: string | undefined | undefined;
+    style?: import("vue").StyleValue;
+    results?: (string | number) | undefined;
     placeholder?: string | undefined | undefined;
+    ref?: import("vue").VNodeRef | undefined;
     class?: import("vue").ClassValue;
     role?: string | undefined | undefined;
     'aria-label'?: string | undefined | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
-    style?: import("vue").StyleValue;
-    title?: string | undefined | undefined;
     onCopy?: ((payload: ClipboardEvent) => void) | undefined;
     onCut?: ((payload: ClipboardEvent) => void) | undefined;
     onPaste?: ((payload: ClipboardEvent) => void) | undefined;
@@ -132,7 +134,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     'aria-colindex'?: (string | number) | undefined;
     'aria-colspan'?: (string | number) | undefined;
     'aria-controls'?: string | undefined | undefined;
-    'aria-current'?: "location" | "time" | (boolean | "true" | "false") | "page" | "step" | "date" | undefined;
+    'aria-current'?: "page" | "location" | "time" | (boolean | "true" | "false") | "step" | "date" | undefined;
     'aria-describedby'?: string | undefined | undefined;
     'aria-details'?: string | undefined | undefined;
     'aria-disabled'?: (boolean | "true" | "false") | undefined;
@@ -141,7 +143,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     'aria-expanded'?: (boolean | "true" | "false") | undefined;
     'aria-flowto'?: string | undefined | undefined;
     'aria-grabbed'?: (boolean | "true" | "false") | undefined;
-    'aria-haspopup'?: "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | "tree" | "grid" | undefined;
+    'aria-haspopup'?: "grid" | "tree" | "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | undefined;
     'aria-invalid'?: (boolean | "true" | "false") | "grammar" | "spelling" | undefined;
     'aria-keyshortcuts'?: string | undefined | undefined;
     'aria-labelledby'?: string | undefined | undefined;
@@ -177,7 +179,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     dir?: string | undefined | undefined;
     draggable?: (boolean | "true" | "false") | undefined;
     enterkeyhint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
-    enterKeyHint?: "search" | "done" | "enter" | "go" | "next" | "previous" | "send" | undefined;
+    enterKeyHint?: "search" | "done" | "previous" | "next" | "enter" | "go" | "send" | undefined;
     hidden?: "" | (boolean | "true" | "false") | "hidden" | "until-found" | undefined;
     inert?: (boolean | "true" | "false") | undefined;
     spellcheck?: (boolean | "true" | "false") | undefined;
@@ -186,7 +188,6 @@ declare const __VLS_base: import("vue").DefineComponent<{
     about?: string | undefined | undefined;
     datatype?: string | undefined | undefined;
     inlist?: any;
-    prefix?: string | undefined | undefined;
     property?: string | undefined | undefined;
     resource?: string | undefined | undefined;
     typeof?: string | undefined | undefined;
@@ -199,7 +200,6 @@ declare const __VLS_base: import("vue").DefineComponent<{
     itemtype?: string | undefined | undefined;
     itemid?: string | undefined | undefined;
     itemref?: string | undefined | undefined;
-    results?: (string | number) | undefined;
     security?: string | undefined | undefined;
     unselectable?: "on" | "off" | undefined | undefined;
     inputmode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
@@ -228,14 +228,16 @@ declare const __VLS_base: import("vue").DefineComponent<{
     modelValue?: string | CalendarRange | null | undefined;
     month?: string | undefined;
     key?: PropertyKey | undefined;
-    ref?: import("vue").VNodeRef | undefined;
+    prefix?: string | undefined | undefined;
+    title?: string | undefined | undefined;
+    style?: import("vue").StyleValue;
+    results?: (string | number) | undefined;
     placeholder?: string | undefined | undefined;
+    ref?: import("vue").VNodeRef | undefined;
     class?: import("vue").ClassValue;
     role?: string | undefined | undefined;
     'aria-label'?: string | undefined | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
-    style?: import("vue").StyleValue;
-    title?: string | undefined | undefined;
     onCopy?: ((payload: ClipboardEvent) => void) | undefined;
     onCut?: ((payload: ClipboardEvent) => void) | undefined;
     onPaste?: ((payload: ClipboardEvent) => void) | undefined;
@@ -343,7 +345,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     'aria-colindex'?: (string | number) | undefined;
     'aria-colspan'?: (string | number) | undefined;
     'aria-controls'?: string | undefined | undefined;
-    'aria-current'?: "location" | "time" | (boolean | "true" | "false") | "page" | "step" | "date" | undefined;
+    'aria-current'?: "page" | "location" | "time" | (boolean | "true" | "false") | "step" | "date" | undefined;
     'aria-describedby'?: string | undefined | undefined;
     'aria-details'?: string | undefined | undefined;
     'aria-disabled'?: (boolean | "true" | "false") | undefined;
@@ -352,7 +354,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     'aria-expanded'?: (boolean | "true" | "false") | undefined;
     'aria-flowto'?: string | undefined | undefined;
     'aria-grabbed'?: (boolean | "true" | "false") | undefined;
-    'aria-haspopup'?: "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | "tree" | "grid" | undefined;
+    'aria-haspopup'?: "grid" | "tree" | "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | undefined;
     'aria-invalid'?: (boolean | "true" | "false") | "grammar" | "spelling" | undefined;
     'aria-keyshortcuts'?: string | undefined | undefined;
     'aria-labelledby'?: string | undefined | undefined;
@@ -388,7 +390,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     dir?: string | undefined | undefined;
     draggable?: (boolean | "true" | "false") | undefined;
     enterkeyhint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
-    enterKeyHint?: "search" | "done" | "enter" | "go" | "next" | "previous" | "send" | undefined;
+    enterKeyHint?: "search" | "done" | "previous" | "next" | "enter" | "go" | "send" | undefined;
     hidden?: "" | (boolean | "true" | "false") | "hidden" | "until-found" | undefined;
     inert?: (boolean | "true" | "false") | undefined;
     spellcheck?: (boolean | "true" | "false") | undefined;
@@ -397,7 +399,6 @@ declare const __VLS_base: import("vue").DefineComponent<{
     about?: string | undefined | undefined;
     datatype?: string | undefined | undefined;
     inlist?: any;
-    prefix?: string | undefined | undefined;
     property?: string | undefined | undefined;
     resource?: string | undefined | undefined;
     typeof?: string | undefined | undefined;
@@ -410,7 +411,6 @@ declare const __VLS_base: import("vue").DefineComponent<{
     itemtype?: string | undefined | undefined;
     itemid?: string | undefined | undefined;
     itemref?: string | undefined | undefined;
-    results?: (string | number) | undefined;
     security?: string | undefined | undefined;
     unselectable?: "on" | "off" | undefined | undefined;
     inputmode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
@@ -422,11 +422,7 @@ declare const __VLS_base: import("vue").DefineComponent<{
     onSelect?: ((iso: string) => any) | undefined;
     "onUpdate:modelValue"?: ((value: string | CalendarRange | null | undefined) => any) | undefined;
     "onUpdate:month"?: ((value: string | undefined) => any) | undefined;
-}>, {
-    nextLabel: string;
-    locale: string;
-    prevLabel: string;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}>, {}, {}, {}, {}, 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;

package/dist/components/forms/ColorInput.vue

@@ -10,7 +10,7 @@
                type="color"
                class="k-color-input-native"
                :value="normalized ?? '#000000'"
-               :aria-label="pickerLabel"
+               :aria-label="pickerText"
                :disabled="control.disabled.value || readonly || void 0"
                @input="onPick"
             />
@@ -47,7 +47,7 @@
          v-if="swatches.length"
          class="k-color-input-swatches"
          role="group"
-         :aria-label="swatchesLabel"
+         :aria-label="swatchesText"
       >
          <button
             v-for="color in normalizedSwatches"
@@ -68,14 +68,15 @@
 <script setup>
 import { computed, ref, useTemplateRef, watch } from "vue";
 import { useFieldControl } from "../../composables/useField";
+import { useLocale } from "../../composables/useLocale";
 import { joinIds } from "../../internal/forms/control";
 defineOptions({ inheritAttrs: false });
 const props = defineProps({
   swatches: { type: Array, required: false, default: () => [] },
   size: { type: String, required: false, default: "md" },
   placeholder: { type: String, required: false, default: "#000000" },
-  pickerLabel: { type: String, required: false, default: "Pick a color" },
-  swatchesLabel: { type: String, required: false, default: "Preset colors" },
+  pickerLabel: { type: String, required: false },
+  swatchesLabel: { type: String, required: false },
   invalid: { type: Boolean, required: false, default: void 0 },
   disabled: { type: Boolean, required: false },
   readonly: { type: Boolean, required: false },
@@ -83,6 +84,9 @@ const props = defineProps({
   class: { type: null, required: false },
   style: { type: null, required: false }
 });
+const { t } = useLocale();
+const pickerText = computed(() => props.pickerLabel ?? t("colorInput.pick"));
+const swatchesText = computed(() => props.swatchesLabel ?? t("colorInput.swatches"));
 const model = defineModel({ type: null });
 const inputRef = useTemplateRef("inputRef");
 const control = useFieldControl({

package/dist/components/forms/ColorInput.vue.d.ts

@@ -13,18 +13,21 @@ declare const __VLS_export: import("vue").DefineComponent<{
     style?: unknown;
     modelValue?: string | null | undefined;
     key?: PropertyKey | undefined;
+    prefix?: string | undefined | undefined;
     value?: any;
+    form?: string | undefined | undefined;
     min?: (string | number) | undefined;
     max?: (string | number) | undefined;
     pattern?: string | undefined | undefined;
+    title?: string | undefined | undefined;
+    list?: string | undefined | undefined;
+    results?: (string | number) | undefined;
     name?: string | undefined | undefined;
     type?: import("vue").InputTypeHTMLAttribute | undefined;
     ref?: import("vue").VNodeRef | undefined;
     role?: string | undefined | undefined;
     'aria-label'?: string | undefined | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
-    form?: string | undefined | undefined;
-    title?: string | undefined | undefined;
     onCopy?: ((payload: ClipboardEvent) => void) | undefined;
     onCut?: ((payload: ClipboardEvent) => void) | undefined;
     onPaste?: ((payload: ClipboardEvent) => void) | undefined;
@@ -135,7 +138,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
     'aria-colindex'?: (string | number) | undefined;
     'aria-colspan'?: (string | number) | undefined;
     'aria-controls'?: string | undefined | undefined;
-    'aria-current'?: "location" | "time" | (boolean | "true" | "false") | "page" | "step" | "date" | undefined;
+    'aria-current'?: "page" | "location" | "time" | (boolean | "true" | "false") | "step" | "date" | undefined;
     'aria-describedby'?: string | undefined | undefined;
     'aria-details'?: string | undefined | undefined;
     'aria-disabled'?: (boolean | "true" | "false") | undefined;
@@ -144,7 +147,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
     'aria-expanded'?: (boolean | "true" | "false") | undefined;
     'aria-flowto'?: string | undefined | undefined;
     'aria-grabbed'?: (boolean | "true" | "false") | undefined;
-    'aria-haspopup'?: "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | "tree" | "grid" | undefined;
+    'aria-haspopup'?: "grid" | "tree" | "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | undefined;
     'aria-invalid'?: (boolean | "true" | "false") | "grammar" | "spelling" | undefined;
     'aria-keyshortcuts'?: string | undefined | undefined;
     'aria-labelledby'?: string | undefined | undefined;
@@ -174,7 +177,6 @@ declare const __VLS_export: import("vue").DefineComponent<{
     'aria-valuetext'?: string | undefined | undefined;
     ref_for?: boolean | undefined | undefined;
     ref_key?: string | undefined | undefined;
-    list?: string | undefined | undefined;
     step?: (string | number) | undefined;
     accesskey?: string | undefined | undefined;
     contenteditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
@@ -182,7 +184,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
     dir?: string | undefined | undefined;
     draggable?: (boolean | "true" | "false") | undefined;
     enterkeyhint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
-    enterKeyHint?: "search" | "done" | "enter" | "go" | "next" | "previous" | "send" | undefined;
+    enterKeyHint?: "search" | "done" | "previous" | "next" | "enter" | "go" | "send" | undefined;
     hidden?: "" | (boolean | "true" | "false") | "hidden" | "until-found" | undefined;
     inert?: (boolean | "true" | "false") | undefined;
     spellcheck?: (boolean | "true" | "false") | undefined;
@@ -191,7 +193,6 @@ declare const __VLS_export: import("vue").DefineComponent<{
     about?: string | undefined | undefined;
     datatype?: string | undefined | undefined;
     inlist?: any;
-    prefix?: string | undefined | undefined;
     property?: string | undefined | undefined;
     resource?: string | undefined | undefined;
     typeof?: string | undefined | undefined;
@@ -204,7 +205,6 @@ declare const __VLS_export: import("vue").DefineComponent<{
     itemtype?: string | undefined | undefined;
     itemid?: string | undefined | undefined;
     itemref?: string | undefined | undefined;
-    results?: (string | number) | undefined;
     security?: string | undefined | undefined;
     unselectable?: "on" | "off" | undefined | undefined;
     inputmode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
@@ -251,18 +251,21 @@ declare const __VLS_export: import("vue").DefineComponent<{
     style?: unknown;
     modelValue?: string | null | undefined;
     key?: PropertyKey | undefined;
+    prefix?: string | undefined | undefined;
     value?: any;
+    form?: string | undefined | undefined;
     min?: (string | number) | undefined;
     max?: (string | number) | undefined;
     pattern?: string | undefined | undefined;
+    title?: string | undefined | undefined;
+    list?: string | undefined | undefined;
+    results?: (string | number) | undefined;
     name?: string | undefined | undefined;
     type?: import("vue").InputTypeHTMLAttribute | undefined;
     ref?: import("vue").VNodeRef | undefined;
     role?: string | undefined | undefined;
     'aria-label'?: string | undefined | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
-    form?: string | undefined | undefined;
-    title?: string | undefined | undefined;
     onCopy?: ((payload: ClipboardEvent) => void) | undefined;
     onCut?: ((payload: ClipboardEvent) => void) | undefined;
     onPaste?: ((payload: ClipboardEvent) => void) | undefined;
@@ -373,7 +376,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
     'aria-colindex'?: (string | number) | undefined;
     'aria-colspan'?: (string | number) | undefined;
     'aria-controls'?: string | undefined | undefined;
-    'aria-current'?: "location" | "time" | (boolean | "true" | "false") | "page" | "step" | "date" | undefined;
+    'aria-current'?: "page" | "location" | "time" | (boolean | "true" | "false") | "step" | "date" | undefined;
     'aria-describedby'?: string | undefined | undefined;
     'aria-details'?: string | undefined | undefined;
     'aria-disabled'?: (boolean | "true" | "false") | undefined;
@@ -382,7 +385,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
     'aria-expanded'?: (boolean | "true" | "false") | undefined;
     'aria-flowto'?: string | undefined | undefined;
     'aria-grabbed'?: (boolean | "true" | "false") | undefined;
-    'aria-haspopup'?: "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | "tree" | "grid" | undefined;
+    'aria-haspopup'?: "grid" | "tree" | "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | undefined;
     'aria-invalid'?: (boolean | "true" | "false") | "grammar" | "spelling" | undefined;
     'aria-keyshortcuts'?: string | undefined | undefined;
     'aria-labelledby'?: string | undefined | undefined;
@@ -412,7 +415,6 @@ declare const __VLS_export: import("vue").DefineComponent<{
     'aria-valuetext'?: string | undefined | undefined;
     ref_for?: boolean | undefined | undefined;
     ref_key?: string | undefined | undefined;
-    list?: string | undefined | undefined;
     step?: (string | number) | undefined;
     accesskey?: string | undefined | undefined;
     contenteditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
@@ -420,7 +422,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
     dir?: string | undefined | undefined;
     draggable?: (boolean | "true" | "false") | undefined;
     enterkeyhint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
-    enterKeyHint?: "search" | "done" | "enter" | "go" | "next" | "previous" | "send" | undefined;
+    enterKeyHint?: "search" | "done" | "previous" | "next" | "enter" | "go" | "send" | undefined;
     hidden?: "" | (boolean | "true" | "false") | "hidden" | "until-found" | undefined;
     inert?: (boolean | "true" | "false") | undefined;
     spellcheck?: (boolean | "true" | "false") | undefined;
@@ -429,7 +431,6 @@ declare const __VLS_export: import("vue").DefineComponent<{
     about?: string | undefined | undefined;
     datatype?: string | undefined | undefined;
     inlist?: any;
-    prefix?: string | undefined | undefined;
     property?: string | undefined | undefined;
     resource?: string | undefined | undefined;
     typeof?: string | undefined | undefined;
@@ -442,7 +443,6 @@ declare const __VLS_export: import("vue").DefineComponent<{
     itemtype?: string | undefined | undefined;
     itemid?: string | undefined | undefined;
     itemref?: string | undefined | undefined;
-    results?: (string | number) | undefined;
     security?: string | undefined | undefined;
     unselectable?: "on" | "off" | undefined | undefined;
     inputmode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
@@ -474,11 +474,9 @@ declare const __VLS_export: import("vue").DefineComponent<{
     "onUpdate:modelValue"?: ((value: string | null | undefined) => any) | undefined;
 }>, {
     invalid: boolean;
-    size: FieldSize;
-    placeholder: string;
     swatches: string[];
-    pickerLabel: string;
-    swatchesLabel: string;
+    placeholder: string;
+    size: FieldSize;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/components/forms/Combobox.vue

@@ -35,7 +35,7 @@
                   v-if="interactive"
                   type="button"
                   class="k-combobox-tag-remove"
-                  :aria-label="`${removeLabel} ${labelFor(value)}`"
+                  :aria-label="`${removeText} ${labelFor(value)}`"
                   @click.stop="remove(value)"
                >
                   <Icon name="x-mark" />
@@ -74,8 +74,8 @@
                v-else-if="showClear"
                type="button"
                class="k-combobox-icon-button"
-               :aria-label="clearLabel"
-               :title="clearLabel"
+               :aria-label="clearText"
+               :title="clearText"
                tabindex="-1"
                @click.stop="clear"
             >
@@ -84,7 +84,7 @@
             <button
                type="button"
                class="k-combobox-icon-button k-combobox-chevron"
-               :aria-label="toggleLabel"
+               :aria-label="toggleText"
                tabindex="-1"
                :disabled="!interactive || void 0"
                @click.stop="onToggleClick"
@@ -106,7 +106,7 @@
             role="listbox"
             class="k-combobox-list"
             :aria-labelledby="listLabelledBy"
-            :aria-label="listLabelledBy ? void 0 : listLabel"
+            :aria-label="listLabelledBy ? void 0 : listText"
             :aria-multiselectable="multiple ? 'true' : void 0"
             :aria-busy="busy ? 'true' : void 0"
          >
@@ -149,7 +149,7 @@
                      }}</span>
                   </slot>
                   <span v-else class="k-combobox-option-label">{{
-                     createText(item.option.label)
+                     buildCreateText(item.option.label)
                   }}</span>
                </span>
                <Icon
@@ -161,10 +161,10 @@
          </ul>
          <div v-if="busy && !items.length" class="k-combobox-state">
             <Spinner decorative size="xs" />
-            <span>{{ loadingText }}</span>
+            <span>{{ loadingLabel }}</span>
          </div>
          <div v-else-if="!items.length" class="k-combobox-state">
-            <slot name="empty" :query="query">{{ emptyText }}</slot>
+            <slot name="empty" :query="query">{{ emptyLabel }}</slot>
          </div>
       </div>
       <span class="k-visually-hidden" role="status" aria-live="polite">{{ statusText }}</span>
@@ -193,6 +193,7 @@ import {
   watch
 } from "vue";
 import { useFieldControl } from "../../composables/useField";
+import { useLocale } from "../../composables/useLocale";
 import { useFloatingLayer } from "../../internal/floating/layer";
 import { nextEnabledIndex } from "../../internal/core/roving";
 import { useAsyncSearch } from "../../internal/core/search";
@@ -217,14 +218,14 @@ const props = defineProps({
   clearable: { type: Boolean, required: false },
   loading: { type: Boolean, required: false },
   openOnFocus: { type: Boolean, required: false },
-  emptyText: { type: String, required: false, default: "No results" },
-  loadingText: { type: String, required: false, default: "Loading" },
-  clearLabel: { type: String, required: false, default: "Clear selection" },
-  toggleLabel: { type: String, required: false, default: "Show options" },
-  removeLabel: { type: String, required: false, default: "Remove" },
-  listLabel: { type: String, required: false, default: "Options" },
-  createText: { type: Function, required: false, default: (query2) => `Create "${query2}"` },
-  resultsText: { type: Function, required: false, default: (count) => `${count} ${count === 1 ? "result" : "results"} available` },
+  emptyText: { type: String, required: false },
+  loadingText: { type: String, required: false },
+  clearLabel: { type: String, required: false },
+  toggleLabel: { type: String, required: false },
+  removeLabel: { type: String, required: false },
+  listLabel: { type: String, required: false },
+  createText: { type: Function, required: false },
+  resultsText: { type: Function, required: false },
   invalid: { type: Boolean, required: false, default: void 0 },
   disabled: { type: Boolean, required: false },
   readonly: { type: Boolean, required: false },
@@ -232,6 +233,16 @@ const props = defineProps({
   class: { type: null, required: false },
   style: { type: null, required: false }
 });
+const { t } = useLocale();
+const emptyLabel = computed(() => props.emptyText ?? t("common.noResults"));
+const loadingLabel = computed(() => props.loadingText ?? t("common.loading"));
+const clearText = computed(() => props.clearLabel ?? t("combobox.clear"));
+const toggleText = computed(() => props.toggleLabel ?? t("combobox.toggle"));
+const removeText = computed(() => props.removeLabel ?? t("common.remove"));
+const listText = computed(() => props.listLabel ?? t("combobox.list"));
+function buildCreateText(text) {
+  return props.createText ? props.createText(text) : t("combobox.create", { query: text });
+}
 const model = defineModel({ type: null });
 const query = defineModel("query", { type: String, ...{ default: "" } });
 const emit = defineEmits(["create", "open", "close"]);
@@ -347,9 +358,10 @@ const activeId = computed(
 );
 const statusText = computed(() => {
   if (!layer.isOpen.value) return "";
-  if (busy.value) return props.loadingText;
-  if (!items.value.length) return props.emptyText;
-  return props.resultsText(items.value.length);
+  if (busy.value) return loadingLabel.value;
+  if (!items.value.length) return emptyLabel.value;
+  const count = items.value.length;
+  return props.resultsText ? props.resultsText(count) : t("combobox.results", { count });
 });
 function keyOf(value) {
   return String(value);

package/dist/components/forms/Combobox.vue.d.ts

@@ -37,9 +37,9 @@ declare const __VLS_export: <T extends string | number, M extends T | T[] | null
         query?: string;
     }) & {
         onClose?: (() => any) | undefined;
+        onCreate?: ((option: ComboboxOption<T>) => any) | undefined;
         onOpen?: (() => any) | undefined;
         "onUpdate:modelValue"?: ((value: M | undefined) => any) | undefined;
-        onCreate?: ((option: ComboboxOption<T>) => any) | undefined;
         "onUpdate:query"?: ((value: string) => any) | undefined;
     } & Partial<import("vue").InputHTMLAttributes & import("vue").ReservedProps>> & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;
@@ -62,7 +62,7 @@ declare const __VLS_export: <T extends string | number, M extends T | T[] | null
             query: string;
         }) => any;
     };
-    emit: (((evt: "close") => void) & ((evt: "open") => void) & ((evt: "create", option: ComboboxOption<T>) => void)) & (((event: "update:modelValue", value: M | undefined) => void) & ((event: "update:query", value: string) => void));
+    emit: (((evt: "close") => void) & ((evt: "create", option: ComboboxOption<T>) => void) & ((evt: "open") => void)) & (((event: "update:modelValue", value: M | undefined) => void) & ((event: "update:query", value: string) => void));
 }>) => import("vue").VNode & {
     __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
 };

package/dist/components/forms/DateInput.vue.d.ts

@@ -12,18 +12,22 @@ declare const __VLS_export: import("vue").DefineComponent<{
     required?: (boolean | "true" | "false") | undefined;
     modelValue?: string | number | null | undefined;
     key?: PropertyKey | undefined;
+    prefix?: string | undefined;
+    icon?: import("../../index.ts").IconName;
     value?: any;
+    form?: string | undefined;
     pattern?: string | undefined;
+    title?: string | undefined;
+    style?: unknown;
+    list?: string | undefined;
+    results?: (string | number) | undefined;
+    placeholder?: string | undefined;
     name?: string | undefined;
     ref?: import("vue").VNodeRef | undefined;
-    placeholder?: string | undefined;
     class?: unknown;
     role?: string | undefined;
     'aria-label'?: string | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
-    style?: unknown;
-    form?: string | undefined;
-    title?: string | undefined;
     onCopy?: ((payload: ClipboardEvent) => void) | undefined;
     onCut?: ((payload: ClipboardEvent) => void) | undefined;
     onPaste?: ((payload: ClipboardEvent) => void) | undefined;
@@ -173,7 +177,6 @@ declare const __VLS_export: import("vue").DefineComponent<{
     'aria-valuetext'?: string | undefined;
     ref_for?: boolean | undefined | undefined;
     ref_key?: string | undefined | undefined;
-    list?: string | undefined;
     accesskey?: string | undefined;
     contenteditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
     contextmenu?: string | undefined;
@@ -189,7 +192,6 @@ declare const __VLS_export: import("vue").DefineComponent<{
     about?: string | undefined;
     datatype?: string | undefined;
     inlist?: any;
-    prefix?: string | undefined;
     property?: string | undefined;
     resource?: string | undefined;
     typeof?: string | undefined;
@@ -202,7 +204,6 @@ declare const __VLS_export: import("vue").DefineComponent<{
     itemtype?: string | undefined;
     itemid?: string | undefined;
     itemref?: string | undefined;
-    results?: (string | number) | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
     inputmode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
@@ -211,7 +212,6 @@ declare const __VLS_export: import("vue").DefineComponent<{
     part?: string;
     popover?: import("../../index.ts").PopoverMode | "" | boolean;
     numeric?: boolean;
-    icon?: import("../../index.ts").IconName;
     autofocus?: (boolean | "true" | "false") | undefined;
     formaction?: string | undefined;
     formenctype?: string | undefined;
@@ -257,18 +257,22 @@ declare const __VLS_export: import("vue").DefineComponent<{
     required?: (boolean | "true" | "false") | undefined;
     modelValue?: string | number | null | undefined;
     key?: PropertyKey | undefined;
+    prefix?: string | undefined;
+    icon?: import("../../index.ts").IconName;
     value?: any;
+    form?: string | undefined;
     pattern?: string | undefined;
+    title?: string | undefined;
+    style?: unknown;
+    list?: string | undefined;
+    results?: (string | number) | undefined;
+    placeholder?: string | undefined;
     name?: string | undefined;
     ref?: import("vue").VNodeRef | undefined;
-    placeholder?: string | undefined;
     class?: unknown;
     role?: string | undefined;
     'aria-label'?: string | undefined;
     'aria-hidden'?: (boolean | "true" | "false") | undefined;
-    style?: unknown;
-    form?: string | undefined;
-    title?: string | undefined;
     onCopy?: ((payload: ClipboardEvent) => void) | undefined;
     onCut?: ((payload: ClipboardEvent) => void) | undefined;
     onPaste?: ((payload: ClipboardEvent) => void) | undefined;
@@ -418,7 +422,6 @@ declare const __VLS_export: import("vue").DefineComponent<{
     'aria-valuetext'?: string | undefined;
     ref_for?: boolean | undefined | undefined;
     ref_key?: string | undefined | undefined;
-    list?: string | undefined;
     accesskey?: string | undefined;
     contenteditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
     contextmenu?: string | undefined;
@@ -434,7 +437,6 @@ declare const __VLS_export: import("vue").DefineComponent<{
     about?: string | undefined;
     datatype?: string | undefined;
     inlist?: any;
-    prefix?: string | undefined;
     property?: string | undefined;
     resource?: string | undefined;
     typeof?: string | undefined;
@@ -447,7 +449,6 @@ declare const __VLS_export: import("vue").DefineComponent<{
     itemtype?: string | undefined;
     itemid?: string | undefined;
     itemref?: string | undefined;
-    results?: (string | number) | undefined;
     security?: string | undefined;
     unselectable?: "on" | "off" | undefined;
     inputmode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
@@ -456,7 +457,6 @@ declare const __VLS_export: import("vue").DefineComponent<{
     part?: string;
     popover?: import("../../index.ts").PopoverMode | "" | boolean;
     numeric?: boolean;
-    icon?: import("../../index.ts").IconName;
     autofocus?: (boolean | "true" | "false") | undefined;
     formaction?: string | undefined;
     formenctype?: string | undefined;