mada-design-system 0.9.1 → 1.0.1

package/index.es83.js

@@ -1,17 +1,77 @@
-import { useState as n } from "react";
-function s({
-  timeout: e = 2e3,
-  onCopy: o
-} = {}) {
-  const [t, r] = n(!1);
-  return { isCopied: t, copyToClipboard: (i) => {
-    typeof window > "u" || !navigator.clipboard.writeText || i && navigator.clipboard.writeText(i).then(() => {
-      r(!0), o && o(), e !== 0 && setTimeout(() => {
-        r(!1);
-      }, e);
-    }, console.error);
-  } };
-}
+import { jsx as s } from "react/jsx-runtime";
+import * as t from "@radix-ui/react-toggle";
+import { cva as n } from "./index.es113.js";
+import * as i from "react";
+import { cn as b } from "./index.es94.js";
+const c = n(
+  `group inline-flex items-center justify-center gap-space-01 transition-colors text-text-default data-[state=on]:font-semibold
+     disabled:text-disabled-text-default-disabled  disabled:pointer-events-none disabled:cursor-not-allowed focus:outline focus:outline-2 focus:outline-offset-1 focus:outline-black
+     `,
+  {
+    variants: {
+      variant: {
+        default: "",
+        outline: "border border-border-neutral-primary disabled:border-disabled disabled:data-[state=on]:bg-disabled-background-disabled disabled:data-[state=on]:border-none"
+      },
+      size: {
+        default: "px-space-04 py-space-02 h-[40px] text-body-02 font-medium [&>svg]:size-space-05",
+        sm: "px-space-03 py-space-01 h-[32px] text-body-01 [&>svg]:size-[20px]",
+        xs: "px-space-03 py-space-01  h-[24px] text-caption-01 [&>svg]:size-space-04",
+        icon: "p-space-02 size-[40px] [&>svg]:size-space-05",
+        "icon-sm": "p-space-02 size-[32px] [&>svg]:size-[20px]",
+        "icon-xs": "p-space-01 size-[24px] [&>svg]:size-space-04",
+        fit: ""
+      },
+      rounded: {
+        default: "rounded",
+        full: "rounded-full"
+      },
+      colors: {
+        default: `hover:bg-button-background-primary-light-hovered
+                         hover:border-button-background-primary-light-hovered
+                         hover:text-text-primary
+                         active:text-text-primary
+                         data-[state=on]:bg-button-background-primary
+                         data-[state=on]:text-text-oncolor-primary
+                         hover:data-[state=on]:bg-button-background-primary-hovered
+                         hover:data-[state=on]:border-button-background-primary-hovered
+                         hover:data-[state=on]:text-text-oncolor-primary
+                         active:data-[state=on]:text-text-oncolor-primary
+                         active:bg-button-background-primary-light-pressed
+                         active:border-button-background-primary-light-pressed
+                         active:data-[state=on]:bg-button-background-primary-pressed`,
+        gray: `hover:bg-button-background-neutral-pressed
+                       active:bg-button-background-neutral-selected
+                       active:data-[state=on]:bg-button-background-black-pressed
+                       data-[state=on]:bg-button-background-black
+                       data-[state=on]:text-text-oncolor-primary
+                       hover:data-[state=on]:bg-button-background-black-hovered
+                       hover:data-[state=on]:text-text-oncolor-primary
+                       `,
+        oncolor: `border-border-white-40 text-text-oncolor-primary
+                         hover:bg-button-background-transparent-hovered
+                         active:bg-button-background-transparent-pressed
+                         data-[state=on]:bg-button-background-oncolor
+                         data-[state=on]:text-text-default
+                         hover:data-[state=on]:bg-button-background-oncolor-hovered
+                         active:data-[state=on]:bg-button-background-oncolor-pressed
+                         disabled:text-disabled-text-default-oncolor-disabled
+                         disabled:border-disabled-icon-default-oncolor-disabled
+                         focus:data-[state=off]:outline-border-white-40
+                         focus:-outline-offset-[3px]
+                `
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+      colors: "default",
+      rounded: "default"
+    }
+  }
+), l = i.forwardRef(({ className: e, variant: a, size: o, ...r }, d) => /* @__PURE__ */ s(t.Root, { ref: d, className: b(c({ variant: a, size: o, className: e })), ...r }));
+l.displayName = t.Root.displayName;
 export {
-  s as useCopyToClipboard
+  l as Toggle,
+  c as toggleVariants
 };

package/index.es84.js

@@ -1,24 +1,42 @@
-import { useIsFetching as t } from "@tanstack/react-query";
-function g(c, o, n) {
-  const a = o.getQueryData(c), s = o.getQueryState(c), i = t({ queryKey: c }, o);
-  return {
-    data: n ? n(a) : a,
-    status: (s == null ? void 0 : s.status) ?? "idle",
-    // Default to 'idle' if no status is available
-    isError: !!(s != null && s.error),
-    error: s == null ? void 0 : s.error,
-    // react-query error
-    isFetching: !!i,
-    // Indicates if the query is currently in-progress
-    isPending: (s == null ? void 0 : s.status) === "pending",
-    // Custom pending state if applicable
-    isSuccess: (s == null ? void 0 : s.status) === "success",
-    // Success state if data is available
-    refetch: () => {
-      o.resetQueries({ queryKey: c });
+import { jsx as n } from "react/jsx-runtime";
+import * as i from "@radix-ui/react-toggle-group";
+import * as o from "react";
+import { toggleVariants as f } from "./index.es83.js";
+import { cn as d } from "./index.es94.js";
+import { ResponsiveScroll as g } from "./index.es54.js";
+const p = o.createContext({
+  size: "default",
+  variant: "default",
+  colors: "default",
+  rounded: "default"
+}), x = o.forwardRef(({ className: l, variant: t, size: r, colors: a, rounded: s, children: m, ...c }, u) => {
+  const e = o.useMemo(() => ({ variant: t, size: r, colors: a, rounded: s }), [t, r, a, s]);
+  return /* @__PURE__ */ n(g, { buttonClassName: "bg-background", children: /* @__PURE__ */ n(i.Root, { ref: u, className: d("flex items-center justify-center gap-space-01", l), ...c, children: /* @__PURE__ */ n(p.Provider, { value: e, children: m }) }) });
+});
+x.displayName = i.Root.displayName;
+const N = o.forwardRef(({ className: l, children: t, variant: r, size: a, colors: s, rounded: m, ...c }, u) => {
+  const e = o.useContext(p);
+  return /* @__PURE__ */ n(
+    i.Item,
+    {
+      ref: u,
+      className: d(
+        f({
+          variant: e.variant || r,
+          size: e.size || a,
+          colors: e.colors || s,
+          rounded: e.rounded || m
+        }),
+        "shrink-0",
+        l
+      ),
+      ...c,
+      children: t
     }
-  };
-}
+  );
+});
+N.displayName = i.Item.displayName;
 export {
-  g as useCachedData
+  x as ToggleGroup,
+  N as ToggleGroupItem
 };

package/index.es85.js

@@ -1,10 +1,23 @@
-import { produce as u } from "./index.es188.js";
-const d = (a) => (e, t) => {
-  a.setQueryData(e, (r) => typeof t != "function" ? t : u(r, (o) => {
-    t(o);
-  }));
-};
+import { jsx as a } from "react/jsx-runtime";
+import * as o from "@radix-ui/react-tooltip";
+import * as r from "react";
+import { cn as s } from "./index.es94.js";
+const l = o.Provider, f = o.Root, c = o.Trigger, m = r.forwardRef(({ className: t, sideOffset: e = 4, ...i }, d) => /* @__PURE__ */ a(
+  o.Content,
+  {
+    ref: d,
+    sideOffset: e,
+    className: s(
+      "z-[10000] overflow-hidden rounded-md border  bg-popover px-3 py-1.5 text-body-01 text-popover-foreground shadow-md  animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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",
+      t
+    ),
+    ...i
+  }
+));
+m.displayName = o.Content.displayName;
 export {
-  d as default,
-  d as useUpdateCachedData
+  f as Tooltip,
+  m as TooltipContent,
+  l as TooltipProvider,
+  c as TooltipTrigger
 };

package/index.es86.js

@@ -1,89 +1,95 @@
-var h = Object.defineProperty;
-var d = (a, e, t) => e in a ? h(a, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : a[e] = t;
-var i = (a, e, t) => (d(a, typeof e != "symbol" ? e + "" : e, t), t);
-import { UserManager as g, Log as r } from "./index.es185.js";
-import { createIdentityConfig as l, createMetadataConfig as c } from "./index.es99.js";
-import "./index.es2.js";
-import u from "./index.es91.js";
-const s = class s {
-  constructor(e) {
-    i(this, "userManager");
-    i(this, "config");
-    i(this, "user");
-    i(this, "isLoading");
-    i(this, "isAuthenticated");
-    i(this, "error");
-    i(this, "signout", async (e = "") => {
-      var t;
-      this.isLoading = !1, window.location.href = `${(t = this.config) == null ? void 0 : t.oauth20LogoutUrl}${e}`;
+import * as c from "react";
+const d = 3, p = 1e6;
+let u = 0;
+function A() {
+  return u = (u + 1) % Number.MAX_VALUE, u.toString();
+}
+const a = /* @__PURE__ */ new Map(), S = (t) => {
+  if (a.has(t))
+    return;
+  const s = setTimeout(() => {
+    a.delete(t), n({
+      type: "REMOVE_TOAST",
+      toastId: t
     });
-    this.config = e, this.userManager = new g({
-      ...l(e),
-      metadata: c(e.authUrl, (e == null ? void 0 : e.jwks) ?? "UP_Definition")
-    }), this.isAuthenticated = !1, this.isLoading = !1, this.user = null, this.error = void 0, r.setLogger(console), r.setLevel(r.DEBUG), this.setupEventListeners();
+  }, p);
+  a.set(t, s);
+}, f = (t, s) => {
+  switch (s.type) {
+    case "ADD_TOAST":
+      return {
+        ...t,
+        toasts: [s.toast, ...t.toasts].slice(0, d)
+      };
+    case "UPDATE_TOAST":
+      return {
+        ...t,
+        toasts: t.toasts.map((e) => e.id === s.toast.id ? { ...e, ...s.toast } : e)
+      };
+    case "DISMISS_TOAST": {
+      const { toastId: e } = s;
+      return e ? S(e) : t.toasts.forEach((o) => {
+        S(o.id);
+      }), {
+        ...t,
+        toasts: t.toasts.map(
+          (o) => o.id === e || e === void 0 ? {
+            ...o,
+            open: !1
+          } : o
+        )
+      };
+    }
+    case "REMOVE_TOAST":
+      return s.toastId === void 0 ? {
+        ...t,
+        toasts: []
+      } : {
+        ...t,
+        toasts: t.toasts.filter((e) => e.id !== s.toastId)
+      };
   }
-  static getInstance(e) {
-    return s.instance || (s.instance = new s(e)), s.instance;
-  }
-  setupEventListeners() {
-    this.userManager.events.addUserLoaded((e) => {
-      this.user = e, this.isAuthenticated = !(e != null && e.expired), this.error = void 0, this.isLoading = !1;
-    }), this.userManager.events.addUserUnloaded(() => {
-      this.isAuthenticated = !1, this.isLoading = !1, this.user = null, this.error = void 0;
-    }), this.userManager.events.addSilentRenewError((e) => {
-      this.error = e, this.user = null, this.isAuthenticated = !1, this.isLoading = !1;
-    }), this.userManager.events.addAccessTokenExpired(() => {
-      this.refreshToken().then((e) => {
-        if (!e) {
-          const { setExpireSession: t } = u.getState();
-          t();
-        }
-      });
-    }), this.userManager.events.addUserSignedIn(() => {
-      this.isLoading = !1, this.error = void 0;
-    });
-  }
-  hasAuthParams(e = window.location) {
-    let t = new URLSearchParams(e.search);
-    return !!((t.get("code") || t.get("error")) && t.get("state") || (t = new URLSearchParams(e.hash.replace("#", "?")), (t.get("code") || t.get("error")) && t.get("state")));
-  }
-  signin(e = {}) {
-    this.isLoading = !0, this.error = void 0, this.user = null;
-    const { lang: t, ...n } = e;
-    return this.userManager.signinRedirect({
-      state: n,
-      extraQueryParams: {
-        lang: t ?? "ar"
+}, r = [];
+let T = { toasts: [] };
+function n(t) {
+  T = f(T, t), r.forEach((s) => {
+    s(T);
+  });
+}
+function O({ ...t }) {
+  const s = A(), e = (i) => n({
+    type: "UPDATE_TOAST",
+    toast: { ...i, id: s }
+  }), o = () => n({ type: "DISMISS_TOAST", toastId: s });
+  return n({
+    type: "ADD_TOAST",
+    toast: {
+      ...t,
+      id: s,
+      open: !0,
+      onOpenChange: (i) => {
+        i || o();
       }
-    });
-  }
-  completeSignIn() {
-    return this.userManager.signinRedirectCallback().then(async (e) => (this.isLoading = !1, e ? (this.user = e, this.isAuthenticated = !(e != null && e.expired)) : this.user = await this.userManager.getUser(), e)).catch((e) => {
-      throw this.isLoading = !1, this.error = e, Error(e);
-    });
-  }
-  getUser() {
-    return this.isLoading = !0, this.userManager.getUser().then((e) => (e && (this.user = e, this.isAuthenticated = !(e != null && e.expired), this.isLoading = !1), e)).catch((e) => {
-      throw this.error = e, this.isLoading = !1, e;
-    });
-  }
-  async refreshToken() {
-    return this.userManager.signinSilent().then((e) => (e && (this.user = e, this.isAuthenticated = !(e != null && e.expired), localStorage.setItem("accessToken", (e == null ? void 0 : e.id_token) ?? "")), e)).catch((e) => (this.error = e, null));
-  }
-  /**
-   * function to call another url to kill opend session with 'sso service'
-   */
-  async clearSession() {
-    return new Promise((e, t) => {
-      const n = window.open("https://iam-dev.moe.gov.sa/pkmslogout", "_blank", "width=800,height=600,noopener");
-      n ? setTimeout(() => {
-        n.close(), e();
-      }, 1e3) : t(new Error("Unable to open new popup window"));
-    });
-  }
-};
-i(s, "instance", null);
-let o = s;
+    }
+  }), {
+    id: s,
+    dismiss: o,
+    update: e
+  };
+}
+function m() {
+  const [t, s] = c.useState(T);
+  return c.useEffect(() => (r.push(s), () => {
+    const e = r.indexOf(s);
+    e > -1 && r.splice(e, 1);
+  }), [t]), {
+    ...t,
+    toast: O,
+    dismiss: (e) => n({ type: "DISMISS_TOAST", toastId: e })
+  };
+}
 export {
-  o as AuthService
+  f as reducer,
+  O as toast,
+  m as useToast
 };

package/index.es87.js

@@ -1,9 +1,53 @@
-import u from "./index.es91.js";
-const n = () => {
-  const { isAuthenticated: t, user: e, nationalId: o } = u((r) => r);
-  return { isAuthenticated: t, user: e, nationalId: o };
+import { jsxs as R, jsx as t } from "react/jsx-runtime";
+import { useVirtualizer as w } from "./index.es120.js";
+import S, { useRef as N } from "react";
+/* empty css          */
+import { Skeleton as z } from "./index.es75.js";
+import { cn as V } from "./index.es94.js";
+import { ShouldRender as p } from "./index.es19.js";
+const Y = ({
+  items: r,
+  renderItem: x,
+  options: m,
+  className: u,
+  async: c,
+  onAsyncLoad: n,
+  isLoading: s,
+  renderLoader: o,
+  ...d
+}) => {
+  var h;
+  const f = N(null), i = w({
+    count: r.length,
+    getScrollElement: () => f.current,
+    estimateSize: () => 35,
+    // Adjust based on your row height
+    overscan: 5,
+    // Improves scroll performance
+    ...m
+  }), l = i.getVirtualItems();
+  return S.useEffect(() => {
+    if (!c) return;
+    const [e] = [...l].reverse();
+    e && e.index >= r.length - 1 && (n == null || n());
+  }, [r.length, l, c, n]), /* @__PURE__ */ R("div", { ref: f, className: V("overflow-y-auto contain-strict", u), ...d, children: [
+    /* @__PURE__ */ t("div", { className: "relative w-full", style: { height: `${i.getTotalSize()}px` }, children: /* @__PURE__ */ t(
+      "div",
+      {
+        className: "absolute start-0 top-0 w-full",
+        style: {
+          transform: `translateY(${((h = l[0]) == null ? void 0 : h.start) ?? 0}px)`
+        },
+        children: l == null ? void 0 : l.map((e) => {
+          const a = r[e.index], g = e.index > r.length - 1;
+          return /* @__PURE__ */ t("div", { ref: i.measureElement, "data-index": e == null ? void 0 : e.index, children: g ? /* @__PURE__ */ t(z, { className: "h-[35px] w-full" }) : x(a, e) }, e == null ? void 0 : e.index);
+        })
+      }
+    ) }),
+    /* @__PURE__ */ t(p, { shouldRender: !!o, children: o == null ? void 0 : o(s) }),
+    /* @__PURE__ */ t(p, { shouldRender: s && !o, children: /* @__PURE__ */ t("p", { children: s ? "Loading more..." : "Nothing more to load" }) })
+  ] });
 };
 export {
-  n as default,
-  n as useAuth
+  Y as VirtualScroller
 };

package/index.es88.js

@@ -1,6 +1,17 @@
-import t from "react";
-import { AuthContext as o } from "./index.es95.js";
-const u = () => t.useContext(o);
+import { useState as n } from "react";
+function s({
+  timeout: e = 2e3,
+  onCopy: o
+} = {}) {
+  const [t, r] = n(!1);
+  return { isCopied: t, copyToClipboard: (i) => {
+    typeof window > "u" || !navigator.clipboard.writeText || i && navigator.clipboard.writeText(i).then(() => {
+      r(!0), o && o(), e !== 0 && setTimeout(() => {
+        r(!1);
+      }, e);
+    }, console.error);
+  } };
+}
 export {
-  u as useOIDCAuth
+  s as useCopyToClipboard
 };

package/index.es89.js

@@ -1,81 +1,24 @@
-import { clsx as s } from "./index.es133.js";
-import a from "./index.es125.js";
-import u from "./index.es186.js";
-import { strings as c } from "./index.es101.js";
-import { DateFormat as i } from "./index.es164.js";
-import l from "./index.es93.js";
-import { extendTailwindMerge as m } from "./index.es187.js";
-import { useToast as d } from "./index.es81.js";
-const g = m({
-  classGroups: {
-    "font-size": ["text-caption-01", "text-caption-02", "text-subtitle-01", "text-subtitle-02", "text-body-01", "text-body-02"]
-  }
-});
-function $(...t) {
-  return g(s(t));
-}
-const S = {
-  enRegex: /^[a-zA-Z- ]+$/,
-  arRegex: /^[\u0621-\u064A- ]+$/,
-  bothArAndEnRegexonlyLetters: /^[a-zA-Z-\u0621-\u064A ]+$/,
-  bothArAndEnRegexonlyLettersAndNumbers: /^[a-zA-Z0-9-\u0621-\u064A ]+$/,
-  enletterAndNumbersRegex: /^[a-zA-Z0-9]*$/,
-  mobileNumber: /^(5)(\d){8}$/,
-  TelPhone: /^(0096611)(\d){7}$/,
-  nationalId: /^1(\d){9}$/,
-  nationalOrResidentId: /^[12](\d){9}$/,
-  nonSaudianNationalId: /^2(\d){9}$/,
-  tags: /<[^>]*>?/gm,
-  specialCharcter: /[!@#$%^&*()_+\-'~<>/\\?|÷×]/,
-  arSpaceRegex: /^[\u0621-\u064A\s]+$/
-}, M = (t, e) => (!/^[0-9\u0660-\u0669]+$/.test(t.target.value) && t.target.value !== "" && (t.target.value = e), t.target.value = t.target.value.replace(/[٠١٢٣٤٥٦٧٨٩]/g, (n) => String(n.charCodeAt(0) - 1632)).replace(/[۰۱۲۳۴۵۶۷۸۹]/g, (n) => String(n.charCodeAt(0) - 1776)), t), w = (...t) => t.map(
-  (e) => e.split(" ").map((r) => process.env.NODE_ENV === "production" ? `er-${r}` : r).join(" ")
-).join(" "), y = () => {
-  const { lang: t } = l((e) => e);
-  return (e = "", r = "") => String(t).toLocaleLowerCase() === "ar" ? e : r || e;
-};
-function T(t, e) {
-  let r = null;
-  return function(...n) {
-    const o = () => {
-      r = null, t.apply(this, n);
-    };
-    r !== null && clearTimeout(r), r = setTimeout(o, e);
+import { useIsFetching as t } from "@tanstack/react-query";
+function g(c, o, n) {
+  const a = o.getQueryData(c), s = o.getQueryState(c), i = t({ queryKey: c }, o);
+  return {
+    data: n ? n(a) : a,
+    status: (s == null ? void 0 : s.status) ?? "idle",
+    // Default to 'idle' if no status is available
+    isError: !!(s != null && s.error),
+    error: s == null ? void 0 : s.error,
+    // react-query error
+    isFetching: !!i,
+    // Indicates if the query is currently in-progress
+    isPending: (s == null ? void 0 : s.status) === "pending",
+    // Custom pending state if applicable
+    isSuccess: (s == null ? void 0 : s.status) === "success",
+    // Success state if data is available
+    refetch: () => {
+      o.resetQueries({ queryKey: c });
+    }
   };
 }
-const v = (t) => new Intl.DateTimeFormat(t === "rtl" ? "ar" : "en", { day: "2-digit", month: "short", year: "numeric" }), R = (t) => new Intl.DateTimeFormat(t === "rtl" ? "ar" : "en", { timeStyle: "short" }), L = ({
-  date: t,
-  format: e,
-  isHijri: r = !1,
-  hasHijriFormat: n
-}) => {
-  const o = document.dir === "rtl";
-  switch (a.updateLocale(o ? "ar-sa" : "en", {}), e) {
-    case "short":
-      return a(t).format(o ? i.ArShort : i.EnShort);
-    case "mid":
-      return a(t).format("dddd");
-    case "long":
-      return r ? u(t, n ? "iDD/iMM/iYYYY" : void 0).format(o ? "iYYYY/iM/iD" : "iD/iM/iYYYY") : a(new Date(t ?? ""), "DD-MM-YYYY").format(o ? "YYYY/M/D" : "D/M/YYYY");
-  }
-}, N = (t) => {
-  const { toast: e } = d();
-  navigator.clipboard.writeText(t).then(() => {
-    e({
-      description: c.Shared.CopiedSuccessfully
-    });
-  });
-};
 export {
-  $ as cn,
-  L as dateFormatter,
-  T as debounce,
-  v as formatter,
-  R as formatterTime,
-  M as handleArabicNumbers,
-  S as langRegex,
-  w as tw,
-  g as twMerge,
-  N as useShareLink,
-  y as useSwitchData
+  g as useCachedData
 };

package/index.es9.js

@@ -1,59 +1,18 @@
-import { jsx as s, jsxs as o } from "react/jsx-runtime";
-import { cva as x } from "./index.es111.js";
-import { forwardRef as n } from "react";
-import { cn as i } from "./index.es89.js";
-const b = x("grid border-b border-border-secondary", {
-  variants: {
-    variant: {
-      default: "[&>dt]:text-foreground-secondary",
-      list: "[&>dd]:text-card-foreground"
-    },
-    size: {
-      default: "text-body-01",
-      sm: "text-caption-01"
-    },
-    orientation: {
-      vertical: "grid-cols-1 gap-space-01",
-      horizental: "grid-cols-1   gap-space-02  sm:grid-cols-[min(50%,theme(spacing.80))_auto]"
-    },
-    lastItem: {
-      true: "border-none"
-    },
-    stretch: {
-      true: ""
-    },
-    padding: {
-      default: "p-space-04",
-      none: "p-space-00"
-    }
-  },
-  compoundVariants: [
-    {
-      orientation: "horizental",
-      stretch: !0,
-      className: "sm:grid-cols-2 sm:[&>dd]:text-end"
-    }
-  ],
-  defaultVariants: {
-    orientation: "horizental",
-    variant: "default",
-    padding: "default",
-    size: "default"
-  }
-}), N = n(({ children: e, className: t, ...r }, a) => /* @__PURE__ */ s("div", { ref: a, className: i("rounded-2 bg-background", t), ...r, children: e }));
-N.displayName = "Description";
-const v = n(
-  ({ icon: e, isSingleLine: t = !0, variant: r, title: a, children: d, orientation: c, stretch: l, lastItem: m, size: p, padding: u, className: f, ...g }, h) => /* @__PURE__ */ o("dl", { ref: h, className: i(b({ variant: r, orientation: c, size: p, stretch: l, lastItem: m, padding: u }), f), ...g, children: [
-    /* @__PURE__ */ o("dt", { className: "col-start-1 inline-flex items-center gap-space-01", children: [
-      e && /* @__PURE__ */ s(e, { className: "h-8 w-8 shrink-0" }),
-      a,
-      ":"
-    ] }),
-    /* @__PURE__ */ s("dd", { className: i({ "line-clamp-1": t }), children: d })
-  ] })
+import l from "./index.es8.js";
+import { create as t } from "./index.es180.js";
+const g = t()(
+  l(
+    (e) => ({
+      lang: localStorage.getItem("lang") ?? "ar",
+      dir: localStorage.getItem("lang") === "en" ? "ltr" : "rtl",
+      changeLang: (a) => e((o) => {
+        a !== o.lang && (localStorage.setItem("lang", a), window.location.pathname === "/login/verification" ? window.location.replace("/login") : window.location.reload());
+      })
+    }),
+    { name: "lanugage" }
+  )
 );
-v.displayName = "DescriptionItem";
 export {
-  N as Description,
-  v as DescriptionItem
+  g as default,
+  g as useLanguage
 };