fix(deps): import flatpickr CSS via JS, add flatpickr direct dep

apps/app/package.json

@@ -38,6 +38,7 @@
     "cookie-es": "1.2.2",
     "destr": "2.0.5",
     "eslint-plugin-regexp": "2.10.0",
+    "flatpickr": "^4.6.13",
     "jwt-decode": "4.0.0",
     "mapbox-gl": "3.5.2",
     "ofetch": "1.5.0",

apps/app/pnpm-lock.yaml

@@ -75,6 +75,9 @@ importers:
       eslint-plugin-regexp:
         specifier: 2.10.0
         version: 2.10.0(eslint@8.57.1)
+      flatpickr:
+        specifier: ^4.6.13
+        version: 4.6.13
       jwt-decode:
         specifier: 4.0.0
         version: 4.0.0

apps/app/src/@core/components/app-form-elements/AppDateTimePicker.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import FlatPickr from 'vue-flatpickr-component'
+import 'flatpickr/dist/flatpickr.css'
 import { useTheme } from 'vuetify'
 
 // @ts-expect-error There won't be declaration file for it
@@ -218,10 +219,9 @@ const elementId = computed (() => {
 
 <style lang="scss">
 @use "@core/scss/template/mixins" as templateMixins;
+@use "@core/scss/base/mixins";
 
 /* stylelint-disable no-descending-specificity */
-@use "flatpickr/dist/flatpickr.css";
-@use "@core/scss/base/mixins";
 
 .flat-picker-custom-style {
   position: absolute;