Git Product home page Git Product logo

react-lineicons's Introduction

react-lineicons

build status PRs Welcome GitHub issues HitCount

NPM

Simple react component for using lineicons in React application.

Check icons here

Installation

react-lineicons is available as an npm package.

npm install react-lineicons

or

yarn add react-lineicons

Usage

import React from "react";
import ReactDOM from "react-dom";
import LineIcon from "react-lineicons";

function App() {
  return <LineIcon name="spinner" />;
}

Options

Property Type Values Description
name String e.g. alarm the name of the icon, see lineicons for list of all available icons
tag String e.g. 'li' by default, Icon tag is i, which can be changed to any valid HTML element
size String 'lg', 'md', 'sm', 'xs' the size of the icon
style Object custom style object
effect String 'spin', 'tada', 'flashing', 'burst', 'fade-left', 'fade-right', 'fade-up', 'fade-down' Additional effect on icon

Any other prop would directly be applied as on the root element (useful for a11y).

Using the Pro version of LineIcons

This module only works with free version of lineicons. To use the Pro version, please use the download section from your lineicons dashboard.

Contribution

Suggestions and PRs are welcome!

Please create issue or open PR request for contribution.

License

Open Source Love

refer LICENSE file in this repository.

react-lineicons's People

Stargazers

avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar avatar

Watchers

avatar avatar avatar

Forkers

kayali-dev

react-lineicons's Issues

icon name property error in typescript

import LineIcon from 'react-lineicons';

typescript is giving error on name property

(JSX attribute) name: string
No overload matches this call.
Overload 1 of 2, '(props: {} | Readonly<{}>): reactLineicons', gave the following error.
Type '{ name: string; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes & Readonly<{}> & Readonly<{ children?: ReactNode; }>'.
Property 'name' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes & Readonly<{}> & Readonly<{ children?: ReactNode; }>'.
Overload 2 of 2, '(props: {}, context: any): reactLineicons', gave the following error.
Type '{ name: string; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes & Readonly<{}> & Readonly<{ children?: ReactNode; }>'.
Property 'name' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes & Readonly<{}> & Readonly<{ children?: ReactNode; }>'.ts(2769)

  and also I am new to typescript 
  
  i made a global.d.ts file in src folder and declare there library

declare module "react-lineicons" {
export default class reactLineicons extends React.Component { }
}

does anyone know how to solve this problem

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.