@ozdao/martyrs 0.2.575 → 0.2.577

package/dist/martyrs.es.js

@@ -1,4 +1,4 @@
-import { _ as e, a as o, b as d, C as r, k as t, c as l, d as i, e as p, f as u, g as n, h as M, i as S, j as c, F as m, l as C, n as F, o as g, p as h, L as b, q as k, M as x, r as B, I, s as T, t as U, u as f, v as w, S as D, w as E, x as L, y as P, z as q, A as y, B as A, D as G, E as j, U as v, G as z, H, m as R } from "./main-BfEQkhXS.js";
+import { _ as e, a as o, b as d, C as r, k as t, c as l, d as i, e as p, f as u, g as n, h as M, i as S, j as c, F as m, l as C, n as F, o as g, p as h, L as b, q as k, M as x, r as B, I, s as T, t as U, u as f, v as w, S as D, w as E, x as L, y as P, z as q, A as y, B as A, D as G, E as j, U as v, G as z, H, m as R } from "./main-EZaj64lH.js";
 export {
   e as Address,
   o as Breadcrumbs,

package/dist/style.css

@@ -19,12 +19,12 @@
   display: flex;
   scroll-snap-type: x mandatory;
   overflow-x: scroll;
-  scrollbar-width: none; /* Firefox */
-  -ms-overflow-style: none; /* IE and Edge */
+  scrollbar-width: none;
+  -ms-overflow-style: none;
   scroll-behavior: smooth;
 }
 .carousel__container::-webkit-scrollbar {
-  display: none; /* Chrome, Safari, Opera */
+  display: none;
 }
 .carousel__slide {
   flex: 0 0 100%;
@@ -32,8 +32,6 @@
   scroll-snap-align: start;
   scroll-snap-stop: always;
 }
-
-/* Navigation dots */
 .carousel__dots {
   display: flex;
   justify-content: center;

package/dist/{web-BqTV9va1.js → web-ClbcbWYJ.js}

@@ -1,4 +1,4 @@
-import { W as p } from "./main-BfEQkhXS.js";
+import { W as p } from "./main-EZaj64lH.js";
 class f extends p {
   constructor() {
     super(...arguments), this.group = "CapacitorStorage";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ozdao/martyrs",
-  "version": "0.2.575",
+  "version": "0.2.577",
   "description": "Fullstack framework focused on user experience and ease of development.",
   "author": "OZ DAO <hello@ozdao.dev>",
   "license": "GPL-3.0-or-later",
@@ -56,21 +56,6 @@
       "import": "./dist/martyrs/src/modules/*/*.client.js"
     }
   },
-  "scripts": {
-    "preinstall": "npx only-allow pnpm",
-    "clean": "rimraf dist",
-    "build": "pnpm run clean && pnpm run build:builder && pnpm run build:components && pnpm run build:client && pnpm run build:server",
-    "build:components": "vite build --config vite.components.config.js",
-    "build:client": "vite build --config vite.modules.client.config.js",
-    "build:server": "vite build --config vite.modules.server.config.js",
-    "build:builder": "vite build --config vite.builder.config.js",
-    "build:rspack": "pnpm run clean && pnpm run build:builder:rspack && pnpm run build:components:rspack && pnpm run build:client:rspack && pnpm run build:theme:rspack && pnpm run build:server:rspack",
-    "build:components:rspack": "rspack --config rspack.components.config.js",
-    "build:theme:rspack": "rspack --config rspack.theme.config.js",
-    "build:client:rspack": "rspack --config rspack.client.config.js && FORMAT=cjs rspack --config rspack.client.config.js",
-    "build:server:rspack": "rspack --config rspack.server.config.js && FORMAT=esm rspack --config rspack.server.config.js",
-    "build:builder:rspack": "rspack --config rspack.builder.config.js"
-  },
   "dependencies": {
     "@capacitor/core": "7.4.4",
     "@capacitor/preferences": "7.0.2",
@@ -116,5 +101,20 @@
   },
   "bugs": {
     "url": "https://github.com/oz-digital/martyrs/issues"
+  },
+  "scripts": {
+    "preinstall": "npx only-allow pnpm",
+    "clean": "rimraf dist",
+    "build": "pnpm run clean && pnpm run build:builder && pnpm run build:components && pnpm run build:client && pnpm run build:server",
+    "build:components": "vite build --config vite.components.config.js",
+    "build:client": "vite build --config vite.modules.client.config.js",
+    "build:server": "vite build --config vite.modules.server.config.js",
+    "build:builder": "vite build --config vite.builder.config.js",
+    "build:rspack": "pnpm run clean && pnpm run build:builder:rspack && pnpm run build:components:rspack && pnpm run build:client:rspack && pnpm run build:theme:rspack && pnpm run build:server:rspack",
+    "build:components:rspack": "rspack --config rspack.components.config.js",
+    "build:theme:rspack": "rspack --config rspack.theme.config.js",
+    "build:client:rspack": "rspack --config rspack.client.config.js && FORMAT=cjs rspack --config rspack.client.config.js",
+    "build:server:rspack": "rspack --config rspack.server.config.js && FORMAT=esm rspack --config rspack.server.config.js",
+    "build:builder:rspack": "rspack --config rspack.builder.config.js"
   }
-}
+}

package/src/components/Slider/Slider.vue

@@ -1,14 +1,19 @@
 <template>
-  <!-- Native Carousel -->
-  <div class="carousel" ref="carouselRef">
+  <div
+    class="carousel"
+    ref="carouselRef"
+    @mouseenter="onHoverStart"
+    @mouseleave="onHoverEnd"
+    @touchstart="onTouchStart"
+    @touchend="onTouchEnd"
+  >
     <div class="carousel__container" @scroll="handleScroll">
       <slot></slot>
     </div>
-    
-    <!-- Navigation Dots (optional) -->
+
     <div class="carousel__dots" v-if="showDots && slideCount > 1">
-      <button 
-        v-for="index in slideCount" 
+      <button
+        v-for="index in slideCount"
         :key="index - 1"
         class="carousel__dot"
         :class="{ 'carousel__dot--active': selectedIndex === index - 1 }"
@@ -19,187 +24,144 @@
 </template>
 
 <script setup>
-import { ref, onMounted, onBeforeUnmount, computed } from 'vue'
+import { ref, onMounted, onBeforeUnmount, watch } from 'vue'
 
-// Props for customization
 const props = defineProps({
   showDots: Boolean,
   slideCount: {
     type: Number,
     default: 0
+  },
+  autoplay: {
+    type: Object,
+    default: null
   }
 });
 
+// autoplay: { enabled, interval, hover, touch, resume, delay }
+
 const carouselRef = ref(null)
 const selectedIndex = ref(0)
-const autoplayInterval = ref(null)
+const intervalId = ref(null)
 const scrollTimeout = ref(null)
+const resumeTimeout = ref(null)
+const paused = ref(false)
 
-// Scroll to specific slide
 const scrollTo = (index) => {
   if (!carouselRef.value) return
-  
   const container = carouselRef.value.querySelector('.carousel__container')
   const slides = container.querySelectorAll('.carousel__slide')
-  
   if (slides[index]) {
-    container.scrollTo({
-      left: slides[index].offsetLeft,
-      behavior: 'smooth'
-    })
-    
+    container.scrollTo({ left: slides[index].offsetLeft, behavior: 'smooth' })
     selectedIndex.value = index
   }
 }
 
-// Handle scroll event with debounce
 const handleScroll = () => {
-  // Clear previous timeout
-  if (scrollTimeout.value) {
-    clearTimeout(scrollTimeout.value)
-  }
-  
-  // Set a timeout to update the index when scrolling stops
-  scrollTimeout.value = setTimeout(() => {
-    updateSelectedIndex()
-  }, 50) // Small delay to ensure scroll has completed
+  if (scrollTimeout.value) clearTimeout(scrollTimeout.value)
+  scrollTimeout.value = setTimeout(updateSelectedIndex, 50)
 }
 
-// Update selected index when scrolling
 const updateSelectedIndex = () => {
   if (!carouselRef.value) return
-  
   const container = carouselRef.value.querySelector('.carousel__container')
   const slides = container.querySelectorAll('.carousel__slide')
-  
   if (!slides.length) return
-  
-  const scrollPosition = container.scrollLeft
-  const slideWidth = slides[0].offsetWidth
-  
-  // Find current slide index based on scroll position
-  const index = Math.round(scrollPosition / slideWidth)
-  
-  // Ensure index is within bounds
-  const boundedIndex = Math.max(0, Math.min(index, slides.length - 1))
-  
-  // Update selected index
-  selectedIndex.value = boundedIndex
-}
-
-// Setup autoplay functionality
-const setupAutoplay = () => {
-  if (autoplayInterval.value) {
-    clearInterval(autoplayInterval.value)
+  const index = Math.round(container.scrollLeft / slides[0].offsetWidth)
+  selectedIndex.value = Math.max(0, Math.min(index, slides.length - 1))
+}
+
+const clearTimers = () => {
+  if (intervalId.value) { clearInterval(intervalId.value); intervalId.value = null }
+  if (resumeTimeout.value) { clearTimeout(resumeTimeout.value); resumeTimeout.value = null }
+}
+
+const startAutoplay = () => {
+  clearTimers()
+  const a = props.autoplay
+  if (!a?.enabled || paused.value) return
+  intervalId.value = setInterval(() => {
+    scrollTo((selectedIndex.value + 1) % props.slideCount)
+  }, a.interval ?? 2000)
+}
+
+const pause = () => {
+  paused.value = true
+  clearTimers()
+}
+
+const resume = () => {
+  const a = props.autoplay
+  if (!a?.enabled || a.resume === false) return
+  clearTimers()
+  const delay = a.delay ?? 0
+  if (delay > 0) {
+    resumeTimeout.value = setTimeout(() => {
+      paused.value = false
+      startAutoplay()
+    }, delay)
+  } else {
+    paused.value = false
+    startAutoplay()
   }
-  
-  autoplayInterval.value = setInterval(() => {
-    const nextIndex = (selectedIndex.value + 1) % props.slideCount
-    scrollTo(nextIndex)
-  }, 2000) // 2 seconds interval like in original
 }
 
+const onHoverStart = () => {
+  if (props.autoplay?.hover !== false) pause()
+}
+
+const onHoverEnd = () => {
+  if (props.autoplay?.hover !== false) resume()
+}
+
+const onTouchStart = () => {
+  if (props.autoplay?.touch !== false) pause()
+}
+
+const onTouchEnd = () => {
+  if (props.autoplay?.touch !== false) resume()
+}
+
+watch(() => props.autoplay, () => {
+  if (props.autoplay?.enabled) {
+    paused.value = false
+    startAutoplay()
+  } else {
+    pause()
+  }
+}, { deep: true })
+
 onMounted(() => {
-  // Initialize native carousel after component is mounted
-  if (carouselRef.value) {
-    // Listen for scroll end using intersection observer for better performance
-    const container = carouselRef.value.querySelector('.carousel__container')
-    const slides = container.querySelectorAll('.carousel__slide')
-    
-    // Create intersection observer to detect when slides are visible
-    const observer = new IntersectionObserver((entries) => {
-      entries.forEach(entry => {
-        if (entry.isIntersecting) {
-          // Find the index of the visible slide
-          const slideIndex = Array.from(slides).indexOf(entry.target)
-          if (slideIndex !== -1) {
-            selectedIndex.value = slideIndex
-          }
-        }
-      })
-    }, {
-      root: container,
-      threshold: 0.7 // Consider slide visible when 70% is in view
-    })
-    
-    // Observe all slides
-    slides.forEach(slide => {
-      observer.observe(slide)
-    })
-    
-    // Add focus/blur events to pause autoplay on focus
-    container.addEventListener('focusin', () => {
-      if (autoplayInterval.value) {
-        clearInterval(autoplayInterval.value)
-      }
-    })
-    
-    container.addEventListener('focusout', () => {
-      setupAutoplay()
-    })
-    
-    // Stop autoplay on touch/mouse interaction
-    container.addEventListener('mousedown', () => {
-      if (autoplayInterval.value) {
-        clearInterval(autoplayInterval.value)
-      }
-    })
-    
-    container.addEventListener('touchstart', () => {
-      if (autoplayInterval.value) {
-        clearInterval(autoplayInterval.value)
+  if (!carouselRef.value) return
+  const container = carouselRef.value.querySelector('.carousel__container')
+  const slides = container.querySelectorAll('.carousel__slide')
+
+  const observer = new IntersectionObserver((entries) => {
+    entries.forEach(entry => {
+      if (entry.isIntersecting) {
+        const idx = Array.from(slides).indexOf(entry.target)
+        if (idx !== -1) selectedIndex.value = idx
       }
     })
-    
-    // Resume autoplay after interaction ends
-    container.addEventListener('mouseup', () => {
-      setupAutoplay()
-    })
-    
-    container.addEventListener('touchend', () => {
-      setupAutoplay()
-    })
-    
-    // Initialize autoplay
-    setupAutoplay()
-    
-    // Store observer for cleanup
-    carouselRef.value._observer = observer
-  }
+  }, { root: container, threshold: 0.7 })
+
+  slides.forEach(slide => observer.observe(slide))
+  carouselRef.value._observer = observer
+
+  container.addEventListener('focusin', pause)
+  container.addEventListener('focusout', resume)
+
+  if (props.autoplay?.enabled) startAutoplay()
 })
 
 onBeforeUnmount(() => {
-  // Clean up all resources
-  if (carouselRef.value) {
-    // Clean up intersection observer
-    if (carouselRef.value._observer) {
-      carouselRef.value._observer.disconnect()
-    }
-    
-    // Clean up event listeners
-    const container = carouselRef.value.querySelector('.carousel__container')
-    if (container) {
-      container.removeEventListener('focusin', () => {})
-      container.removeEventListener('focusout', () => {})
-      container.removeEventListener('mousedown', () => {})
-      container.removeEventListener('touchstart', () => {})
-      container.removeEventListener('mouseup', () => {})
-      container.removeEventListener('touchend', () => {})
-    }
-  }
-  
-  // Clear all timeouts and intervals
-  if (autoplayInterval.value) {
-    clearInterval(autoplayInterval.value)
-  }
-  
-  if (scrollTimeout.value) {
-    clearTimeout(scrollTimeout.value)
-  }
+  if (carouselRef.value?._observer) carouselRef.value._observer.disconnect()
+  clearTimers()
+  if (scrollTimeout.value) clearTimeout(scrollTimeout.value)
 })
 </script>
 
-<style >
+<style>
 .carousel {
   position: relative;
   width: 100%;
@@ -210,13 +172,13 @@ onBeforeUnmount(() => {
   display: flex;
   scroll-snap-type: x mandatory;
   overflow-x: scroll;
-  scrollbar-width: none; /* Firefox */
-  -ms-overflow-style: none; /* IE and Edge */
+  scrollbar-width: none;
+  -ms-overflow-style: none;
   scroll-behavior: smooth;
 }
 
 .carousel__container::-webkit-scrollbar {
-  display: none; /* Chrome, Safari, Opera */
+  display: none;
 }
 
 .carousel__slide {
@@ -226,7 +188,6 @@ onBeforeUnmount(() => {
   scroll-snap-stop: always;
 }
 
-/* Navigation dots */
 .carousel__dots {
   display: flex;
   justify-content: center;
@@ -248,4 +209,4 @@ onBeforeUnmount(() => {
 .carousel__dot--active {
   background-color: rgba(0, 0, 0, 0.6);
 }
-</style>
+</style>

package/src/jit/loader.js

@@ -2,13 +2,12 @@
  * Martyrs JIT CSS Engine - Token Extraction Loader
  *
  * Этот loader вызывается rspack для каждого .vue/.js/.ts файла.
- * 1. Извлекает токены для JIT engine
- * 2. Оборачивает <style> блоки в @layer components для приоритета JIT
+ * Извлекает токены для JIT engine
  */
 
 /**
  * @param {string} source - содержимое файла
- * @returns {string} - source с обёрнутыми стилями
+ * @returns {string} - source без изменений
  */
 export default function martyrsLoader(source) {
   // Получаем options и plugin instance
@@ -28,19 +27,5 @@ export default function martyrsLoader(source) {
     console.warn(`[MartyrsJIT] Error extracting tokens from ${resourcePath}:`, error.message);
   }
 
-  // Для .vue файлов оборачиваем содержимое <style> в @layer components
-  if (resourcePath.endsWith('.vue')) {
-    source = source.replace(
-      /<style([^>]*)>([\s\S]*?)<\/style>/gi,
-      (match, attrs, css) => {
-        // Пропускаем пустые стили или уже обёрнутые в @layer
-        if (!css.trim() || css.includes('@layer')) {
-          return match;
-        }
-        return `<style${attrs}>@layer components {\n${css}\n}</style>`;
-      }
-    );
-  }
-
   return source;
 }

package/src/jit/plugin.js

@@ -204,8 +204,7 @@ export class MartyrsJitPlugin {
   generateCSS() {
     const tokens = Array.from(this.tokens);
     const css = this.jit.generate(tokens);
-    // Порядок: base < components < utilities (последний = высший приоритет)
-    return `/* Martyrs JIT - ${tokens.length} tokens */\n@layer base, components, utilities;\n@layer utilities {\n${css}\n}`;
+    return `/* Martyrs JIT - ${tokens.length} tokens */\nbody {\n${css}\n}`;
   }
 }
 

package/src/styles/config.scss

@@ -46,7 +46,6 @@ $xxl-desktop-min: 1921px;
 // ============================================================================
 // CSS VARIABLES
 // ============================================================================
-@layer base {
 :root {
   color-scheme: light dark;
 
@@ -214,4 +213,3 @@ p,.p-regular { font-family: var(--font-second); font-weight: 400; font-size: 1.0
 .text-box-trim { text-box: trim-both cap alphabetic; }
 .text-box-trim-end { text-box: trim-end cap alphabetic; }
 .trimmed > * { text-box: trim-both cap alphabetic; overflow: visible; }
-}

package/src/styles/layout.scss

@@ -1,4 +1,3 @@
-@layer base {
 * {
 	box-sizing: border-box;
 }
@@ -170,5 +169,4 @@ hr {
 
 //     display: none !important;
 //   }
-// }
-}
+// }

package/src/styles/reset.scss

@@ -1,5 +1,4 @@
 @charset "UTF-8";
-@layer base {
 html, button, body, div, span, applet, object, iframe,
 h1, h2, h3, h4, h5, h6, p, blockquote, pre,
 a, abbr, acronym, address, big, cite, code,
@@ -82,5 +81,4 @@ input::-webkit-outer-spin-button,
 input::-webkit-inner-spin-button {
   -webkit-appearance: none;
   margin: 0;
-}
 }