@etus/ui 0.4.0-beta.2 → 0.4.0-beta.21

package/dist/chunk-WGKOYZRI.js

@@ -0,0 +1,338 @@
+import { cn } from './chunk-RVAYDRMA.js';
+import { ChevronDown } from 'lucide-react';
+import { useRef, useState, useCallback, useEffect } from 'react';
+import { cva } from 'class-variance-authority';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/components/forms/PhoneInput/countries.ts
+var defaultCountries = [
+  // Priority countries
+  { code: "BR", dialCode: "+55", name: "Brazil", flag: "\u{1F1E7}\u{1F1F7}", format: "(##) #####-####" },
+  { code: "US", dialCode: "+1", name: "United States", flag: "\u{1F1FA}\u{1F1F8}", format: "(###) ###-####" },
+  { code: "GB", dialCode: "+44", name: "United Kingdom", flag: "\u{1F1EC}\u{1F1E7}", format: "#### ######" },
+  { code: "CA", dialCode: "+1", name: "Canada", flag: "\u{1F1E8}\u{1F1E6}", format: "(###) ###-####" },
+  { code: "PT", dialCode: "+351", name: "Portugal", flag: "\u{1F1F5}\u{1F1F9}", format: "### ### ###" },
+  { code: "ES", dialCode: "+34", name: "Spain", flag: "\u{1F1EA}\u{1F1F8}", format: "### ### ###" },
+  // Latin America
+  { code: "AR", dialCode: "+54", name: "Argentina", flag: "\u{1F1E6}\u{1F1F7}", format: "## ####-####" },
+  { code: "CL", dialCode: "+56", name: "Chile", flag: "\u{1F1E8}\u{1F1F1}", format: "# #### ####" },
+  { code: "CO", dialCode: "+57", name: "Colombia", flag: "\u{1F1E8}\u{1F1F4}", format: "### #######" },
+  { code: "MX", dialCode: "+52", name: "Mexico", flag: "\u{1F1F2}\u{1F1FD}", format: "### ### ####" },
+  { code: "PE", dialCode: "+51", name: "Peru", flag: "\u{1F1F5}\u{1F1EA}", format: "### ### ###" },
+  { code: "UY", dialCode: "+598", name: "Uruguay", flag: "\u{1F1FA}\u{1F1FE}", format: "## ### ###" },
+  { code: "VE", dialCode: "+58", name: "Venezuela", flag: "\u{1F1FB}\u{1F1EA}", format: "### #######" },
+  // Europe
+  { code: "DE", dialCode: "+49", name: "Germany", flag: "\u{1F1E9}\u{1F1EA}", format: "#### #######" },
+  { code: "FR", dialCode: "+33", name: "France", flag: "\u{1F1EB}\u{1F1F7}", format: "# ## ## ## ##" },
+  { code: "IT", dialCode: "+39", name: "Italy", flag: "\u{1F1EE}\u{1F1F9}", format: "### #######" },
+  { code: "NL", dialCode: "+31", name: "Netherlands", flag: "\u{1F1F3}\u{1F1F1}", format: "# ########" },
+  { code: "BE", dialCode: "+32", name: "Belgium", flag: "\u{1F1E7}\u{1F1EA}", format: "### ## ## ##" },
+  { code: "CH", dialCode: "+41", name: "Switzerland", flag: "\u{1F1E8}\u{1F1ED}", format: "## ### ## ##" },
+  { code: "AT", dialCode: "+43", name: "Austria", flag: "\u{1F1E6}\u{1F1F9}", format: "### #######" },
+  { code: "PL", dialCode: "+48", name: "Poland", flag: "\u{1F1F5}\u{1F1F1}", format: "### ### ###" },
+  { code: "SE", dialCode: "+46", name: "Sweden", flag: "\u{1F1F8}\u{1F1EA}", format: "## ### ## ##" },
+  { code: "NO", dialCode: "+47", name: "Norway", flag: "\u{1F1F3}\u{1F1F4}", format: "### ## ###" },
+  { code: "DK", dialCode: "+45", name: "Denmark", flag: "\u{1F1E9}\u{1F1F0}", format: "## ## ## ##" },
+  { code: "FI", dialCode: "+358", name: "Finland", flag: "\u{1F1EB}\u{1F1EE}", format: "## ### ####" },
+  { code: "IE", dialCode: "+353", name: "Ireland", flag: "\u{1F1EE}\u{1F1EA}", format: "## #######" },
+  // Asia
+  { code: "JP", dialCode: "+81", name: "Japan", flag: "\u{1F1EF}\u{1F1F5}", format: "##-####-####" },
+  { code: "CN", dialCode: "+86", name: "China", flag: "\u{1F1E8}\u{1F1F3}", format: "### #### ####" },
+  { code: "IN", dialCode: "+91", name: "India", flag: "\u{1F1EE}\u{1F1F3}", format: "##### #####" },
+  { code: "KR", dialCode: "+82", name: "South Korea", flag: "\u{1F1F0}\u{1F1F7}", format: "##-####-####" },
+  { code: "SG", dialCode: "+65", name: "Singapore", flag: "\u{1F1F8}\u{1F1EC}", format: "#### ####" },
+  { code: "HK", dialCode: "+852", name: "Hong Kong", flag: "\u{1F1ED}\u{1F1F0}", format: "#### ####" },
+  { code: "TW", dialCode: "+886", name: "Taiwan", flag: "\u{1F1F9}\u{1F1FC}", format: "### ### ###" },
+  { code: "TH", dialCode: "+66", name: "Thailand", flag: "\u{1F1F9}\u{1F1ED}", format: "## ### ####" },
+  { code: "MY", dialCode: "+60", name: "Malaysia", flag: "\u{1F1F2}\u{1F1FE}", format: "##-### ####" },
+  { code: "ID", dialCode: "+62", name: "Indonesia", flag: "\u{1F1EE}\u{1F1E9}", format: "### ### ####" },
+  { code: "PH", dialCode: "+63", name: "Philippines", flag: "\u{1F1F5}\u{1F1ED}", format: "### ### ####" },
+  { code: "VN", dialCode: "+84", name: "Vietnam", flag: "\u{1F1FB}\u{1F1F3}", format: "## ### ## ##" },
+  // Middle East
+  { code: "AE", dialCode: "+971", name: "UAE", flag: "\u{1F1E6}\u{1F1EA}", format: "## ### ####" },
+  { code: "SA", dialCode: "+966", name: "Saudi Arabia", flag: "\u{1F1F8}\u{1F1E6}", format: "## ### ####" },
+  { code: "IL", dialCode: "+972", name: "Israel", flag: "\u{1F1EE}\u{1F1F1}", format: "##-###-####" },
+  { code: "TR", dialCode: "+90", name: "Turkey", flag: "\u{1F1F9}\u{1F1F7}", format: "### ### ## ##" },
+  // Oceania
+  { code: "AU", dialCode: "+61", name: "Australia", flag: "\u{1F1E6}\u{1F1FA}", format: "### ### ###" },
+  { code: "NZ", dialCode: "+64", name: "New Zealand", flag: "\u{1F1F3}\u{1F1FF}", format: "## ### ####" },
+  // Africa
+  { code: "ZA", dialCode: "+27", name: "South Africa", flag: "\u{1F1FF}\u{1F1E6}", format: "## ### ####" },
+  { code: "NG", dialCode: "+234", name: "Nigeria", flag: "\u{1F1F3}\u{1F1EC}", format: "### ### ####" },
+  { code: "EG", dialCode: "+20", name: "Egypt", flag: "\u{1F1EA}\u{1F1EC}", format: "## #### ####" },
+  { code: "KE", dialCode: "+254", name: "Kenya", flag: "\u{1F1F0}\u{1F1EA}", format: "### ######" }
+];
+function findCountryByCode(code, countries = defaultCountries) {
+  return countries.find((c) => c.code.toLowerCase() === code.toLowerCase());
+}
+function findCountryByDialCode(dialCode, countries = defaultCountries) {
+  return countries.find((c) => c.dialCode === dialCode);
+}
+function formatPhoneNumber(value, country) {
+  const digits = value.replaceAll(/\D/g, "");
+  if (!country.format) {
+    return digits;
+  }
+  let result = "";
+  let digitIndex = 0;
+  for (const char of country.format) {
+    if (digitIndex >= digits.length) break;
+    if (char === "#") {
+      result += digits[digitIndex] ?? "";
+      digitIndex++;
+    } else {
+      result += char;
+    }
+  }
+  return result;
+}
+function getPhoneDigits(value) {
+  return value.replaceAll(/\D/g, "");
+}
+var phoneInputVariants = cva(
+  [
+    "flex w-full min-w-0 rounded-md border bg-transparent transition-[color,box-shadow] outline-none",
+    "dark:bg-input/30",
+    "focus-within:border-ring focus-within:ring-ring/50 focus-within:ring-[3px]",
+    "has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50",
+    "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "h-8 text-sm",
+        md: "h-9 text-base md:text-sm",
+        lg: "h-10 text-base"
+      },
+      variant: {
+        default: "border-input shadow-xs",
+        filled: "border-transparent bg-muted",
+        flushed: "rounded-none border-x-0 border-t-0 border-b-input"
+      }
+    },
+    defaultVariants: {
+      size: "md",
+      variant: "default"
+    }
+  }
+);
+var phoneInputCountryButtonVariants = cva(
+  [
+    "flex items-center gap-1.5 shrink-0 border-r border-[color:var(--phone-input-country-select-border-color)] bg-transparent outline-none transition-colors",
+    "hover:bg-muted/50",
+    "focus-visible:bg-muted/50",
+    "disabled:cursor-not-allowed disabled:opacity-50"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "px-2 text-sm",
+        md: "px-3 text-sm",
+        lg: "px-3.5 text-base"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+var phoneInputInputVariants = cva(
+  [
+    "flex-1 min-w-0 bg-transparent outline-none",
+    "placeholder:text-muted-foreground",
+    "disabled:cursor-not-allowed"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "px-2 text-sm",
+        md: "px-3 text-base md:text-sm",
+        lg: "px-3.5 text-base"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+var phoneInputDropdownVariants = cva(
+  [
+    "absolute left-0 top-full z-50 mt-1 max-h-60 min-w-52 overflow-auto rounded-md border bg-popover p-1 shadow-md",
+    "animate-in fade-in-0 zoom-in-95"
+  ]
+);
+var phoneInputOptionVariants = cva(
+  [
+    "flex items-center gap-2 cursor-pointer rounded-sm px-2 py-1.5 text-sm outline-none transition-colors",
+    "hover:bg-accent hover:text-accent-foreground",
+    "focus-visible:bg-accent focus-visible:text-accent-foreground",
+    "data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground"
+  ]
+);
+function PhoneInput({
+  value: controlledValue,
+  defaultValue = "",
+  onChange,
+  onCountryChange,
+  defaultCountry = "BR",
+  countries = defaultCountries,
+  disabled,
+  size = "md",
+  variant,
+  invalid,
+  placeholder = "Phone number",
+  className,
+  ...props
+}) {
+  const containerRef = useRef(null);
+  const inputRef = useRef(null);
+  const [isOpen, setIsOpen] = useState(false);
+  const initialCountry = findCountryByCode(defaultCountry, countries) ?? countries[0] ?? defaultCountries[0];
+  if (!initialCountry) {
+    throw new Error("PhoneInput requires at least one country option.");
+  }
+  const [selectedCountry, setSelectedCountry] = useState(() => initialCountry);
+  const [internalValue, setInternalValue] = useState(defaultValue);
+  const isControlled = controlledValue !== void 0;
+  const phoneValue = isControlled ? controlledValue : internalValue;
+  const displayValue = formatPhoneNumber(phoneValue, selectedCountry);
+  const handleCountrySelect = useCallback(
+    (country) => {
+      setSelectedCountry(country);
+      setIsOpen(false);
+      onCountryChange?.(country);
+      inputRef.current?.focus();
+      if (phoneValue) {
+        onChange?.(phoneValue, country);
+      }
+    },
+    [onCountryChange, onChange, phoneValue]
+  );
+  const handleInputChange = useCallback(
+    (e) => {
+      const rawValue = getPhoneDigits(e.target.value);
+      if (!isControlled) {
+        setInternalValue(rawValue);
+      }
+      onChange?.(rawValue, selectedCountry);
+    },
+    [isControlled, onChange, selectedCountry]
+  );
+  useEffect(() => {
+    const handleClickOutside = (event) => {
+      if (containerRef.current && !containerRef.current.contains(event.target)) {
+        setIsOpen(false);
+      }
+    };
+    if (isOpen) {
+      document.addEventListener("mousedown", handleClickOutside);
+    }
+    return () => {
+      document.removeEventListener("mousedown", handleClickOutside);
+    };
+  }, [isOpen]);
+  const handleKeyDown = useCallback(
+    (e) => {
+      if (e.key === "Escape") {
+        setIsOpen(false);
+      } else if (e.key === "ArrowDown" && !isOpen) {
+        setIsOpen(true);
+      }
+    },
+    [isOpen]
+  );
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: containerRef,
+      className: cn("relative", className),
+      "data-slot": "phone-input",
+      onKeyDown: handleKeyDown,
+      children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            "aria-invalid": invalid ?? void 0,
+            className: phoneInputVariants({ size, variant }),
+            children: [
+              /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  "aria-expanded": isOpen,
+                  "aria-haspopup": "listbox",
+                  "aria-label": `Select country, current: ${selectedCountry.name}`,
+                  className: phoneInputCountryButtonVariants({ size }),
+                  "data-slot": "phone-input-country",
+                  disabled,
+                  type: "button",
+                  onClick: () => {
+                    setIsOpen(!isOpen);
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx("span", { className: "text-base", children: selectedCountry.flag }),
+                    /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: selectedCountry.dialCode }),
+                    /* @__PURE__ */ jsx(
+                      ChevronDown,
+                      {
+                        className: cn(
+                          "size-4 text-muted-foreground transition-transform",
+                          isOpen && "rotate-180"
+                        )
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  ref: inputRef,
+                  "aria-invalid": invalid ?? void 0,
+                  className: phoneInputInputVariants({ size }),
+                  "data-slot": "phone-input-field",
+                  disabled,
+                  placeholder,
+                  type: "tel",
+                  value: displayValue,
+                  onChange: handleInputChange,
+                  ...props
+                }
+              )
+            ]
+          }
+        ),
+        isOpen && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: phoneInputDropdownVariants(),
+            "data-slot": "phone-input-dropdown",
+            role: "listbox",
+            children: countries.map((country) => /* @__PURE__ */ jsxs(
+              "div",
+              {
+                "aria-selected": country.code === selectedCountry.code,
+                className: phoneInputOptionVariants(),
+                "data-selected": country.code === selectedCountry.code,
+                "data-slot": "phone-input-option",
+                role: "option",
+                onClick: () => {
+                  handleCountrySelect(country);
+                },
+                children: [
+                  /* @__PURE__ */ jsx("span", { className: "text-base", children: country.flag }),
+                  /* @__PURE__ */ jsx("span", { className: "flex-1", children: country.name }),
+                  /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: country.dialCode })
+                ]
+              },
+              country.code
+            ))
+          }
+        )
+      ]
+    }
+  );
+}
+
+export { PhoneInput, defaultCountries, findCountryByCode, findCountryByDialCode, formatPhoneNumber, getPhoneDigits, phoneInputCountryButtonVariants, phoneInputDropdownVariants, phoneInputInputVariants, phoneInputOptionVariants, phoneInputVariants };
+//# sourceMappingURL=chunk-WGKOYZRI.js.map
+//# sourceMappingURL=chunk-WGKOYZRI.js.map

package/dist/chunk-WGKOYZRI.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/forms/PhoneInput/countries.ts","../src/components/forms/PhoneInput/PhoneInput.variants.ts","../src/components/forms/PhoneInput/PhoneInput.tsx"],"names":[],"mappings":"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","file":"chunk-WGKOYZRI.js","sourcesContent":["/* eslint-disable sonarjs/no-duplicate-string -- Country data naturally has repeated format patterns */\n\n/**\n * Country information for phone input\n */\nexport interface Country {\n  /** ISO 3166-1 alpha-2 country code */\n  code: string\n  /** International dial code */\n  dialCode: string\n  /** Flag emoji */\n  flag: string\n  /** Phone number format pattern (# = digit) */\n  format?: string\n  /** Country name in English */\n  name: string\n}\n\n/**\n * Default list of countries with dial codes\n * Prioritizes common countries at the top\n */\nexport const defaultCountries: Country[] = [\n  // Priority countries\n  { code: \"BR\", dialCode: \"+55\", name: \"Brazil\", flag: \"🇧🇷\", format: \"(##) #####-####\" },\n  { code: \"US\", dialCode: \"+1\", name: \"United States\", flag: \"🇺🇸\", format: \"(###) ###-####\" },\n  { code: \"GB\", dialCode: \"+44\", name: \"United Kingdom\", flag: \"🇬🇧\", format: \"#### ######\" },\n  { code: \"CA\", dialCode: \"+1\", name: \"Canada\", flag: \"🇨🇦\", format: \"(###) ###-####\" },\n  { code: \"PT\", dialCode: \"+351\", name: \"Portugal\", flag: \"🇵🇹\", format: \"### ### ###\" },\n  { code: \"ES\", dialCode: \"+34\", name: \"Spain\", flag: \"🇪🇸\", format: \"### ### ###\" },\n\n  // Latin America\n  { code: \"AR\", dialCode: \"+54\", name: \"Argentina\", flag: \"🇦🇷\", format: \"## ####-####\" },\n  { code: \"CL\", dialCode: \"+56\", name: \"Chile\", flag: \"🇨🇱\", format: \"# #### ####\" },\n  { code: \"CO\", dialCode: \"+57\", name: \"Colombia\", flag: \"🇨🇴\", format: \"### #######\" },\n  { code: \"MX\", dialCode: \"+52\", name: \"Mexico\", flag: \"🇲🇽\", format: \"### ### ####\" },\n  { code: \"PE\", dialCode: \"+51\", name: \"Peru\", flag: \"🇵🇪\", format: \"### ### ###\" },\n  { code: \"UY\", dialCode: \"+598\", name: \"Uruguay\", flag: \"🇺🇾\", format: \"## ### ###\" },\n  { code: \"VE\", dialCode: \"+58\", name: \"Venezuela\", flag: \"🇻🇪\", format: \"### #######\" },\n\n  // Europe\n  { code: \"DE\", dialCode: \"+49\", name: \"Germany\", flag: \"🇩🇪\", format: \"#### #######\" },\n  { code: \"FR\", dialCode: \"+33\", name: \"France\", flag: \"🇫🇷\", format: \"# ## ## ## ##\" },\n  { code: \"IT\", dialCode: \"+39\", name: \"Italy\", flag: \"🇮🇹\", format: \"### #######\" },\n  { code: \"NL\", dialCode: \"+31\", name: \"Netherlands\", flag: \"🇳🇱\", format: \"# ########\" },\n  { code: \"BE\", dialCode: \"+32\", name: \"Belgium\", flag: \"🇧🇪\", format: \"### ## ## ##\" },\n  { code: \"CH\", dialCode: \"+41\", name: \"Switzerland\", flag: \"🇨🇭\", format: \"## ### ## ##\" },\n  { code: \"AT\", dialCode: \"+43\", name: \"Austria\", flag: \"🇦🇹\", format: \"### #######\" },\n  { code: \"PL\", dialCode: \"+48\", name: \"Poland\", flag: \"🇵🇱\", format: \"### ### ###\" },\n  { code: \"SE\", dialCode: \"+46\", name: \"Sweden\", flag: \"🇸🇪\", format: \"## ### ## ##\" },\n  { code: \"NO\", dialCode: \"+47\", name: \"Norway\", flag: \"🇳🇴\", format: \"### ## ###\" },\n  { code: \"DK\", dialCode: \"+45\", name: \"Denmark\", flag: \"🇩🇰\", format: \"## ## ## ##\" },\n  { code: \"FI\", dialCode: \"+358\", name: \"Finland\", flag: \"🇫🇮\", format: \"## ### ####\" },\n  { code: \"IE\", dialCode: \"+353\", name: \"Ireland\", flag: \"🇮🇪\", format: \"## #######\" },\n\n  // Asia\n  { code: \"JP\", dialCode: \"+81\", name: \"Japan\", flag: \"🇯🇵\", format: \"##-####-####\" },\n  { code: \"CN\", dialCode: \"+86\", name: \"China\", flag: \"🇨🇳\", format: \"### #### ####\" },\n  { code: \"IN\", dialCode: \"+91\", name: \"India\", flag: \"🇮🇳\", format: \"##### #####\" },\n  { code: \"KR\", dialCode: \"+82\", name: \"South Korea\", flag: \"🇰🇷\", format: \"##-####-####\" },\n  { code: \"SG\", dialCode: \"+65\", name: \"Singapore\", flag: \"🇸🇬\", format: \"#### ####\" },\n  { code: \"HK\", dialCode: \"+852\", name: \"Hong Kong\", flag: \"🇭🇰\", format: \"#### ####\" },\n  { code: \"TW\", dialCode: \"+886\", name: \"Taiwan\", flag: \"🇹🇼\", format: \"### ### ###\" },\n  { code: \"TH\", dialCode: \"+66\", name: \"Thailand\", flag: \"🇹🇭\", format: \"## ### ####\" },\n  { code: \"MY\", dialCode: \"+60\", name: \"Malaysia\", flag: \"🇲🇾\", format: \"##-### ####\" },\n  { code: \"ID\", dialCode: \"+62\", name: \"Indonesia\", flag: \"🇮🇩\", format: \"### ### ####\" },\n  { code: \"PH\", dialCode: \"+63\", name: \"Philippines\", flag: \"🇵🇭\", format: \"### ### ####\" },\n  { code: \"VN\", dialCode: \"+84\", name: \"Vietnam\", flag: \"🇻🇳\", format: \"## ### ## ##\" },\n\n  // Middle East\n  { code: \"AE\", dialCode: \"+971\", name: \"UAE\", flag: \"🇦🇪\", format: \"## ### ####\" },\n  { code: \"SA\", dialCode: \"+966\", name: \"Saudi Arabia\", flag: \"🇸🇦\", format: \"## ### ####\" },\n  { code: \"IL\", dialCode: \"+972\", name: \"Israel\", flag: \"🇮🇱\", format: \"##-###-####\" },\n  { code: \"TR\", dialCode: \"+90\", name: \"Turkey\", flag: \"🇹🇷\", format: \"### ### ## ##\" },\n\n  // Oceania\n  { code: \"AU\", dialCode: \"+61\", name: \"Australia\", flag: \"🇦🇺\", format: \"### ### ###\" },\n  { code: \"NZ\", dialCode: \"+64\", name: \"New Zealand\", flag: \"🇳🇿\", format: \"## ### ####\" },\n\n  // Africa\n  { code: \"ZA\", dialCode: \"+27\", name: \"South Africa\", flag: \"🇿🇦\", format: \"## ### ####\" },\n  { code: \"NG\", dialCode: \"+234\", name: \"Nigeria\", flag: \"🇳🇬\", format: \"### ### ####\" },\n  { code: \"EG\", dialCode: \"+20\", name: \"Egypt\", flag: \"🇪🇬\", format: \"## #### ####\" },\n  { code: \"KE\", dialCode: \"+254\", name: \"Kenya\", flag: \"🇰🇪\", format: \"### ######\" },\n]\n\n/**\n * Find country by ISO code\n */\nexport function findCountryByCode(code: string, countries = defaultCountries): Country | undefined {\n  return countries.find((c) => c.code.toLowerCase() === code.toLowerCase())\n}\n\n/**\n * Find country by dial code\n */\nexport function findCountryByDialCode(dialCode: string, countries = defaultCountries): Country | undefined {\n  return countries.find((c) => c.dialCode === dialCode)\n}\n\n/**\n * Format a phone number according to the country format\n */\nexport function formatPhoneNumber(value: string, country: Country): string {\n  // Remove all non-digit characters\n  const digits = value.replaceAll(/\\D/g, \"\")\n\n  if (!country.format) {\n    return digits\n  }\n\n  let result = \"\"\n  let digitIndex = 0\n\n  for (const char of country.format) {\n    if (digitIndex >= digits.length) break\n\n    if (char === \"#\") {\n      result += digits[digitIndex] ?? \"\"\n      digitIndex++\n    } else {\n      result += char\n    }\n  }\n\n  return result\n}\n\n/**\n * Get the raw digits from a formatted phone number\n */\nexport function getPhoneDigits(value: string): string {\n  return value.replaceAll(/\\D/g, \"\")\n}\n","import { cva, type VariantProps } from \"class-variance-authority\"\n\n/**\n * PhoneInput container variant styles using CVA\n */\nexport const phoneInputVariants = cva(\n  [\n    \"flex w-full min-w-0 rounded-md border bg-transparent transition-[color,box-shadow] outline-none\",\n    \"dark:bg-input/30\",\n    \"focus-within:border-ring focus-within:ring-ring/50 focus-within:ring-[3px]\",\n    \"has-disabled:pointer-events-none has-disabled:cursor-not-allowed has-disabled:opacity-50\",\n    \"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n  ],\n  {\n    variants: {\n      size: {\n        sm: \"h-8 text-sm\",\n        md: \"h-9 text-base md:text-sm\",\n        lg: \"h-10 text-base\",\n      },\n      variant: {\n        default: \"border-input shadow-xs\",\n        filled: \"border-transparent bg-muted\",\n        flushed: \"rounded-none border-x-0 border-t-0 border-b-input\",\n      },\n    },\n    defaultVariants: {\n      size: \"md\",\n      variant: \"default\",\n    },\n  }\n)\n\n/**\n * Country selector button styles\n */\nexport const phoneInputCountryButtonVariants = cva(\n  [\n    \"flex items-center gap-1.5 shrink-0 border-r border-[color:var(--phone-input-country-select-border-color)] bg-transparent outline-none transition-colors\",\n    \"hover:bg-muted/50\",\n    \"focus-visible:bg-muted/50\",\n    \"disabled:cursor-not-allowed disabled:opacity-50\",\n  ],\n  {\n    variants: {\n      size: {\n        sm: \"px-2 text-sm\",\n        md: \"px-3 text-sm\",\n        lg: \"px-3.5 text-base\",\n      },\n    },\n    defaultVariants: {\n      size: \"md\",\n    },\n  }\n)\n\n/**\n * Phone number input styles\n */\nexport const phoneInputInputVariants = cva(\n  [\n    \"flex-1 min-w-0 bg-transparent outline-none\",\n    \"placeholder:text-muted-foreground\",\n    \"disabled:cursor-not-allowed\",\n  ],\n  {\n    variants: {\n      size: {\n        sm: \"px-2 text-sm\",\n        md: \"px-3 text-base md:text-sm\",\n        lg: \"px-3.5 text-base\",\n      },\n    },\n    defaultVariants: {\n      size: \"md\",\n    },\n  }\n)\n\n/**\n * Country dropdown styles\n */\nexport const phoneInputDropdownVariants = cva(\n  [\n    \"absolute left-0 top-full z-50 mt-1 max-h-60 min-w-52 overflow-auto rounded-md border bg-popover p-1 shadow-md\",\n    \"animate-in fade-in-0 zoom-in-95\",\n  ]\n)\n\n/**\n * Country option styles\n */\nexport const phoneInputOptionVariants = cva(\n  [\n    \"flex items-center gap-2 cursor-pointer rounded-sm px-2 py-1.5 text-sm outline-none transition-colors\",\n    \"hover:bg-accent hover:text-accent-foreground\",\n    \"focus-visible:bg-accent focus-visible:text-accent-foreground\",\n    \"data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground\",\n  ]\n)\n\nexport type PhoneInputVariantProps = VariantProps<typeof phoneInputVariants>\n","\"use client\"\n\nimport type { PhoneInputProps } from \"./PhoneInput.types\"\n\nimport { ChevronDown } from \"lucide-react\"\nimport * as React from \"react\"\nimport { useCallback, useEffect, useRef, useState } from \"react\"\n\nimport { cn } from \"../../../lib/utils\"\nimport {\n  type Country,\n  defaultCountries,\n  findCountryByCode,\n  formatPhoneNumber,\n  getPhoneDigits,\n} from \"./countries\"\nimport {\n  phoneInputCountryButtonVariants,\n  phoneInputDropdownVariants,\n  phoneInputInputVariants,\n  phoneInputOptionVariants,\n  phoneInputVariants,\n} from \"./PhoneInput.variants\"\n\n/**\n * PhoneInput - An international phone number input with country selector\n *\n * @example\n * ```tsx\n * // Basic usage\n * <PhoneInput\n *   placeholder=\"Enter phone number\"\n *   defaultCountry=\"BR\"\n * />\n *\n * // Controlled\n * const [phone, setPhone] = useState(\"\")\n * <PhoneInput\n *   value={phone}\n *   onChange={(value, country) => {\n *     setPhone(value)\n *     console.log(`${country.dialCode} ${value}`)\n *   }}\n * />\n * ```\n */\nfunction PhoneInput({\n  value: controlledValue,\n  defaultValue = \"\",\n  onChange,\n  onCountryChange,\n  defaultCountry = \"BR\",\n  countries = defaultCountries,\n  disabled,\n  size = \"md\",\n  variant,\n  invalid,\n  placeholder = \"Phone number\",\n  className,\n  ...props\n}: PhoneInputProps) {\n  const containerRef = useRef<HTMLDivElement>(null)\n  const inputRef = useRef<HTMLInputElement>(null)\n  const [isOpen, setIsOpen] = useState(false)\n\n  // Find initial country - fallback to first country or Brazil\n  const initialCountry = findCountryByCode(defaultCountry, countries) ?? countries[0] ?? defaultCountries[0]\n  if (!initialCountry) {\n    throw new Error(\"PhoneInput requires at least one country option.\")\n  }\n  const [selectedCountry, setSelectedCountry] = useState<Country>(() => initialCountry)\n\n  // Internal state for uncontrolled mode\n  const [internalValue, setInternalValue] = useState(defaultValue)\n\n  // Determine if controlled\n  const isControlled = controlledValue !== undefined\n  const phoneValue = isControlled ? controlledValue : internalValue\n\n  // Format the display value\n  const displayValue = formatPhoneNumber(phoneValue, selectedCountry)\n\n  const handleCountrySelect = useCallback(\n    (country: Country) => {\n      setSelectedCountry(country)\n      setIsOpen(false)\n      onCountryChange?.(country)\n      inputRef.current?.focus()\n\n      // Notify parent of the change with current value\n      if (phoneValue) {\n        onChange?.(phoneValue, country)\n      }\n    },\n    [onCountryChange, onChange, phoneValue]\n  )\n\n  const handleInputChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      const rawValue = getPhoneDigits(e.target.value)\n\n      if (!isControlled) {\n        setInternalValue(rawValue)\n      }\n\n      onChange?.(rawValue, selectedCountry)\n    },\n    [isControlled, onChange, selectedCountry]\n  )\n\n  // Close dropdown on click outside\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      if (containerRef.current && !containerRef.current.contains(event.target as Node)) {\n        setIsOpen(false)\n      }\n    }\n\n    if (isOpen) {\n      document.addEventListener(\"mousedown\", handleClickOutside)\n    }\n\n    return () => {\n      document.removeEventListener(\"mousedown\", handleClickOutside)\n    }\n  }, [isOpen])\n\n  // Handle keyboard navigation\n  const handleKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (e.key === \"Escape\") {\n        setIsOpen(false)\n      } else if (e.key === \"ArrowDown\" && !isOpen) {\n        setIsOpen(true)\n      }\n    },\n    [isOpen]\n  )\n\n  return (\n    <div\n      ref={containerRef}\n      className={cn(\"relative\", className)}\n      data-slot=\"phone-input\"\n      onKeyDown={handleKeyDown}\n    >\n      <div\n        aria-invalid={invalid ?? undefined}\n        className={phoneInputVariants({ size, variant })}\n      >\n        {/* Country selector */}\n        <button\n          aria-expanded={isOpen}\n          aria-haspopup=\"listbox\"\n          aria-label={`Select country, current: ${selectedCountry.name}`}\n          className={phoneInputCountryButtonVariants({ size })}\n          data-slot=\"phone-input-country\"\n          disabled={disabled}\n          type=\"button\"\n          onClick={() => { setIsOpen(!isOpen); }}\n        >\n          <span className=\"text-base\">{selectedCountry.flag}</span>\n          <span className=\"text-muted-foreground\">{selectedCountry.dialCode}</span>\n          <ChevronDown\n            className={cn(\n              \"size-4 text-muted-foreground transition-transform\",\n              isOpen && \"rotate-180\"\n            )}\n          />\n        </button>\n\n        {/* Phone number input */}\n        <input\n          ref={inputRef}\n          aria-invalid={invalid ?? undefined}\n          className={phoneInputInputVariants({ size })}\n          data-slot=\"phone-input-field\"\n          disabled={disabled}\n          placeholder={placeholder}\n          type=\"tel\"\n          value={displayValue}\n          onChange={handleInputChange}\n          {...props}\n        />\n      </div>\n\n      {/* Country dropdown */}\n      {isOpen && (\n        <div\n          className={phoneInputDropdownVariants()}\n          data-slot=\"phone-input-dropdown\"\n          role=\"listbox\"\n        >\n          {countries.map((country) => (\n            <div\n              key={country.code}\n              aria-selected={country.code === selectedCountry.code}\n              className={phoneInputOptionVariants()}\n              data-selected={country.code === selectedCountry.code}\n              data-slot=\"phone-input-option\"\n              role=\"option\"\n              onClick={() => { handleCountrySelect(country); }}\n            >\n              <span className=\"text-base\">{country.flag}</span>\n              <span className=\"flex-1\">{country.name}</span>\n              <span className=\"text-muted-foreground\">{country.dialCode}</span>\n            </div>\n          ))}\n        </div>\n      )}\n    </div>\n  )\n}\n\nexport { PhoneInput }\n"]}

package/dist/chunk-WGSVSZ7V.js

@@ -0,0 +1,172 @@
+import { cn } from './chunk-RVAYDRMA.js';
+import { cva } from 'class-variance-authority';
+import { jsx } from 'react/jsx-runtime';
+
+var headerVariants = cva(
+  [
+    // Base styles
+    "flex w-full items-center",
+    // Figma height model — min 64px (logo-only), hugs to 76px with nav/actions
+    "min-h-[var(--header-height)]",
+    // Transition
+    "transition-colors"
+  ],
+  {
+    variants: {
+      variant: {
+        default: "bg-[color:var(--header-root-bg)] border-b border-[color:var(--header-root-border-color)]",
+        transparent: "bg-transparent",
+        floating: "bg-[color:var(--header-root-bg)]/80 backdrop-blur-sm border-b border-[color:var(--header-root-border-color)]/50 shadow-sm"
+      },
+      sticky: {
+        true: "sticky top-0 z-[var(--header-sticky-z-index)]",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      sticky: false
+    }
+  }
+);
+var headerContainerVariants = cva(
+  [
+    "flex w-full items-center gap-4 px-[var(--header-root-padding-x)] py-[var(--header-root-padding-y)]"
+  ],
+  {
+    variants: {
+      contained: {
+        true: "mx-auto max-w-[var(--header-contained-max-width)]",
+        false: ""
+      },
+      layout: {
+        // Brand left, Nav middle, Actions right (default)
+        default: "justify-between",
+        // Brand center; Nav and Actions on sides if provided
+        "logo-centered": "justify-center [&>[data-slot=header-brand]]:order-2 [&>[data-slot=header-nav]]:order-1 [&>[data-slot=header-actions]]:order-3 [&>[data-slot=header-nav]]:flex-1 [&>[data-slot=header-actions]]:flex-1",
+        // Nav left, Brand right (mirror of default)
+        "links-left": "justify-between [&>[data-slot=header-brand]]:order-2 [&>[data-slot=header-nav]]:order-1 [&>[data-slot=header-actions]]:order-3",
+        // Brand + Nav clustered center, Actions right
+        centered: "[&>[data-slot=header-brand]]:flex-none [&>[data-slot=header-nav]]:flex-1 [&>[data-slot=header-nav]]:justify-center [&>[data-slot=header-actions]]:flex-none [&>[data-slot=header-actions]]:ml-auto"
+      }
+    },
+    defaultVariants: {
+      contained: false,
+      layout: "default"
+    }
+  }
+);
+var headerBrandVariants = cva([
+  "flex shrink-0 items-center gap-2"
+]);
+var headerNavVariants = cva([
+  "hidden md:flex items-center gap-1 min-h-[var(--header-content-height)]"
+]);
+var headerActionsVariants = cva(
+  [
+    "flex items-center gap-2 min-h-[var(--header-content-height)]"
+  ],
+  {
+    variants: {
+      align: {
+        start: "justify-start",
+        center: "justify-center",
+        end: "justify-end"
+      }
+    },
+    defaultVariants: {
+      align: "end"
+    }
+  }
+);
+function Header({
+  className,
+  variant = "default",
+  sticky = false,
+  contained = false,
+  layout = "default",
+  containerClassName,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "header",
+    {
+      className: cn(headerVariants({ variant, sticky }), className),
+      "data-slot": "header",
+      ...props,
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: cn(
+            headerContainerVariants({ contained, layout }),
+            containerClassName
+          ),
+          "data-layout": layout,
+          "data-slot": "header-container",
+          children
+        }
+      )
+    }
+  );
+}
+function HeaderBrand({
+  className,
+  asLink = false,
+  href = "/",
+  children,
+  ...props
+}) {
+  if (asLink) {
+    return /* @__PURE__ */ jsx(
+      "a",
+      {
+        className: cn(headerBrandVariants(), className),
+        "data-slot": "header-brand",
+        href,
+        ...props,
+        children
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(headerBrandVariants(), className),
+      "data-slot": "header-brand",
+      ...props,
+      children
+    }
+  );
+}
+function HeaderNav({ className, children, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "nav",
+    {
+      className: cn(headerNavVariants(), className),
+      "data-slot": "header-nav",
+      ...props,
+      children
+    }
+  );
+}
+function HeaderActions({
+  className,
+  align = "end",
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(headerActionsVariants({ align }), className),
+      "data-slot": "header-actions",
+      ...props,
+      children
+    }
+  );
+}
+
+export { Header, HeaderActions, HeaderBrand, HeaderNav, headerActionsVariants, headerBrandVariants, headerContainerVariants, headerNavVariants, headerVariants };
+//# sourceMappingURL=chunk-WGSVSZ7V.js.map
+//# sourceMappingURL=chunk-WGSVSZ7V.js.map

package/dist/chunk-WGSVSZ7V.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/navigation/Header/Header.variants.ts","../src/components/navigation/Header/Header.tsx"],"names":[],"mappings":"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","file":"chunk-WGSVSZ7V.js","sourcesContent":["import { cva } from \"class-variance-authority\"\n\n/**\n * Header root variant styles\n *\n * Height follows the Figma auto-layout model (DES-1271): the root has a min\n * height of `--header-height` (64px — a logo-only header) and hugs to 76px\n * when a HeaderNav/HeaderActions row is present, because that row enforces\n * `--header-content-height` (36px) and the container adds `--header-root-padding-y`\n * (20px × 2). There is no `size` prop — the Figma component has no size axis.\n */\nexport const headerVariants = cva(\n  [\n    // Base styles\n    \"flex w-full items-center\",\n    // Figma height model — min 64px (logo-only), hugs to 76px with nav/actions\n    \"min-h-[var(--header-height)]\",\n    // Transition\n    \"transition-colors\",\n  ],\n  {\n    variants: {\n      variant: {\n        default:\n          \"bg-[color:var(--header-root-bg)] border-b border-[color:var(--header-root-border-color)]\",\n        transparent: \"bg-transparent\",\n        floating:\n          \"bg-[color:var(--header-root-bg)]/80 backdrop-blur-sm border-b border-[color:var(--header-root-border-color)]/50 shadow-sm\",\n      },\n      sticky: {\n        true: \"sticky top-0 z-[var(--header-sticky-z-index)]\",\n        false: \"\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      sticky: false,\n    },\n  }\n)\n\n/**\n * Header container variant styles (inner wrapper)\n */\nexport const headerContainerVariants = cva(\n  [\n    \"flex w-full items-center gap-4 px-[var(--header-root-padding-x)] py-[var(--header-root-padding-y)]\",\n  ],\n  {\n    variants: {\n      contained: {\n        true: \"mx-auto max-w-[var(--header-contained-max-width)]\",\n        false: \"\",\n      },\n      layout: {\n        // Brand left, Nav middle, Actions right (default)\n        default: \"justify-between\",\n        // Brand center; Nav and Actions on sides if provided\n        \"logo-centered\":\n          \"justify-center [&>[data-slot=header-brand]]:order-2 [&>[data-slot=header-nav]]:order-1 [&>[data-slot=header-actions]]:order-3 [&>[data-slot=header-nav]]:flex-1 [&>[data-slot=header-actions]]:flex-1\",\n        // Nav left, Brand right (mirror of default)\n        \"links-left\":\n          \"justify-between [&>[data-slot=header-brand]]:order-2 [&>[data-slot=header-nav]]:order-1 [&>[data-slot=header-actions]]:order-3\",\n        // Brand + Nav clustered center, Actions right\n        centered:\n          \"[&>[data-slot=header-brand]]:flex-none [&>[data-slot=header-nav]]:flex-1 [&>[data-slot=header-nav]]:justify-center [&>[data-slot=header-actions]]:flex-none [&>[data-slot=header-actions]]:ml-auto\",\n      },\n    },\n    defaultVariants: {\n      contained: false,\n      layout: \"default\",\n    },\n  }\n)\n\n/**\n * HeaderBrand variant styles\n */\nexport const headerBrandVariants = cva([\n  \"flex shrink-0 items-center gap-2\",\n])\n\n/**\n * HeaderNav variant styles\n *\n * Enforces the Figma nav-row height (`--header-content-height` 36px) so a\n * header with navigation hugs to 76px regardless of whether the links are\n * plain text or buttons.\n */\nexport const headerNavVariants = cva([\n  \"hidden md:flex items-center gap-1 min-h-[var(--header-content-height)]\",\n])\n\n/**\n * HeaderActions variant styles\n *\n * Enforces the Figma action-row height (`--header-content-height` 36px) so a\n * header with actions (e.g. the Mobile layout: logo + icons) hugs to 76px.\n */\nexport const headerActionsVariants = cva(\n  [\n    \"flex items-center gap-2 min-h-[var(--header-content-height)]\",\n  ],\n  {\n    variants: {\n      align: {\n        start: \"justify-start\",\n        center: \"justify-center\",\n        end: \"justify-end\",\n      },\n    },\n    defaultVariants: {\n      align: \"end\",\n    },\n  }\n)\n","\"use client\"\n\nimport type {\n  HeaderActionsProps,\n  HeaderBrandProps,\n  HeaderNavProps,\n  HeaderProps,\n} from \"./Header.types\"\n\nimport { cn } from \"../../../lib/utils\"\nimport {\n  headerActionsVariants,\n  headerBrandVariants,\n  headerContainerVariants,\n  headerNavVariants,\n  headerVariants,\n} from \"./Header.variants\"\n\n/**\n * Header - A responsive header component for site navigation.\n *\n * Supports multiple visual variants, Figma layouts, and sticky positioning.\n * Height follows the Figma model: 64px for a logo-only header, 76px once a\n * HeaderNav/HeaderActions row is present (content-driven, no `size` prop).\n *\n * @example\n * <Header variant=\"default\" sticky>\n *   <HeaderBrand asLink href=\"/\">Logo</HeaderBrand>\n *   <HeaderNav>\n *     <a href=\"/about\">About</a>\n *     <a href=\"/contact\">Contact</a>\n *   </HeaderNav>\n *   <HeaderActions>\n *     <Button>Sign In</Button>\n *   </HeaderActions>\n * </Header>\n */\nfunction Header({\n  className,\n  variant = \"default\",\n  sticky = false,\n  contained = false,\n  layout = \"default\",\n  containerClassName,\n  children,\n  ...props\n}: HeaderProps) {\n  return (\n    <header\n      className={cn(headerVariants({ variant, sticky }), className)}\n      data-slot=\"header\"\n      {...props}\n    >\n      <div\n        className={cn(\n          headerContainerVariants({ contained, layout }),\n          containerClassName\n        )}\n        data-layout={layout}\n        data-slot=\"header-container\"\n      >\n        {children}\n      </div>\n    </header>\n  )\n}\n\n/**\n * HeaderBrand - Logo/brand area of the header.\n *\n * Can optionally render as a link when asLink is true.\n */\nfunction HeaderBrand({\n  className,\n  asLink = false,\n  href = \"/\",\n  children,\n  ...props\n}: HeaderBrandProps) {\n  if (asLink) {\n    return (\n      <a\n        className={cn(headerBrandVariants(), className)}\n        data-slot=\"header-brand\"\n        href={href}\n        {...(props as React.ComponentProps<\"a\">)}\n      >\n        {children}\n      </a>\n    )\n  }\n\n  return (\n    <div\n      className={cn(headerBrandVariants(), className)}\n      data-slot=\"header-brand\"\n      {...props}\n    >\n      {children}\n    </div>\n  )\n}\n\n/**\n * HeaderNav - Navigation container for header links.\n */\nfunction HeaderNav({ className, children, ...props }: HeaderNavProps) {\n  return (\n    <nav\n      className={cn(headerNavVariants(), className)}\n      data-slot=\"header-nav\"\n      {...props}\n    >\n      {children}\n    </nav>\n  )\n}\n\n/**\n * HeaderActions - Actions container for buttons/controls.\n */\nfunction HeaderActions({\n  className,\n  align = \"end\",\n  children,\n  ...props\n}: HeaderActionsProps) {\n  return (\n    <div\n      className={cn(headerActionsVariants({ align }), className)}\n      data-slot=\"header-actions\"\n      {...props}\n    >\n      {children}\n    </div>\n  )\n}\n\nexport { Header, HeaderActions, HeaderBrand, HeaderNav }\n"]}

package/dist/chunk-WH7Y2MAY.js

@@ -0,0 +1,24 @@
+import * as React from 'react';
+
+// src/hooks/use-mobile.ts
+var MOBILE_BREAKPOINT = 768;
+function subscribe(callback) {
+  const mql = window.matchMedia(`(max-width: ${String(MOBILE_BREAKPOINT - 1)}px)`);
+  mql.addEventListener("change", callback);
+  return () => {
+    mql.removeEventListener("change", callback);
+  };
+}
+function getSnapshot() {
+  return window.innerWidth < MOBILE_BREAKPOINT;
+}
+function getServerSnapshot() {
+  return false;
+}
+function useIsMobile() {
+  return React.useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);
+}
+
+export { useIsMobile };
+//# sourceMappingURL=chunk-WH7Y2MAY.js.map
+//# sourceMappingURL=chunk-WH7Y2MAY.js.map

package/dist/chunk-WH7Y2MAY.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/use-mobile.ts"],"names":[],"mappings":";;;AAEA,IAAM,iBAAA,GAAoB,GAAA;AAK1B,SAAS,UAAU,QAAA,EAAsB;AACvC,EAAA,MAAM,GAAA,GAAM,OAAO,UAAA,CAAW,CAAA,YAAA,EAAe,OAAO,iBAAA,GAAoB,CAAC,CAAC,CAAA,GAAA,CAAK,CAAA;AAC/E,EAAA,GAAA,CAAI,gBAAA,CAAiB,UAAU,QAAQ,CAAA;AACvC,EAAA,OAAO,MAAM;AAAE,IAAA,GAAA,CAAI,mBAAA,CAAoB,UAAU,QAAQ,CAAA;AAAA,EAAG,CAAA;AAC9D;AAKA,SAAS,WAAA,GAAc;AACrB,EAAA,OAAO,OAAO,UAAA,GAAa,iBAAA;AAC7B;AAKA,SAAS,iBAAA,GAAoB;AAC3B,EAAA,OAAO,KAAA;AACT;AAEO,SAAS,WAAA,GAAc;AAC5B,EAAA,OAAa,KAAA,CAAA,oBAAA,CAAqB,SAAA,EAAW,WAAA,EAAa,iBAAiB,CAAA;AAC7E","file":"chunk-WH7Y2MAY.js","sourcesContent":["import * as React from \"react\"\n\nconst MOBILE_BREAKPOINT = 768\n\n/**\n * Subscribe to media query changes\n */\nfunction subscribe(callback: () => void) {\n  const mql = window.matchMedia(`(max-width: ${String(MOBILE_BREAKPOINT - 1)}px)`)\n  mql.addEventListener(\"change\", callback)\n  return () => { mql.removeEventListener(\"change\", callback); }\n}\n\n/**\n * Get current mobile state (client-side only)\n */\nfunction getSnapshot() {\n  return window.innerWidth < MOBILE_BREAKPOINT\n}\n\n/**\n * Server snapshot - returns false as default for SSR\n */\nfunction getServerSnapshot() {\n  return false\n}\n\nexport function useIsMobile() {\n  return React.useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot)\n}\n"]}