# mdabdulkayum/cmp-countrypicker architecture

> Architecture diagram of the GitHub repository mdabdulkayum/cmp-countrypicker, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-15). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/mdabdulkayum/cmp-countrypicker
- Repository: https://github.com/mdabdulkayum/cmp-countrypicker

## Overview

CMP Country Picker is a Compose Multiplatform library for country selection and international phone entry. An app embeds the country bottom sheet or phone field; users search/filter and select a country, or enter a number that may be parsed, formatted, and validated before updated state is returned to the app. The core layer supplies country records, lookup/filtering, and ranked search. Edges reflect shown calls or README capabilities; some phone-field details are only partially excerpted, so those links use the available index or documentation evidence.

Main entry points: [`countrypicker/src/commonMain/kotlin/ui/PhoneInputField.kt`](https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/ui/PhoneInputField.kt) (Phone Input), [`countrypicker/src/commonMain/kotlin/ui/CountryPickerBottomSheet.kt`](https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/ui/CountryPickerBottomSheet.kt) (Country Picker), [`countrypicker/src/commonMain/kotlin/core/CountryRepository.kt`](https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/core/CountryRepository.kt) (Country Repository), [`countrypicker/src/commonMain/kotlin/ui/internal/CountryPickerUiComponents.kt`](https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/ui/internal/CountryPickerUiComponents.kt) (Picker UI Parts)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_ui["Compose UI"]
  node_picker["Country Picker"]
  node_picker_state["Picker State"]
  node_picker_parts["Picker UI Parts"]
  node_phone_field["Phone Input<br/>[PhoneInputField.kt]"]
end

subgraph group_phone["Phone Handling"]
  node_formatter["Phone Formatter<br/>[PhoneFormatter.kt]"]
  node_validator["Phone Validator<br/>[PhoneValidator.kt]"]
end

subgraph group_countries["Country Data"]
  node_country_data[("Country Data<br/>[CountryData.kt]")]
  node_repository["Country Repository"]
  node_search["Country Search<br/>[SearchEngine.kt]"]
  node_country["Country Model<br/>[Country.kt]"]
  node_filter["Country Filters<br/>[CountryFilter.kt]"]
end

subgraph group_styling["Customization"]
  node_theme["Picker Theme"]
end

node_app(("Host App"))
node_phone_result["Updated Input State"]

node_app -->|"opens picker"| node_picker
node_picker -->|"renders state"| node_picker_state
node_picker -->|"renders components"| node_picker_parts
node_picker_state -->|"filters countries"| node_repository
node_repository -->|"reads records"| node_country_data
node_repository -->|"ranks matches"| node_search
node_repository -->|"applies rules"| node_filter
node_app -->|"enters phone"| node_phone_field
node_phone_field -->|"opens selector"| node_picker
node_phone_field -->|"parses international number"| node_country_data
node_phone_field -->|"formats number"| node_formatter
node_phone_field -->|"validates number"| node_validator
node_phone_field -->|"updates state"| node_phone_result
node_country_data -->|"defines records"| node_country
node_picker -->|"uses styling"| node_theme
node_phone_field -->|"uses styling"| node_theme
node_picker_parts -->|"reads theme"| node_theme
node_picker_parts -->|"renders country"| node_country

click node_picker "https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/ui/CountryPickerBottomSheet.kt"
click node_picker_state "https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/ui/CountryPickerBottomSheet.kt"
click node_picker_parts "https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/ui/internal/CountryPickerUiComponents.kt"
click node_phone_field "https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/ui/PhoneInputField.kt"
click node_formatter "https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/phone/PhoneFormatter.kt"
click node_validator "https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/phone/PhoneValidator.kt"
click node_country_data "https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/core/internal/CountryData.kt"
click node_repository "https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/core/CountryRepository.kt"
click node_search "https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/core/internal/SearchEngine.kt"
click node_country "https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/core/Country.kt"
click node_filter "https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/core/CountryFilter.kt"
click node_theme "https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/theme/CountryPickerTheme.kt"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_picker,node_picker_state,node_picker_parts,node_phone_field toneBlue
class node_formatter,node_validator toneAmber
class node_country_data,node_repository,node_search,node_country,node_filter toneMint
class node_theme toneRose
class node_app,node_phone_result toneIndigo
```

## Components

### Compose UI

- [Country Picker](https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/ui/CountryPickerBottomSheet.kt): `countrypicker/src/commonMain/kotlin/ui/CountryPickerBottomSheet.kt`
- [Picker State](https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/ui/CountryPickerBottomSheet.kt): `countrypicker/src/commonMain/kotlin/ui/CountryPickerBottomSheet.kt`
- [Picker UI Parts](https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/ui/internal/CountryPickerUiComponents.kt): `countrypicker/src/commonMain/kotlin/ui/internal/CountryPickerUiComponents.kt`
- [Phone Input](https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/ui/PhoneInputField.kt): `countrypicker/src/commonMain/kotlin/ui/PhoneInputField.kt`

### Phone Handling

- [Phone Formatter](https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/phone/PhoneFormatter.kt): `countrypicker/src/commonMain/kotlin/phone/PhoneFormatter.kt`
- [Phone Validator](https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/phone/PhoneValidator.kt): `countrypicker/src/commonMain/kotlin/phone/PhoneValidator.kt`

### Country Data

- [Country Data](https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/core/internal/CountryData.kt): `countrypicker/src/commonMain/kotlin/core/internal/CountryData.kt`
- [Country Repository](https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/core/CountryRepository.kt): `countrypicker/src/commonMain/kotlin/core/CountryRepository.kt`
- [Country Search](https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/core/internal/SearchEngine.kt): `countrypicker/src/commonMain/kotlin/core/internal/SearchEngine.kt`
- [Country Model](https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/core/Country.kt): `countrypicker/src/commonMain/kotlin/core/Country.kt`
- [Country Filters](https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/core/CountryFilter.kt): `countrypicker/src/commonMain/kotlin/core/CountryFilter.kt`

### Customization

- [Picker Theme](https://github.com/mdabdulkayum/cmp-countrypicker/blob/main/countrypicker/src/commonMain/kotlin/theme/CountryPickerTheme.kt): `countrypicker/src/commonMain/kotlin/theme/CountryPickerTheme.kt`

### Other components

- **Host App**
- **Updated Input State**

## Connections

- Host App → Country Picker: opens picker (evidence: `README.md`)
- Country Picker → Picker State: renders state (evidence: `countrypicker/src/commonMain/kotlin/ui/CountryPickerBottomSheet.kt`)
- Country Picker → Picker UI Parts: renders components (evidence: `countrypicker/src/commonMain/kotlin/ui/CountryPickerBottomSheet.kt`)
- Picker State → Country Repository: filters countries (evidence: `countrypicker/src/commonMain/kotlin/ui/CountryPickerBottomSheet.kt`)
- Country Repository → Country Data: reads records (evidence: `countrypicker/src/commonMain/kotlin/core/CountryRepository.kt`)
- Country Repository → Country Search: ranks matches (evidence: `countrypicker/src/commonMain/kotlin/core/CountryRepository.kt`)
- Country Repository → Country Filters: applies rules (evidence: `countrypicker/src/commonMain/kotlin/core/CountryRepository.kt`)
- Host App → Phone Input: enters phone (evidence: `README.md`)
- Phone Input → Country Picker: opens selector (evidence: `countrypicker/src/commonMain/kotlin/ui/PhoneInputField.kt`)
- Phone Input → Country Data: parses international number (evidence: `countrypicker/src/commonMain/kotlin/ui/PhoneInputField.kt`)
- Phone Input → Phone Formatter: formats number (evidence: `countrypicker/src/commonMain/kotlin/ui/PhoneInputField.kt`)
- Phone Input → Phone Validator: validates number (evidence: `countrypicker/src/commonMain/kotlin/ui/PhoneInputField.kt`)
- Phone Input → Updated Input State: updates state (evidence: `README.md`)
- Country Data → Country Model: defines records (evidence: `countrypicker/src/commonMain/kotlin/core/internal/CountryData.kt`)
- Country Picker → Picker Theme: uses styling (evidence: `countrypicker/src/commonMain/kotlin/ui/CountryPickerBottomSheet.kt`)
- Phone Input → Picker Theme: uses styling (evidence: `countrypicker/src/commonMain/kotlin/ui/PhoneInputField.kt`)
- Picker UI Parts → Picker Theme: reads theme (evidence: `countrypicker/src/commonMain/kotlin/ui/internal/CountryPickerUiComponents.kt`)
- Picker UI Parts → Country Model: renders country (evidence: `countrypicker/src/commonMain/kotlin/ui/internal/CountryPickerUiComponents.kt`)
