kmcom-nuxt-layers 1.6.9 → 1.6.11

package/docs/LAYOUT.md

@@ -208,8 +208,11 @@ Positioned child within a subgrid section. Use `preset` for common layouts or se
 | `rowStart` | `number \| ResponsiveValue` | Grid row start |
 | `rowSpan` | `number \| ResponsiveValue` | Row span |
 | `layer` | `keyof GridLayers` | Z-index layer: `back`, `mid`, `front`, `top` |
-| `align` | `string` | `align-self` value |
-| `justify` | `string` | `justify-self` value |
+| `align` | `string` | `align-self` value: `start`, `center`, `end`, `stretch` |
+| `justify` | `string` | `justify-self` value: `start`, `center`, `end`, `stretch` |
+| `container` | `string` | Content width constraint: `content` (65ch), `wide` (90rem), `fluid`, `full` |
+| `gap` | `string` | Override `--grid-gap` for nested content (e.g. `'1rem'`) |
+| `density` | `string` | Rhythm base unit: `compact` (2px), `normal` (4px), `relaxed` (8px) |
 | `bleed` | `boolean` | Negative margin to reach viewport edge |
 | `as` | `string` | Tag override |
 
@@ -428,12 +431,14 @@ interface GridConfig {
 
 interface GridPresetsItem {
   colStart?: number | ResponsiveValue
-  colSpan?: number | ResponsiveValue
+  colSpan?: number | 'full' | ResponsiveValue
   rowStart?: number | ResponsiveValue
   rowSpan?: number | ResponsiveValue
+  align?: 'start' | 'center' | 'end' | 'stretch'
+  justify?: 'start' | 'center' | 'end' | 'stretch'
   container?: 'content' | 'wide' | 'fluid' | 'full'
   gap?: string
-  density?: 'compact' | 'normal' | 'spacious'
+  density?: 'compact' | 'normal' | 'relaxed'
 }
 ```
 

package/layers/content/app/types/app-config.d.ts

@@ -0,0 +1,7 @@
+declare module '@nuxt/schema' {
+  interface AppConfigInput {
+    contentLayer?: {
+      name?: string
+    }
+  }
+}

package/layers/content/nuxt.config.ts

@@ -31,7 +31,7 @@ export default defineNuxtConfig({
     },
   },
 
-  css: ['#layers/content/app/assets/css/main.css'],
+  css: ['#layers/content/app/assets/css/content.css'],
 
   compatibilityDate: '2026-01-24',
 

package/layers/core/app/assets/css/{main.css → core.css}

@@ -10,5 +10,3 @@
 
 @import '#layers/core/app/assets/css/layout.css';
 @import '#layers/core/app/assets/css/base.css';
-
-

package/layers/core/app/types/app-config.d.ts

@@ -0,0 +1,59 @@
+declare module '@nuxt/schema' {
+  interface AppConfigInput {
+    coreLayer?: {
+      /** Project name */
+      name?: string
+
+      /** 404 Not Found page configuration */
+      notFound?: {
+        icon?: string
+        title?: string
+        description?: string
+        showPath?: boolean
+        showHomeButton?: boolean
+        homeButtonLabel?: string
+        homeButtonTo?: string
+        showBackButton?: boolean
+        backButtonLabel?: string
+        actions?: Array<{
+          label: string
+          to?: string
+          icon?: string
+          color?: 'primary' | 'neutral' | 'error' | 'success'
+          variant?: 'solid' | 'outline' | 'ghost' | 'soft'
+          click?: () => void
+        }>
+        suggestions?: {
+          enabled?: boolean
+          title?: string
+          links?: Array<{ label: string; to: string; icon?: string }>
+        }
+      }
+
+      loading?: {
+        enabled?: boolean
+        minDuration?: number
+        maxDuration?: number
+        background?: string
+        textColor?: string
+        zIndex?: number
+      }
+
+      errors?: {
+        logToConsole?: boolean
+        logToExternal?: boolean
+        externalUrl?: string
+        externalToken?: string
+      }
+
+      scrollGuard?: {
+        enabled?: boolean
+        excludeSelectors?: string[]
+        strict?: boolean
+        transitionDuration?: number
+        resizeDebounce?: number
+        debug?: boolean
+      }
+    }
+  }
+}

package/layers/core/nuxt.config.ts

@@ -19,7 +19,7 @@ export default defineNuxtConfig({
     ...(process.env.NODE_ENV === 'production' ? ['@vite-pwa/nuxt'] : []),
   ],
 
-  css: ['#layers/core/app/assets/css/main.css'],
+  css: ['#layers/core/app/assets/css/core.css'],
 
   devtools: {
     enabled: true,

package/layers/forms/app/types/app-config.d.ts

@@ -0,0 +1,7 @@
+declare module '@nuxt/schema' {
+  interface AppConfigInput {
+    formsLayer?: {
+      name?: string
+    }
+  }
+}

package/layers/layout/{app.config.ts → app/app.config.ts}

@@ -86,11 +86,12 @@ export default {
           // Full-viewport hero: full width, all 12 rows
           hero: { colSpan: 'full', rowSpan: 12 },
 
-          // Centered content column (equal margins both sides)
-          // lg: 3 + 12 + 3 = 18 ✓  |  md: 1 + 10 + 1 = 12 ✓
+          // Full-width content area within the grid's own padding.
+          // mastmain already applies padding-inline (clamp-based gutters),
+          // so col-start:1 / col-end:-1 is already visually centred.
+          // Use preset="prose" for a narrower reading-width column.
           centered: {
-            colStart: { default: 1, md: 2, lg: 4 },
-            colSpan: { default: 6, md: 10, lg: 12 },
+            colSpan: 'full',
             rowSpan: 12,
           },
 

package/layers/layout/app/components/Layout/Grid/Item.vue

@@ -12,6 +12,9 @@
  * @prop {number | ResponsiveValue} rowSpan - Number of rows to span (default: 1)
  * @prop {Alignment} align - Vertical alignment (align-self): start, center, end, stretch
  * @prop {Alignment} justify - Horizontal alignment (justify-self): start, center, end, stretch
+ * @prop {string} container - Content width constraint: content (65ch), wide (90rem), fluid, full
+ * @prop {string} gap - Override --grid-gap for nested content (e.g. '1rem', '2rem')
+ * @prop {string} density - Vertical rhythm: compact (2px), normal (4px), relaxed (8px)
  * @prop {number} z - Explicit z-index value
  * @prop {LayerName} layer - Semantic layer: back, mid, front, top
  * @prop {BleedDirection} bleed - Edge bleed: left, right, both
@@ -41,6 +44,9 @@ interface ResponsiveValue<T> {
   lg?: T
 }
 
+type ContainerSize = 'content' | 'wide' | 'fluid' | 'full'
+type Density = 'compact' | 'normal' | 'relaxed'
+
 interface Props {
   preset?: string
   as?: string
@@ -50,6 +56,9 @@ interface Props {
   rowSpan?: number | ResponsiveValue<number>
   align?: Alignment
   justify?: Alignment
+  container?: ContainerSize
+  gap?: string
+  density?: Density
   z?: number
   layer?: LayerName
   bleed?: BleedDirection
@@ -73,6 +82,9 @@ const rowSpan = computed(() => props.rowSpan ?? presetConfig.value?.rowSpan ?? 1
 // Preset-aware alignment computed refs
 const align = computed(() => props.align ?? presetConfig.value?.align)
 const justify = computed(() => props.justify ?? presetConfig.value?.justify)
+const container = computed(() => props.container ?? presetConfig.value?.container)
+const gap = computed(() => props.gap ?? presetConfig.value?.gap)
+const density = computed(() => props.density ?? presetConfig.value?.density)
 
 const layerZIndex: Record<LayerName, number> = {
   back: 0,
@@ -186,6 +198,19 @@ const style = computed(() => {
     styles.placeItems = `${align.value ?? 'stretch'} ${justify.value ?? 'stretch'}`
   }
 
+  // Gap override — cascades to nested content via --grid-gap
+  if (gap.value) styles['--grid-gap'] = gap.value
+
+  // Density — sets --rhythm base unit for child spacing utilities
+  if (density.value) {
+    const rhythmMap: Record<Density, string> = {
+      compact: '0.125rem',
+      normal: '0.25rem',
+      relaxed: '0.5rem',
+    }
+    styles['--rhythm'] = rhythmMap[density.value]
+  }
+
   // Z-index
   const zIndex = props.z ?? (props.layer ? layerZIndex[props.layer] : undefined)
   if (zIndex !== undefined) styles.zIndex = String(zIndex)
@@ -196,9 +221,8 @@ const style = computed(() => {
 const classes = computed(() => {
   const classList: string[] = ['gi-placed', '@container', '@container/item']
 
-  if (props.aspect) {
-    classList.push(aspectClasses[props.aspect])
-  }
+  if (props.aspect) classList.push(aspectClasses[props.aspect])
+  if (container.value) classList.push(`layout-container-${container.value}`)
 
   return classList.join(' ')
 })

package/layers/layout/app/types/app-config.d.ts

@@ -0,0 +1,10 @@
+declare module '@nuxt/schema' {
+  interface AppConfigInput {
+    layoutLayer?: {
+      name?: string
+      ui?: {
+        grid?: import('./layouts').GridConfig
+      }
+    }
+  }
+}

package/layers/layout/app/types/layouts.ts

@@ -28,7 +28,7 @@ export interface GridLayers {
 }
 
 export type GridContainerSize = 'content' | 'wide' | 'fluid' | 'full'
-export type GridDensity = 'compact' | 'normal' | 'relaxed'
+export type GridDensity = 'compact' | 'normal' | 'relaxed' // relaxed = 0.5rem --rhythm base
 export type GridMode = 'swiss' | 'fluid' | 'disabled'
 
 export interface GridPresetsItem {

package/layers/layout/nuxt.config.ts

@@ -8,7 +8,7 @@ export default defineNuxtConfig({
     '#layers/layout': import.meta.dirname,
   },
 
-  css: ['#layers/layout/app/assets/css/main.css'],
+  css: ['#layers/layout/app/assets/css/layout.css'],
 
   compatibilityDate: '2026-01-20',
 })

package/layers/motion/app/composables/useGsap.ts

@@ -1,5 +1,9 @@
+import { gsap } from 'gsap'
+import { ScrollTrigger } from 'gsap/ScrollTrigger'
+
 /**
- * GSAP composable - provides access to GSAP and ScrollTrigger
+ * Provides access to GSAP and ScrollTrigger.
+ * Registration is handled by v-gsap-nuxt.
  *
  * @example
  * const { gsap, ScrollTrigger } = useGsap()
@@ -11,11 +15,5 @@
  * })
  */
 export function useGsap() {
-  const nuxtApp = useNuxtApp()
-
-  return {
-    gsap: nuxtApp.$gsap as unknown as typeof import('gsap').gsap,
-    ScrollTrigger:
-      nuxtApp.$ScrollTrigger as unknown as typeof import('gsap/ScrollTrigger').ScrollTrigger,
-  }
+  return { gsap, ScrollTrigger }
 }

package/layers/motion/app/types/app-config.d.ts

@@ -0,0 +1,7 @@
+declare module '@nuxt/schema' {
+  interface AppConfigInput {
+    motionLayer?: {
+      name?: string
+    }
+  }
+}

package/layers/motion/nuxt.config.ts

@@ -14,7 +14,7 @@ export default defineNuxtConfig({
     composable: true,
   },
 
-  css: ['#layers/motion/app/assets/css/main.css'],
+  css: ['#layers/motion/app/assets/css/motion.css'],
 
   compatibilityDate: '2026-01-30',
 

package/layers/shader/app/types/app-config.d.ts

@@ -0,0 +1,7 @@
+declare module '@nuxt/schema' {
+  interface AppConfigInput {
+    shaderLayer?: {
+      name?: string
+    }
+  }
+}

package/layers/shader/nuxt.config.ts

@@ -95,7 +95,7 @@ export default defineNuxtConfig({
     devtools: true,
   },
 
-  css: ['#layers/shader/app/assets/css/main.css'],
+  css: ['#layers/shader/app/assets/css/shader.css'],
 
   alias: {
     '#layers/shader': import.meta.dirname,

package/layers/theme/app/assets/css/theme.css

@@ -7,46 +7,46 @@
  */
 
 /* --- Reduced Motion --- */
-[data-theme-motion="reduced"] *,
-[data-theme-motion="reduced"] *::before,
-[data-theme-motion="reduced"] *::after {
+[data-theme-motion='reduced'] *,
+[data-theme-motion='reduced'] *::before,
+[data-theme-motion='reduced'] *::after {
   animation-duration: 0.01ms !important;
   animation-iteration-count: 1 !important;
   transition-duration: 0.01ms !important;
   scroll-behavior: auto !important;
 }
 
-[data-theme-motion="reduced"] {
+[data-theme-motion='reduced'] {
   --duration-base: 0ms;
 }
 
 /* --- Reduced Transparency --- */
-[data-theme-transparency="reduced"] {
+[data-theme-transparency='reduced'] {
   --ui-bg-elevated: var(--ui-bg);
   --opacity-glass: 1;
   --backdrop-blur: 0px;
 }
 
-[data-theme-transparency="reduced"] :where([class*='backdrop-blur']) {
+[data-theme-transparency='reduced'] :where([class*='backdrop-blur']) {
   backdrop-filter: none !important;
   -webkit-backdrop-filter: none !important;
 }
 
-[data-theme-transparency="reduced"] :where([class*='bg-default/'], [class*='bg-elevated/']) {
+[data-theme-transparency='reduced'] :where([class*='bg-default/'], [class*='bg-elevated/']) {
   background-color: var(--ui-bg-elevated) !important;
 }
 
 /* --- High Contrast --- */
-[data-theme-contrast="high"] {
+[data-theme-contrast='high'] {
   --ui-border: var(--ui-border-accented);
 }
 
-[data-theme-contrast="high"] :where(button, a, [role='button']) {
+[data-theme-contrast='high'] :where(button, a, [role='button']) {
   outline-width: 2px;
 }
 
-[data-theme-contrast="high"] .text-muted,
-[data-theme-contrast="high"] .text-dimmed {
+[data-theme-contrast='high'] .text-muted,
+[data-theme-contrast='high'] .text-dimmed {
   opacity: 1;
   filter: contrast(1.25);
 }

package/layers/theme/app/types/app-config.d.ts

@@ -0,0 +1,8 @@
+declare module '@nuxt/schema' {
+  interface AppConfigInput {
+    themeLayer?: {
+      accents?: string[]
+      defaultAccent?: string
+    }
+  }
+}

package/layers/ui/app/assets/css/{main.css → ui.css}

@@ -10,9 +10,11 @@
 }
 
 .accent-blob {
-  transition: background-color 400ms ease, opacity 300ms ease;
+  transition:
+    background-color 400ms ease,
+    opacity 300ms ease;
 }
 
-[data-theme-transparency="reduced"] .accent-blob {
+[data-theme-transparency='reduced'] .accent-blob {
   opacity: 0 !important;
 }

package/layers/ui/app/components/Typography/Headline.vue

@@ -32,7 +32,7 @@ const props = withDefaults(
   {
     level: 1,
     weight: 'font-bold',
-    width: 'normal',
+    width: 'font-stretch-normal',
     slant: 'normal',
     leading: 'leading-tight',
     tracking: 'tracking-tight',

package/layers/ui/app/composables/typography.ts

@@ -50,7 +50,7 @@ export function useTypography(props: {
       }),
 
       normalizeAxis(props.width, {
-        prefix: 'font',
+        numericFormatter: (v) => `font-stretch-[${v}%]`,
       }),
 
       normalizeAxis(props.slant, {

package/layers/ui/app/types/typography.ts

@@ -65,7 +65,15 @@ export type FontSize =
    - Semantic abstraction over wdth axis
    ====================================================== */
 
-export type FontWidth = 'condensed' | 'normal' | 'expanded' | number // variable wdth axis override
+export type FontWidth =
+  | 'font-stretch-ultra-condensed'
+  | 'font-stretch-condensed'
+  | 'font-stretch-semi-condensed'
+  | 'font-stretch-normal'
+  | 'font-stretch-semi-expanded'
+  | 'font-stretch-expanded'
+  | 'font-stretch-ultra-expanded'
+  | number // variable wdth axis override
 
 /* ======================================================
    Font Slant

package/layers/ui/nuxt.config.ts

@@ -17,7 +17,7 @@ export default defineNuxtConfig({
     // '@nuxt/image'
   ],
 
-  css: ['#layers/ui/app/assets/css/main.css'],
+  css: ['#layers/ui/app/assets/css/ui.css'],
 
   // devtools: {
   //   enabled: true,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "kmcom-nuxt-layers",
   "private": false,
-  "version": "1.6.9",
+  "version": "1.6.11",
   "description": "Composable Nuxt 4 layers for building scalable Vue applications",
   "files": [
     "layers/*/nuxt.config.ts",
@@ -31,7 +31,7 @@
     "@tresjs/nuxt": "^5.3.0",
     "@tresjs/post-processing": "^3.4.0",
     "@vite-pwa/nuxt": "^1.1.1",
-    "@vueuse/nuxt": "^14.2.1",
+    "@vueuse/nuxt": "^14.3.0",
     "better-sqlite3": "^12.6.2",
     "gsap": "^3.14.2",
     "locomotive-scroll": "^5.0.1",
@@ -94,49 +94,49 @@
     "@commitlint/cli": "^20.4.3",
     "@commitlint/config-conventional": "^20.4.3",
     "@culur/config-stylelint": "^1.6.5",
-    "@eslint/json": "^1.0.1",
-    "@eslint/markdown": "^7.5.1",
+    "@eslint/json": "^1.2.0",
+    "@eslint/markdown": "^8.0.1",
     "@ianvs/prettier-plugin-sort-imports": "^4.7.1",
-    "@iconify-json/lucide": "^1.2.102",
-    "@netlify/nuxt": "0.2.41",
+    "@iconify-json/lucide": "^1.2.105",
+    "@netlify/nuxt": "0.3.1",
     "@nuxt/eslint": "^1.15.2",
     "@nuxt/fonts": "^0.14.0",
     "@nuxt/image": "^2.0.0",
     "@nuxt/ui": "latest",
     "@nuxtjs/device": "^4.0.0",
-    "@perplex-digital/stylelint-config": "^17.3.0",
+    "@perplex-digital/stylelint-config": "^17.4.0",
     "@pinia/nuxt": "^0.11.3",
     "@types/node": "^25.6.0",
-    "@typescript-eslint/eslint-plugin": "^8.58.2",
-    "@typescript-eslint/parser": "^8.58.2",
+    "@typescript-eslint/eslint-plugin": "^8.59.1",
+    "@typescript-eslint/parser": "^8.59.1",
     "@vue/eslint-config-typescript": "^14.7.0",
-    "@vueuse/core": "^14.2.1",
-    "@vueuse/nuxt": "^14.2.1",
+    "@vueuse/core": "^14.3.0",
+    "@vueuse/nuxt": "^14.3.0",
     "@webgpu/glslang": "^0.0.15",
     "browserslist": "^4.28.2",
     "changesets": "^1.0.2",
     "cypress": "^15.10.0",
     "depcheck": "^1.4.7",
-    "eslint": "^10.2.0",
-    "eslint-plugin-compat": "^7.0.1",
+    "eslint": "^10.3.0",
+    "eslint-plugin-compat": "^7.0.2",
     "eslint-plugin-glsl": "0.0.0-wip",
     "eslint-plugin-pnpm": "^1.6.0",
     "eslint-plugin-prettier": "^5.5.5",
     "eslint-plugin-unicorn": "^64.0.0",
     "eslint-plugin-unused-imports": "^4.4.1",
-    "eslint-plugin-vue": "^10.8.0",
+    "eslint-plugin-vue": "^10.9.0",
     "npm-check-updates": "^21.0.3",
     "nuxt": "latest",
     "pinia": "^3.0.4",
     "playwright": "^1.58.2",
     "postcss-html": "^1.8.1",
-    "prettier": "^3.8.2",
+    "prettier": "^3.8.3",
     "prettier-plugin-css-order": "^2.2.0",
     "prettier-plugin-glsl": "^0.2.5",
     "prettier-plugin-organize-attributes": "^1.0.0",
     "prettier-plugin-tailwind-styled-components": "^2.0.2",
-    "prettier-plugin-tailwindcss": "^0.7.2",
-    "stylelint": "^17.4.0",
+    "prettier-plugin-tailwindcss": "^0.8.0",
+    "stylelint": "^17.10.0",
     "stylelint-config-recommended-vue": "^1.6.1",
     "stylelint-config-standard": "^40.0.0",
     "stylelint-config-standard-vue": "^1.0.0",
@@ -144,12 +144,12 @@
     "stylelint-no-unsupported-browser-features": "^8.1.1",
     "stylelint-prettier": "^5.0.3",
     "tailwindcss": "^4.2.4",
-    "turbo": "^2.9.6",
-    "typescript": "^6.0.2",
+    "turbo": "^2.9.8",
+    "typescript": "^6.0.3",
     "vite-plugin-checker": "^0.13.0",
     "vitest": "^4.1.5",
     "vue": "latest",
-    "vue-tsc": "^3.2.6",
+    "vue-tsc": "^3.2.8",
     "zod": "^4.3.6",
     "zod-to-json-schema": "^3.25.1"
   },

package/layers/motion/app/composables/useMotion.ts

@@ -1,137 +0,0 @@
-import { useElementHover, useElementVisibility, useScroll } from '@vueuse/core'
-// eslint-disable-next-line no-restricted-imports
-import type { Ref } from 'vue'
-
-/**
- * Composable for handling element animations and transitions
- */
-export function useMotion(target?: Ref<HTMLElement | null>) {
-  // Hover state
-  const isHovered = ref(false)
-
-  // Visibility state
-  const isVisible = ref(false)
-
-  // Scroll position
-  const scroll = ref({ x: 0, y: 0 })
-
-  // Initialize if target is provided
-  if (target?.value) {
-    isHovered.value = useElementHover(target).value
-    isVisible.value = useElementVisibility(target).value
-
-    const scrollResult = useScroll(target)
-    scroll.value = {
-      x: scrollResult.x.value,
-      y: scrollResult.y.value,
-    }
-  }
-
-  // Animation trigger states
-  const animateOnHover = ref(false)
-  const animateOnVisible = ref(false)
-  const animateOnScroll = ref(false)
-
-  // Trigger functions
-  const triggerHoverAnimation = () => {
-    animateOnHover.value = true
-    setTimeout(() => {
-      animateOnHover.value = false
-    }, 300)
-  }
-
-  const triggerVisibleAnimation = () => {
-    animateOnVisible.value = true
-  }
-
-  const triggerScrollAnimation = () => {
-    animateOnScroll.value = true
-  }
-
-  return {
-    // States
-    isHovered,
-    isVisible,
-    scroll,
-    animateOnHover,
-    animateOnVisible,
-    animateOnScroll,
-
-    // Methods
-    triggerHoverAnimation,
-    triggerVisibleAnimation,
-    triggerScrollAnimation,
-  }
-}
-
-/**
- * Composable for managing CSS transitions
- */
-export function useTransition() {
-  const transitionClasses = ref<string[]>([])
-
-  const addTransition = (className: string) => {
-    if (!transitionClasses.value.includes(className)) {
-      transitionClasses.value.push(className)
-    }
-  }
-
-  const removeTransition = (className: string) => {
-    const index = transitionClasses.value.indexOf(className)
-    if (index > -1) {
-      transitionClasses.value.splice(index, 1)
-    }
-  }
-
-  const clearTransitions = () => {
-    transitionClasses.value = []
-  }
-
-  return {
-    transitionClasses,
-    addTransition,
-    removeTransition,
-    clearTransitions,
-  }
-}
-
-/**
- * Composable for managing CSS animations
- */
-export function useAnimation() {
-  const animationClasses = ref<string[]>([])
-  const isAnimating = ref(false)
-
-  const addAnimation = (className: string) => {
-    if (!animationClasses.value.includes(className)) {
-      animationClasses.value.push(className)
-      isAnimating.value = true
-
-      // Auto-remove after duration (assuming 300ms)
-      setTimeout(() => {
-        removeAnimation(className)
-        isAnimating.value = false
-      }, 300)
-    }
-  }
-
-  const removeAnimation = (className: string) => {
-    const index = animationClasses.value.indexOf(className)
-    if (index > -1) {
-      animationClasses.value.splice(index, 1)
-    }
-  }
-
-  const clearAnimations = () => {
-    animationClasses.value = []
-    isAnimating.value = false
-  }
-
-  return {
-    animationClasses,
-    isAnimating,
-    addAnimation,
-    removeAnimation,
-    clearAnimations,
-  }
-}

package/layers/motion/app/plugins/gsap.client.ts

@@ -1,15 +0,0 @@
-import { gsap } from 'gsap'
-import { ScrollTrigger } from 'gsap/ScrollTrigger'
-
-export default defineNuxtPlugin(() => {
-  // Register GSAP plugins
-  gsap.registerPlugin(ScrollTrigger)
-
-  // Provide GSAP globally
-  return {
-    provide: {
-      gsap,
-      ScrollTrigger,
-    },
-  }
-})