@alikhalilll/ui 1.1.0 → 1.2.0

package/dist/index.d.ts

@@ -26,7 +26,7 @@ declare const __VLS_component: DefineComponent<__VLS_Props, {}, {}, {}, {}, Comp
 size: Size;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-declare const __VLS_component_10: DefineComponent<__VLS_Props_7, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_7> & Readonly<{}>, {
+declare const __VLS_component_10: DefineComponent<__VLS_Props_8, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_8> & Readonly<{}>, {
 sideOffset: number;
 align: "start" | "center" | "end";
 overlay: boolean;
@@ -74,13 +74,15 @@ emptyText: string;
 loadingText: string;
 suggestedLabel: string;
 allCountriesLabel: string;
+countryLabel: string;
+selectCountryLabel: string;
 suggestedLimit: number;
 maxResults: number;
 kbdOpen: string | null;
 kbdClose: string | null;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-declare const __VLS_component_13: DefineComponent<__VLS_Props_10, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_10> & Readonly<{}>, {
+declare const __VLS_component_13: DefineComponent<__VLS_Props_11, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_11> & Readonly<{}>, {
 width: number;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
@@ -134,14 +136,14 @@ shouldScaleBackground: boolean;
 
 declare const __VLS_component_6: DefineComponent<DrawerTriggerProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<DrawerTriggerProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-declare const __VLS_component_7: DefineComponent<__VLS_Props_3, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
+declare const __VLS_component_7: DefineComponent<__VLS_Props_4, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
 escapeKeyDown: (event: KeyboardEvent) => any;
 pointerDownOutside: (event: PointerDownOutsideEvent) => any;
 focusOutside: (event: FocusOutsideEvent) => any;
 interactOutside: (event: PointerDownOutsideEvent | FocusOutsideEvent) => any;
 openAutoFocus: (event: Event) => any;
 closeAutoFocus: (event: Event) => any;
-}, string, PublicProps, Readonly<__VLS_Props_3> & Readonly<{
+}, string, PublicProps, Readonly<__VLS_Props_4> & Readonly<{
 onEscapeKeyDown?: ((event: KeyboardEvent) => any) | undefined;
 onPointerDownOutside?: ((event: PointerDownOutsideEvent) => any) | undefined;
 onFocusOutside?: ((event: FocusOutsideEvent) => any) | undefined;
@@ -159,7 +161,7 @@ modal: boolean;
 breakpoint: string;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
-declare const __VLS_component_9: DefineComponent<__VLS_Props_6, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_6> & Readonly<{}>, {
+declare const __VLS_component_9: DefineComponent<__VLS_Props_7, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_7> & Readonly<{}>, {
 breakpoint: string;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
@@ -177,6 +179,49 @@ declare type __VLS_Props = {
 };
 
 declare type __VLS_Props_10 = {
+    class?: HTMLAttributes['class'];
+    triggerClass?: HTMLAttributes['class'];
+    contentClass?: HTMLAttributes['class'];
+    popoverClass?: HTMLAttributes['class'];
+    drawerClass?: HTMLAttributes['class'];
+    searchPlaceholder?: string;
+    emptyText?: string;
+    loadingText?: string;
+    suggestedLabel?: string;
+    allCountriesLabel?: string;
+    /** ISO2 codes that are selectable. Others are listed but disabled. */
+    allowedDialCodes?: string[];
+    disabled?: boolean;
+    /** Drives the trigger button padding + text size. Matches ATellInput's `size`. */
+    size?: Size;
+    /** Max items rendered under the "Suggested" header (current + recents, deduped). */
+    suggestedLimit?: number;
+    /** Cap the number of matching countries shown in search results. */
+    maxResults?: number;
+    /** Override the flag URL builder, e.g. `(iso, w) => \`/flags/${iso}.svg\``. */
+    flagUrl?: (iso2: string, width: number) => string;
+    /**
+     * Custom search predicate. Default: substring match on the precomputed `search_key`.
+     * Return `true` to keep the country in results.
+     */
+    searcher?: (query: string, country: CountryOption) => boolean;
+    /**
+     * Provide your own country list (bypasses the REST Countries fetch). Useful when you
+     * already have a curated subset, an i18n'd list, or want to avoid the network call.
+     */
+    countries?: CountryOption[];
+    /** Override the right-side kbd hints. Pass `null` to hide. */
+    kbdOpen?: string | null;
+    kbdClose?: string | null;
+    /** BCP-47 locale — country names render localized via `Intl.DisplayNames`. */
+    locale?: string;
+    /** Prefix of the trigger's `aria-label` when a country is selected, e.g. `"Country"`. */
+    countryLabel?: string;
+    /** Trigger's `aria-label` when no country is selected. */
+    selectCountryLabel?: string;
+};
+
+declare type __VLS_Props_11 = {
     /** ISO 3166-1 alpha-2 country code, case-insensitive. */
     iso2: string;
     /** Pixel width served by flagcdn. 40 is crisp at retina up to ~24px wide. */
@@ -191,20 +236,26 @@ declare type __VLS_Props_10 = {
 
 declare type __VLS_Props_2 = PopoverContentProps & {
     class?: HTMLAttributes['class'];
-    /** Render a dimmed, clickable backdrop behind the popover. Pair with `<APopover modal>`. */
+    /** Dim the entire viewport behind the popover and block all interaction with the
+     *  page (clicks are captured by the overlay; body scroll is locked while open).
+     *  Pair with `<APopover :modal="true">` (the default) for the full modal behaviour. */
     overlay?: boolean;
     overlayClass?: HTMLAttributes['class'];
 };
 
-declare type __VLS_Props_3 = DialogContentProps & {
+declare type __VLS_Props_3 = {
+    class?: HTMLAttributes['class'];
+};
+
+declare type __VLS_Props_4 = DialogContentProps & {
     class?: HTMLAttributes['class'];
 };
 
-declare type __VLS_Props_4 = DialogOverlayProps & {
+declare type __VLS_Props_5 = DialogOverlayProps & {
     class?: HTMLAttributes['class'];
 };
 
-declare type __VLS_Props_5 = {
+declare type __VLS_Props_6 = {
     /** CSS media query for the desktop break. Below this width we render a vaul drawer. */
     breakpoint?: string;
     /**
@@ -214,12 +265,12 @@ declare type __VLS_Props_5 = {
     modal?: boolean;
 };
 
-declare type __VLS_Props_6 = {
+declare type __VLS_Props_7 = {
     breakpoint?: string;
     asChild?: boolean;
 };
 
-declare type __VLS_Props_7 = {
+declare type __VLS_Props_8 = {
     breakpoint?: string;
     /** Classes applied on both branches. Avoid width / inset classes here. */
     class?: HTMLAttributes['class'];
@@ -237,57 +288,20 @@ declare type __VLS_Props_7 = {
     sideOffset?: number;
 };
 
-declare type __VLS_Props_8 = ExtendedProps;
-
-declare type __VLS_Props_9 = {
-    class?: HTMLAttributes['class'];
-    triggerClass?: HTMLAttributes['class'];
-    contentClass?: HTMLAttributes['class'];
-    popoverClass?: HTMLAttributes['class'];
-    drawerClass?: HTMLAttributes['class'];
-    searchPlaceholder?: string;
-    emptyText?: string;
-    loadingText?: string;
-    suggestedLabel?: string;
-    allCountriesLabel?: string;
-    /** ISO2 codes that are selectable. Others are listed but disabled. */
-    allowedDialCodes?: string[];
-    disabled?: boolean;
-    /** Drives the trigger button padding + text size. Matches ATellInput's `size`. */
-    size?: Size;
-    /** Max items rendered under the "Suggested" header (current + recents, deduped). */
-    suggestedLimit?: number;
-    /** Cap the number of matching countries shown in search results. */
-    maxResults?: number;
-    /** Override the flag URL builder, e.g. `(iso, w) => \`/flags/${iso}.svg\``. */
-    flagUrl?: (iso2: string, width: number) => string;
-    /**
-     * Custom search predicate. Default: substring match on the precomputed `search_key`.
-     * Return `true` to keep the country in results.
-     */
-    searcher?: (query: string, country: CountryOption) => boolean;
-    /**
-     * Provide your own country list (bypasses the REST Countries fetch). Useful when you
-     * already have a curated subset, an i18n'd list, or want to avoid the network call.
-     */
-    countries?: CountryOption[];
-    /** Override the right-side kbd hints. Pass `null` to hide. */
-    kbdOpen?: string | null;
-    kbdClose?: string | null;
-};
+declare type __VLS_Props_9 = ExtendedProps;
 
 declare type __VLS_PublicProps = {
     'open'?: boolean;
-} & __VLS_Props_5;
+} & __VLS_Props_6;
 
 declare type __VLS_PublicProps_2 = {
     'phone'?: string;
     'country'?: number | null;
-} & __VLS_Props_8;
+} & __VLS_Props_9;
 
 declare type __VLS_PublicProps_3 = {
     'selected'?: string;
-} & __VLS_Props_9;
+} & __VLS_Props_10;
 
 declare function __VLS_template(): {
     attrs: Partial<{}>;
@@ -746,7 +760,7 @@ export declare const ADrawer: __VLS_WithTemplateSlots_5<typeof __VLS_component_5
 
 export declare const ADrawerContent: __VLS_WithTemplateSlots_7<typeof __VLS_component_7, __VLS_TemplateResult_7["slots"]>;
 
-export declare const ADrawerOverlay: DefineComponent<__VLS_Props_4, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_4> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+export declare const ADrawerOverlay: DefineComponent<__VLS_Props_5, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_5> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
 export declare const ADrawerTrigger: __VLS_WithTemplateSlots_6<typeof __VLS_component_6, __VLS_TemplateResult_6["slots"]>;
 
@@ -756,6 +770,8 @@ export declare const APopover: __VLS_WithTemplateSlots_2<typeof __VLS_component_
 
 export declare const APopoverContent: __VLS_WithTemplateSlots_4<typeof __VLS_component_4, __VLS_TemplateResult_4["slots"]>;
 
+export declare const APopoverOverlay: DefineComponent<__VLS_Props_3, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_3> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+
 export declare const APopoverTrigger: __VLS_WithTemplateSlots_3<typeof __VLS_component_3, __VLS_TemplateResult_3["slots"]>;
 
 export declare const AResponsivePopover: __VLS_WithTemplateSlots_8<typeof __VLS_component_8, __VLS_TemplateResult_8["slots"]>;
@@ -766,12 +782,32 @@ export declare const AResponsivePopoverTrigger: __VLS_WithTemplateSlots_9<typeof
 
 export declare const ATellInput: __VLS_WithTemplateSlots_11<typeof __VLS_component_11, __VLS_TemplateResult_11["slots"]>;
 
+/** Text direction for the field. `'auto'` (or omitting the prop) inherits from the
+ *  nearest `[dir]` ancestor / `<html dir>`; `'ltr'` / `'rtl'` force it. */
+export declare type ATellInputDir = 'ltr' | 'rtl' | 'auto';
+
 export declare interface ATellInputProps {
     class?: HTMLAttributes['class'];
     placeholder?: string;
     disabled?: boolean;
     loading?: boolean;
     size?: ATellInputSize;
+    /**
+     * Text direction. Omit (or pass `'auto'`) to inherit from the page — RTL pages get an
+     * RTL field automatically. Pass `'ltr'` / `'rtl'` to force it.
+     */
+    dir?: ATellInputDir;
+    /**
+     * BCP-47 locale (e.g. `'ar'`, `'fr'`). When set, country names render localized via
+     * `Intl.DisplayNames` and the format hint uses the locale's numerals.
+     */
+    locale?: string;
+    /**
+     * Localized UI strings. A single bag covering the picker, validation errors, and a11y
+     * labels. Individual props (`searchPlaceholder`, `emptyText`, `loadingText`,
+     * `errorMessages`) take precedence over the matching `messages` key when both are set.
+     */
+    messages?: TellInputMessagesInput;
     /**
      * Whitelist of allowed dial-digit codes (no `+`), e.g. `['20', '966']`.
      * Countries outside this list are still shown in the picker but rendered as disabled.
@@ -854,6 +890,9 @@ export declare interface CountryOption<T = RestCountry> {
 
 export declare const DEFAULT_ERROR_MESSAGES: Record<PhoneValidationReason, string>;
 
+/** English defaults for every {@link TellInputMessages} key. */
+export declare const DEFAULT_MESSAGES: TellInputMessages;
+
 export declare const DEFAULT_SIZE: Size;
 
 /**
@@ -917,6 +956,30 @@ declare interface ExtendedProps extends ATellInputProps {
 
 export declare type FlagUrlBuilder = (iso2: string, width: number) => string;
 
+/**
+ * Base code points of contiguous decimal-digit blocks. Each block runs `base`‥`base+9`
+ * for digit `0`‥`9`, so the ASCII digit is `codePoint - base`. Add a script by appending
+ * one entry here.
+ */
+export declare const LOCALE_DIGIT_RANGES: {
+    name: string;
+    base: number;
+}[];
+
+/**
+ * Return a copy of the country list with display names localized to `locale` via
+ * `Intl.DisplayNames`. `search_key` is rebuilt (keeping the English name too) so search
+ * still matches either spelling. Unknown locales / regions fall back to the English name.
+ */
+export declare function localizeCountries(list: CountryOption[], locale?: string): CountryOption[];
+
+/**
+ * Replace any supported non-ASCII decimal digit with its ASCII equivalent. Every other
+ * character (spaces, `+`, separators, letters) is left untouched — callers still run their
+ * own `\D` cleanup afterwards.
+ */
+export declare function normalizeDigits(input: string): string;
+
 export declare interface PhoneRequiredInfo {
     iso2: string;
     dial_code: string;
@@ -949,6 +1012,12 @@ export declare interface PhoneValidationResult {
     details?: Record<string, unknown>;
 }
 
+/**
+ * Merge a partial `messages` override onto the English defaults. Used internally by
+ * `ATellInput` to resolve a complete {@link TellInputMessages} object.
+ */
+export declare function resolveMessages(input?: TellInputMessagesInput): TellInputMessages;
+
 export declare interface RestCountry {
     name?: {
         common?: string;
@@ -978,6 +1047,36 @@ export declare type Size = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 
 export declare const SIZES: readonly Size[];
 
+/**
+ * Every user-facing string in the tell-input UI, bundled so a consumer can localize the
+ * component in one prop. Each key has an English default in {@link DEFAULT_MESSAGES}.
+ */
+export declare interface TellInputMessages {
+    /** Placeholder of the country-picker search box. */
+    searchPlaceholder: string;
+    /** Shown when a search yields no countries. */
+    emptyText: string;
+    /** Shown while the country list is loading. */
+    loadingText: string;
+    /** Header of the "Suggested" group (current + recent picks). */
+    suggestedLabel: string;
+    /** Header of the full country list. */
+    allCountriesLabel: string;
+    /** Validation error text, keyed by reason. */
+    errorMessages: Record<PhoneValidationReason, string>;
+    /** Prefix of the country trigger's `aria-label`, e.g. `"Country: Egypt"`. */
+    countryLabel: string;
+    /** `aria-label` of the country trigger when no country is selected. */
+    selectCountryLabel: string;
+    /** `aria-label` of the phone input element. */
+    phoneInputLabel: string;
+}
+
+/** Partial override shape for the `messages` prop — every key (and every error reason) is optional. */
+export declare type TellInputMessagesInput = Partial<Omit<TellInputMessages, 'errorMessages'>> & {
+    errorMessages?: Partial<Record<PhoneValidationReason, string>>;
+};
+
 /**
  * Reactive wrapper. Kicks off detection in `onMounted` so SSR renders an empty value and the
  * client patches in the real country once resolved.
@@ -1007,7 +1106,7 @@ export declare interface UsePhoneValidationReturn {
     getRequiredInfo(country: {
         iso2: string;
         dial_code?: string;
-    }): PhoneRequiredInfo | null;
+    }, locale?: string): PhoneRequiredInfo | null;
     validate(input: ValidateArgs): PhoneValidationResult;
 }
 
@@ -1017,12 +1116,16 @@ export declare type ValidateArgs = {
         dial_code?: string;
     } | null | undefined;
     phone?: undefined;
+    /** BCP-47 locale — localizes the numerals in the returned `required.format_hint`. */
+    locale?: string;
 } | {
     country: {
         iso2: string;
         dial_code?: string;
     } | null | undefined;
     phone: string | null;
+    /** BCP-47 locale — localizes the numerals in the returned `required.format_hint`. */
+    locale?: string;
 };
 
 export { }

package/dist/index.mjs

@@ -1,37 +1,43 @@
-import { _ as a } from "./chunks/AInput.vue_vue_type_script_setup_true_lang-BJUP7ePq.mjs";
-import { _ as s, a as t, b as n } from "./chunks/APopoverContent.vue_vue_type_script_setup_true_lang-BRqULKIg.mjs";
-import { _ as A, a as l, b as i, c } from "./chunks/ADrawerContent.vue_vue_type_script_setup_true_lang-BivIZvV1.mjs";
-import { _ as u, a as v, b as f } from "./chunks/AResponsivePopoverContent.vue_vue_type_script_setup_true_lang-CCGyy9Lp.mjs";
-import { _ as D, a as P, b as S, D as T, c as _, d, e as m, u as C, f as E } from "./chunks/ATellInput.vue_vue_type_script_setup_true_lang-B4lyNu_f.mjs";
-import { c as b } from "./chunks/cn-B6yFEsav.mjs";
-import { D as I, S as w, c as F, a as h, b as U, d as H } from "./chunks/sizes-B_9MfLkz.mjs";
+import { _ as o } from "./chunks/AInput.vue_vue_type_script_setup_true_lang-BJUP7ePq.mjs";
+import { _ as s, a as t, b as n, c as A } from "./chunks/APopoverContent.vue_vue_type_script_setup_true_lang-o1XhV9DM.mjs";
+import { _ as p, a as i, b as c, c as g } from "./chunks/ADrawerContent.vue_vue_type_script_setup_true_lang-BivIZvV1.mjs";
+import { _ as S, a as u, b as D } from "./chunks/AResponsivePopoverContent.vue_vue_type_script_setup_true_lang-BYEb5UBL.mjs";
+import { _, a as P, b as T, D as f, c as x, L as C, d as m, e as d, f as I, l as R, n as y, r as L, u as b, g as F } from "./chunks/ATellInput.vue_vue_type_script_setup_true_lang-Bv_lLV_l.mjs";
+import { c as G } from "./chunks/cn-B6yFEsav.mjs";
+import { D as U, S as h, c as z, a as M, b as H, d as V } from "./chunks/sizes-B_9MfLkz.mjs";
 export {
-  D as ACountryFlag,
+  _ as ACountryFlag,
   P as ACountrySelect,
-  A as ADrawer,
-  l as ADrawerContent,
-  i as ADrawerOverlay,
-  c as ADrawerTrigger,
-  a as AInput,
+  p as ADrawer,
+  i as ADrawerContent,
+  c as ADrawerOverlay,
+  g as ADrawerTrigger,
+  o as AInput,
   s as APopover,
   t as APopoverContent,
-  n as APopoverTrigger,
-  u as AResponsivePopover,
-  v as AResponsivePopoverContent,
-  f as AResponsivePopoverTrigger,
-  S as ATellInput,
-  T as DEFAULT_ERROR_MESSAGES,
-  I as DEFAULT_SIZE,
-  w as SIZES,
-  _ as aTellInputVariants,
-  b as cn,
-  F as controlHeight,
-  h as controlHeightPx,
-  U as controlPaddingX,
-  H as controlTextSize,
+  n as APopoverOverlay,
+  A as APopoverTrigger,
+  S as AResponsivePopover,
+  u as AResponsivePopoverContent,
+  D as AResponsivePopoverTrigger,
+  T as ATellInput,
+  f as DEFAULT_ERROR_MESSAGES,
+  x as DEFAULT_MESSAGES,
+  U as DEFAULT_SIZE,
+  C as LOCALE_DIGIT_RANGES,
+  h as SIZES,
+  m as aTellInputVariants,
+  G as cn,
+  z as controlHeight,
+  M as controlHeightPx,
+  H as controlPaddingX,
+  V as controlTextSize,
   d as defaultFlagUrl,
-  m as detectCountry,
-  C as useCountryDetection,
-  E as usePhoneValidation
+  I as detectCountry,
+  R as localizeCountries,
+  y as normalizeDigits,
+  L as resolveMessages,
+  b as useCountryDetection,
+  F as usePhoneValidation
 };
 //# sourceMappingURL=index.mjs.map

package/dist/popover.d.ts

@@ -41,11 +41,17 @@ overlay: boolean;
 
 declare type __VLS_Props = PopoverContentProps & {
     class?: HTMLAttributes['class'];
-    /** Render a dimmed, clickable backdrop behind the popover. Pair with `<APopover modal>`. */
+    /** Dim the entire viewport behind the popover and block all interaction with the
+     *  page (clicks are captured by the overlay; body scroll is locked while open).
+     *  Pair with `<APopover :modal="true">` (the default) for the full modal behaviour. */
     overlay?: boolean;
     overlayClass?: HTMLAttributes['class'];
 };
 
+declare type __VLS_Props_2 = {
+    class?: HTMLAttributes['class'];
+};
+
 declare function __VLS_template(): {
     attrs: Partial<{}>;
     slots: {
@@ -104,6 +110,8 @@ export declare const APopover: __VLS_WithTemplateSlots<typeof __VLS_component, _
 
 export declare const APopoverContent: __VLS_WithTemplateSlots_3<typeof __VLS_component_3, __VLS_TemplateResult_3["slots"]>;
 
+export declare const APopoverOverlay: DefineComponent<__VLS_Props_2, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_2> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+
 export declare const APopoverTrigger: __VLS_WithTemplateSlots_2<typeof __VLS_component_2, __VLS_TemplateResult_2["slots"]>;
 
 export { }

package/dist/popover.mjs

@@ -1,7 +1,8 @@
-import { _ as e, a, b as p } from "./chunks/APopoverContent.vue_vue_type_script_setup_true_lang-BRqULKIg.mjs";
+import { _ as e, a, b as p, c as v } from "./chunks/APopoverContent.vue_vue_type_script_setup_true_lang-o1XhV9DM.mjs";
 export {
   e as APopover,
   a as APopoverContent,
-  p as APopoverTrigger
+  p as APopoverOverlay,
+  v as APopoverTrigger
 };
 //# sourceMappingURL=popover.mjs.map

package/dist/responsive-popover.mjs

@@ -1,4 +1,4 @@
-import { _ as s, a as p, b as r } from "./chunks/AResponsivePopoverContent.vue_vue_type_script_setup_true_lang-CCGyy9Lp.mjs";
+import { _ as s, a as p, b as r } from "./chunks/AResponsivePopoverContent.vue_vue_type_script_setup_true_lang-BYEb5UBL.mjs";
 export {
   s as AResponsivePopover,
   p as AResponsivePopoverContent,

package/dist/tell-input.d.ts

@@ -49,6 +49,8 @@ emptyText: string;
 loadingText: string;
 suggestedLabel: string;
 allCountriesLabel: string;
+countryLabel: string;
+selectCountryLabel: string;
 suggestedLimit: number;
 maxResults: number;
 kbdOpen: string | null;
@@ -96,6 +98,12 @@ declare type __VLS_Props_2 = {
     /** Override the right-side kbd hints. Pass `null` to hide. */
     kbdOpen?: string | null;
     kbdClose?: string | null;
+    /** BCP-47 locale — country names render localized via `Intl.DisplayNames`. */
+    locale?: string;
+    /** Prefix of the trigger's `aria-label` when a country is selected, e.g. `"Country"`. */
+    countryLabel?: string;
+    /** Trigger's `aria-label` when no country is selected. */
+    selectCountryLabel?: string;
 };
 
 declare type __VLS_Props_3 = {
@@ -391,12 +399,32 @@ export declare const ACountrySelect: __VLS_WithTemplateSlots_2<typeof __VLS_comp
 
 export declare const ATellInput: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 
+/** Text direction for the field. `'auto'` (or omitting the prop) inherits from the
+ *  nearest `[dir]` ancestor / `<html dir>`; `'ltr'` / `'rtl'` force it. */
+export declare type ATellInputDir = 'ltr' | 'rtl' | 'auto';
+
 export declare interface ATellInputProps {
     class?: HTMLAttributes['class'];
     placeholder?: string;
     disabled?: boolean;
     loading?: boolean;
     size?: ATellInputSize;
+    /**
+     * Text direction. Omit (or pass `'auto'`) to inherit from the page — RTL pages get an
+     * RTL field automatically. Pass `'ltr'` / `'rtl'` to force it.
+     */
+    dir?: ATellInputDir;
+    /**
+     * BCP-47 locale (e.g. `'ar'`, `'fr'`). When set, country names render localized via
+     * `Intl.DisplayNames` and the format hint uses the locale's numerals.
+     */
+    locale?: string;
+    /**
+     * Localized UI strings. A single bag covering the picker, validation errors, and a11y
+     * labels. Individual props (`searchPlaceholder`, `emptyText`, `loadingText`,
+     * `errorMessages`) take precedence over the matching `messages` key when both are set.
+     */
+    messages?: TellInputMessagesInput;
     /**
      * Whitelist of allowed dial-digit codes (no `+`), e.g. `['20', '966']`.
      * Countries outside this list are still shown in the picker but rendered as disabled.
@@ -467,6 +495,9 @@ export declare interface CountryOption<T = RestCountry> {
 
 export declare const DEFAULT_ERROR_MESSAGES: Record<PhoneValidationReason, string>;
 
+/** English defaults for every {@link TellInputMessages} key. */
+export declare const DEFAULT_MESSAGES: TellInputMessages;
+
 /**
  * Default flag URL builder — flagcdn.com hosts PNG flags at multiple widths and is
  * generous with caching + no API key required. Swap via the `flagUrl` prop on
@@ -528,6 +559,30 @@ declare interface ExtendedProps extends ATellInputProps {
 
 export declare type FlagUrlBuilder = (iso2: string, width: number) => string;
 
+/**
+ * Base code points of contiguous decimal-digit blocks. Each block runs `base`‥`base+9`
+ * for digit `0`‥`9`, so the ASCII digit is `codePoint - base`. Add a script by appending
+ * one entry here.
+ */
+export declare const LOCALE_DIGIT_RANGES: {
+    name: string;
+    base: number;
+}[];
+
+/**
+ * Return a copy of the country list with display names localized to `locale` via
+ * `Intl.DisplayNames`. `search_key` is rebuilt (keeping the English name too) so search
+ * still matches either spelling. Unknown locales / regions fall back to the English name.
+ */
+export declare function localizeCountries(list: CountryOption[], locale?: string): CountryOption[];
+
+/**
+ * Replace any supported non-ASCII decimal digit with its ASCII equivalent. Every other
+ * character (spaces, `+`, separators, letters) is left untouched — callers still run their
+ * own `\D` cleanup afterwards.
+ */
+export declare function normalizeDigits(input: string): string;
+
 export declare interface PhoneRequiredInfo {
     iso2: string;
     dial_code: string;
@@ -560,6 +615,12 @@ export declare interface PhoneValidationResult {
     details?: Record<string, unknown>;
 }
 
+/**
+ * Merge a partial `messages` override onto the English defaults. Used internally by
+ * `ATellInput` to resolve a complete {@link TellInputMessages} object.
+ */
+export declare function resolveMessages(input?: TellInputMessagesInput): TellInputMessages;
+
 export declare interface RestCountry {
     name?: {
         common?: string;
@@ -587,6 +648,36 @@ declare function selectCountry(option: CountryOption): void;
  */
 declare type Size = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 
+/**
+ * Every user-facing string in the tell-input UI, bundled so a consumer can localize the
+ * component in one prop. Each key has an English default in {@link DEFAULT_MESSAGES}.
+ */
+export declare interface TellInputMessages {
+    /** Placeholder of the country-picker search box. */
+    searchPlaceholder: string;
+    /** Shown when a search yields no countries. */
+    emptyText: string;
+    /** Shown while the country list is loading. */
+    loadingText: string;
+    /** Header of the "Suggested" group (current + recent picks). */
+    suggestedLabel: string;
+    /** Header of the full country list. */
+    allCountriesLabel: string;
+    /** Validation error text, keyed by reason. */
+    errorMessages: Record<PhoneValidationReason, string>;
+    /** Prefix of the country trigger's `aria-label`, e.g. `"Country: Egypt"`. */
+    countryLabel: string;
+    /** `aria-label` of the country trigger when no country is selected. */
+    selectCountryLabel: string;
+    /** `aria-label` of the phone input element. */
+    phoneInputLabel: string;
+}
+
+/** Partial override shape for the `messages` prop — every key (and every error reason) is optional. */
+export declare type TellInputMessagesInput = Partial<Omit<TellInputMessages, 'errorMessages'>> & {
+    errorMessages?: Partial<Record<PhoneValidationReason, string>>;
+};
+
 /**
  * Reactive wrapper. Kicks off detection in `onMounted` so SSR renders an empty value and the
  * client patches in the real country once resolved.
@@ -616,7 +707,7 @@ export declare interface UsePhoneValidationReturn {
     getRequiredInfo(country: {
         iso2: string;
         dial_code?: string;
-    }): PhoneRequiredInfo | null;
+    }, locale?: string): PhoneRequiredInfo | null;
     validate(input: ValidateArgs): PhoneValidationResult;
 }
 
@@ -626,12 +717,16 @@ export declare type ValidateArgs = {
         dial_code?: string;
     } | null | undefined;
     phone?: undefined;
+    /** BCP-47 locale — localizes the numerals in the returned `required.format_hint`. */
+    locale?: string;
 } | {
     country: {
         iso2: string;
         dial_code?: string;
     } | null | undefined;
     phone: string | null;
+    /** BCP-47 locale — localizes the numerals in the returned `required.format_hint`. */
+    locale?: string;
 };
 
 export { }