@saasmakers/ui 0.1.70 → 0.1.72

package/app/composables/useChartist.ts

@@ -1,36 +1,42 @@
+import type { AreaDrawEvent, BarChartOptions, BarDrawEvent, BaseChart, DrawEvent, LineDrawEvent, Options } from 'chartist'
+import { easings } from 'chartist'
+
 export default function useChartist() {
+  type EasingType = keyof typeof easings | number[]
+
   const progressiveLinePlugin = (params: {
     animateArea?: boolean
     delay?: number
     duration?: number
-    easing?: any
+    easing?: EasingType
     stagger?: number
   } = {}) => {
     const {
       animateArea = true,
       delay = 0,
       duration = 500,
-      easing = (window as any)?.Chartist?.Svg?.Easing?.easeOutQuart,
+      easing = easings.easeOutQuart,
       stagger = 0,
     } = params
 
-    return (chart: any) => {
-      chart.on('draw', (ctx: any) => {
+    return (chart: BaseChart) => {
+      chart.on('draw', (ctx: DrawEvent) => {
         const begin = delay + (stagger ? stagger * (ctx.seriesIndex ?? 0) : 0)
 
         // Animation for line charts
         if (ctx.type === 'line') {
-          const node: SVGPathElement = ctx.element._node
+          const lineCtx = ctx as LineDrawEvent
+          const node = lineCtx.element.getNode<SVGPathElement>()
           const length = node.getTotalLength()
 
           // Set the stroke dasharray and dashoffset
-          ctx.element.attr({
+          lineCtx.element.attr({
             'stroke-dasharray': `${length}px ${length}px`,
             'stroke-dashoffset': `${length}px`,
           })
 
           // Animate the stroke dashoffset to 0
-          ctx.element.animate({
+          lineCtx.element.animate({
             'stroke-dashoffset': {
               begin,
               dur: duration,
@@ -42,67 +48,72 @@ export default function useChartist() {
           }, false)
 
           // Clean up the dash attributes after it finishes
-          const total = delay + duration + (stagger ? stagger * (ctx.seriesIndex ?? 0) : 0)
+          const total = delay + duration + (stagger ? stagger * (lineCtx.seriesIndex ?? 0) : 0)
 
           window.setTimeout(() => {
-            ctx.element.attr({
-              'stroke-dasharray': null,
-              'stroke-dashoffset': null,
+            lineCtx.element.attr({
+              'stroke-dasharray': undefined,
+              'stroke-dashoffset': undefined,
             })
           }, total + 30)
         }
 
         // Animation for area charts
         if (animateArea && ctx.type === 'area') {
-          ctx.element.animate({
+          const areaCtx = ctx as AreaDrawEvent
+
+          areaCtx.element.animate({
             // eslint-disable-next-line id-length -- SVG path attribute
             d: {
               begin,
               dur: duration,
               easing,
               fill: 'freeze',
-              from: ctx.path
+              from: areaCtx.path
                 .clone()
                 .scale(1, 0)
-                .translate(0, ctx.chartRect.height())
+                .translate(0, areaCtx.chartRect.height())
                 .stringify(),
-              to: ctx.path.stringify(),
+              to: areaCtx.path.stringify(),
             },
           }, false)
         }
 
         // Animation for bar charts
         if (ctx.type === 'bar') {
-          const horizontal = !!chart.options?.horizontalBars
+          const barCtx = ctx as BarDrawEvent
+          // Access private options property via type assertion
+          const chartOptions = (chart as unknown as { options?: Options & Partial<BarChartOptions> }).options
+          const horizontal = !!(chartOptions as BarChartOptions | undefined)?.horizontalBars
 
           // For vertical bars, y1 is baseline, y2 is top. For horizontal, x1 is baseline, x2 is end.
-          const from = horizontal ? ctx.x1 : ctx.y1
-          const to = horizontal ? ctx.x2 : ctx.y2
+          const from = horizontal ? barCtx.x1 : barCtx.y1
+          const to = horizontal ? barCtx.x2 : barCtx.y2
 
           // Start collapsed at baseline
           if (horizontal) {
-            ctx.element.attr({ x2: from })
-            ctx.element.animate({
+            barCtx.element.attr({ x2: from })
+            barCtx.element.animate({
               x2: {
                 begin,
                 dur: duration,
                 easing,
                 fill: 'freeze',
-                from,
-                to,
+                from: String(from),
+                to: String(to),
               },
             }, false)
           }
           else {
-            ctx.element.attr({ y2: from })
-            ctx.element.animate({
+            barCtx.element.attr({ y2: from })
+            barCtx.element.animate({
               y2: {
                 begin,
                 dur: duration,
                 easing,
                 fill: 'freeze',
-                from,
-                to,
+                from: String(from),
+                to: String(to),
               },
             }, false)
           }

package/app/types/global.d.ts

@@ -5,7 +5,7 @@ import type * as Fields from './fields'
 declare module '@vue/runtime-core' {
   interface ComponentCustomProperties {
     vHotkey?: Record<string, (event?: KeyboardEvent | MouseEvent) => void>
-    vTooltip?: Record<string, any> | string
+    vTooltip?: Record<string, unknown> | string
   }
 }
 

package/nuxt.config.ts

@@ -116,8 +116,8 @@ export default defineNuxtConfig({
 
   unocss: {
     nuxtLayers: true,
-    presets: uno.presets as any,
-    rules: uno.rules as any,
+    presets: uno.presets,
+    rules: uno.rules,
     theme: uno.theme,
   },
 })

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@saasmakers/ui",
   "type": "module",
-  "version": "0.1.70",
+  "version": "0.1.72",
   "private": false,
   "description": "Reusable Nuxt UI components for SaaS Makers projects",
   "license": "MIT",

package/uno.config.ts

@@ -1,6 +1,7 @@
+import type { Preset } from 'unocss'
 import { defineConfig, presetWind3 } from 'unocss'
 
-export const presets = [presetWind3()]
+export const presets: Preset[] = [presetWind3()]
 
 export const rules: Array<[string, Record<string, string>]> = [
   [
@@ -185,7 +186,7 @@ export const theme = {
 }
 
 export default defineConfig({
-  presets: [presetWind3()] as any,
+  presets,
   rules,
   theme,
 })