@vasakgroup/vue-libvasak 0.2.3 → 0.3.1

package/src/forms/SwitchToggle.vue

@@ -1,49 +0,0 @@
-<template>
-  <button
-    type="button"
-    @click="handleClick"
-    :disabled="disabled"
-    :class="[
-      'relative inline-flex items-center rounded-full transition-colors',
-      size === 'small' ? 'h-6 w-11' : 'h-7 w-12',
-      isOn ? activeClass : inactiveClass,
-      disabled ? 'opacity-50 cursor-not-allowed' : 'cursor-pointer',
-      customClass
-    ]"
-  >
-    <span
-      :class="[
-        'inline-block transform rounded-full bg-white shadow transition-transform',
-        size === 'small' ? 'h-4 w-4' : 'h-6 w-6',
-        isOn ? (size === 'small' ? 'translate-x-6' : 'translate-x-5') : 'translate-x-1'
-      ]"
-    ></span>
-  </button>
-</template>
-
-<script setup lang="ts">
-interface Props {
-  isOn: boolean;
-  disabled?: boolean;
-  size?: 'small' | 'medium';
-  activeClass?: string;
-  inactiveClass?: string;
-  customClass?: string;
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  disabled: false,
-  size: 'small',
-  activeClass: 'bg-primary dark:bg-primary-dark',
-  inactiveClass: 'background',
-  customClass: '',
-});
-
-const emit = defineEmits<{
-  toggle: [value: boolean];
-}>();
-
-const handleClick = () => {
-  emit('toggle', !props.isOn);
-};
-</script>

package/src/layout/ConfigSection.vue

@@ -1,28 +0,0 @@
-<script setup lang="ts">
-interface Props {
-  title: string;
-  icon?: string;
-  customClass?: string | Record<string, boolean>;
-}
-
-withDefaults(defineProps<Props>(), {
-  icon: '',
-  customClass: () => ({}),
-});
-</script>
-
-<template>
-  <div
-    class="flex flex-col gap-4 p-4 background rounded-corner"
-    :class="customClass"
-  >
-    <h3 class="text-base font-semibold m-0 text-primary dark:text-primary-dark">
-      {{ icon ? `${icon} ${title}` : title }}
-    </h3>
-    <slot />
-  </div>
-</template>
-
-<style scoped>
-/* Ningún estilo adicional requerido */
-</style>

package/src/sidebar/SideBar.vue

@@ -1,7 +0,0 @@
-<script lang="ts" setup></script>
-
-<template>
-  <div class="sidebar">
-    <slot />
-  </div>
-</template>

package/src/sidebar/SideButton.vue

@@ -1,18 +0,0 @@
-<script lang="ts" setup>
-const props = defineProps({
-  title: {
-    type: String,
-    default: "Link",
-  },
-  image: {
-    type: String,
-    default: "",
-  },
-});
-</script>
-
-<template>
-  <a href="#" class="sidebar-button">
-    <img :src="image" :alt="title" class="img-fluid" />
-  </a>
-</template>

package/src/tray/TrayIconButton.vue

@@ -1,80 +0,0 @@
-<template>
-  <div
-    class="p-1 rounded-corner relative hover:bg-primary dark:hover:bg-primary-dark group transition-all duration-300"
-    :class="customClass"
-    :title="tooltip"
-    @click="handleClick"
-    @mouseenter="showTooltip = true"
-    @mouseleave="showTooltip = false"
-  >
-    <img
-      :src="icon"
-      :alt="alt"
-      class="m-auto h-5.5 w-auto transition-all duration-300"
-      :class="iconClass"
-    />
-    
-    <!-- Badge/Counter -->
-    <div
-      v-if="badge !== null && badge > 0"
-      class="absolute bottom-1 right-1 bg-primary dark:bg-primary-dark text-white text-xs rounded-full w-4 h-4 flex items-center justify-center font-bold animate-bounce"
-    >
-      {{ badge }}
-    </div>
-
-    <!-- Tooltip personalizado -->
-    <div 
-      v-if="showCustomTooltip && customTooltipText"
-      class="absolute top-1 left-1/2 transform -translate-x-1/2 text-xs font-semibold p-1 rounded-corner transition-all duration-300 pointer-events-none background"
-      :class="[
-        tooltipClass,
-        {
-          'opacity-0 -translate-y-2': !showTooltip,
-          'opacity-100 translate-y-0': showTooltip
-        }
-      ]"
-    >
-      {{ customTooltipText }}
-    </div>
-
-    <!-- Slot para contenido adicional personalizado -->
-    <slot></slot>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue';
-
-interface Props {
-  icon: string;
-  alt?: string;
-  tooltip?: string;
-  badge?: number | null;
-  iconClass?: string | Record<string, boolean>;
-  customClass?: string | Record<string, boolean>;
-  tooltipClass?: string | Record<string, boolean>;
-  showCustomTooltip?: boolean;
-  customTooltipText?: string;
-}
-
-withDefaults(defineProps<Props>(), {
-  alt: '',
-  tooltip: '',
-  badge: null,
-  iconClass: () => ({}),
-  customClass: '',
-  tooltipClass: '',
-  showCustomTooltip: false,
-  customTooltipText: '',
-});
-
-const emit = defineEmits<{
-  click: [];
-}>();
-
-const showTooltip = ref(false);
-
-const handleClick = () => {
-  emit('click');
-};
-</script>

package/src/types/vue-libvasak.d.ts

@@ -1,155 +0,0 @@
-declare module "@vasakgroup/vue-libvasak" {
-  import { DefineComponent, App } from "vue";
-
-  /* Layout */
-  export interface WindowFrameProps {
-    title?: string;
-    image?: string;
-    class?: string;
-    [key: string]: any;
-  }
-
-  /* Sidebar */
-  export interface SideBarProps {
-    class?: string;
-    [key: string]: any;
-  }
-
-  export interface SideButtonProps {
-    title?: string;
-    image?: string;
-    class?: string;
-    [key: string]: any;
-  }
-
-  /* Controls */
-  export interface ActionButtonProps {
-    label: string;
-    disabled?: boolean;
-    variant?: "primary" | "secondary" | "danger";
-    loading?: boolean;
-    customClass?: string | Record<string, boolean>;
-    size?: "sm" | "md" | "lg";
-    fullWidth?: boolean;
-    iconSrc?: string;
-    iconAlt?: string;
-    iconRight?: boolean;
-    type?: "button" | "submit" | "reset";
-    stopPropagation?: boolean;
-    preventDefault?: boolean;
-    [key: string]: any;
-  }
-
-  export interface ToggleControlProps {
-    icon: string;
-    alt?: string;
-    tooltip?: string;
-    isActive?: boolean;
-    isLoading?: boolean;
-    iconClass?: Record<string, boolean>;
-    customClass?: Record<string, boolean>;
-    [key: string]: any;
-  }
-
-  /* Layout/Config */
-  export interface ConfigSectionProps {
-    title: string;
-    icon?: string;
-    customClass?: string | Record<string, boolean>;
-    [key: string]: any;
-  }
-
-  /* Cards */
-  export interface DeviceCardProps {
-    icon: string;
-    title: string;
-    subtitle?: string;
-    metadata?: string;
-    extraInfo?: string[];
-    isConnected?: boolean;
-    showActionButton?: boolean;
-    actionLabel?: string;
-    showStatusIndicator?: boolean;
-    customClass?: string;
-    clickable?: boolean;
-    [key: string]: any;
-  }
-
-  export interface ListCardProps {
-    clickable?: boolean;
-    customClass?: string | Record<string, boolean>;
-    [key: string]: any;
-  }
-
-  /* Forms */
-  export interface FormGroupProps {
-    label: string;
-    htmlFor?: string;
-    customClass?: string | Record<string, boolean>;
-    labelClass?: string | Record<string, boolean>;
-    [key: string]: any;
-  }
-
-  export interface SliderControlProps {
-    icon: string;
-    alt?: string;
-    tooltip?: string;
-    modelValue: number;
-    min?: number;
-    max?: number;
-    showButton?: boolean;
-    iconClass?: string | Record<string, boolean>;
-    getPercentageClass?: (percentage: number) => string;
-    [key: string]: any;
-  }
-
-  export interface SwitchToggleProps {
-    isOn: boolean;
-    disabled?: boolean;
-    size?: "small" | "medium";
-    activeClass?: string;
-    inactiveClass?: string;
-    customClass?: string;
-    [key: string]: any;
-  }
-
-  /* Tray */
-  export interface TrayIconButtonProps {
-    icon: string;
-    alt?: string;
-    tooltip?: string;
-    badge?: number | null;
-    iconClass?: string | Record<string, boolean>;
-    customClass?: string | Record<string, boolean>;
-    tooltipClass?: string | Record<string, boolean>;
-    showCustomTooltip?: boolean;
-    customTooltipText?: string;
-    [key: string]: any;
-  }
-
-  /* Component exports */
-  export const WindowFrame: DefineComponent<WindowFrameProps, any, any, {}, {}, {}, {}, {}, string>;
-  export const SideBar: DefineComponent<SideBarProps, any, any, {}, {}, {}, {}, {}, string>;
-  export const SideButton: DefineComponent<SideButtonProps, any, any, {}, {}, {}, {}, {}, string>;
-
-  export const ActionButton: DefineComponent<ActionButtonProps, any, any, {}, {}, {}, {}, { click: () => void }, string>;
-  export const ToggleControl: DefineComponent<ToggleControlProps, any, any, {}, {}, {}, {}, { click: () => void }, string>;
-  export const ConfigSection: DefineComponent<ConfigSectionProps, any, any, {}, {}, {}, {}, {}, string>;
-
-  export const DeviceCard: DefineComponent<DeviceCardProps, any, any, {}, {}, {}, {}, { action: () => void; click: () => void }, string>;
-  export const ListCard: DefineComponent<ListCardProps, any, any, {}, {}, {}, {}, { click: () => void }, string>;
-
-  export const FormGroup: DefineComponent<FormGroupProps, any, any, {}, {}, {}, {}, {}, string>;
-  export const SliderControl: DefineComponent<SliderControlProps, any, any, {}, {}, {}, {}, { 'update:modelValue': (value: number) => void; buttonClick: () => void }, string>;
-  export const SwitchToggle: DefineComponent<SwitchToggleProps, any, any, {}, {}, {}, {}, { toggle: (value: boolean) => void }, string>;
-
-  export const TrayIconButton: DefineComponent<TrayIconButtonProps, any, any, {}, {}, {}, {}, { click: () => void }, string>;
-
-  // Plugin de Vue
-  export interface VueLibVasakPlugin {
-    install(app: App): void;
-  }
-
-  declare const plugin: VueLibVasakPlugin;
-  export default plugin;
-}

package/src/window/TopBar.vue

@@ -1,46 +0,0 @@
-<script lang="ts" setup>
-import { ref, Ref, onMounted } from "vue";
-import { getCurrentWindow } from "@tauri-apps/api/window";
-import { getIconSource } from "@vasakgroup/plugin-vicons";
-
-const bar = ref(null);
-const appWindow = getCurrentWindow();
-const closeIcon: Ref<string> = ref("");
-const minimizeIcon: Ref<string> = ref("");
-const maximizeIcon: Ref<string> = ref("");
-
-const props = defineProps({
-  title: String,
-  image: String,
-});
-
-onMounted(async () => {
-  closeIcon.value = await getIconSource("window-close");
-  minimizeIcon.value = await getIconSource("window-minimize");
-  maximizeIcon.value = await getIconSource("window-maximize");
-});
-</script>
-
-<template>
-  <div
-    data-tauri-drag-region
-    class="flex h-8 px-4 py-1 bg-primary dark:bg-primary-dark rounded-t-corner-window justify-between align-center"
-    ref="bar"
-  >
-    <div data-tauri-drag-region>
-      <img :src="props.image" data-tauri-drag-region class="h-6 w-auto" :alt="props.title" />
-    </div>
-    <div data-tauri-drag-region>{{ props.title }}</div>
-    <div data-tauri-drag-region>
-      <span class="win-button" @click="appWindow.minimize()">
-        <img :src="minimizeIcon" class="h-6 w-6 inline-block" alt="Minimize">
-      </span>
-      <span class="win-button" @click="appWindow.toggleMaximize()">
-        <img :src="maximizeIcon" class="h-6 w-6 inline-block" alt="Maximize">
-      </span>
-      <span class="win-button" @click="appWindow.close()">
-        <img :src="closeIcon" class="h-6 w-6 inline-block" alt="Close">
-      </span>
-    </div>
-  </div>
-</template>

package/src/window/WindowFrame.vue

@@ -1,20 +0,0 @@
-<script lang="ts" setup>
-import TopBar from "./TopBar.vue";
-import { defineProps } from "vue";
-
-const props = defineProps({
-  title: {
-    type: String,
-    default: "Vasak",
-  },
-  image: {
-    type: String,
-    default: "",
-  },
-});
-</script>
-
-<template>
-  <TopBar :title="props.title" :image="props.image" />
-  <slot />
-</template>