Repository: ant-design/ant-design-mobile
Pull request #6632 (2024-05-23 04:51:56)

feat(i18n): add in-ID and update others
- add in-ID
- update ar-SA, de-DE, es-ES, fr-FR, ja-JP, th-TH

github-actions[bot]: PR preview has been successfully built and deployed to https://antd-mobile-preview-pr-6632.surge.sh
codecov[bot]: ## [Codecov](https://app.codecov.io/gh/ant-design/ant-design-mobile/pull/6632?dropdown=coverage&src=pr&el=h1&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=ant-design) Report
All modified and coverable lines are covered by tests :white_check_mark:
> Project coverage is 92.39%. Comparing base [(`cf550e4`)](https://app.codecov.io/gh/ant-design/ant-design-mobile/commit/cf550e43989cbe9f0cc2c78cb84dd57ac5b4fff9?dropdown=coverage&el=desc&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=ant-design) to head [(`337c1b6`)](https://app.codecov.io/gh/ant-design/ant-design-mobile/commit/337c1b6f90d6597370bf835746a71e7c19ff87d3?dropdown=coverage&el=desc&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=ant-design).
> Report is 12 commits behind head on master.


<details><summary>Additional details and impacted files</summary>


```diff
@@            Coverage Diff             @@
##           master    #6632      +/-   ##
==========================================
+ Coverage   92.34%   92.39%   +0.04%     
==========================================
  Files         318      325       +7     
  Lines        6910     6967      +57     
  Branches     1729     1731       +2     
==========================================
+ Hits         6381     6437      +56     
- Misses        493      494       +1     
  Partials       36       36              
```



</details>

[:umbrella: View full report in Codecov by Sentry](https://app.codecov.io/gh/ant-design/ant-design-mobile/pull/6632?dropdown=coverage&src=pr&el=continue&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=ant-design).   
:loudspeaker: Have feedback on the report? [Share it here](https://about.codecov.io/codecov-pr-comment-feedback/?utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=ant-design).


Patch:
diff --git a/docs/guide/i18n.en.md b/docs/guide/i18n.en.md
index f6b96d0f9..6751a2ace 100644
--- a/docs/guide/i18n.en.md
+++ b/docs/guide/i18n.en.md
@@ -30,6 +30,7 @@ The following languages are currently supported:
 | Japanese              | ja-JP    |
 | Kazakh                | kk-KZ    |
 | Indonesian            | id-ID    |
+| Indonesian(old form)  | in-ID    |
 | Italian               | it-IT    |
 | Danish                | da-DK    |
 | Norwegian (Bokmål)    | nb-NO    |
diff --git a/docs/guide/i18n.zh.md b/docs/guide/i18n.zh.md
index 491fd8607..bbb4600b1 100644
--- a/docs/guide/i18n.zh.md
+++ b/docs/guide/i18n.zh.md
@@ -29,6 +29,7 @@ return (
 | 日语                 | ja-JP  |
 | 哈萨克语             | kk-KZ  |
 | 印度尼西亚语         | id-ID  |
+| 印度尼西亚语（旧版） | in-ID  |
 | 意大利语             | it-IT  |
 | 丹麦语               | da-DK  |
 | 挪威                 | nb-NO  |
diff --git a/src/locales/ar-SA.ts b/src/locales/ar-SA.ts
index b64897205..cfa5fe5cf 100644
--- a/src/locales/ar-SA.ts
+++ b/src/locales/ar-SA.ts
@@ -21,7 +21,7 @@ const arSA = mergeLocale(base, {
     'yearAndMonth': '${year} سنة ${month} شهر',
   },
   'Cascader': { 'placeholder': 'اختر من فضلك' },
-  'Dialog': { 'ok': 'عرفت' },
+  'Dialog': { 'ok': 'فهمت' },
   'DatePicker': { 'tillNow': 'إلى اليوم' },
   'ErrorBlock': {
     'default': {
@@ -95,7 +95,7 @@ const arSA = mergeLocale(base, {
   },
   'Input': { 'clear': 'إزالة' },
   'Mask': { 'name': 'قناع الخلفية' },
-  'Modal': { 'ok': 'عرفت' },
+  'Modal': { 'ok': 'فهمت' },
   'PasscodeInput': { 'name': 'مربع إدخال كلمة المرور' },
   'PullToRefresh': {
     'pulling': 'اسحب إلى الأسفل للتحديث',
diff --git a/src/locales/de-DE.ts b/src/locales/de-DE.ts
index fb3f957ce..447d0395b 100644
--- a/src/locales/de-DE.ts
+++ b/src/locales/de-DE.ts
@@ -17,19 +17,11 @@ const deDE = mergeLocale(base, {
     'start': 'Starten',
     'end': 'Beenden',
     'today': 'Heute',
-    'markItems': [
-      'Montag',
-      'Dienstag',
-      'Mittwoch',
-      'Donnerstag',
-      'Freitag',
-      'Samstag',
-      'Tag',
-    ],
+    'markItems': ['I', 'II', 'III', 'IV', 'V', 'Sechs', 'Tag'],
     'yearAndMonth': '${year}Jahr${month}Monat',
   },
   'Cascader': { 'placeholder': 'Bitte auswählen' },
-  'Dialog': { 'ok': 'OK' },
+  'Dialog': { 'ok': 'Ich weiß.' },
   'DatePicker': { 'tillNow': 'Bis heute' },
   'ErrorBlock': {
     'default': {
@@ -108,7 +100,7 @@ const deDE = mergeLocale(base, {
   },
   'Input': { 'clear': 'Löschen' },
   'Mask': { 'name': 'Hintergrundmaske' },
-  'Modal': { 'ok': 'OK' },
+  'Modal': { 'ok': 'Ich weiß.' },
   'PasscodeInput': { 'name': 'Passwort-Eingabefeld' },
   'PullToRefresh': {
     'pulling': 'Nach unten zum Aktualisieren ziehen',
diff --git a/src/locales/es-ES.ts b/src/locales/es-ES.ts
index b7fc56b8b..617755102 100644
--- a/src/locales/es-ES.ts
+++ b/src/locales/es-ES.ts
@@ -18,7 +18,7 @@ const esES = mergeLocale(base, {
     placeholder: 'Seleccionando',
   },
   Dialog: {
-    ok: 'OK',
+    ok: 'Entendido',
   },
   ErrorBlock: {
     default: {
@@ -96,7 +96,7 @@ const esES = mergeLocale(base, {
     name: 'Máscara',
   },
   Modal: {
-    ok: 'OK',
+    ok: 'Entendido',
   },
   PullToRefresh: {
     pulling: 'Desplácese hacia abajo para refrescar',
diff --git a/src/locales/fr-FR.ts b/src/locales/fr-FR.ts
index becc24823..9cacf81da 100644
--- a/src/locales/fr-FR.ts
+++ b/src/locales/fr-FR.ts
@@ -6,7 +6,7 @@ const typeTemplate = '${label}Pas un valide${type}'
 const frFR = mergeLocale(base, {
   locale: 'fr-FR',
   common: {
-    confirm: 'Valider',
+    confirm: 'Activer',
     cancel: 'Annuler',
     loading: 'Chargement',
   },
diff --git a/src/locales/in-ID.ts b/src/locales/in-ID.ts
new file mode 100644
index 000000000..8a09ce987
--- /dev/null
+++ b/src/locales/in-ID.ts
@@ -0,0 +1,115 @@
+import { mergeLocale } from '../utils/merge-locale'
+import { base } from './base'
+
+const typeTemplate = '${label} bukan ${type} yang valid'
+
+const inID = mergeLocale(base, {
+  locale: 'in-ID',
+  common: {
+    confirm: 'Yakin',
+    cancel: 'Batal ',
+    loading: 'memuat',
+    close: 'Tutup',
+  },
+  Calendar: {
+    title: 'Pilih Tanggal',
+    confirm: 'OK',
+    start: 'Mulai',
+    end: 'Selesai',
+    today: 'Hari Ini',
+    markItems: ['Senin', 'Selasa', 'Rabu', 'Kamis', 'Jumat', 'Sabtu', 'Minggu'],
+    yearAndMonth: '${year} Tahun ${month} Bulan',
+  },
+  Cascader: { placeholder: 'Silahkan Pilih' },
+  Dialog: { ok: 'Saya mendapatkannya' },
+  DatePicker: { tillNow: 'Sampai sekarang' },
+  ErrorBlock: {
+    default: {
+      title: 'Halaman mengalami beberapa permasalahan kecil',
+      description: 'Coba lagi nanti',
+    },
+    busy: {
+      title: 'kepadatan diawal',
+      description: 'Coba untuk menyegarkan',
+    },
+    disconnected: {
+      title: 'jaringan sedikit sibuk',
+      description: 'Gerakkan jari Anda untuk membantu memperbaiki',
+    },
+    empty: {
+      title: 'Itu tidak menemukan apa yang Anda butuhkan',
+      description: 'Silahkan cari yang lain',
+    },
+  },
+  Form: {
+    required: 'Diperlukan',
+    optional: 'opsional untuk diisi',
+    defaultValidateMessages: {
+      default: 'Kesalahan validasi bidang ${label}',
+      required: 'Harap masukkan ${label}',
+      enum: '${label} harus salah satu dari [${enum}]',
+      whitespace: '${label} tidak boleh berupa karakter kosong',
+      date: {
+        format: 'Format tanggal ${label} tidak valid',
+        parse: '${label} tidak dapat dikonversi ke tanggal',
+        invalid: '${label} adalah tanggal yang tidak valid',
+      },
+      types: {
+        string: typeTemplate,
+        method: typeTemplate,
+        array: typeTemplate,
+        object: typeTemplate,
+        number: typeTemplate,
+        date: typeTemplate,
+        boolean: typeTemplate,
+        integer: typeTemplate,
+        float: typeTemplate,
+        regexp: typeTemplate,
+        email: typeTemplate,
+        url: typeTemplate,
+        hex: typeTemplate,
+      },
+      string: {
+        len: '${label} harus berupa ${len} karakter',
+        min: '${label} Minimal ${min} karakter',
+        max: '${label}Maksimum ${max} karakter',
+        range: '${label} harus antara ${min}-${max} karakter',
+      },
+      number: {
+        len: '${label} harus sama dengan ${len}',
+        min: 'Nilai minimum ${label} adalah ${min}',
+        max: '${label} memiliki nilai maksimum ${max}',
+        range: '${label} harus antara ${min}-${max}',
+      },
+      array: {
+        len: 'Harus ${len} ${label}',
+        min: 'Minimal ${min} ${label}',
+        max: 'Hingga ${max} ${label}',
+        range: 'Jumlah ${label} harus antara ${min}-${max}',
+      },
+      pattern: { mismatch: '${label} tidak cocok dengan pola ${pattern}' },
+    },
+  },
+  ImageUploader: { uploading: 'mengunggah...', upload: 'diunggah' },
+  InfiniteScroll: {
+    noMore: 'tidak ada lagi',
+    failedToLoad: 'Gagal memuat',
+    retry: 'memuat ulang',
+  },
+  Input: { clear: 'Hapus' },
+  Mask: { name: 'lapisan pelindung' },
+  Modal: { ok: 'Saya mendapatkannya' },
+  PasscodeInput: { name: 'Kotak kata sandi' },
+  PullToRefresh: {
+    pulling: 'Tarik ke bawah untuk menyegarkan',
+    canRelease: 'Lepaskan untuk menyegarkan segera',
+    complete: 'Segarkan berhasil',
+  },
+  SearchBar: { name: 'Bilah Pencarian' },
+  Slider: { name: 'Penggeser' },
+  Stepper: { decrease: 'mengurangi', increase: 'meningkat' },
+  Switch: { name: 'Mengalihkan' },
+  Selector: { name: 'Grup pilih' },
+})
+
+export default inID
diff --git a/src/locales/ja-JP.ts b/src/locales/ja-JP.ts
index 564d729d4..96d150e4a 100644
--- a/src/locales/ja-JP.ts
+++ b/src/locales/ja-JP.ts
@@ -18,7 +18,7 @@ const jaJP = mergeLocale(base, {
     placeholder: '選択下さい',
   },
   Dialog: {
-    ok: 'わかりました',
+    ok: '了解',
   },
   ErrorBlock: {
     default: {
@@ -105,7 +105,7 @@ const jaJP = mergeLocale(base, {
     name: 'マスク',
   },
   Modal: {
-    ok: 'わかりました',
+    ok: '了解',
   },
   PasscodeInput: {
     name: 'パスコード入力',
diff --git a/src/locales/th-TH.ts b/src/locales/th-TH.ts
index e27ce81bd..452b66b93 100644
--- a/src/locales/th-TH.ts
+++ b/src/locales/th-TH.ts
@@ -32,7 +32,7 @@ const thTH = mergeLocale(base, {
     placeholder: 'เลือก',
   },
   Dialog: {
-    ok: 'โอเค',
+    ok: 'ฉันรู้แล้ว',
   },
   DatePicker: {
     tillNow: 'จนถึงตอนนี้',
@@ -122,7 +122,7 @@ const thTH = mergeLocale(base, {
     name: 'มาสก์',
   },
   Modal: {
-    ok: 'ตกลง',
+    ok: 'ฉันรู้แล้ว',
   },
   PasscodeInput: {
     name: 'ป้อนรหัสผ่าน',


Test patch:
diff --git a/src/components/config-provider/tests/__snapshots__/config-provider.test.tsx.snap b/src/components/config-provider/tests/__snapshots__/config-provider.test.tsx.snap
index 0960fc97c..1eff27f4e 100644
--- a/src/components/config-provider/tests/__snapshots__/config-provider.test.tsx.snap
+++ b/src/components/config-provider/tests/__snapshots__/config-provider.test.tsx.snap
@@ -9475,32 +9475,32 @@ exports[`ConfigProvider should display the text as de-DE 1`] = `
       <div
         class="adm-calendar-mark-cell"
       >
-        Montag
+        I
       </div>
       <div
         class="adm-calendar-mark-cell"
       >
-        Dienstag
+        II
       </div>
       <div
         class="adm-calendar-mark-cell"
       >
-        Mittwoch
+        III
       </div>
       <div
         class="adm-calendar-mark-cell"
       >
-        Donnerstag
+        IV
       </div>
       <div
         class="adm-calendar-mark-cell"
       >
-        Freitag
+        V
       </div>
       <div
         class="adm-calendar-mark-cell"
       >
-        Samstag
+        Sechs
       </div>
     </div>
     <div
@@ -10035,32 +10035,32 @@ exports[`ConfigProvider should display the text as de-DE 1`] = `
       <div
         class="adm-calendar-picker-view-mark-cell"
       >
-        Montag
+        I
       </div>
       <div
         class="adm-calendar-picker-view-mark-cell"
       >
-        Dienstag
+        II
       </div>
       <div
         class="adm-calendar-picker-view-mark-cell"
       >
-        Mittwoch
+        III
       </div>
       <div
         class="adm-calendar-picker-view-mark-cell"
       >
-        Donnerstag
+        IV
       </div>
       <div
         class="adm-calendar-picker-view-mark-cell"
       >
-        Freitag
+        V
       </div>
       <div
         class="adm-calendar-picker-view-mark-cell"
       >
-        Samstag
+        Sechs
       </div>
     </div>
     <div
@@ -41796,6 +41796,4650 @@ exports[`ConfigProvider should display the text as id-ID 1`] = `
 </div>
 `;
 
+exports[`ConfigProvider should display the text as in-ID 1`] = `
+<div>
+  <div
+    class="adm-calendar"
+  >
+    <div
+      class="adm-calendar-header"
+    >
+      <a
+        class="adm-calendar-arrow-button adm-calendar-arrow-button-year"
+      >
+        <svg
+          height="1em"
+          viewBox="0 0 44 44"
+        >
+          <g
+            fill="none"
+            fill-rule="evenodd"
+            stroke="none"
+            stroke-width="1"
+          >
+            <g
+              transform="translate(-24.000000, -22.000000)"
+            >
+              <g
+                transform="translate(24.000000, 22.000000)"
+              >
+                <rect
+                  height="44"
+                  width="44"
+                  x="0"
+                  y="0"
+                />
+                <g
+                  fill="currentColor"
+                  fill-rule="nonzero"
+                  transform="translate(7.000000, 4.000000)"
+                >
+                  <path
+                    d="M19.4833058,2.71985611 L3.53051139,17.0699744 C3.0173831,17.5315665 2.97522952,18.3220903 3.43630803,18.8357433 L3.43630796,18.8357432 C3.46601289,18.8688164 3.49745845,18.9002801 3.53051133,18.9300007 L19.4833057,33.2801611 C20.1234001,33.8559077 20.1759552,34.8420707 19.6007967,35.4827774 C19.0256382,36.1235263 18.0404824,36.1761351 17.400388,35.6003885 L1.44759367,21.2502703 L1.4475933,21.25027 C1.33208743,21.1463692 1.22220259,21.036372 1.11840792,20.920748 C-0.49302969,19.1256817 -0.345639536,16.3628317 1.4475933,14.7497465 L17.4003877,0.399628282 C18.0404821,-0.176160428 19.0256378,-0.123509422 19.6007963,0.517239417 C20.1759548,1.1579461 20.1233997,2.14410915 19.4833053,2.7198557 L19.4833058,2.71985611 Z"
+                  />
+                  <path
+                    d="M19.5305114,17.0699744 C19.0173831,17.5315665 18.9752295,18.3220903 19.436308,18.8357433 C19.4660129,18.8688164 19.4974585,18.9002801 19.5305113,18.9300007 L29.4833057,27.2801611 C30.1234001,27.8559077 30.1759552,28.8420707 29.6007967,29.4827774 C29.0256382,30.1235263 28.0404824,30.1761351 27.400388,29.6003885 L17.4475937,21.2502703 C17.3320874,21.1463692 17.2222026,21.036372 17.1184079,20.920748 C15.5069703,19.1256817 15.6543605,16.3628317 17.4475933,14.7497465 L27.4003877,6.39962828 C28.0404821,5.82383957 29.0256378,5.87649058 29.6007963,6.51723942 C30.1759548,7.1579461 30.1233997,8.14410915 29.4833053,8.7198557 L19.5305114,17.0699744 Z"
+                  />
+                </g>
+              </g>
+            </g>
+          </g>
+        </svg>
+      </a>
+      <a
+        class="adm-calendar-arrow-button adm-calendar-arrow-button-month"
+      >
+        <svg
+          height="1em"
+          viewBox="0 0 44 44"
+        >
+          <g
+            fill="none"
+            fill-rule="evenodd"
+            stroke="none"
+            stroke-width="1"
+          >
+            <g
+              transform="translate(-100.000000, -22.000000)"
+            >
+              <g
+                transform="translate(100.000000, 22.000000)"
+              >
+                <rect
+                  height="44"
+                  width="44"
+                  x="0"
+                  y="0"
+                />
+                <g
+                  fill="currentColor"
+                  fill-rule="nonzero"
+                  transform="translate(12.000000, 4.000000)"
+                >
+                  <path
+                    d="M19.4833058,2.71985611 L3.53051139,17.0699744 C3.0173831,17.5315665 2.97522952,18.3220903 3.43630803,18.8357433 L3.43630796,18.8357432 C3.46601289,18.8688164 3.49745845,18.9002801 3.53051133,18.9300007 L19.4833057,33.2801611 C20.1234001,33.8559077 20.1759552,34.8420707 19.6007967,35.4827774 C19.0256382,36.1235263 18.0404824,36.1761351 17.400388,35.6003885 L1.44759367,21.2502703 L1.4475933,21.25027 C1.33208743,21.1463692 1.22220259,21.036372 1.11840792,20.920748 C-0.49302969,19.1256817 -0.345639536,16.3628317 1.4475933,14.7497465 L17.4003877,0.399628282 C18.0404821,-0.176160428 19.0256378,-0.123509422 19.6007963,0.517239417 C20.1759548,1.1579461 20.1233997,2.14410915 19.4833053,2.7198557 L19.4833058,2.71985611 Z"
+                  />
+                </g>
+              </g>
+            </g>
+          </g>
+        </svg>
+      </a>
+      <div
+        class="adm-calendar-title"
+      >
+        2022 Tahun 3 Bulan
+      </div>
+      <a
+        class="adm-calendar-arrow-button adm-calendar-arrow-button-right adm-calendar-arrow-button-right-month"
+      >
+        <svg
+          height="1em"
+          viewBox="0 0 44 44"
+        >
+          <g
+            fill="none"
+            fill-rule="evenodd"
+            stroke="none"
+            stroke-width="1"
+          >
+            <g
+              transform="translate(-100.000000, -22.000000)"
+            >
+              <g
+                transform="translate(100.000000, 22.000000)"
+              >
+                <rect
+                  height="44"
+                  width="44"
+                  x="0"
+                  y="0"
+                />
+                <g
+                  fill="currentColor"
+                  fill-rule="nonzero"
+                  transform="translate(12.000000, 4.000000)"
+                >
+                  <path
+                    d="M19.4833058,2.71985611 L3.53051139,17.0699744 C3.0173831,17.5315665 2.97522952,18.3220903 3.43630803,18.8357433 L3.43630796,18.8357432 C3.46601289,18.8688164 3.49745845,18.9002801 3.53051133,18.9300007 L19.4833057,33.2801611 C20.1234001,33.8559077 20.1759552,34.8420707 19.6007967,35.4827774 C19.0256382,36.1235263 18.0404824,36.1761351 17.400388,35.6003885 L1.44759367,21.2502703 L1.4475933,21.25027 C1.33208743,21.1463692 1.22220259,21.036372 1.11840792,20.920748 C-0.49302969,19.1256817 -0.345639536,16.3628317 1.4475933,14.7497465 L17.4003877,0.399628282 C18.0404821,-0.176160428 19.0256378,-0.123509422 19.6007963,0.517239417 C20.1759548,1.1579461 20.1233997,2.14410915 19.4833053,2.7198557 L19.4833058,2.71985611 Z"
+                  />
+                </g>
+              </g>
+            </g>
+          </g>
+        </svg>
+      </a>
+      <a
+        class="adm-calendar-arrow-button adm-calendar-arrow-button-right adm-calendar-arrow-button-right-year"
+      >
+        <svg
+          height="1em"
+          viewBox="0 0 44 44"
+        >
+          <g
+            fill="none"
+            fill-rule="evenodd"
+            stroke="none"
+            stroke-width="1"
+          >
+            <g
+              transform="translate(-24.000000, -22.000000)"
+            >
+              <g
+                transform="translate(24.000000, 22.000000)"
+              >
+                <rect
+                  height="44"
+                  width="44"
+                  x="0"
+                  y="0"
+                />
+                <g
+                  fill="currentColor"
+                  fill-rule="nonzero"
+                  transform="translate(7.000000, 4.000000)"
+                >
+                  <path
+                    d="M19.4833058,2.71985611 L3.53051139,17.0699744 C3.0173831,17.5315665 2.97522952,18.3220903 3.43630803,18.8357433 L3.43630796,18.8357432 C3.46601289,18.8688164 3.49745845,18.9002801 3.53051133,18.9300007 L19.4833057,33.2801611 C20.1234001,33.8559077 20.1759552,34.8420707 19.6007967,35.4827774 C19.0256382,36.1235263 18.0404824,36.1761351 17.400388,35.6003885 L1.44759367,21.2502703 L1.4475933,21.25027 C1.33208743,21.1463692 1.22220259,21.036372 1.11840792,20.920748 C-0.49302969,19.1256817 -0.345639536,16.3628317 1.4475933,14.7497465 L17.4003877,0.399628282 C18.0404821,-0.176160428 19.0256378,-0.123509422 19.6007963,0.517239417 C20.1759548,1.1579461 20.1233997,2.14410915 19.4833053,2.7198557 L19.4833058,2.71985611 Z"
+                  />
+                  <path
+                    d="M19.5305114,17.0699744 C19.0173831,17.5315665 18.9752295,18.3220903 19.436308,18.8357433 C19.4660129,18.8688164 19.4974585,18.9002801 19.5305113,18.9300007 L29.4833057,27.2801611 C30.1234001,27.8559077 30.1759552,28.8420707 29.6007967,29.4827774 C29.0256382,30.1235263 28.0404824,30.1761351 27.400388,29.6003885 L17.4475937,21.2502703 C17.3320874,21.1463692 17.2222026,21.036372 17.1184079,20.920748 C15.5069703,19.1256817 15.6543605,16.3628317 17.4475933,14.7497465 L27.4003877,6.39962828 C28.0404821,5.82383957 29.0256378,5.87649058 29.6007963,6.51723942 C30.1759548,7.1579461 30.1233997,8.14410915 29.4833053,8.7198557 L19.5305114,17.0699744 Z"
+                  />
+                </g>
+              </g>
+            </g>
+          </g>
+        </svg>
+      </a>
+    </div>
+    <div
+      class="adm-calendar-mark"
+    >
+      <div
+        class="adm-calendar-mark-cell"
+      >
+        Minggu
+      </div>
+      <div
+        class="adm-calendar-mark-cell"
+      >
+        Senin
+      </div>
+      <div
+        class="adm-calendar-mark-cell"
+      >
+        Selasa
+      </div>
+      <div
+        class="adm-calendar-mark-cell"
+      >
+        Rabu
+      </div>
+      <div
+        class="adm-calendar-mark-cell"
+      >
+        Kamis
+      </div>
+      <div
+        class="adm-calendar-mark-cell"
+      >
+        Jumat
+      </div>
+      <div
+        class="adm-calendar-mark-cell"
+      >
+        Sabtu
+      </div>
+    </div>
+    <div
+      class="adm-calendar-cells"
+    >
+      <div
+        class="adm-calendar-cell adm-calendar-cell-disabled"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          27
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell adm-calendar-cell-disabled"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          28
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          1
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          2
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          3
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          4
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          5
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          6
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          7
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          8
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          9
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          10
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          11
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          12
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          13
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          14
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          15
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          16
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          17
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          18
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          19
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          20
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          21
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell adm-calendar-cell-today"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          22
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          23
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          24
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          25
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          26
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          27
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          28
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          29
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          30
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          31
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell adm-calendar-cell-disabled"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          1
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell adm-calendar-cell-disabled"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          2
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell adm-calendar-cell-disabled"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          3
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell adm-calendar-cell-disabled"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          4
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell adm-calendar-cell-disabled"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          5
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell adm-calendar-cell-disabled"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          6
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell adm-calendar-cell-disabled"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          7
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell adm-calendar-cell-disabled"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          8
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+      <div
+        class="adm-calendar-cell adm-calendar-cell-disabled"
+      >
+        <div
+          class="adm-calendar-cell-top"
+        >
+          9
+        </div>
+        <div
+          class="adm-calendar-cell-bottom"
+        />
+      </div>
+    </div>
+  </div>
+  <div
+    class="adm-calendar-picker-view"
+  >
+    <div
+      class="adm-calendar-picker-view-header"
+    >
+      <div
+        class="adm-calendar-picker-view-title"
+      >
+        Pilih Tanggal
+      </div>
+    </div>
+    <div
+      class="adm-calendar-picker-view-mark"
+    >
+      <div
+        class="adm-calendar-picker-view-mark-cell"
+      >
+        Minggu
+      </div>
+      <div
+        class="adm-calendar-picker-view-mark-cell"
+      >
+        Senin
+      </div>
+      <div
+        class="adm-calendar-picker-view-mark-cell"
+      >
+        Selasa
+      </div>
+      <div
+        class="adm-calendar-picker-view-mark-cell"
+      >
+        Rabu
+      </div>
+      <div
+        class="adm-calendar-picker-view-mark-cell"
+      >
+        Kamis
+      </div>
+      <div
+        class="adm-calendar-picker-view-mark-cell"
+      >
+        Jumat
+      </div>
+      <div
+        class="adm-calendar-picker-view-mark-cell"
+      >
+        Sabtu
+      </div>
+    </div>
+    <div
+      class="adm-calendar-picker-view-body"
+    >
+      <div>
+        <div
+          class="adm-calendar-picker-view-title"
+        >
+          2022 Tahun 3 Bulan
+        </div>
+        <div
+          class="adm-calendar-picker-view-cells"
+        >
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              1
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              2
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              3
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              4
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              5
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              6
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              7
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              8
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              9
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              10
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              11
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              12
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              13
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              14
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              15
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              16
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              17
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              18
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              19
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              20
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              21
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-today"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            >
+              Hari Ini
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              22
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              23
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              24
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              25
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              26
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              27
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              28
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              29
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              30
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              31
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+        </div>
+      </div>
+      <div>
+        <div
+          class="adm-calendar-picker-view-title"
+        >
+          2022 Tahun 4 Bulan
+        </div>
+        <div
+          class="adm-calendar-picker-view-cells"
+        >
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              1
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              2
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              3
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              4
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              5
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              6
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              7
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              8
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              9
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              10
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              11
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              12
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              13
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              14
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              15
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              16
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              17
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              18
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              19
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              20
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              21
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              22
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              23
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              24
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              25
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              26
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              27
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              28
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              29
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              30
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+        </div>
+      </div>
+      <div>
+        <div
+          class="adm-calendar-picker-view-title"
+        >
+          2022 Tahun 5 Bulan
+        </div>
+        <div
+          class="adm-calendar-picker-view-cells"
+        >
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              1
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              2
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              3
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              4
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              5
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              6
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              7
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              8
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              9
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              10
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              11
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              12
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              13
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              14
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              15
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              16
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              17
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              18
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              19
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              20
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              21
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              22
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              23
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              24
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              25
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              26
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              27
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              28
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              29
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              30
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              31
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+        </div>
+      </div>
+      <div>
+        <div
+          class="adm-calendar-picker-view-title"
+        >
+          2022 Tahun 6 Bulan
+        </div>
+        <div
+          class="adm-calendar-picker-view-cells"
+        >
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              1
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              2
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              3
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              4
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              5
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              6
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              7
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              8
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              9
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              10
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              11
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              12
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              13
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              14
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              15
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              16
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              17
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              18
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              19
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              20
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              21
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              22
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              23
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              24
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              25
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              26
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              27
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              28
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              29
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              30
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+        </div>
+      </div>
+      <div>
+        <div
+          class="adm-calendar-picker-view-title"
+        >
+          2022 Tahun 7 Bulan
+        </div>
+        <div
+          class="adm-calendar-picker-view-cells"
+        >
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              1
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              2
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              3
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              4
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              5
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              6
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              7
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              8
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              9
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              10
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              11
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              12
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              13
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              14
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              15
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              16
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              17
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              18
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              19
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              20
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              21
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              22
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              23
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              24
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              25
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              26
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              27
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              28
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              29
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              30
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              31
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+        </div>
+      </div>
+      <div>
+        <div
+          class="adm-calendar-picker-view-title"
+        >
+          2022 Tahun 8 Bulan
+        </div>
+        <div
+          class="adm-calendar-picker-view-cells"
+        >
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              1
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              2
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              3
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              4
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              5
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              6
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              7
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              8
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              9
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              10
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              11
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              12
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              13
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              14
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              15
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              16
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              17
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              18
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              19
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              20
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              21
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              22
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              23
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              24
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              25
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              26
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              27
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              28
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              29
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              30
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              31
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+        </div>
+      </div>
+      <div>
+        <div
+          class="adm-calendar-picker-view-title"
+        >
+          2022 Tahun 9 Bulan
+        </div>
+        <div
+          class="adm-calendar-picker-view-cells"
+        >
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          />
+          <div
+            class="adm-calendar-picker-view-cell"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              1
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              2
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              3
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              4
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              5
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              6
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              7
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              8
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              9
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              10
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              11
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              12
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              13
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              14
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              15
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              16
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              17
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              18
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              19
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              20
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              21
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              22
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              23
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              24
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              25
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              26
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              27
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              28
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              29
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+          <div
+            class="adm-calendar-picker-view-cell adm-calendar-picker-view-cell-disabled"
+          >
+            <div
+              class="adm-calendar-picker-view-cell-top"
+            />
+            <div
+              class="adm-calendar-picker-view-cell-date"
+            >
+              30
+            </div>
+            <div
+              class="adm-calendar-picker-view-cell-bottom"
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    class="adm-error-block"
+  >
+    <div
+      class="adm-error-block-image"
+    >
+      <svg
+        viewBox="0 0 200 200"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlns:xlink="http://www.w3.org/1999/xlink"
+      >
+        <defs>
+          <lineargradient
+            id="error-block-image-default-a"
+            x1="50%"
+            x2="50%"
+            y1="-116.862%"
+            y2="90.764%"
+          >
+            <stop
+              offset="0%"
+              stop-color="#72A7FD"
+              stop-opacity="0.207"
+            />
+            <stop
+              offset="80.072%"
+              stop-color="#72A7FD"
+              stop-opacity="0.115"
+            />
+            <stop
+              offset="100%"
+              stop-color="#72A7FD"
+              stop-opacity="0"
+            />
+          </lineargradient>
+          <circle
+            cx="18.823"
+            cy="18.823"
+            id="error-block-image-default-d"
+            r="18.823"
+          />
+          <rect
+            height="88"
+            id="error-block-image-default-b"
+            rx="4.571"
+            width="51.429"
+            x="3.5"
+            y="9"
+          />
+        </defs>
+        <g
+          fill="none"
+          fill-rule="evenodd"
+        >
+          <path
+            d="M73.557.004c19.435-.311 38.696 17.016 51.523 35.287 8.708-10.822 17.127-16.233 25.255-16.233 13.333 0 28.35 14.274 45.053 42.822 1.769 3.024-3.582 7.435-16.054 13.231l-41.322 1.37c-7.343 5.872-31.225.626-69.152 1.234-27.79.445-45.759-1.234-53.908-5.037C3.2 71.143-1.625 68.686.48 65.308 27.371 22.12 51.73.353 73.557.003Zm93.098 49.53a1.125 1.125 0 0 0-.401.072l-.058.023-.07.03-.028.014-.02.01c-.03.015-.059.032-.088.049a2.543 2.543 0 0 0-.568.477l-.067.074c-1.686 1.931-2.904 7.062-2.904 8.985 0 2.283 1.719 4.153 3.898 4.314l.026.001v3.805c0 .39.25.705.56.705.31 0 .56-.316.56-.705l.001-3.88c1.92-.402 3.363-2.148 3.363-4.24 0-2.39-1.882-9.734-4.204-9.734Zm-100-5a1.125 1.125 0 0 0-.331.05l-.035.01-.035.012-.058.023-.07.03-.028.014-.02.01c-.03.015-.059.032-.088.049a2.543 2.543 0 0 0-.568.477l-.067.074c-1.686 1.931-2.904 7.062-2.904 8.985 0 2.212 1.613 4.036 3.695 4.294l.203.02.026.001v3.805c0 .39.25.705.56.705.282 0 .515-.26.555-.6l.006-.105v-3.88c1.92-.402 3.363-2.148 3.363-4.24 0-2.39-1.882-9.734-4.204-9.734ZM52.64 38.348l-.15.008-.149.023-.032.007-.032.008-.078.022-.045.015-.045.016-.06.023-.038.017-.038.017-.058.028-.022.011a2.201 2.201 0 0 0-.323.204l-.05.038-.05.04-.025.02-.025.021a3.742 3.742 0 0 0-.31.294l-.036.04c-.035.037-.07.076-.105.116-.01.012-.02.025-.031.036a3.275 3.275 0 0 0-.081.098l-.063.078c-2.031 2.583-3.48 8.692-3.48 11.027 0 2.636 1.846 4.832 4.292 5.323l.224.04-.064-.012.105.018.103.014v4.618c0 .47.299.85.667.85.337 0 .615-.32.659-.735l.006-.115v-4.618c.18-.023.355-.054.527-.094l.256-.067.196-.06c2.136-.706 3.68-2.75 3.68-5.162 0-2.996-2.383-12.207-5.325-12.207Z"
+            fill="url(#error-block-image-default-a)"
+            transform="translate(2.286 22.286)"
+          />
+          <g
+            transform="rotate(-90 102.429 55.357)"
+          >
+            <path
+              d="M6.857 0H52a6.857 6.857 0 0 1 6.857 6.857v92A6.857 6.857 0 0 1 52 105.714H6.857A6.857 6.857 0 0 1 0 98.857v-92A6.857 6.857 0 0 1 6.857 0Z"
+              fill="#7EACFF"
+            />
+            <mask
+              fill="#fff"
+              id="error-block-image-default-c"
+            >
+              <use
+                xlink:href="#error-block-image-default-b"
+              />
+            </mask>
+            <use
+              fill="#377EFF"
+              xlink:href="#error-block-image-default-b"
+            />
+            <path
+              d="M11.838 91.8a.64.64 0 0 1 .627.652.64.64 0 0 1-.627.652.64.64 0 0 1-.628-.652c0-.36.281-.651.628-.651Zm-2.858 0a.64.64 0 0 1 .628.652.64.64 0 0 1-.628.652.64.64 0 0 1-.627-.652c0-.36.281-.651.627-.651Zm2.16-2.305a.64.64 0 0 1 .628.652.64.64 0 0 1-.627.651.64.64 0 0 1-.627-.651c0-.36.28-.652.627-.652Zm-2.982-.04a.64.64 0 0 1 .627.651.64.64 0 0 1-.627.652.64.64 0 0 1-.627-.652c0-.36.28-.651.627-.651Zm5.268-.531a.64.64 0 0 1 .628.651.64.64 0 0 1-.628.652.64.64 0 0 1-.627-.652c0-.36.281-.651.627-.651Zm2.858-1.143a.64.64 0 0 1 .627.651.64.64 0 0 1-.627.652.64.64 0 0 1-.628-.652c0-.36.281-.651.628-.651Zm-6.37-.917c.209 0 .377.175.377.39a.384.384 0 0 1-.376.392.384.384 0 0 1-.376-.391c0-.216.168-.391.376-.391Zm3.512-.798.093.007a.644.644 0 0 1 .535.645.64.64 0 0 1-.628.652.64.64 0 0 1-.627-.652c0-.36.281-.652.627-.652Zm5.715 0a.64.64 0 0 1 .627.652.64.64 0 0 1-.627.652.64.64 0 0 1-.627-.652c0-.36.28-.652.627-.652Zm-11.429 0a.64.64 0 0 1 .627.652.64.64 0 0 1-.627.652.64.64 0 0 1-.627-.652c0-.36.28-.652.627-.652Zm-3.261.241c.208 0 .376.175.376.39a.384.384 0 0 1-.376.392.384.384 0 0 1-.377-.391c0-.216.169-.391.377-.391Zm11.833-.812a.64.64 0 0 1 .627.652.64.64 0 0 1-.627.651.64.64 0 0 1-.628-.651c0-.36.281-.652.628-.652Zm-4.851.399c.208 0 .376.175.376.39a.384.384 0 0 1-.376.392.384.384 0 0 1-.377-.391c0-.216.169-.391.377-.391Zm10.313-2.056a.64.64 0 0 1 .628.652.64.64 0 0 1-.628.651.64.64 0 0 1-.627-.651c0-.36.281-.652.627-.652Zm-2.354-.128a.64.64 0 0 1 .627.652.64.64 0 0 1-.627.652.64.64 0 0 1-.628-.652c0-.36.281-.652.628-.652Zm-13.798.311c.207 0 .376.175.376.391a.384.384 0 0 1-.376.391.384.384 0 0 1-.377-.39c0-.217.169-.392.377-.392Zm11.832-.812a.64.64 0 0 1 .628.652.64.64 0 0 1-.628.651.64.64 0 0 1-.627-.651c0-.36.281-.652.627-.652Zm-6.285 0a.64.64 0 0 1 .627.652.64.64 0 0 1-.627.651.64.64 0 0 1-.627-.651c0-.36.28-.652.627-.652Zm3.428 0a.64.64 0 0 1 .627.652.64.64 0 0 1-.627.651.64.64 0 0 1-.627-.651c0-.36.28-.652.627-.652Zm-6.118.24c.208 0 .376.176.376.392a.384.384 0 0 1-.376.39.384.384 0 0 1-.377-.39c0-.216.169-.391.377-.391Zm11.261-2.525a.64.64 0 0 1 .627.651.64.64 0 0 1-.627.652.64.64 0 0 1-.627-.652c0-.36.28-.651.627-.651Zm-3.557.484c.208 0 .376.175.376.391a.384.384 0 0 1-.376.391.384.384 0 0 1-.376-.391c0-.216.168-.391.376-.391Zm-2.478-.555a.64.64 0 0 1 .627.652.64.64 0 0 1-.627.652.64.64 0 0 1-.627-.652c0-.36.28-.652.627-.652Zm-3.512-.26c.208 0 .376.175.376.39a.384.384 0 0 1-.376.392.384.384 0 0 1-.376-.391c0-.216.168-.391.376-.391Zm-2.857 0c.208 0 .376.175.376.39a.384.384 0 0 1-.376.392.384.384 0 0 1-.376-.391c0-.216.168-.391.376-.391Zm-4.571 0c.207 0 .376.175.376.39a.384.384 0 0 1-.376.392.384.384 0 0 1-.377-.391c0-.216.169-.391.377-.391Zm14.898-1.835a.64.64 0 0 1 .628.652.64.64 0 0 1-.628.651.64.64 0 0 1-.627-.651c0-.36.281-.652.627-.652Zm-8.027-.245c.208 0 .377.175.377.39a.384.384 0 0 1-.377.392.384.384 0 0 1-.376-.391c0-.216.169-.391.376-.391Zm6.271-1.349c.208 0 .377.175.377.391a.384.384 0 0 1-.377.391.384.384 0 0 1-.376-.39c0-.217.169-.392.376-.392Zm-11.484-.481c.208 0 .376.175.376.39a.384.384 0 0 1-.376.392.384.384 0 0 1-.376-.391c0-.216.168-.391.376-.391Zm15.103-.972c.208 0 .376.175.376.391a.384.384 0 0 1-.376.391.384.384 0 0 1-.376-.39c0-.217.168-.392.376-.392Zm-9.333-1.404c.208 0 .376.175.376.39a.384.384 0 0 1-.376.392.384.384 0 0 1-.376-.391c0-.216.168-.391.376-.391Zm-6.819-.405c.208 0 .377.175.377.39a.384.384 0 0 1-.377.392.384.384 0 0 1-.376-.391c0-.216.168-.391.376-.391Z"
+              fill="#003CFF"
+              fill-rule="nonzero"
+              mask="url(#error-block-image-default-c)"
+              transform="rotate(116 12.367 83.503)"
+            />
+            <path
+              d="M36.774 5.474H21.523"
+              stroke="#FFF"
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              stroke-width="0.75"
+            />
+            <path
+              d="m67.818 94.025-4.996 3.913m4.996 11.91-4.996-3.912m-1.142 9.145-1.143-6.288m10.71-6.768h-7.262"
+              stroke="#4486FE"
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              stroke-width="0.75"
+            />
+          </g>
+          <circle
+            cx="8.571"
+            cy="8.571"
+            fill="#FFCD6B"
+            fill-rule="nonzero"
+            r="8.571"
+            transform="translate(22.857 142)"
+          />
+          <g
+            transform="translate(132.857 124)"
+          >
+            <mask
+              fill="#fff"
+              id="error-block-image-default-e"
+            >
+              <use
+                xlink:href="#error-block-image-default-d"
+              />
+            </mask>
+            <use
+              fill="#FBBE47"
+              fill-rule="nonzero"
+              xlink:href="#error-block-image-default-d"
+            />
+            <circle
+              cx="13.886"
+              cy="15.12"
+              fill="#FFCD6B"
+              fill-rule="nonzero"
+              mask="url(#error-block-image-default-e)"
+              r="18.823"
+            />
+            <circle
+              cx="23.4"
+              cy="29.057"
+              fill="#FFB400"
+              fill-rule="nonzero"
+              mask="url(#error-block-image-default-e)"
+              r="1"
+            />
+            <circle
+              cx="30.343"
+              cy="29.829"
+              fill="#FFB400"
+              fill-rule="nonzero"
+              mask="url(#error-block-image-default-e)"
+              r="1"
+            />
+            <circle
+              cx="18.771"
+              cy="32.657"
+              fill="#FFB400"
+              fill-rule="nonzero"
+              mask="url(#error-block-image-default-e)"
+              r="1.286"
+            />
+            <circle
+              cx="29.571"
+              cy="25.971"
+              fill="#FFB400"
+              fill-rule="nonzero"
+              mask="url(#error-block-image-default-e)"
+              r="1.286"
+            />
+            <circle
+              cx="19.286"
+              cy="7.971"
+              fill="#FFB400"
+              fill-rule="nonzero"
+              mask="url(#error-block-image-default-e)"
+              r="1.286"
+            />
+            <circle
+              cx="26.486"
+              cy="5.914"
+              fill="#FFB400"
+              fill-rule="nonzero"
+              mask="url(#error-block-image-default-e)"
+              r="1.286"
+            />
+            <circle
+              cx="11.057"
+              cy="6.943"
+              fill="#FFB400"
+              fill-rule="nonzero"
+              mask="url(#error-block-image-default-e)"
+              r="1"
+            />
+            <circle
+              cx="30.086"
+              cy="15.686"
+              fill="#FFB400"
+              fill-rule="nonzero"
+              mask="url(#error-block-image-default-e)"
+              r="1.286"
+            />
+            <circle
+              cx="22.886"
+              cy="14.657"
+              fill="#FFB400"
+              fill-rule="nonzero"
+              mask="url(#error-block-image-default-e)"
+              r="1"
+            />
+          </g>
+          <path
+            d="m87.429 135.123 6.591-9.378v-.08h-5.99v-2.559h10.038v1.787l-6.44 9.254v.082h6.56v2.557h-10.76v-1.663Zm12.185-5.889 4.948-7.047v-.056h-4.498v-1.917h7.536v1.34l-4.849 6.942v.059h4.923v1.92h-8.06v-1.24Zm10.345.702 3.708-5.274v-.045h-3.372v-1.437h5.648v1.003l-3.628 5.206v.045H116v1.438h-6.041v-.936Z"
+            fill="#FFF"
+            fill-rule="nonzero"
+          />
+        </g>
+      </svg>
+    </div>
+    <div
+      class="adm-error-block-description"
+    >
+      <div
+        class="adm-error-block-description-title"
+      >
+        Halaman mengalami beberapa permasalahan kecil
+      </div>
+      <div
+        class="adm-error-block-description-subtitle"
+      >
+        Coba lagi nanti
+      </div>
+    </div>
+  </div>
+  <form
+    class="adm-form"
+  >
+    <div
+      class="adm-list adm-list-default"
+    >
+      <div
+        class="adm-list-body"
+      >
+        <div
+          class="adm-list-body-inner"
+        >
+          <div
+            class="adm-list-item adm-form-item adm-form-item-vertical"
+          >
+            <div
+              class="adm-list-item-content"
+            >
+              <div
+                class="adm-list-item-content-main"
+              >
+                <div
+                  class="adm-list-item-title"
+                >
+                  <label
+                    class="adm-form-item-label"
+                    for="name"
+                  >
+                    name
+                    <span
+                      class="adm-form-item-required-text"
+                    >
+                      (
+                      Diperlukan
+                      )
+                    </span>
+                  </label>
+                </div>
+                <div
+                  class="adm-form-item-child adm-form-item-child-position-normal"
+                >
+                  <div
+                    class="adm-form-item-child-inner"
+                  >
+                    <input
+                      id="name"
+                      value=""
+                    />
+                  </div>
+                </div>
+                <div
+                  class="adm-list-item-description"
+                />
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </form>
+  <div
+    class="adm-search-bar"
+  >
+    <div
+      class="adm-search-bar-input-box"
+    >
+      <div
+        class="adm-search-bar-input-box-icon"
+      >
+        <svg
+          class="antd-mobile-icon"
+          height="1em"
+          style="vertical-align: -0.125em;"
+          viewBox="0 0 48 48"
+          width="1em"
+          xmlns="http://www.w3.org/2000/svg"
+          xmlns:xlink="http://www.w3.org/1999/xlink"
+        >
+          <g
+            fill="none"
+            fill-rule="evenodd"
+            id="SearchOutline-SearchOutline"
+            stroke="none"
+            stroke-width="1"
+          >
+            <g
+              id="SearchOutline-编组"
+            >
+              <rect
+                fill="#FFFFFF"
+                height="48"
+                id="SearchOutline-矩形"
+                opacity="0"
+                width="48"
+                x="0"
+                y="0"
+              />
+              <path
+                d="M10.2434135,10.1505371 C17.2346315,3.28315429 28.5696354,3.28315429 35.5608534,10.1505371 C42.3159331,16.7859644 42.5440954,27.4048667 36.2453405,34.3093889 L43.7095294,41.6422249 C43.8671196,41.7970419 43.8693677,42.0502979 43.7145508,42.2078881 C43.7128864,42.2095822 43.7112069,42.2112616 43.7095126,42.2129259 L42.1705322,43.7246464 C42.014915,43.8775072 41.7655181,43.8775006 41.6099089,43.7246316 L34.0775268,36.3248916 L34.0775268,36.3248916 C27.0485579,41.8551751 16.7593545,41.4200547 10.2434135,35.0195303 C3.25219551,28.1521474 3.25219551,17.0179199 10.2434135,10.1505371 Z M12.3532001,12.2229532 C6.52718516,17.9457722 6.52718516,27.2242951 12.3532001,32.9471142 C18.1792151,38.6699332 27.6250517,38.6699332 33.4510667,32.9471142 C39.2770817,27.2242951 39.2770817,17.9457722 33.4510667,12.2229532 C27.6250517,6.50013419 18.1792151,6.50013419 12.3532001,12.2229532 Z"
+                fill="currentColor"
+                fill-rule="nonzero"
+                id="SearchOutline-形状"
+              />
+            </g>
+          </g>
+        </svg>
+      </div>
+      <div
+        aria-label="Bilah Pencarian"
+        class="adm-input adm-search-bar-input"
+      >
+        <input
+          aria-label="Bilah Pencarian"
+          class="adm-input-element"
+          enterkeyhint="search"
+          type="search"
+          value=""
+        />
+      </div>
+    </div>
+  </div>
+  <div
+    class="adm-image-uploader"
+  >
+    <div
+      class="adm-space adm-space-wrap adm-space-block adm-space-horizontal adm-image-uploader-space"
+    >
+      <div
+        class="adm-space-item"
+      >
+        <div
+          class="adm-image-uploader-cell"
+        >
+          <div
+            class="adm-image adm-image-uploader-cell-image"
+          >
+            <div
+              class="adm-image-tip"
+            >
+              <svg
+                viewBox="0 0 48 48"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M41.396 6.234c1.923 0 3.487 1.574 3.487 3.505v29.14c0 1.937-1.568 3.51-3.491 3.51H6.604c-1.923 0-3.487-1.573-3.487-3.51V9.745c0-1.936 1.564-3.51 3.487-3.51Zm0 2.847H6.604c-.355 0-.654.3-.654.658V34.9l5.989-8.707a2.373 2.373 0 0 1 1.801-1.005 2.405 2.405 0 0 1 1.933.752l4.182 4.525 7.58-11.005a2.374 2.374 0 0 1 1.96-1.01c.79 0 1.532.38 1.966 1.01L42.05 34.89V9.74a.664.664 0 0 0-.654-.658Zm-28.305 2.763a3.119 3.119 0 0 1 3.117 3.117 3.119 3.119 0 0 1-3.117 3.117 3.122 3.122 0 0 1-3.117-3.117 3.119 3.119 0 0 1 3.117-3.117Z"
+                  fill="#DBDBDB"
+                  fill-rule="nonzero"
+                />
+              </svg>
+            </div>
+            <img
+              class="adm-image-img"
+              draggable="false"
+              src="https://images.unsplash.com/photo-1567945716310-4745a6b7844b?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=300&q=60"
+              style="object-fit: cover; display: none;"
+            />
+          </div>
+          <span
+            class="adm-image-uploader-cell-delete"
+          >
+            <svg
+              class="antd-mobile-icon adm-image-uploader-cell-delete-icon"
+              height="1em"
+              style="vertical-align: -0.125em;"
+              viewBox="0 0 48 48"
+              width="1em"
+              xmlns="http://www.w3.org/2000/svg"
+              xmlns:xlink="http://www.w3.org/1999/xlink"
+            >
+              <g
+                fill="none"
+                fill-rule="evenodd"
+                id="CloseOutline-CloseOutline"
+                stroke="none"
+                stroke-width="1"
+              >
+                <g
+                  id="CloseOutline-编组"
+                >
+                  <rect
+                    fill="#FFFFFF"
+                    height="48"
+                    id="CloseOutline-矩形"
+                    opacity="0"
+                    width="48"
+                    x="0"
+                    y="0"
+                  />
+                  <path
+                    d="M10.6085104,8.11754663 L24.1768397,21.8195031 L24.1768397,21.8195031 L37.7443031,8.1175556 C37.8194278,8.04168616 37.9217669,7.999 38.0285372,7.999 L41.1040268,7.999 C41.3249407,7.999 41.5040268,8.1780861 41.5040268,8.399 C41.5040268,8.50440471 41.4624226,8.60554929 41.3882578,8.68044752 L26.2773302,23.9408235 L26.2773302,23.9408235 L41.5021975,39.3175645 C41.65763,39.4745475 41.6563731,39.7278104 41.4993901,39.8832429 C41.4244929,39.9574004 41.3233534,39.999 41.2179546,39.999 L38.1434012,39.999 C38.0366291,39.999 37.9342885,39.9563124 37.8591634,39.8804408 L24.1768397,26.0621438 L24.1768397,26.0621438 L10.4936501,39.8804497 C10.4185257,39.9563159 10.3161889,39.999 10.2094212,39.999 L7.13584526,39.999 C6.91493136,39.999 6.73584526,39.8199139 6.73584526,39.599 C6.73584526,39.4936017 6.77744443,39.3924627 6.85160121,39.3175656 L22.0763492,23.9408235 L22.0763492,23.9408235 L6.96554081,8.68044639 C6.81010226,8.52346929 6.81134951,8.27020637 6.9683266,8.11476782 C7.04322474,8.04060377 7.14436883,7.999 7.24977299,7.999 L10.3242852,7.999 C10.4310511,7.999 10.5333863,8.04168267 10.6085104,8.11754663 Z"
+                    fill="currentColor"
+                    fill-rule="nonzero"
+                    id="CloseOutline-路径"
+                  />
+                </g>
+              </g>
+            </svg>
+          </span>
+        </div>
+      </div>
+      <div
+        class="adm-space-item"
+      >
+        <div
+          class="adm-image-uploader-upload-button-wrap"
+        >
+          <span
+            aria-label="diunggah"
+            class="adm-image-uploader-cell adm-image-uploader-upload-button"
+            role="button"
+          >
+            <span
+              class="adm-image-uploader-upload-button-icon"
+            >
+              <svg
+                class="antd-mobile-icon"
+                height="1em"
+                style="vertical-align: -0.125em;"
+                viewBox="0 0 48 48"
+                width="1em"
+                xmlns="http://www.w3.org/2000/svg"
+                xmlns:xlink="http://www.w3.org/1999/xlink"
+              >
+                <g
+                  fill="none"
+                  fill-rule="evenodd"
+                  id="AddOutline-AddOutline"
+                  stroke="none"
+                  stroke-width="1"
+                >
+                  <g
+                    id="AddOutline-add"
+                  >
+                    <rect
+                      fill="#FFFFFF"
+                      height="48"
+                      id="AddOutline-矩形"
+                      opacity="0"
+                      width="48"
+                      x="0"
+                      y="0"
+                    />
+                    <path
+                      d="M25.1,6.5 C25.3209139,6.5 25.5,6.6790861 25.5,6.9 L25.5,22.5 L41.1,22.5 C41.3209139,22.5 41.5,22.6790861 41.5,22.9 L41.5,25.1 C41.5,25.3209139 41.3209139,25.5 41.1,25.5 L25.5,25.5 L25.5,41.1 C25.5,41.3209139 25.3209139,41.5 25.1,41.5 L22.9,41.5 C22.6790861,41.5 22.5,41.3209139 22.5,41.1 L22.5,25.5 L6.9,25.5 C6.6790861,25.5 6.5,25.3209139 6.5,25.1 L6.5,22.9 C6.5,22.6790861 6.6790861,22.5 6.9,22.5 L22.5,22.5 L22.5,6.9 C22.5,6.6790861 22.6790861,6.5 22.9,6.5 L25.1,6.5 Z"
+                      fill="currentColor"
+                      fill-rule="nonzero"
+                      id="AddOutline-路径"
+                    />
+                  </g>
+                </g>
+              </svg>
+            </span>
+          </span>
+          <input
+            accept="image/*"
+            aria-hidden="true"
+            class="adm-image-uploader-input"
+            type="file"
+          />
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+`;
+
 exports[`ConfigProvider should display the text as it-IT 1`] = `
 <div>
   <div
diff --git a/src/components/config-provider/tests/config-provider.test.tsx b/src/components/config-provider/tests/config-provider.test.tsx
index b8919863d..1db12cbfc 100644
--- a/src/components/config-provider/tests/config-provider.test.tsx
+++ b/src/components/config-provider/tests/config-provider.test.tsx
@@ -21,6 +21,7 @@ import faIR from '../../../locales/fa-IR'
 import frFR from '../../../locales/fr-FR'
 import huHU from '../../../locales/hu-HU'
 import idID from '../../../locales/id-ID'
+import inID from '../../../locales/in-ID'
 import itIT from '../../../locales/it-IT'
 import jaJP from '../../../locales/ja-JP'
 import kkKZ from '../../../locales/kk-KZ'
@@ -62,6 +63,7 @@ const locales = [
   arSA,
   ptBR,
   viVN,
+  inID,
 ]
 
 describe('ConfigProvider', () => {
diff --git a/src/components/dialog/tests/dialog.test.tsx b/src/components/dialog/tests/dialog.test.tsx
index 5536f7717..ddeb782f3 100644
--- a/src/components/dialog/tests/dialog.test.tsx
+++ b/src/components/dialog/tests/dialog.test.tsx
@@ -1,17 +1,17 @@
 /* eslint-disable @typescript-eslint/no-non-null-assertion */
 
+import { act } from '@testing-library/react'
 import React from 'react'
 import {
+  fireEvent,
   render,
+  screen,
   testA11y,
-  fireEvent,
+  waitFakeTimers,
   waitFor,
   waitForElementToBeRemoved,
-  screen,
-  waitFakeTimers,
 } from 'testing'
 import Dialog, { DialogAlertProps } from '..'
-import { act } from '@testing-library/react'
 
 const classPrefix = `adm-dialog`
 
@@ -120,38 +120,44 @@ describe('Dialog', () => {
     expect(fn).toBeCalled()
   })
 
-  test('wait for confirm to complete', async () => {
-    const fn = jest.fn()
-    const Confirm = () => (
-      <button
-        onClick={async () => {
-          const res = await Dialog.confirm({
-            content: 'content',
-          })
-          fn(res)
-        }}
-      >
-        btn
-      </button>
-    )
-
-    render(<Confirm />)
-    const btn = screen.getByRole('button', { name: 'btn' })
-    fireEvent.click(btn)
-    const dialog = screen.getByRole('dialog')
-    fireEvent.click(screen.getByRole('button', { name: '确定' }))
-    await act(async () => {
-      await Promise.resolve()
-    })
-    expect(fn.mock.calls[0][0]).toBe(true)
-    await waitForElementToBeRemoved(dialog)
-
-    fireEvent.click(btn)
-    fireEvent.click(screen.getByRole('button', { name: '取消' }))
-    await act(async () => {
-      await Promise.resolve()
-    })
-    expect(fn.mock.calls[1][0]).toBe(false)
+  describe('wait for confirm to complete', () => {
+    function testFn(button: string, result: boolean) {
+      test(`wait for confirm to complete (${String(result)})`, async () => {
+        jest.useFakeTimers()
+
+        const fn = jest.fn()
+        const Confirm = () => (
+          <button
+            onClick={async () => {
+              const res = await Dialog.confirm({
+                content: 'content',
+              })
+              fn(res)
+            }}
+          >
+            btn
+          </button>
+        )
+
+        render(<Confirm />)
+
+        // First click to open
+        const btn = screen.getByRole('button', { name: 'btn' })
+        fireEvent.click(btn)
+        await waitFakeTimers()
+
+        // Click confirm
+        fireEvent.click(screen.getByRole('button', { name: button }))
+        expect(fn).not.toHaveBeenCalled()
+        await waitFakeTimers()
+        expect(fn).toHaveBeenCalledWith(result)
+
+        jest.useRealTimers()
+      })
+    }
+
+    testFn('确定', true)
+    testFn('取消', false)
   })
 
   test('custom actions', async () => {