bartaxyz / xyz-icon-set Goto Github PK

API is described in #14.

• Download
• Upload
• Translate
• Share
• Share with an arrow
• Signal
• WiFi
• RSS
• Reply
• Quote
• Fullscreen
• History
• Kebab menu
  • Vertical
  • Horizontal
• Link (chain)
• Repeat
• Layout
  • Grid
  • Column
  • Row
• Color picker
• Thumbs Up
• Thumbs Down

• XY Axis
• XYZ Axis
• Subscript
• Superscript
• Function
  • Linear
  • Exponential
  • Logarithmic
  • Sinus
  • Cosinus
  • Tagnens
  • Parabola
  • Hyberbola
• Pi
• Tau
• Square Root
• Calculator
• Ruler
• Golden Ratio
• Sum
• Infinity
• Plus
• Minus

• Pie Chart
• Bar Chart
• Line Chart
  • Smooth
  • Sharp
• Venn Diagram
• Flow Chart

• Cloud
  • Plain
  • With storm
  • With rain
  • With snowflake
• Storm
• Sun
• Snowflake
• Moon

This package will be used even by packages scoped inside of this one. Therefore it should have nice and expandable API. This issue will cover how will it look.

import XYZIconSet from 'xyz-icon-set';

/*
 *  [ iconName: string ]: Icon
 *  returns all icon names in dash-case format
 */

const paperPlane = XYZIconSet.PaperPlane;
paperPlane.name === 'paper-plane';
paperPlane.source === '<svg wid...';

Import just specific icon

import { PaperPlane } from 'xyz-icon-set';

/*
 *  Icon object
 *  {
 *    name: string,
 *    source: string,
 *  }
 */

PaperPlane.name === 'paper-plane';
PaperPlane.source === '<svg width="24" height="24"><path style="fill:#000" ...';

• Star
• Octagon
• Hexagon
• Heart
• Diamond

• Headphones
• Single Note
• Double Note
• Violin Key
• Speaker
• Volume Indicator
  • Level 2
  • Level 1
  • Level 0
  • Muted
• Floppy Disc
• Camera
• Videocamera
• Microphone
• Megaphone
• Radio
• Speaker

Implement the basic API design specification that is described inside #21.

• Branch
• Commit
• Merge
• Pull request / Merge request
• Compare
• Fork

• Tree Architecture
• Web
• Harddrive
• Router

I miss food icons like pizza, burger, beef, etc.

• Pizza
• Burger
• Beef (steak icon?)
• Fork & knife
• Bottle
• Coffee Cup
• Chicken
• Soup (bowl)
• Spaghetti

Developer with Vue must be able to use the Vue icon components as follows

import { PaperPlane } from '@xyz-icon-set/vue';

export default {
  components: {
    PaperPlaneIcon: PaperPlane,
  }
}

and in template

<template>
  <paper-plane-icon />
</template>

Icon natively uses currentColor as fill. Can be specified manually.

<template>
  <paper-plane-icon color="#F06262" />
</template>

• Tree
• Mountains
• Rainbow

• Planet
• Earth
• Planet with ring
• Spaceship
  • Apollo
  • Falcon Heavy
• ISS
• Galaxy

• Flame (trending)
• Filter
• Flag
  
• Tag
• Flashlight
• Battery
• Crown
• Hand Watches
• Stopwatch
• TV
• Wallet
• Barcode
• Eye
• Ship
• Anchor
• Book
  • Open
  • Closed
• Car (from front)
• Taxi (car icon with taxi sign on top)
• Train (from front)
• Stick figure
  • Standing
  • Walking
  • Waving
• Gift
• Toolbox
  
• Bank
  
• Shop
  
• NFC
  

• Pin
• Pencil
• Magnifying Glass
  • Normal
  • Plus
  • Minus
• Table
• Chair
• Calendar
• Archive Box
• Printer
• Trash Bin
  • Empty
  • Full
• Notepad
  
• Envelope
  

• Chat bubble
  • Square Chat Bubble
  • Circle Chat Bubble
• Send
• Emoji
• Reply
• Hashtag
• Mention (@)