{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "flag-picker",
  "title": "Flag Picker",
  "author": "Shadi Al Milhem",
  "description": "A searchable, keyboard-accessible flag combobox with typed country codes.",
  "dependencies": [
    "@tabler/icons-react"
  ],
  "registryDependencies": [
    "@flagcn/flag",
    "@flagcn/country-data"
  ],
  "files": [
    {
      "path": "src/components/flags/flag-picker.tsx",
      "content": "// SPDX-License-Identifier: MIT\n\nimport { IconCheck, IconChevronDown, IconSearch } from \"@tabler/icons-react\"\nimport * as React from \"react\"\n\nimport { cn } from \"@/lib/utils\"\n\nimport { Flag } from \"./flag\"\nimport { getCountry, normalizeCountrySearch } from \"./country-utils\"\nimport { flagNames, flags, type FlagCode, type FlagKind } from \"./flag-data\"\nimport type { FlagFormat, FlagRatio } from \"./flag-utils\"\n\nexport interface FlagPickerProps {\n  value?: FlagCode\n  defaultValue?: FlagCode\n  onValueChange?: (code: FlagCode) => void\n  format?: FlagFormat\n  ratio?: FlagRatio\n  placeholder?: string\n  searchPlaceholder?: string\n  emptyMessage?: string\n  kinds?: FlagKind[]\n  codes?: readonly FlagCode[]\n  disabledCodes?: readonly FlagCode[]\n  showCode?: boolean\n  showCallingCode?: boolean\n  disabled?: boolean\n  className?: string\n  triggerClassName?: string\n  contentClassName?: string\n  triggerDisplay?: \"name\" | \"code\" | \"calling-code\" | \"flag\"\n  name?: string\n  \"aria-label\"?: string\n}\n\nexport function FlagPicker({\n  value,\n  defaultValue,\n  onValueChange,\n  format = \"svg\",\n  ratio = \"4x3\",\n  placeholder = \"Select a flag\",\n  searchPlaceholder = \"Search by name or code…\",\n  emptyMessage = \"No flags found.\",\n  kinds,\n  codes,\n  disabledCodes = [],\n  showCode = true,\n  showCallingCode = false,\n  disabled = false,\n  className,\n  triggerClassName,\n  contentClassName,\n  triggerDisplay = \"name\",\n  name,\n  \"aria-label\": ariaLabel,\n}: FlagPickerProps) {\n  const [internalValue, setInternalValue] = React.useState<FlagCode | undefined>(defaultValue)\n  const [phase, setPhase] = React.useState<\"closed\" | \"open\" | \"closing\">(\"closed\")\n  const [query, setQuery] = React.useState(\"\")\n  const [activeIndex, setActiveIndex] = React.useState(0)\n  const rootRef = React.useRef<HTMLDivElement>(null)\n  const triggerRef = React.useRef<HTMLButtonElement>(null)\n  const searchRef = React.useRef<HTMLInputElement>(null)\n  const closeTimerRef = React.useRef<number | undefined>(undefined)\n  const listId = React.useId()\n  const currentValue = value ?? internalValue\n  const currentCountry = currentValue ? getCountry(currentValue) : undefined\n  const open = phase === \"open\"\n  const allowedCodes = React.useMemo(() => codes ? new Set(codes) : undefined, [codes])\n  const disabledCodeSet = React.useMemo(() => new Set(disabledCodes), [disabledCodes])\n\n  const filteredFlags = React.useMemo(() => {\n    const normalizedQuery = normalizeCountrySearch(query)\n    return flags.filter((flag) => {\n      const inKind = !kinds?.length || kinds.includes(flag.kind)\n      const country = getCountry(flag.code)\n      const searchValue = country\n        ? [flag.name, flag.code, country.alpha2, country.alpha3, country.nativeName, ...country.aliases, ...country.callingCodes].join(\" \")\n        : `${flag.name} ${flag.code}`\n      return inKind && (!allowedCodes || allowedCodes.has(flag.code)) && (!normalizedQuery || normalizeCountrySearch(searchValue).includes(normalizedQuery))\n    })\n  }, [allowedCodes, kinds, query])\n\n  const closePicker = React.useCallback((restoreFocus = false) => {\n    window.clearTimeout(closeTimerRef.current)\n    setPhase((current) => current === \"closed\" ? current : \"closing\")\n    closeTimerRef.current = window.setTimeout(() => {\n      setPhase(\"closed\")\n      if (restoreFocus) triggerRef.current?.focus()\n    }, 150)\n  }, [])\n\n  React.useEffect(() => () => window.clearTimeout(closeTimerRef.current), [])\n\n  React.useEffect(() => {\n    if (!open) return\n    const onPointerDown = (event: PointerEvent) => {\n      if (!rootRef.current?.contains(event.target as Node)) closePicker()\n    }\n    document.addEventListener(\"pointerdown\", onPointerDown)\n    return () => document.removeEventListener(\"pointerdown\", onPointerDown)\n  }, [closePicker, open])\n\n  React.useEffect(() => {\n    if (!open) return\n    requestAnimationFrame(() => searchRef.current?.focus())\n  }, [open])\n\n  function selectFlag(code: FlagCode) {\n    if (disabledCodeSet.has(code)) return\n    if (value === undefined) setInternalValue(code)\n    onValueChange?.(code)\n    setQuery(\"\")\n    closePicker(true)\n  }\n\n  function handleKeyDown(event: React.KeyboardEvent) {\n    if (event.key === \"Escape\") {\n      closePicker(true)\n      return\n    }\n    if (event.key === \"ArrowDown\") {\n      event.preventDefault()\n      setActiveIndex((index) => Math.min(index + 1, filteredFlags.length - 1))\n    }\n    if (event.key === \"ArrowUp\") {\n      event.preventDefault()\n      setActiveIndex((index) => Math.max(index - 1, 0))\n    }\n    if (event.key === \"Enter\" && filteredFlags[activeIndex]) {\n      event.preventDefault()\n      selectFlag(filteredFlags[activeIndex].code)\n    }\n  }\n\n  function toggleOpen() {\n    if (open) closePicker()\n    else {\n      window.clearTimeout(closeTimerRef.current)\n      setActiveIndex(0)\n      setPhase(\"open\")\n    }\n  }\n\n  return (\n    <div ref={rootRef} data-slot=\"flag-picker\" className={cn(\"relative w-full\", className)}>\n      {name ? <input type=\"hidden\" name={name} value={currentValue ?? \"\"} /> : null}\n      <button\n        ref={triggerRef}\n        type=\"button\"\n        role=\"combobox\"\n        aria-expanded={open}\n        aria-controls={listId}\n        aria-haspopup=\"listbox\"\n        aria-label={ariaLabel ?? (currentValue ? `${placeholder}: ${flagNames[currentValue]}` : placeholder)}\n        disabled={disabled}\n        className={cn(\n          \"border-input bg-background ring-offset-background flex h-10 w-full items-center justify-between rounded-md border px-3 text-sm shadow-xs outline-none transition-[color,box-shadow] sm:h-9\",\n          \"focus-visible:border-ring focus-visible:ring-ring/30 focus-visible:ring-[3px]\",\n          \"disabled:cursor-not-allowed disabled:opacity-50\",\n          triggerClassName,\n        )}\n        onClick={toggleOpen}\n        onKeyDown={(event) => {\n          if (!open && (event.key === \"ArrowDown\" || event.key === \"Enter\" || event.key === \" \")) {\n            event.preventDefault()\n            setActiveIndex(0)\n            window.clearTimeout(closeTimerRef.current)\n            setPhase(\"open\")\n          }\n        }}\n      >\n        <span className={cn(\"flex min-w-0 items-center gap-2\", !currentValue && \"text-muted-foreground\")}>\n          {currentValue ? (\n            <Flag\n              code={currentValue}\n              format={format}\n              width={24}\n              ratio={ratio}\n              alt=\"\"\n              decorative\n              className=\"size-5 object-contain outline outline-1 -outline-offset-1 outline-black/10 dark:outline-white/15\"\n            />\n          ) : null}\n          {triggerDisplay !== \"flag\" ? (\n            <span className=\"truncate\">\n              {currentValue\n                ? triggerDisplay === \"code\"\n                  ? currentValue.toUpperCase()\n                  : triggerDisplay === \"calling-code\"\n                    ? currentCountry?.callingCodes[0] ?? currentValue.toUpperCase()\n                    : flagNames[currentValue]\n                : placeholder}\n            </span>\n          ) : null}\n        </span>\n        <IconChevronDown aria-hidden=\"true\" className=\"text-muted-foreground size-4 shrink-0\" />\n      </button>\n\n      {phase !== \"closed\" ? (\n        <div\n          data-origin=\"top\"\n          className={cn(\n            \"t-dropdown bg-popover text-popover-foreground absolute z-50 mt-1 w-full min-w-64 overflow-hidden rounded-md border shadow-md\",\n            phase === \"open\" ? \"is-open\" : \"is-closing\",\n            contentClassName,\n          )}\n          onKeyDown={handleKeyDown}\n        >\n          <div className=\"border-b p-2\">\n            <div className=\"relative\">\n              <IconSearch\n                aria-hidden=\"true\"\n                className=\"text-muted-foreground pointer-events-none absolute start-2.5 top-1/2 size-4 -translate-y-1/2\"\n              />\n              <input\n                ref={searchRef}\n                value={query}\n                onChange={(event) => {\n                  setQuery(event.target.value)\n                  setActiveIndex(0)\n                }}\n                placeholder={searchPlaceholder}\n                aria-label={searchPlaceholder}\n                aria-controls={listId}\n                aria-activedescendant={filteredFlags[activeIndex] ? `${listId}-${filteredFlags[activeIndex].code}` : undefined}\n                className=\"placeholder:text-muted-foreground h-9 w-full rounded-sm bg-transparent ps-8 pe-3 text-sm focus-visible:ring-ring/30 focus-visible:ring-[3px]\"\n              />\n            </div>\n          </div>\n          <div id={listId} role=\"listbox\" className=\"max-h-72 overflow-y-auto p-1\">\n            {filteredFlags.length ? filteredFlags.map((flag, index) => (\n              <button\n                key={flag.code}\n                id={`${listId}-${flag.code}`}\n                type=\"button\"\n                role=\"option\"\n                aria-selected={currentValue === flag.code}\n                disabled={disabledCodeSet.has(flag.code)}\n                data-active={index === activeIndex || undefined}\n                className=\"data-[active]:bg-accent data-[active]:text-accent-foreground flex min-h-10 w-full items-center gap-2 rounded-sm px-2 py-2 text-start text-sm hover:bg-accent hover:text-accent-foreground focus-visible:ring-ring/30 focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-40 sm:min-h-9\"\n                onPointerMove={() => setActiveIndex(index)}\n                onClick={() => selectFlag(flag.code)}\n              >\n                <Flag\n                  code={flag.code}\n                  format={format}\n                  width={24}\n                  ratio={ratio}\n                  alt=\"\"\n                  decorative\n                  className=\"h-[15px] w-5 shrink-0 object-contain outline outline-1 -outline-offset-1 outline-black/10 dark:outline-white/15\"\n                />\n                <span className=\"min-w-0 flex-1 truncate\">{flag.name}</span>\n                {showCallingCode && getCountry(flag.code)?.callingCodes[0] ? (\n                  <span className=\"text-muted-foreground font-mono text-[11px]\">{getCountry(flag.code)?.callingCodes[0]}</span>\n                ) : showCode ? (\n                  <span className=\"text-muted-foreground font-mono text-[11px] uppercase\">{flag.code}</span>\n                ) : null}\n                <IconCheck\n                  aria-hidden=\"true\"\n                  className={cn(\"size-4\", currentValue === flag.code ? \"opacity-100\" : \"opacity-0\")}\n                />\n              </button>\n            )) : (\n              <p className=\"text-muted-foreground px-3 py-8 text-center text-sm\">{emptyMessage}</p>\n            )}\n          </div>\n        </div>\n      ) : null}\n    </div>\n  )\n}\n",
      "type": "registry:component",
      "target": "@components/flags/flag-picker.tsx"
    },
    {
      "path": "src/components/flags/flag-data.ts",
      "content": "// SPDX-License-Identifier: MIT\n\nexport const flagNames = {\n  ad: \"Andorra\",\n  ae: \"United Arab Emirates\",\n  af: \"Afghanistan\",\n  ag: \"Antigua and Barbuda\",\n  ai: \"Anguilla\",\n  al: \"Albania\",\n  am: \"Armenia\",\n  ao: \"Angola\",\n  aq: \"Antarctica\",\n  ar: \"Argentina\",\n  as: \"American Samoa\",\n  at: \"Austria\",\n  au: \"Australia\",\n  aw: \"Aruba\",\n  ax: \"Åland Islands\",\n  az: \"Azerbaijan\",\n  ba: \"Bosnia and Herzegovina\",\n  bb: \"Barbados\",\n  bd: \"Bangladesh\",\n  be: \"Belgium\",\n  bf: \"Burkina Faso\",\n  bg: \"Bulgaria\",\n  bh: \"Bahrain\",\n  bi: \"Burundi\",\n  bj: \"Benin\",\n  bl: \"Saint Barthélemy\",\n  bm: \"Bermuda\",\n  bn: \"Brunei\",\n  bo: \"Bolivia\",\n  bq: \"Caribbean Netherlands\",\n  br: \"Brazil\",\n  bs: \"Bahamas\",\n  bt: \"Bhutan\",\n  bv: \"Bouvet Island\",\n  bw: \"Botswana\",\n  by: \"Belarus\",\n  bz: \"Belize\",\n  ca: \"Canada\",\n  cc: \"Cocos (Keeling) Islands\",\n  cd: \"DR Congo\",\n  cf: \"Central African Republic\",\n  cg: \"Republic of the Congo\",\n  ch: \"Switzerland\",\n  ci: \"Côte d'Ivoire (Ivory Coast)\",\n  ck: \"Cook Islands\",\n  cl: \"Chile\",\n  cm: \"Cameroon\",\n  cn: \"China\",\n  co: \"Colombia\",\n  cr: \"Costa Rica\",\n  cu: \"Cuba\",\n  cv: \"Cape Verde\",\n  cw: \"Curaçao\",\n  cx: \"Christmas Island\",\n  cy: \"Cyprus\",\n  cz: \"Czechia\",\n  de: \"Germany\",\n  dj: \"Djibouti\",\n  dk: \"Denmark\",\n  dm: \"Dominica\",\n  do: \"Dominican Republic\",\n  dz: \"Algeria\",\n  ec: \"Ecuador\",\n  ee: \"Estonia\",\n  eg: \"Egypt\",\n  eh: \"Western Sahara\",\n  er: \"Eritrea\",\n  es: \"Spain\",\n  et: \"Ethiopia\",\n  eu: \"European Union\",\n  fi: \"Finland\",\n  fj: \"Fiji\",\n  fk: \"Falkland Islands\",\n  fm: \"Micronesia\",\n  fo: \"Faroe Islands\",\n  fr: \"France\",\n  ga: \"Gabon\",\n  gb: \"United Kingdom\",\n  \"gb-eng\": \"England\",\n  \"gb-nir\": \"Northern Ireland\",\n  \"gb-sct\": \"Scotland\",\n  \"gb-wls\": \"Wales\",\n  gd: \"Grenada\",\n  ge: \"Georgia\",\n  gf: \"French Guiana\",\n  gg: \"Guernsey\",\n  gh: \"Ghana\",\n  gi: \"Gibraltar\",\n  gl: \"Greenland\",\n  gm: \"Gambia\",\n  gn: \"Guinea\",\n  gp: \"Guadeloupe\",\n  gq: \"Equatorial Guinea\",\n  gr: \"Greece\",\n  gs: \"South Georgia\",\n  gt: \"Guatemala\",\n  gu: \"Guam\",\n  gw: \"Guinea-Bissau\",\n  gy: \"Guyana\",\n  hk: \"Hong Kong\",\n  hm: \"Heard Island and McDonald Islands\",\n  hn: \"Honduras\",\n  hr: \"Croatia\",\n  ht: \"Haiti\",\n  hu: \"Hungary\",\n  id: \"Indonesia\",\n  ie: \"Ireland\",\n  il: \"Israel\",\n  im: \"Isle of Man\",\n  in: \"India\",\n  io: \"British Indian Ocean Territory\",\n  iq: \"Iraq\",\n  ir: \"Iran\",\n  is: \"Iceland\",\n  it: \"Italy\",\n  je: \"Jersey\",\n  jm: \"Jamaica\",\n  jo: \"Jordan\",\n  jp: \"Japan\",\n  ke: \"Kenya\",\n  kg: \"Kyrgyzstan\",\n  kh: \"Cambodia\",\n  ki: \"Kiribati\",\n  km: \"Comoros\",\n  kn: \"Saint Kitts and Nevis\",\n  kp: \"North Korea\",\n  kr: \"South Korea\",\n  kw: \"Kuwait\",\n  ky: \"Cayman Islands\",\n  kz: \"Kazakhstan\",\n  la: \"Laos\",\n  lb: \"Lebanon\",\n  lc: \"Saint Lucia\",\n  li: \"Liechtenstein\",\n  lk: \"Sri Lanka\",\n  lr: \"Liberia\",\n  ls: \"Lesotho\",\n  lt: \"Lithuania\",\n  lu: \"Luxembourg\",\n  lv: \"Latvia\",\n  ly: \"Libya\",\n  ma: \"Morocco\",\n  mc: \"Monaco\",\n  md: \"Moldova\",\n  me: \"Montenegro\",\n  mf: \"Saint Martin\",\n  mg: \"Madagascar\",\n  mh: \"Marshall Islands\",\n  mk: \"North Macedonia\",\n  ml: \"Mali\",\n  mm: \"Myanmar\",\n  mn: \"Mongolia\",\n  mo: \"Macau\",\n  mp: \"Northern Mariana Islands\",\n  mq: \"Martinique\",\n  mr: \"Mauritania\",\n  ms: \"Montserrat\",\n  mt: \"Malta\",\n  mu: \"Mauritius\",\n  mv: \"Maldives\",\n  mw: \"Malawi\",\n  mx: \"Mexico\",\n  my: \"Malaysia\",\n  mz: \"Mozambique\",\n  na: \"Namibia\",\n  nc: \"New Caledonia\",\n  ne: \"Niger\",\n  nf: \"Norfolk Island\",\n  ng: \"Nigeria\",\n  ni: \"Nicaragua\",\n  nl: \"Netherlands\",\n  no: \"Norway\",\n  np: \"Nepal\",\n  nr: \"Nauru\",\n  nu: \"Niue\",\n  nz: \"New Zealand\",\n  om: \"Oman\",\n  pa: \"Panama\",\n  pe: \"Peru\",\n  pf: \"French Polynesia\",\n  pg: \"Papua New Guinea\",\n  ph: \"Philippines\",\n  pk: \"Pakistan\",\n  pl: \"Poland\",\n  pm: \"Saint Pierre and Miquelon\",\n  pn: \"Pitcairn Islands\",\n  pr: \"Puerto Rico\",\n  ps: \"Palestine\",\n  pt: \"Portugal\",\n  pw: \"Palau\",\n  py: \"Paraguay\",\n  qa: \"Qatar\",\n  re: \"Réunion\",\n  ro: \"Romania\",\n  rs: \"Serbia\",\n  ru: \"Russia\",\n  rw: \"Rwanda\",\n  sa: \"Saudi Arabia\",\n  sb: \"Solomon Islands\",\n  sc: \"Seychelles\",\n  sd: \"Sudan\",\n  se: \"Sweden\",\n  sg: \"Singapore\",\n  sh: \"Saint Helena, Ascension and Tristan da Cunha\",\n  si: \"Slovenia\",\n  sj: \"Svalbard and Jan Mayen\",\n  sk: \"Slovakia\",\n  sl: \"Sierra Leone\",\n  sm: \"San Marino\",\n  sn: \"Senegal\",\n  so: \"Somalia\",\n  sr: \"Suriname\",\n  ss: \"South Sudan\",\n  st: \"São Tomé and Príncipe\",\n  sv: \"El Salvador\",\n  sx: \"Sint Maarten\",\n  sy: \"Syria\",\n  sz: \"Eswatini (Swaziland)\",\n  tc: \"Turks and Caicos Islands\",\n  td: \"Chad\",\n  tf: \"French Southern and Antarctic Lands\",\n  tg: \"Togo\",\n  th: \"Thailand\",\n  tj: \"Tajikistan\",\n  tk: \"Tokelau\",\n  tl: \"Timor-Leste\",\n  tm: \"Turkmenistan\",\n  tn: \"Tunisia\",\n  to: \"Tonga\",\n  tr: \"Turkey\",\n  tt: \"Trinidad and Tobago\",\n  tv: \"Tuvalu\",\n  tw: \"Taiwan\",\n  tz: \"Tanzania\",\n  ua: \"Ukraine\",\n  ug: \"Uganda\",\n  um: \"United States Minor Outlying Islands\",\n  un: \"United Nations\",\n  us: \"United States\",\n  \"us-ak\": \"Alaska\",\n  \"us-al\": \"Alabama\",\n  \"us-ar\": \"Arkansas\",\n  \"us-az\": \"Arizona\",\n  \"us-ca\": \"California\",\n  \"us-co\": \"Colorado\",\n  \"us-ct\": \"Connecticut\",\n  \"us-de\": \"Delaware\",\n  \"us-fl\": \"Florida\",\n  \"us-ga\": \"Georgia\",\n  \"us-hi\": \"Hawaii\",\n  \"us-ia\": \"Iowa\",\n  \"us-id\": \"Idaho\",\n  \"us-il\": \"Illinois\",\n  \"us-in\": \"Indiana\",\n  \"us-ks\": \"Kansas\",\n  \"us-ky\": \"Kentucky\",\n  \"us-la\": \"Louisiana\",\n  \"us-ma\": \"Massachusetts\",\n  \"us-md\": \"Maryland\",\n  \"us-me\": \"Maine\",\n  \"us-mi\": \"Michigan\",\n  \"us-mn\": \"Minnesota\",\n  \"us-mo\": \"Missouri\",\n  \"us-ms\": \"Mississippi\",\n  \"us-mt\": \"Montana\",\n  \"us-nc\": \"North Carolina\",\n  \"us-nd\": \"North Dakota\",\n  \"us-ne\": \"Nebraska\",\n  \"us-nh\": \"New Hampshire\",\n  \"us-nj\": \"New Jersey\",\n  \"us-nm\": \"New Mexico\",\n  \"us-nv\": \"Nevada\",\n  \"us-ny\": \"New York\",\n  \"us-oh\": \"Ohio\",\n  \"us-ok\": \"Oklahoma\",\n  \"us-or\": \"Oregon\",\n  \"us-pa\": \"Pennsylvania\",\n  \"us-ri\": \"Rhode Island\",\n  \"us-sc\": \"South Carolina\",\n  \"us-sd\": \"South Dakota\",\n  \"us-tn\": \"Tennessee\",\n  \"us-tx\": \"Texas\",\n  \"us-ut\": \"Utah\",\n  \"us-va\": \"Virginia\",\n  \"us-vt\": \"Vermont\",\n  \"us-wa\": \"Washington\",\n  \"us-wi\": \"Wisconsin\",\n  \"us-wv\": \"West Virginia\",\n  \"us-wy\": \"Wyoming\",\n  uy: \"Uruguay\",\n  uz: \"Uzbekistan\",\n  va: \"Vatican City (Holy See)\",\n  vc: \"Saint Vincent and the Grenadines\",\n  ve: \"Venezuela\",\n  vg: \"British Virgin Islands\",\n  vi: \"United States Virgin Islands\",\n  vn: \"Vietnam\",\n  vu: \"Vanuatu\",\n  wf: \"Wallis and Futuna\",\n  ws: \"Samoa\",\n  xk: \"Kosovo\",\n  ye: \"Yemen\",\n  yt: \"Mayotte\",\n  za: \"South Africa\",\n  zm: \"Zambia\",\n  zw: \"Zimbabwe\",\n} as const\n\nexport type FlagCode = keyof typeof flagNames\nexport type FlagKind = \"country\" | \"subdivision\" | \"organization\"\n\nexport interface FlagMeta {\n  code: FlagCode\n  name: (typeof flagNames)[FlagCode]\n  kind: FlagKind\n}\n\nexport const flags = Object.entries(flagNames).map(([code, name]) => ({\n  code: code as FlagCode,\n  name,\n  kind: code === \"eu\" || code === \"un\"\n    ? \"organization\"\n    : code.startsWith(\"us-\") || code.startsWith(\"gb-\")\n      ? \"subdivision\"\n      : \"country\",\n})) satisfies FlagMeta[]\n\nexport const flagCount = flags.length\n\nexport function isFlagCode(value: string): value is FlagCode {\n  return Object.prototype.hasOwnProperty.call(flagNames, value.toLowerCase())\n}\n",
      "type": "registry:lib",
      "target": "@components/flags/flag-data.ts"
    }
  ],
  "meta": {
    "count": 306,
    "keyboard": true,
    "formCompatible": true,
    "license": "MIT"
  },
  "docs": "Use value/onValueChange for controlled state. Pass kinds=['country'] to omit subdivisions and organizations.",
  "categories": [
    "flags",
    "combobox",
    "forms",
    "internationalization"
  ],
  "type": "registry:block"
}