feat: Add tp-inline-arrow-[up/down] slots (resolves #884)

Author: Jasenkoo

src/VueDatePicker/components/TimePicker/TimeInput.vue

@@ -30,8 +30,13 @@
                         <ChevronUpIcon v-if="!$slots['arrow-up']" />
                     </template>
                     <template v-else>
-                        <span class="dp__tp_inline_btn_bar dp__tp_btn_in_l"></span>
-                        <span class="dp__tp_inline_btn_bar dp__tp_btn_in_r"></span>
+                        <template v-if="$slots['tp-inline-arrow-up']">
+                            <slot name="tp-inline-arrow-up" />
+                        </template>
+                        <template v-else>
+                            <span class="dp__tp_inline_btn_bar dp__tp_btn_in_l"></span>
+                            <span class="dp__tp_inline_btn_bar dp__tp_btn_in_r"></span>
+                        </template>
                     </template>
                 </button>
                 <button
@@ -86,8 +91,13 @@
                         <ChevronDownIcon v-if="!$slots['arrow-down']" />
                     </template>
                     <template v-else>
-                        <span class="dp__tp_inline_btn_bar dp__tp_btn_in_l"></span>
-                        <span class="dp__tp_inline_btn_bar dp__tp_btn_in_r"></span>
+                        <template v-if="$slots['tp-inline-arrow-down']">
+                            <slot name="tp-inline-arrow-down" />
+                        </template>
+                        <template v-else>
+                            <span class="dp__tp_inline_btn_bar dp__tp_btn_in_l"></span>
+                            <span class="dp__tp_inline_btn_bar dp__tp_btn_in_r"></span>
+                        </template>
                     </template>
                 </button>
             </template>

src/VueDatePicker/composables/slots.ts

@@ -40,6 +40,8 @@ export const slots = [
     { name: 'marker', use: ['calendar', 'shared'] },
     { name: 'quarter', use: ['shared'] },
     { name: 'top-extra', use: ['shared', 'month-year'] },
+    { name: 'tp-inline-arrow-up', use: ['shared', 'time'] },
+    { name: 'tp-inline-arrow-down', use: ['shared', 'time'] },
 ];
 
 export const inputSlots = [{ name: 'trigger' }, { name: 'input-icon' }, { name: 'clear-icon' }, { name: 'dp-input' }];