Component: Vue Widget Slider (new) (#5516)

* feat: Initial shadcn configuration

* component: Add Slider component from shadcn-vue

* deps: Add tw-animate-css

* component: Align slider with Figma styles

* component: Set the step value for the slider, update styles

* fix: update component tests to work with Array of values

* vite: Don't reload dev server for test changes

* component: Swap text for a number input kept in sync with the slider

* cleanup: Don't need the override if the input isn't type="number"

* test: add step size tests

* cleanup: Don't need cn for these

* css: Update token names to match new Figma Variables

* lint: Fix camelCase vs train-case in passthrough

* feat: If the value is deleted, revert to the slider state cc: @PabloWiedemann

* feat: Improve cursor styles, grabbable thumb, clickable track

* lint: temporarily disable some warnings

* feat: Grabbing while sliding (most of the time)

src/renderer/extensions/vueNodes/widgets/components/layout/WidgetLayoutField.vue

@@ -19,7 +19,7 @@ defineProps<{
       {{ widget.name }}
     </p>
     <div
-      class="w-75"
+      class="w-75 cursor-default"
       @pointerdown.stop="noop"
       @pointermove.stop="noop"
       @pointerup.stop="noop"

src/renderer/extensions/vueNodes/widgets/components/layout/index.ts

@@ -1,4 +1,6 @@
-export const WidgetInputBaseClass = [
+import { cn } from '@/utils/tailwindUtil'
+
+export const WidgetInputBaseClass = cn([
   // Background
   'bg-zinc-500/10',
   // Outline
@@ -11,4 +13,4 @@ export const WidgetInputBaseClass = [
   '!rounded-lg',
   // Hover
   'hover:outline-blue-500/80'
-].join(' ')
+])