@amirjalili1374/ui-kit 1.2.0 → 1.2.2

package/src/components/shared/DescriptionInput.vue

@@ -1,204 +0,0 @@
-<template>
-  <div class="description-input">
-    <v-textarea
-      v-model="internalValue"
-      :label="label"
-      :placeholder="placeholder"
-      :rows="rows"
-      :maxlength="maxlength"
-      :disabled="disabled"
-      :readonly="readonly"
-      :clearable="clearable"
-      :counter="showCounter || undefined"
-      variant="outlined"
-      density="comfortable"
-      auto-grow
-      @keydown="handleKeydown"
-      @input="handleInput"
-      @blur="handleBlur"
-    />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref, watch } from 'vue';
-
-interface Props {
-  modelValue?: string;
-  label?: string;
-  placeholder?: string;
-  rows?: number;
-  maxlength?: number;
-  disabled?: boolean;
-  readonly?: boolean;
-  clearable?: boolean;
-  showCounter?: boolean;
-  autoNumbering?: boolean; // Enable/disable auto numbering
-  startNumber?: number; // Starting number for auto numbering
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  modelValue: '',
-  label: 'توضیحات',
-  placeholder: 'توضیحات خود را وارد کنید...',
-  rows: 4,
-  maxlength: 1000,
-  disabled: false,
-  readonly: false,
-  clearable: true,
-  showCounter: true,
-  autoNumbering: true,
-  startNumber: 1
-});
-
-const emit = defineEmits<{
-  (e: 'update:modelValue', value: string): void;
-  (e: 'change', value: string): void;
-}>();
-
-const internalValue = ref(props.modelValue);
-
-// Watch for external modelValue changes
-watch(() => props.modelValue, (newValue) => {
-  internalValue.value = newValue;
-});
-
-// Watch for internal value changes and emit
-watch(internalValue, (newValue) => {
-  emit('update:modelValue', newValue);
-});
-
-// Handle keydown events for auto numbering
-const handleKeydown = (event: KeyboardEvent) => {
-  if (!props.autoNumbering || props.disabled || props.readonly) {
-    return;
-  }
-
-  const target = event.target as HTMLTextAreaElement;
-  const { key, ctrlKey, shiftKey, altKey } = event;
-
-  // Handle Enter key (new line with incrementing number)
-  if (key === 'Enter' && !ctrlKey && !shiftKey && !altKey) {
-    event.preventDefault();
-    insertNumberedLine(target, true);
-  }
-  
-  // Handle Inter key (new line with decrementing number)
-  if (key === 'Inter' || (key === 'Enter' && shiftKey)) {
-    event.preventDefault();
-    insertNumberedLine(target, false);
-  }
-};
-
-// Insert a numbered line
-const insertNumberedLine = (textarea: HTMLTextAreaElement, increment: boolean) => {
-  const { selectionStart, selectionEnd, value } = textarea;
-  
-  // Get current line number
-  const currentLineNumber = getCurrentLineNumber(value, selectionStart);
-  
-  // Calculate new line number
-  const newLineNumber = increment ? currentLineNumber + 1 : Math.max(1, currentLineNumber - 1);
-  
-  // Create the new line text
-  const newLineText = `\n${newLineNumber} - `;
-  
-  // Insert the new line
-  const newValue = value.slice(0, selectionStart) + newLineText + value.slice(selectionEnd);
-  internalValue.value = newValue;
-  
-  // Set cursor position after the new line
-  const newCursorPosition = selectionStart + newLineText.length;
-  
-  // Use nextTick to ensure DOM is updated
-  setTimeout(() => {
-    textarea.setSelectionRange(newCursorPosition, newCursorPosition);
-    textarea.focus();
-  }, 0);
-};
-
-// Get the current line number from the text
-const getCurrentLineNumber = (text: string, cursorPosition: number): number => {
-  // Find the current line
-  const lines = text.split('\n');
-  let currentPos = 0;
-  
-  for (let i = 0; i < lines.length; i++) {
-    const lineLength = lines[i].length + 1; // +1 for newline
-    
-    if (currentPos + lineLength > cursorPosition) {
-      // We found the current line
-      const line = lines[i];
-      
-      // Check if line starts with a number pattern (e.g., "1 - ", "2 - ", etc.)
-      const numberMatch = line.match(/^(\d+)\s*-\s*/);
-      if (numberMatch) {
-        return parseInt(numberMatch[1]);
-      }
-      
-      // If no number found, return the line index + startNumber
-      return props.startNumber + i;
-    }
-    
-    currentPos += lineLength;
-  }
-  
-  // If we're at the end, return the next number
-  return props.startNumber + lines.length;
-};
-
-// Handle input changes
-const handleInput = (event: Event) => {
-  const target = event.target as HTMLTextAreaElement;
-  const value = target.value;
-  
-  // Auto-format existing text to add numbering if needed
-  if (props.autoNumbering && value && !value.match(/^\d+\s*-\s/)) {
-    const formattedValue = formatTextWithNumbering(value);
-    if (formattedValue !== value) {
-      internalValue.value = formattedValue;
-    }
-  }
-};
-
-// Format text to add numbering
-const formatTextWithNumbering = (text: string): string => {
-  const lines = text.split('\n');
-  const formattedLines = lines.map((line, index) => {
-    // Skip empty lines
-    if (!line.trim()) {
-      return line;
-    }
-    
-    // If line already has numbering, keep it
-    if (line.match(/^\d+\s*-\s/)) {
-      return line;
-    }
-    
-    // Add numbering
-    return `${props.startNumber + index} - ${line}`;
-  });
-  
-  return formattedLines.join('\n');
-};
-
-// Handle blur event
-const handleBlur = () => {
-  emit('change', internalValue.value);
-};
-</script>
-
-<style scoped>
-.description-input {
-  width: 100%;
-}
-
-.description-input :deep(.v-textarea textarea) {
-  font-family: 'Vazir', 'Tahoma', sans-serif;
-  line-height: 1.6;
-}
-
-.description-input :deep(.v-textarea textarea:focus) {
-  outline: none;
-}
-</style>

package/src/components/shared/DownloadButton.vue

@@ -1,169 +0,0 @@
-<template>
-  <v-btn
-    v-bind="$attrs"
-    :loading="loading"
-    @click="handleDownload"
-    class="download-button"
-  >
-    <v-icon v-if="icon" :start="iconStart" :end="iconEnd" :class="iconClass">{{ icon }}</v-icon>
-    <span class="download-title">{{ title }}</span>
-    <v-icon v-if="!icon" start :icon="icons.download" :class="iconClass"></v-icon>
-  </v-btn>
-</template>
-
-<script setup lang="ts">
-import { ref, computed } from 'vue'
-import { icons } from '@/plugins/mdi-icon'
-
-interface Props {
-  url: string
-  title?: string
-  icon?: string
-  iconStart?: boolean
-  iconEnd?: boolean
-  filename?: string
-  method?: 'anchor' | 'fetch'
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  title: 'دانلود',
-  iconStart: true,
-  iconEnd: false,
-  method: 'anchor'
-})
-
-const emit = defineEmits<{
-  download: [url: string]
-  error: [error: Error]
-  success: [filename: string]
-}>()
-
-const loading = ref(false)
-
-// Computed class for icon positioning
-const iconClass = computed(() => {
-  if (props.iconStart) return 'icon-start'
-  if (props.iconEnd) return 'icon-end'
-  return ''
-})
-
-const handleDownload = async () => {
-  if (!props.url) {
-    const error = new Error('URL is required for download')
-    emit('error', error)
-    return
-  }
-
-  loading.value = true
-  
-  try {
-    if (props.method === 'fetch') {
-      await downloadWithFetch()
-    } else {
-      await downloadWithAnchor()
-    }
-  } catch (error) {
-    console.error('Download failed:', error)
-    emit('error', error as Error)
-  } finally {
-    loading.value = false
-  }
-}
-
-const downloadWithAnchor = async () => {
-  // Create a temporary anchor element to trigger download
-  const link = document.createElement('a')
-  link.href = props.url
-  link.download = props.filename || ''
-  link.target = '_blank'
-  link.rel = 'noopener noreferrer'
-  
-  // Append to body, click, and remove
-  document.body.appendChild(link)
-  link.click()
-  document.body.removeChild(link)
-  
-  emit('download', props.url)
-  emit('success', props.filename || 'downloaded-file')
-}
-
-const downloadWithFetch = async () => {
-  try {
-    const response = await fetch(props.url)
-    
-    if (!response.ok) {
-      throw new Error(`Download failed: ${response.status} ${response.statusText}`)
-    }
-    
-    const blob = await response.blob()
-    const url = window.URL.createObjectURL(blob)
-    
-    const link = document.createElement('a')
-    link.href = url
-    link.download = props.filename || getFilenameFromUrl(props.url) || 'download'
-    
-    document.body.appendChild(link)
-    link.click()
-    document.body.removeChild(link)
-    
-    // Clean up the object URL
-    window.URL.revokeObjectURL(url)
-    
-    emit('download', props.url)
-    emit('success', props.filename || 'downloaded-file')
-  } catch (error) {
-    throw new Error(`Fetch download failed: ${error}`)
-  }
-}
-
-const getFilenameFromUrl = (url: string): string => {
-  try {
-    const urlObj = new URL(url)
-    const pathname = urlObj.pathname
-    const filename = pathname.split('/').pop()
-    return filename || 'download'
-  } catch {
-    return 'download'
-  }
-}
-
-// Inherit all Vuetify button attributes except the ones we override
-defineOptions({
-  inheritAttrs: false
-})
-</script>
-
-<style scoped>
-.download-button {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-
-.download-title {
-  margin: 0 4px;
-}
-
-.icon-start {
-  margin-right: 4px;
-}
-
-.icon-end {
-  margin-left: 4px;
-}
-
-/* RTL Support */
-[dir="rtl"] .download-button {
-  gap: 8px;
-}
-
-[dir="rtl"] .icon-start {
-  margin-right: 0;
-  margin-left: 4px;
-}
-
-[dir="rtl"] .icon-end {
-  margin-left: 0;
-  margin-right: 4px;
-}
-</style>

package/src/components/shared/MoneyInput.vue

@@ -1,105 +0,0 @@
-<script setup lang="ts">
-import { computed, ref } from 'vue';
-
-const props = defineProps({
-  modelValue: {
-    type: Number,
-    required: false,
-    default: 0,
-    validator: (value) => value === null || value === undefined || typeof value === 'string' || typeof value === 'number'
-  },
-  label: {
-    type: String,
-    default: ''
-  },
-  placeholder: {
-    type: String,
-    default: ''
-  },
-  disabled: {
-    type: Boolean,
-    default: false
-  },
-  readonly: {
-    type: Boolean,
-    default: false
-  },
-  clearable: {
-    type: Boolean,
-    default: false
-  },
-  variant: {
-    type: String,
-    default: 'outlined'
-  },
-  errorMessages: {
-    type: [String, Array],
-    default: () => []
-  },
-  min: {
-    type: Number,
-    default: undefined
-  },
-  max: {
-    type: Number,
-    default: undefined
-  },
-  suffix: {
-    type: String,
-    default: ''
-  },
-  prefix: {
-    type: String,
-    default: ''
-  }
-});
-
-const emit = defineEmits(['update:modelValue']);
-
-// Memoization for better performance
-const lastProcessedValue = ref<string | number | null | undefined>(null);
-const lastFormattedValue = ref<string>('');
-
-const displayValue = computed({
-  get() {
-    // Format with commas for display
-    const val = props.modelValue;
-    if (val === undefined || val === null || val === 0) return '';
-    return val.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
-  },
-  set(val: string | null | undefined) {
-    // Remove all non-digit characters and emit as number
-    const safeVal = (val ?? '').replace(/[^\d]/g, '');
-    emit('update:modelValue', safeVal === '' ? 0 : Number(safeVal));
-  }
-});
-
-function onKeyPress(event: KeyboardEvent) {
-  if (!/[0-9]/.test(event.key)) {
-    event.preventDefault();
-  }
-}
-</script>
-
-<template>
-  <v-text-field
-    v-model="displayValue"
-    :label="props.label"
-    :placeholder="props.placeholder"
-    :disabled="props.disabled"
-    :readonly="props.readonly"
-    :clearable="props.clearable"
-    :variant="props.variant as any"
-    :error-messages="props.errorMessages as string[]"
-    :suffix="props.suffix"
-    :prefix="props.prefix"
-    inputmode="numeric"
-    pattern="[0-9]*"
-    type="text"
-    @keypress="onKeyPress"
-  >
-    <template v-for="(slot) in $slots" #[slot]="scope">
-      <slot :name="slot" v-bind="scope || {}" />
-    </template>
-  </v-text-field>
-</template>