SkillAgentSearch skills...

PersianDatePicker

Android Persian (Jalali) DatePicker for Jetpack Compose: dialog, bottom sheet, single/multiple/range

Install / Use

/learn @mirajabi/PersianDatePicker

README

Android Persian (Jalali) DatePicker for Jetpack Compose

JitPack minSdk Kotlin Compose License: MIT

Clean, configurable Persian (Jalali/Iranian) Date Picker for Android with Jetpack Compose. Supports Single, Multiple, and Range selection in Dialog and Bottom Sheet, RTL-friendly, with full styling and an optional Year Picker.

Keywords: Android Persian DatePicker, Jalali Calendar, Jetpack Compose Date Picker, Range Picker, Multi-date, BottomSheet, Dialog.

Features

  • Single, Multiple, and Range selection modes
  • Dialog or Bottom Sheet presentation with gravity control (Top, Center, Bottom)
  • Full styling via PersianDatePickerStyle (colors, sizes, typography, ripple, footer)
  • Builder-based config (size/sizeFraction, margins, paddings, dismiss behavior)
  • Today button with custom text/callback and calendar auto-navigation
  • Optional Year Picker (columns, range years, colors, corner radius)
  • Selection summary footer and RTL-aware typography

Installation (JitPack)

Add JitPack to repositories.

Kotlin DSL:

repositories {
    google()
    mavenCentral()
    maven(url = "https://jitpack.io")
}

dependencies {
    implementation("com.github.Miaadrajabi:persianDatePicker:v1.0.0")
}

Groovy DSL:

repositories {
    google()
    mavenCentral()
    maven { url 'https://jitpack.io' }
}

dependencies {
    implementation 'com.github.Miaadrajabi:persianDatePicker:v1.0.0'
}

Version Catalog (optional):

[libraries]
persian-datepicker = { module = "com.github.Miaadrajabi:persianDatePicker", version = "v1.0.0" }
dependencies { implementation(libs.persian.datepicker) }

Quick Usage

Minimal example with Dialog + Range:

var show by remember { mutableStateOf(false) }

Button(onClick = { show = true }) { Text("Pick Date Range") }

PersianDatePicker(
    isVisible = show,
    config = PersianDatePickerBuilder()
        .selectionMode(SelectionMode.RANGE)
        .presentation(PresentationStyle.DIALOG)
        .gravity(DialogGravity.CENTER)
        .sizeFraction(widthFraction = 0.95f, heightFraction = null)
        .dialogMargin(horizontal = 16.dp, vertical = 16.dp)
        .contentPadding(horizontal = 24.dp, vertical = 24.dp)
        .style(PersianDatePickerStyle())
        .showTodayButton(true)
        .todayButtonText("امروز")
        .singleTitle("انتخاب تاریخ")
        .multipleTitle("انتخاب چند تاریخ")
        .rangeTitle("انتخاب بازه تاریخ")
        .enableYearPicker(true)
        .showSelectionSummaryFooter(true)
        .build(),
    onDismiss = { show = false },
    onResult = { result ->
        when (result) {
            is SelectionResult.Single -> { /* result.date */ }
            is SelectionResult.Multiple -> { /* result.dates */ }
            is SelectionResult.Range -> { /* result.range */ }
        }
    }
)

Bottom Sheet + Multiple example (from sample app):

PersianDatePicker(
    isVisible = show,
    config = PersianDatePickerBuilder()
        .selectionMode(SelectionMode.MULTIPLE)
        .presentation(PresentationStyle.BOTTOM_SHEET)
        .style(PersianDatePickerStyle())
        .build(),
    onDismiss = { show = false },
    onResult = { /* handle SelectionResult.Multiple */ }
)

Screenshots

<table> <tr> <td align="center"> <img src="./rangepicker_light.png" alt="android persian datepicker dialog range light" width="360" /> <br/>Range (Dialog) - Light </td> <td align="center"> <img src="./rangepicker_dialog_dark.png" alt="android persian datepicker dialog range dark" width="360" /> <br/>Range (Dialog) - Dark </td> </tr> <tr> <td align="center"> <img src="./multi_select_light.png" alt="android persian datepicker bottomsheet multi light" width="360" /> <br/>Multiple (BottomSheet) - Light </td> <td align="center"> <img src="./mutlti_picker_dark.png" alt="android persian datepicker bottomsheet multi dark" width="360" /> <br/>Multiple (BottomSheet) - Dark </td> </tr> </table>

FAQ

  • How do I set initial values?
    • Range: .initialRange(PersianDateRange(start, end))
    • Multiple: .initialSelectedDates(setOf(date1, date2))
  • How do I enable the Year Picker?
    • .enableYearPicker(true) and customize via PersianDatePickerStyle (columns, colors, radius).
  • What is the minimum SDK?
    • minSdk 21.

Leap Year (سال کبیسه)

Handled internally for Jalali. You can also query:

val isLeap = PersianDate.isLeapYear(1404)

License

MIT

Related Skills

clearshot

Structured screenshot analysis for UI implementation and critique. Analyzes every UI screenshot with a 5×5 spatial grid, full element inventory, and design system extraction — facts and taste together, every time. Escalates to full implementation blueprint when building. Trigger on any digital interface image file (png, jpg, gif, webp — websites, apps, dashboards, mockups, wireframes) or commands like 'analyse this screenshot,' 'rebuild this,' 'match this design,' 'clone this.' Skip for non-UI images (photos, memes, charts) unless the user explicitly wants to build a UI from them. Does NOT trigger on HTML source code, CSS, SVGs, or any code pasted as text.

openpencil

2.0k

The world's first open-source AI-native vector design tool and the first to feature concurrent Agent Teams. Design-as-Code. Turn prompts into UI directly on the live canvas. A modern alternative to Pencil.

ui-ux-designer

Use this agent when you need to design, implement, or improve user interface components and user experience flows. Examples include: creating new pages or components, improving existing UI layouts, implementing responsive designs, optimizing user interactions, building forms or dashboards, analyzing existing UI through browser snapshots, or when you need to ensure UI components follow design system standards and shadcn/ui best practices.\n\n<example>\nContext: User needs to create a new dashboard page for team management.\nuser: "I need to create a team management dashboard where users can view team members, invite new members, and manage roles"\nassistant: "I'll use the ui-ux-designer agent to design and implement this dashboard with proper UX considerations, using shadcn/ui components and our design system tokens."\n</example>\n\n<example>\nContext: User wants to improve the user experience of an existing form.\nuser: "The signup form feels clunky and users are dropping off. Can you improve it?"\nassistant: "Let me use the ui-ux-designer agent to analyze the current form UX and implement improvements using our design system and shadcn/ui components."\n</example>\n\n<example>\nContext: User wants to evaluate and improve existing UI.\nuser: "Can you take a look at our pricing page and see how we can make it more appealing and user-friendly?"\nassistant: "I'll use the ui-ux-designer agent to take a snapshot of the current pricing page, analyze the UX against Notion-inspired design principles, and implement improvements using our design tokens."\n</example>

HappyColorBlend

HappyColorBlendVibe Project Guidelines Project Overview HappyColorBlendVibe is a Figma plugin for color palette generation with advanced tint/shade blending capabilities. It allows designers to

View on GitHub
GitHub Stars6
CategoryDesign
Updated1mo ago
Forks0

Languages

Kotlin

Security Score

90/100

Audited on Feb 5, 2026

No findings