1.0.10 • Published 1 year ago

@doing-ai/doing-ai-icons v1.0.10

Weekly downloads
-
License
MIT
Repository
-
Last release
1 year ago

Librairie d'icônes SVG DOING AI

Ce projet fournit une collection d'icônes SVG personnalisées pour une utilisation dans vos applications. Vous pouvez facilement installer la librairie et intégrer les icônes dans vos projets.

Installation

Installation via npm

Pour installer la librairie dans votre projet, exécutez la commande suivante :

npm i @doing-ai/doing-ai-icons

Installation via pnpm

Pour installer la librairie dans votre projet en utilisant pnpm, exécutez la commande suivante :

pnpm add @doing-ai/doing-ai-icons

Utilisation

Utilisation avec React

Pour utiliser les icônes dans un projet React, importez simplement l'icône souhaitée et utilisez-la dans votre composant :

import { IconName } from '@doing-ai/doing-ai-icons';

const MyComponent = () => (
    <div>
        <img src={IconName} alt="Name" />
    </div>
);

Utilisation avec Vue

Pour utiliser les icônes dans un projet Vue, importez l'icône souhaitée et enregistrez-la en tant que composant :

<script>
import { IconName } from '@doing-ai/doing-ai-icons';
</script>

<template>
  <div>
    <img :src="IconName" alt="Name" />
  </div>
</template>

Utilisation avec Angular

Pour utiliser les icônes dans un projet Angular, importez l'icône souhaitée et ajoutez-la à votre module :

import { IconName } from '@doing-ai/doing-ai-icons';

@Component({
    selector: 'app-example',
    template: `
    <div>
      <img [src]="iconName" alt="Name">
    </div>
  `
})
export class ExampleComponent {
    iconName = IconName;
}

Utilisation recommandée

Il est recommandé de créer un composant personnalisé pour afficher les icônes, ce qui permet de les utiliser de manière plus flexible dans votre application. Voici un exemple de composant personnalisé pour afficher une icône sous react:

import { IconName } from '@doing-ai/doing-ai-icons';

export const IconComponent = (icon, size = 20) => {
    return <img src={icon} alt="Name" width={size} height={size} />;
}

Icones Disponibles

Voici une liste de tous les icones disponibles dans la librairie :

Icon NamePreview
Button
Key
Connector
UserEdit
Edit
ArrowRight
ArrowLeft
ArrowUp
ArrowDown
Users
BuIa
Code
Question
UserLock
Password
Info
Settings
Selector
CaretLeft
Diamond
SideElement
CaretRight
Suit
Archive
Message
Stat
DropdownArrow
Cloud
DocumentSlide
Network
Phone
Setting
Database
Plus
CheckMark
Error
1.0.10

1 year ago

1.0.7

1 year ago

1.0.9

1 year ago

1.0.6

1 year ago

1.0.5

1 year ago

1.0.4

1 year ago

1.0.3

1 year ago

1.0.2

1 year ago

1.0.1

1 year ago