Vous pouvez installer la bibliotheque de composant via la commande git suivante :
Créée un fichier global.css dans le dossier /src/routes/
importer le dans le +layout.svelte a la racine du projet.
<script>
import "./global.css"
</script>
<slot/>
Dans le fichier global.css copier le code suivant.
@import url('https://fonts.googleapis.com/css2?family=Geist+Mono:wght@100..900&family=Geist:wght@100..900&display=swap');
/* variable */
:root {
/* palet */
--green: #2fcc5c;
--green-b: #80f8a233;
--red: #cc3737;
--red-b: #e1737328;
--blue: #1459C1;
--blue-b: #1459c136;
--orange: #e0a21d;
--orange-b: #e0a21d3d;
--mauve: #7342FF;
Vous êtes prêt ! Vous pouvez maintenant importer des composants de la bibliotheque.
Configurer la configuration hamzus-ui afin de pouvoir utiliser les composant serveur.
Pour se faire aller dans votre +layout.svelte a la racine de votre projet ou créée le fichier. Dedans inséré ces ligne
import { init } from 'hamzus-ui';
// init le package hamzus-ui
init({
url:"http://localhost:8000",
sessionTokenName:"token"
})
La clé url contient l'url vers lequel votre composant Form et la fonction utilitaires sendRequest() envoie les requete par defaut. Specifié votre url sans "/" a la fin.
La clé sessionTokenName contient le nom du cookie stocker qui contient votre token d'authentification il est automatiquement récuperer et envoyé par le composant Form et si vous ajouter la clé includeToken a true dans les options de la fonction sendRequest().
Nous vous recommandons d'init en important l'url serveur en recupant une variable d'environement. Cela vous permettra d'avoir une url spécifique pour la production et le developement
Ici cette exemple est pour les utilisateur vite en fonction de vos packet vous pouvez utiliser d'autre manière d'importer des variable d'environement.
Pour se faire créée 2 fichier si il ne sont pas créée .env.production et .env.developement a la racine de votre projet au niveau du package.json.
VITE_API_URL=http://localhost:8000
VITE_SESSION_TOKEN_NAME=token
VITE_API_URL=https://api.exemple.com
VITE_SESSION_TOKEN_NAME=token
Ensuite dans votre +layout.svelte a la racine du projet svelte.
import { init } from 'hamzus-ui';
// init le package hamzus-ui
init({
url:import.meta.env.VITE_API_URL,
sessionTokenName:import.meta.env.VITE_SESSION_TOKEN_NAME
})
Maintenant en fonction de si vous êtes en production ou en developement le package sera configuré correctement !