dev-dga
ComponentsComplianceAccessibilityArabic & RTLInstallationStorybook

Actions & buttons

ButtonFloatingButtonLinkToggleContentSwitcher

Form inputs

TextInputTextareaNumberInputSelectDropdownCheckboxRadioSwitchSliderRatingInputOTPTagInputSearchBoxFileUploadDatePickerDateRangePickerChip

Data display

CardTagStatusTagAvatarDividerDescriptionListListStructuredListMetricQuoteTimelineTableAspectRatioDigitalStampCodeSnippetSaudiRiyal

Data visualization

Charts

Feedback

InlineAlertNotificationNotificationToastTooltipSpinnerSkeletonProgressEmptyState

Overlays

ModalDrawerPopoverSlideoutMenuDropdownMenuMenubarFiltrationCommand

Navigation

TabsBreadcrumbPaginationAccordionProgressIndicatorCollapsibleScrollAreaCarousel

App shell

Sidebar

Provider & utilities

DgaProvider
Overlays

Modal

A centered dialog over the page.

Open in Storybook ↗import { Modal }from '@dev-dga/react'

Modal opens a centered dialog from a trigger: header, body, and a footer of actions. It inherits theme and direction from the provider.

Confirmation dialog

PreviousEmptyStateNextDrawer
dev-dga

Saudi Arabia’s DGA Platforms Code, as accessible React 19 components.

Explore

ComponentsInstallationTheme studioBlocksExamplesStorybook

Proof

ComplianceAccessibilityArabic & RTL

Project

GitHubMIT Licensenpm · @dev-dga/react

Independent implementation, free to use under the MIT license. Not affiliated with, nor endorsed by, the official Saudi Digital Government Authority (DGA).

Built by Dhaifallah Alfarawi · @DevDhaif

MIT · built with @dev-dga