@place-framework/place-block-image 1.0.1 → 1.0.2

package/src/templates/vue.ts

@@ -1,98 +0,0 @@
-import { getSharedTemplate } from './shared/';
-import { CLASS_NAMES } from '../constants';
-
-export function getVueTemplate(imagePrefix: string): string {
-  const shared = getSharedTemplate(imagePrefix);
-  
-  return `<template>
-  <picture :class="wrapperClassName">
-    <img
-      ref="imgRef"
-      :src="imageSrc"
-      :alt="alt"
-      :class="imgClassName"
-      v-bind="$attrs"
-    />
-  </picture>
-</template>
-
-<script setup lang="ts">
-import { computed, ref, onMounted, onUnmounted, watch } from 'vue';
-
-interface Props {
-  src: string;
-  alt: string;
-  lazy?: boolean;
-  class?: string;
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  lazy: false,
-  class: ''
-});
-
-${shared.comment}
-
-const imgRef = ref<HTMLImageElement | null>(null);
-const imageSrc = ref(props.lazy ? '' : props.src);
-const isLoaded = ref(!props.lazy);
-let observer: IntersectionObserver | null = null;
-
-${shared.getImageClassNameTemplate}
-
-const imageClassName = computed(() => getImageClassName(props.src));
-const wrapperClassName = computed(() => 
-  \`${imagePrefix}wrapper \${imageClassName.value}\`
-);
-
-const lazyClass = computed(() => 
-  props.lazy ? (isLoaded.value ? '${CLASS_NAMES.LAZY} ${CLASS_NAMES.LOADED}' : '${CLASS_NAMES.LAZY}') : ''
-);
-
-const imgClassName = computed(() => 
-  \`\${props.class} \${lazyClass.value}\`.trim()
-);
-
-const setupLazyLoading = () => {
-  if (!props.lazy || isLoaded.value) return;
-
-  ${shared.intersectionObserverTemplate}
-
-  if (imgRef.value) {
-    observer.observe(imgRef.value);
-  }
-};
-
-const cleanupObserver = () => {
-  if (observer) {
-    observer.disconnect();
-    observer = null;
-  }
-};
-
-onMounted(() => {
-  setupLazyLoading();
-});
-
-onUnmounted(() => {
-  cleanupObserver();
-});
-
-watch(() => props.src, (newSrc) => {
-  if (!props.lazy) {
-    imageSrc.value = newSrc;
-  } else if (!isLoaded.value) {
-    cleanupObserver();
-    setupLazyLoading();
-  }
-});
-
-watch(isLoaded, (loaded) => {
-  if (loaded) {
-    imageSrc.value = props.src;
-    cleanupObserver();
-  }
-});
-</script>
-`;
-}

package/src/templates.ts

@@ -1,29 +0,0 @@
-// Main template exports
-import { getReactTsxTemplate as getReactTsx } from './templates/react-tsx';
-import { getReactJsxTemplate as getReactJsx } from './templates/react-jsx';
-import { getVueTemplate as getVue } from './templates/vue';
-
-export function getReactTsxTemplate(imagePrefix: string): string {
-  return getReactTsx(imagePrefix);
-}
-
-export function getReactJsxTemplate(imagePrefix: string): string {
-  return getReactJsx(imagePrefix);
-}
-
-export function getVueTemplate(imagePrefix: string): string {
-  return getVue(imagePrefix);
-}
-
-export function getTemplate(type: 'tsx' | 'jsx' | 'vue', imagePrefix: string): string {
-  switch (type) {
-    case 'tsx':
-      return getReactTsxTemplate(imagePrefix);
-    case 'jsx':
-      return getReactJsxTemplate(imagePrefix);
-    case 'vue':
-      return getVueTemplate(imagePrefix);
-    default:
-      throw new Error(`Unsupported component type: ${type}`);
-  }
-}