BMS Shared Components

Библиотека общих Vue 3 компонентов для переиспользования в различных проектах.

Установка

npm install bms-shared-components

Использование

Как плагин (глобальная регистрация)

import { createApp } from "vue";
import App from "./App.vue";
import BmsSharedComponents from "bms-shared-components";
import "bms-shared-components/style.css";

const app = createApp(App);
app.use(BmsSharedComponents);
app.mount("#app");

Импорт отдельных компонентов

import { FullLoader } from "bms-shared-components";
import "bms-shared-components/style.css";

export default {
  components: {
    FullLoader,
  },
};

Компоненты

FullLoader

Компонент полноэкранного загрузчика с красивой анимацией.

Пропсы

• modelValue (Boolean) - управляет видимостью загрузчика
• minShowTime (Number) - минимальное время показа в миллисекундах (по умолчанию 750)

Пример использования

<template>
  <div>
    <button @click="showLoader = true">Показать загрузчик</button>

    <FullLoader v-model="showLoader"> Загружаем данные... </FullLoader>
  </div>
</template>

<script setup>
import { ref } from "vue";
import { FullLoader } from "bms-shared-components";

const showLoader = ref(false);

// Автоматически скрыть через 3 секунды
setTimeout(() => {
  showLoader.value = false;
}, 3000);
</script>

Разработка

# Установка зависимостей
npm install

# Запуск в режиме разработки
npm run dev

# Сборка библиотеки
npm run build:lib

# Публикация
npm publish

Лицензия

MIT