1) Installation

1. Install Hijri Calendar from Forge.

2. In your Reactive Web app, add a Dependency to the component public elements.

3. Drag the HijriCalendar block onto your screen.

4. Publish.

2) Required CSS & JS References

To ensure proper rendering, add the following CSS imports in your Theme or Layout:

@import url("/HijriCalendar/bootstrap.min.css");
@import url("/HijriCalendar/bootstrap-datetimepicker.css");

Also, make sure the component has access to its required CSS Files:

• bootstrap.min.css

• bootstrap-datetimepicker.css

⚡️ These files are already packaged with the component. Just confirm they are referenced in your Layout or loaded via Dependencies.

3) Inputs (Block Parameters)

• DefaultDate (Text/DateTime, optional)

• MinDate / MaxDate (Text/DateTime, optional)

• ViewMode → "days" | "months" | "years"

• ShowSwitcher, Inline, ShowTodayButton, ShowClearButton, ShowCloseButton, KeepOpen, UseCurrent, AllowInputToggle, OpenOnLoad (Boolean)

4) Outputs

• Gregorian (Date)

• Hijri (Date)

5) Events (Reactive)

• OnChange → Fires when value changes.
  Example client action:

Assign:
  VarGregorian = HijriCalendar.SelectedGregorian
  VarHijri     = HijriCalendar.SelectedHijri

Message:
  "Gregorian: " + VarGregorian + " | Hijri: " + VarHijri

6) Usage Tips

• Use NullIdentifier() in DefaultDate if you want it empty.

• Store SelectedGregorian in DB; keep SelectedHijri for display.

7) Compatibility

• Reactive Web only.

• CSS must be imported in your theme (see step 2).

8) License

BSD 3-Clause (see Forge listing).