npm - @alikhalilll/ui - Versions diffs - 1.1.0 → 1.2.0 - Mend

@alikhalilll/ui 1.1.0 → 1.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (20) hide show

package/dist/tell-input.mjs CHANGED Viewed

@@ -1,13 +1,18 @@
-import { _ as e, a as s, b as l, D as n, c as u, d as o, e as r, u as A, f as c } from "./chunks/ATellInput.vue_vue_type_script_setup_true_lang-B4lyNu_f.mjs";
+import { _ as e, a as t, b as l, D as n, c as o, L as r, d as u, e as i, f as A, l as E, n as S, r as C, u as D, g as _ } from "./chunks/ATellInput.vue_vue_type_script_setup_true_lang-Bv_lLV_l.mjs";
 export {
   e as ACountryFlag,
-  s as ACountrySelect,
+  t as ACountrySelect,
   l as ATellInput,
   n as DEFAULT_ERROR_MESSAGES,
+  o as DEFAULT_MESSAGES,
+  r as LOCALE_DIGIT_RANGES,
   u as aTellInputVariants,
-  o as defaultFlagUrl,
-  r as detectCountry,
-  A as useCountryDetection,
-  c as usePhoneValidation
+  i as defaultFlagUrl,
+  A as detectCountry,
+  E as localizeCountries,
+  S as normalizeDigits,
+  C as resolveMessages,
+  D as useCountryDetection,
+  _ as usePhoneValidation
 };
 //# sourceMappingURL=tell-input.mjs.map

package/entries/tell-input/README.md CHANGED Viewed

@@ -1,6 +1,6 @@
 # `@alikhalilll/ui/tell-input`
-Vue 3 phone-number input with smart country detection (libphonenumber-js + IP/timezone/locale hint), a responsive popover/drawer country picker, and a structured `PhoneValidationResult` exposed via template ref.
+Vue 3 phone-number input with smart country detection (libphonenumber-js + IP/timezone/locale hint), a responsive popover/drawer country picker, and a structured `PhoneValidationResult` exposed via template ref. RTL-aware, localisable, and accepts alternative numeral systems.
 ## Install
@@ -31,7 +31,22 @@ const country = ref<number | null>(null);
 </template>
 ```
-The default shape is a plain phone input with the country picker hidden. As the user types or pastes, detection runs (debounced) against known dial codes; on first match the picker slides in pre-filled and `phone` is normalised to the national significant number — `01066105963` becomes `1066105963`, `+447911123456` becomes `7911123456`.
+The default shape is a plain phone input with the country picker hidden. As the user types or pastes, detection runs (debounced) against known dial codes; on first match a flag-only trigger reveals at the **end** of the field, the dial code shows as a static prefix inside the input, and `phone` is normalised to the national significant number — `01066105963` becomes `1066105963`, `+447911123456` becomes `7911123456`.
+## Internationalization
+- **RTL** — direction inherits from the page (`<div dir="rtl">` / `<html dir="rtl">`), or force it with `dir="ltr"` / `dir="rtl"`. The phone field row stays LTR (dial prefix → digits → flag); only the helper/error text and the country popover follow the page direction.
+- **`locale`** — localises country names (`Intl.DisplayNames`) and the format-hint numerals.
+- **`messages`** — one bag for every UI string (picker labels, validation errors, a11y labels).
+- **Alternative numerals** — digits typed as Arabic-Indic (`٠-٩`), Persian (`۰-۹`), Devanagari, or Bengali are normalised to ASCII. `normalizeDigits` is exported for standalone use.
+```vue
+<template>
+  <div dir="rtl">
+    <ATellInput v-model:phone="phone" v-model:country="country" locale="ar" :messages="ar" />
+  </div>
+</template>
+```
 ## Variants

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@alikhalilll/ui",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "description": "Headless, shadcn-vue style Vue 3 component library — every component is its own importable subpath (`@alikhalilll/ui/tell-input`, `@alikhalilll/ui/popover`, …) so users pay only for what they actually use.",
   "license": "MIT",
   "author": "alikhalilll",

package/dist/chunks/APopoverContent.vue_vue_type_script_setup_true_lang-BRqULKIg.mjs DELETED Viewed

@@ -1,103 +0,0 @@
-import { defineComponent as p, openBlock as n, createBlock as c, unref as e, mergeProps as u, withCtx as l, renderSlot as f, normalizeProps as g, guardReactiveProps as B, createElementBlock as _, normalizeClass as P, createCommentVNode as h, createVNode as b } from "vue";
-import { useForwardPropsEmits as v, PopoverRoot as w, useForwardProps as C, PopoverTrigger as O, PopoverPortal as A, PopoverContent as k } from "reka-ui";
-import { reactiveOmit as z } from "@vueuse/core";
-import { c as y } from "./cn-B6yFEsav.mjs";
-const D = /* @__PURE__ */ p({
-  __name: "APopover",
-  props: {
-    defaultOpen: { type: Boolean },
-    open: { type: Boolean },
-    modal: { type: Boolean, default: !0 }
-  },
-  emits: ["update:open"],
-  setup(t, { emit: a }) {
-    const r = v(t, a);
-    return (i, d) => (n(), c(e(w), u({ "data-slot": "popover" }, e(r)), {
-      default: l((m) => [
-        f(i.$slots, "default", g(B(m)))
-      ]),
-      _: 3
-    }, 16));
-  }
-}), E = /* @__PURE__ */ p({
-  __name: "APopoverTrigger",
-  props: {
-    asChild: { type: Boolean },
-    as: {}
-  },
-  setup(t) {
-    const o = C(t);
-    return (s, r) => (n(), c(e(O), u({ "data-slot": "popover-trigger" }, e(o)), {
-      default: l(() => [
-        f(s.$slots, "default")
-      ]),
-      _: 3
-    }, 16));
-  }
-}), j = /* @__PURE__ */ p({
-  inheritAttrs: !1,
-  __name: "APopoverContent",
-  props: {
-    forceMount: { type: Boolean },
-    side: {},
-    sideOffset: { default: 4 },
-    sideFlip: { type: Boolean },
-    align: { default: "center" },
-    alignOffset: {},
-    alignFlip: { type: Boolean },
-    avoidCollisions: { type: Boolean },
-    collisionBoundary: {},
-    collisionPadding: {},
-    arrowPadding: {},
-    hideShiftedArrow: { type: Boolean },
-    sticky: {},
-    hideWhenDetached: { type: Boolean },
-    positionStrategy: {},
-    updatePositionStrategy: {},
-    disableUpdateOnLayoutShift: { type: Boolean },
-    prioritizePosition: { type: Boolean },
-    reference: {},
-    asChild: { type: Boolean },
-    as: {},
-    disableOutsidePointerEvents: { type: Boolean },
-    class: { type: [Boolean, null, String, Object, Array] },
-    overlay: { type: Boolean, default: !1 },
-    overlayClass: { type: [Boolean, null, String, Object, Array] }
-  },
-  emits: ["escapeKeyDown", "pointerDownOutside", "focusOutside", "interactOutside", "openAutoFocus", "closeAutoFocus"],
-  setup(t, { emit: a }) {
-    const o = t, s = a, r = z(o, "class", "overlay", "overlayClass"), i = v(r, s);
-    return (d, m) => (n(), c(e(A), null, {
-      default: l(() => [
-        o.overlay ? (n(), _("div", {
-          key: 0,
-          "data-slot": "popover-overlay",
-          class: P(
-            e(y)(
-              "fixed inset-0 z-40 bg-black/60 backdrop-blur-sm pointer-events-auto data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-              o.overlayClass
-            )
-          )
-        }, null, 2)) : h("", !0),
-        b(e(k), u({ "data-slot": "popover-content" }, { ...d.$attrs, ...e(i) }, {
-          class: e(y)(
-            "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 rounded-md border p-4 shadow-md outline-none",
-            o.class
-          )
-        }), {
-          default: l(() => [
-            f(d.$slots, "default")
-          ]),
-          _: 3
-        }, 16, ["class"])
-      ]),
-      _: 3
-    }));
-  }
-});
-export {
-  D as _,
-  j as a,
-  E as b
-};
-//# sourceMappingURL=APopoverContent.vue_vue_type_script_setup_true_lang-BRqULKIg.mjs.map

package/dist/chunks/APopoverContent.vue_vue_type_script_setup_true_lang-BRqULKIg.mjs.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"APopoverContent.vue_vue_type_script_setup_true_lang-BRqULKIg.mjs","sources":["../../entries/popover/components/APopover.vue","../../entries/popover/components/APopoverTrigger.vue","../../entries/popover/components/APopoverContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { PopoverRootEmits, PopoverRootProps } from 'reka-ui';\nimport { PopoverRoot, useForwardPropsEmits } from 'reka-ui';\n\n/**\n * Defaults `modal` to `true` so the popover locks page scroll, traps focus, and an overlay\n * (rendered by APopoverContent when `overlay` is set) actually dims the page.\n * Pass `:modal=\"false\"` for tooltip-style non-modal popovers.\n */\nconst props = withDefaults(defineProps<PopoverRootProps>(), { modal: true });\nconst emits = defineEmits<PopoverRootEmits>();\nconst forwarded = useForwardPropsEmits(props, emits);\n</script>\n\n<template>\n <PopoverRoot v-slot=\"slotProps\" data-slot=\"popover\" v-bind=\"forwarded\">\n <slot v-bind=\"slotProps\" />\n </PopoverRoot>\n</template>\n","<script setup lang=\"ts\">\nimport type { PopoverTriggerProps } from 'reka-ui';\nimport { PopoverTrigger, useForwardProps } from 'reka-ui';\n\nconst props = defineProps<PopoverTriggerProps>();\nconst forwarded = useForwardProps(props);\n</script>\n\n<template>\n <PopoverTrigger data-slot=\"popover-trigger\" v-bind=\"forwarded\">\n <slot />\n </PopoverTrigger>\n</template>\n","<script setup lang=\"ts\">\nimport type { HTMLAttributes } from 'vue';\nimport { reactiveOmit } from '@vueuse/core';\nimport {\n PopoverContent,\n type PopoverContentEmits,\n type PopoverContentProps,\n PopoverPortal,\n useForwardPropsEmits,\n} from 'reka-ui';\nimport { cn } from '@/utils';\n\ndefineOptions({ inheritAttrs: false });\n\nconst props = withDefaults(\n defineProps<\n PopoverContentProps & {\n class?: HTMLAttributes['class'];\n /** Render a dimmed, clickable backdrop behind the popover. Pair with `<APopover modal>`. */\n overlay?: boolean;\n overlayClass?: HTMLAttributes['class'];\n }\n >(),\n { align: 'center', sideOffset: 4, overlay: false }\n);\nconst emits = defineEmits<PopoverContentEmits>();\nconst delegated = reactiveOmit(props, 'class', 'overlay', 'overlayClass');\nconst forwarded = useForwardPropsEmits(delegated, emits);\n</script>\n\n<template>\n <PopoverPortal>\n \n <div\n v-if=\"props.overlay\"\n data-slot=\"popover-overlay\"\n :class=\"\n cn(\n 'fixed inset-0 z-40 bg-black/60 backdrop-blur-sm pointer-events-auto data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n props.overlayClass\n )\n \"\n />\n <PopoverContent\n data-slot=\"popover-content\"\n v-bind=\"{ ...$attrs, ...forwarded }\"\n :class=\"\n cn(\n 'bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 rounded-md border p-4 shadow-md outline-none',\n props.class\n )\n \"\n >\n <slot />\n </PopoverContent>\n </PopoverPortal>\n</template>\n"],"names":["forwarded","useForwardPropsEmits","__props","__emit","_openBlock","_createBlock","_unref","_mergeProps","_withCtx","slotProps","_renderSlot","_ctx","useForwardProps","props","emits","delegated","reactiveOmit","PopoverPortal","_createElementBlock","_normalizeClass","cn","_createVNode","PopoverContent","$attrs"],"mappings":";;;;;;;;;;;;;AAWA,UAAMA,IAAYC,EAFJC,GACAC,CACqC;sBAIjDC,EAAA,GAAAC,EAEcC,MAFdC,EAEc,EAFkB,aAAU,UAAA,GAAkBD,EAAAN,CAAA,CAAS,GAAA;AAAA,MACnE,SAAAQ,EAAA,CADmBC,MAAS;AAAA,QAC5BC,EAA2BC,yBAAbF,CAAS,CAAA,CAAA;AAAA,MAAA;;;;;;;;;;;ACX3B,UAAMT,IAAYY,EADJV,CACyB;sBAIrCE,EAAA,GAAAC,EAEiBC,MAFjBC,EAEiB,EAFD,aAAU,kBAAA,GAA0BD,EAAAN,CAAA,CAAS,GAAA;AAAA,iBAC3D,MAAQ;AAAA,QAARU,EAAQC,EAAA,QAAA,SAAA;AAAA,MAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACIZ,UAAME,IAAQX,GAWRY,IAAQX,GACRY,IAAYC,EAAaH,GAAO,SAAS,WAAW,cAAc,GAClEb,IAAYC,EAAqBc,GAAWD,CAAK;2BAIrDT,EA6BgBC,EAAAW,CAAA,GAAA,MAAA;AAAA,iBAtBd,MASE;AAAA,QARMJ,EAAM,gBADdK,EASE,OAAA;AAAA;UAPA,aAAU;AAAA,UACT,OAAKC;AAAAA,YAAWb,EAAAc,CAAA;AAAA;cAAuNP,EAAM;AAAA,YAAA;AAAA;;QAOhPQ,EAWiBf,EAAAgB,CAAA,GAXjBf,EAWiB,EAVf,aAAU,kBAAA,GAAiB,EAAA,GACdgB,EAAAA,QAAM,GAAKjB,EAAAN,CAAA,KAAS;AAAA,UAChC,OAAgBM,EAAAc,CAAA;AAAA;YAAscP,EAAM;AAAA,UAAA;AAAA;qBAO7d,MAAQ;AAAA,YAARH,EAAQC,EAAA,QAAA,SAAA;AAAA,UAAA;;;;;;;;"}