bms-shared-components 1.0.0 → 1.0.1

package/README.md

@@ -1,92 +1,208 @@
-# BMS Shared Components
-
-Библиотека общих Vue 3 компонентов для переиспользования в различных проектах.
-
-## Установка
-
-```bash
-npm install bms-shared-components
-```
-
-## Использование
-
-### Как плагин (глобальная регистрация)
-
-```js
-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");
-```
-
-### Импорт отдельных компонентов
-
-```js
-import { FullLoader } from "bms-shared-components";
-import "bms-shared-components/style.css";
-
-export default {
-  components: {
-    FullLoader,
-  },
-};
-```
-
-## Компоненты
-
-### FullLoader
-
-Компонент полноэкранного загрузчика с красивой анимацией.
-
-#### Пропсы
-
-- `modelValue` (Boolean) - управляет видимостью загрузчика
-- `minShowTime` (Number) - минимальное время показа в миллисекундах (по умолчанию 750)
-
-#### Пример использования
-
-```vue
-<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>
-```
-
-## Разработка
-
-```bash
-# Установка зависимостей
-npm install
-
-# Запуск в режиме разработки
-npm run dev
-
-# Сборка библиотеки
-npm run build:lib
-
-# Публикация
-npm publish
-```
-
-## Лицензия
-
-MIT
+# BMS Shared Components
+
+Библиотека общих Vue 3 компонентов для переиспользования в различных проектах.
+
+## Установка
+
+```bash
+npm install bms-shared-components
+```
+
+## Использование
+
+### Как плагин (глобальная регистрация)
+
+```js
+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");
+```
+
+### С настройкой API при установке плагина
+
+```js
+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, {
+  apiConfig: {
+    baseURL: "https://api.example.com",
+    token: "your-auth-token",
+  },
+});
+app.mount("#app");
+```
+
+### Импорт отдельных компонентов
+
+```js
+import { FullLoader } from "bms-shared-components";
+import "bms-shared-components/style.css";
+
+export default {
+  components: {
+    FullLoader,
+  },
+};
+```
+
+## Настройка API
+
+Если ваши компоненты будут обращаться к API, необходимо настроить базовый URL и токен авторизации.
+
+### Настройка с помощью configureApi
+
+```js
+import { configureApi } from "bms-shared-components";
+
+// Настройка API перед использованием компонентов
+configureApi({
+  baseURL: "https://api.example.com",
+  token: "your-auth-token",
+  headers: {
+    // Дополнительные заголовки (опционально)
+    "Custom-Header": "value",
+  },
+});
+```
+
+### Обновление токена
+
+```js
+import { updateToken } from "bms-shared-components";
+
+// Обновить токен авторизации
+updateToken("new-auth-token");
+```
+
+### Получение текущей конфигурации
+
+```js
+import { getApiConfig } from "bms-shared-components";
+
+const config = getApiConfig();
+console.log(config.baseURL); // текущий базовый URL
+console.log(config.token); // текущий токен
+```
+
+## Композаблы
+
+### useAxios
+
+Композабл для выполнения HTTP запросов с использованием настроенной конфигурации API.
+
+```vue
+<template>
+  <div>
+    <button @click="loadData" :disabled="loading">Загрузить данные</button>
+
+    <div v-if="loading">Загрузка...</div>
+    <div v-if="error">Ошибка: {{ error }}</div>
+    <div v-if="data">
+      <pre>{{ JSON.stringify(data, null, 2) }}</pre>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { useAxios } from "bms-shared-components";
+
+const { loading, error, data, get, post, put, delete: del } = useAxios();
+
+async function loadData() {
+  try {
+    // GET запрос
+    await get("/api/users");
+
+    // POST запрос
+    // await post("/api/users", { name: "John", email: "john@example.com" });
+
+    // PUT запрос
+    // await put("/api/users/1", { name: "Jane" });
+
+    // DELETE запрос
+    // await del("/api/users/1");
+  } catch (err) {
+    console.error("Ошибка запроса:", err);
+  }
+}
+</script>
+```
+
+#### Возвращаемые значения useAxios
+
+- `loading` - реактивное значение состояния загрузки
+- `error` - реактивное значение с текстом ошибки
+- `data` - реактивное значение с данными ответа
+- `request(url, options)` - универсальный метод запроса
+- `get(url, options)` - GET запрос
+- `post(url, body, options)` - POST запрос
+- `put(url, body, options)` - PUT запрос
+- `delete(url, options)` - DELETE запрос
+
+## Компоненты
+
+### FullLoader
+
+Компонент полноэкранного загрузчика с красивой анимацией.
+
+#### Пропсы
+
+- `modelValue` (Boolean) - управляет видимостью загрузчика
+- `minShowTime` (Number) - минимальное время показа в миллисекундах (по умолчанию 750)
+
+#### Пример использования
+
+```vue
+<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>
+```
+
+## Примеры
+
+Полные примеры использования смотрите в папке `example/`.
+
+## Разработка
+
+```bash
+# Установка зависимостей
+npm install
+
+# Запуск в режиме разработки
+npm run dev
+
+# Сборка библиотеки
+npm run build:lib
+
+# Публикация
+npm publish
+```
+
+## Лицензия
+
+MIT

package/dist/bms-shared-components.css

@@ -1 +1 @@
-.loader-fade-enter-active[data-v-b1f0ef8e],.loader-fade-leave-active[data-v-b1f0ef8e]{transition:opacity .3s ease}.loader-fade-enter-from[data-v-b1f0ef8e],.loader-fade-leave-to[data-v-b1f0ef8e]{opacity:0}
+.loader-fade-enter-active[data-v-b1f0ef8e],.loader-fade-leave-active[data-v-b1f0ef8e]{transition:opacity .3s ease}.loader-fade-enter-from[data-v-b1f0ef8e],.loader-fade-leave-to[data-v-b1f0ef8e]{opacity:0}.tox-promotion-link,.tox-statusbar__branding{display:none!important}.gutter{background-color:#eee;background-repeat:no-repeat;background-position:50%}.gutter.gutter-vertical{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAFAQMAAABo7865AAAABlBMVEVHcEzMzMzyAv2sAAAAAXRSTlMAQObYZgAAABBJREFUeF5jOAMEEAIEEFwAn3kMwcB6I2AAAAAASUVORK5CYII=)}.gutter.gutter-horizontal{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAeCAYAAADkftS9AAAAIklEQVQoU2M4c+bMfxAGAgYYmwGrIIiDjrELjpo5aiZeMwF+yNnOs5KSvgAAAABJRU5ErkJggg==)}