@bisom/web_package

@bisom/web_package

Bibliothèque de composants Vue 3 et utilitaires BISOM : cartes, formulaires, cartes, vidéo, visio et dashboard.

Prérequis

• Vue 3.5+
• Vuetify 3.8+
• Pinia 3+
• Vue Router 5+
• Vue I18n 11+

Installation

npm install @bisom/web_package

Peer Dependencies

Assurez-vous d'avoir les dépendances suivantes installées dans votre projet :

npm install vue vuetify pinia vue-router vue-i18n axios leaflet @vue-leaflet/vue-leaflet

Dépendance	Version
vue	^3.5.13
vuetify	^3.8.3
pinia	^3.0.2
vue-router	^5.0.1
vue-i18n	^11.1.3
axios	^1.13.4
leaflet	^1.9.4
@vue-leaflet/vue-leaflet	^0.10.1

Utilisation

Importer les composants

// main.ts ou plugin
import { createApp } from "vue";
import App from "./App.vue";
import vuetify from "./plugins/vuetify"; // Vuetify configuré pour votre app

import {
  BBisomImg,
  BMap,
  BLineChart,
  vuetifyConfig,
  bisomI18n,
  BisomUtils,
  apiHeader,
} from "@bisom/web_package";

// Importer les styles
import "@bisom/web_package/dist/bisom-lib.css";

const app = createApp(App);

// Enregistrer les composants globalement (optionnel)
app.component("BBisomImg", BBisomImg);
app.component("BMap", BMap);
app.component("BLineChart", BLineChart);
// ... autres composants

app.use(vuetify).mount("#app");

Utilisation dans un composant

<template>
  <BBisomImg height="200" class="ma-3" />
</template>

<script setup lang="ts">
import { BBisomImg } from "@bisom/web_package";
</script>

Import des utilitaires

import { BisomUtils, apiHeader } from "@bisom/web_package";

// Utilitaires disponibles
BisomUtils.getAccessToken();
BisomUtils.downloadFile();
BisomUtils.compressImg();
BisomUtils.parseJwt();
// ...

Exports disponibles

Composants

Composant	Description
BBisomImg	Image BISOM
BBisomLoader	Loader BISOM
BMap	Carte Leaflet
BLineChart	Graphique Chart.js
BTextField, BDateInput, BTextarea	Champs de formulaire
BButtonIconText, BGenderBtn, BIconBtnWithTooltip	Boutons
BChatCard, BNodata, BCardHeader	Cartes
BFullscreenModal, BIncompletProfil, BVehicleLocationModal	Modales
BDashboardMapChart, BDashboardHospitalTable	Dashboard SSE
BShareVisio, VideoCard, RemoteVideoCard, VisioInfosCard	Visio
…	Et plus

Configuration

• vuetifyConfig — configuration Vuetify (theme, icônes)
• bisomI18n — traductions françaises (fr-FR, dates)

Scripts de développement

Commande	Description
npm run dev	Démarre le serveur de développement
npm run build	Build de la bibliothèque
npm run lint	Lint du code
npm run format	Formatage Prettier
npm run typecheck	Vérification TypeScript
npm run test:unit	Tests unitaires Vitest
npm run herokuCheck	Vérification complète (lint + depcheck + typecheck)

Avant chaque PR

npm run lint

Auteur

Laurent Mahieu