Commit 9799dba7 authored by Hideki Yamane's avatar Hideki Yamane 🐈

Merge tag 'v8.1.0' into debian/sid

parents 33ff7f05 cad47f96
The contents of */octicons* */svg* are generated by an automated process. Changes to these files may be accepted, but may also be overwritten. # Adding or Updating icons
Octicons is GitHub's icon font. At this time, new icons will only be added when they are needed for GitHub products. If you plan to update an icon and/or add a new icon follow these steps. These steps will be the same for core primer members and contributors.
Complete steps 1 - 3 and notify us of your changes, either with a pull request or an issue describing your changes. Screenshots welcome! 🎉
## Step 1, Duplicate:
The first step is to make a copy of the [master Octicons file][master-octicons] to your drafts folder. You can do this from the dropdown menu, select "Duplicate to your drafts".
[<img src="https://user-images.githubusercontent.com/54012/37802948-c10dca06-2de9-11e8-98c3-dd45cd561865.gif" width="400"/>](https://user-images.githubusercontent.com/54012/37802948-c10dca06-2de9-11e8-98c3-dd45cd561865.gif)
## Step 2, Edit:
In your duplicate file, make proposed changes. In the example, we’ll make the GitHub logo red. It will also simplify things if you give your file a unique name e.g. _Octicons (Jon’s Changes)_.
[<img src="https://user-images.githubusercontent.com/54012/37803022-14d1a0fe-2dea-11e8-862d-b7ef22c918cf.gif" width="400"/>](https://user-images.githubusercontent.com/54012/37803022-14d1a0fe-2dea-11e8-862d-b7ef22c918cf.gif)
## Step 3, Share:
Make sure your duplicate file can be viewed by others. In the share menu "Anyone with link" should be set to "can view". Copy the link.
[<img src="https://user-images.githubusercontent.com/54012/37803059-3ca54432-2dea-11e8-8c27-36c83a2dc5cb.gif" width="400"/>](https://user-images.githubusercontent.com/54012/37803059-3ca54432-2dea-11e8-8c27-36c83a2dc5cb.gif)
## Step 4, Pull Request: _(Optional)_
You can submit a pull request updating the `figma.url` configuration in the root [package.json](https://github.com/primer/octicons/blob/master/package.json#L10) with your figma file. Doing so will generate alpha releases of [all the libraries that distribute Octicons](https://github.com/primer/octicons#libraries).
Once the build passes on your pull request, you should see statuses with all the alpha versions of the libraries. You can then use these to test your changes.
[Here is an example pull request](https://github.com/primer/octicons/pull/206)
[<img src="https://user-images.githubusercontent.com/54012/37811102-45ec2abc-2e15-11e8-8c1d-2d162ddcdad2.png" width="700"/>](https://user-images.githubusercontent.com/54012/37811102-45ec2abc-2e15-11e8-8c1d-2d162ddcdad2.png)
---
# Maintainers accepting changes
Once submitted changes have been agreed upon, these instructions will guide core primer team members in merging in those changes.
## Step 1, Save:
Save the contributor’s figma file as a `.fig` file.
[<img src="https://user-images.githubusercontent.com/54012/37809888-940f5d38-2e0e-11e8-957f-99c162a1d4ff.gif" width="400"/>](https://user-images.githubusercontent.com/54012/37809888-940f5d38-2e0e-11e8-957f-99c162a1d4ff.gif)
## Step 2, Import:
Drag and drop, or add the file to the main team project. Make sure its name is different from the master Octicons file.
[<img src="https://user-images.githubusercontent.com/54012/37809879-8d9824ee-2e0e-11e8-9b1d-e83316192eb0.gif" width="400"/>](https://user-images.githubusercontent.com/54012/37809879-8d9824ee-2e0e-11e8-9b1d-e83316192eb0.gif)
## Step 3, Publish:
From the new imported file, publish the updated or new components to the team library. This published component makes importing into the master document easier.
[<img src="https://user-images.githubusercontent.com/54012/37807772-6734f926-2e04-11e8-98a0-9b4c73411bd3.gif" width="400"/>](https://user-images.githubusercontent.com/54012/37807772-6734f926-2e04-11e8-98a0-9b4c73411bd3.gif)
## Step 4, Add:
In the Team Library you will see the new Octicons file, and all the components from that file. Add the new components to the master Octicons file. It makes changing easier if you drag it on top of the icon you are changing.
[<img src="https://user-images.githubusercontent.com/54012/37807775-6b1dea52-2e04-11e8-804a-a41c6bc04fd2.gif" width="400"/>](https://user-images.githubusercontent.com/54012/37807775-6b1dea52-2e04-11e8-804a-a41c6bc04fd2.gif)
## Step 5, Replace:
Right click on the new component instance and select "Detach Instance". Then toggle both the old and new components open. Move the shape from the new component into the old component. Delete the old component’s shape. Delete the empty new component container.
[<img src="https://user-images.githubusercontent.com/54012/37807780-6ddba626-2e04-11e8-9a6b-749ac5b800fe.gif" width="400"/>](https://user-images.githubusercontent.com/54012/37807780-6ddba626-2e04-11e8-9a6b-749ac5b800fe.gif)
## Step 6, Publishing:
Publish the component changes to your team library. You can now delete the imported `.fig` file from the contributor.
[<img src="https://user-images.githubusercontent.com/54012/37812350-cc2349ba-2e1c-11e8-8b80-d9ff2f8d4ea3.png" width="600"/>](https://user-images.githubusercontent.com/54012/37812350-cc2349ba-2e1c-11e8-8b80-d9ff2f8d4ea3.png)
Create a release branch, and run `npm run bump`. This will guide you through a prompt asking what all the new versions of the packages should be. After, push up your branch and open a pull request into master.
[master-octicons]: https://www.figma.com/file/FP7lqd1V00LUaT5zvdklkkZr/Octicons
node_modules *.gem
.DS_Store *.lock
build
*.log *.log
.DS_Store
.bundle
.env
node_modules
package-lock.json
vendor
# Ignore build/export artifacts
lib/**/build/
.github
.travis.yml
Gruntfile.js
lib
test
inherit_gem:
rubocop-github:
- config/default.yml
- config/rails.yml
multipass: true
plugins:
- removeTitle: true
- removeViewBox: false
- removeStyleElement: true
- removeAttrs:
attrs:
- xmlns:xlink
- id
- class
- data-name
- fill
- transform
- href
- clip-path
- clip-rule
- removeEmptyContainers: true
- sortAttrs: true
- removeUselessDefs: true
- removeEmptyText: true
- removeEditorsNSData: true
- removeEmptyAttrs: true
- removeHiddenElems: true
- collapseGroups: true
language: node_js language: node_js
node_js: node_js:
- '5' - 8
script:
- npm test
after_success:
# Setup rubygems creds
- curl -u "$RUBYGEMS_USER:$RUBYGEMS_PW" https://rubygems.org/api/v1/api_key.yaml > ~/.gem/credentials
- chmod 0600 ~/.gem/credentials
# this will short-circuit the publish step if it fails to interpolate $NPM_API_KEY
- npm config set "//registry.npmjs.org/:_authToken=\${NPM_API_KEY}"
deploy:
# publish release candidates from any branch beginning with "release"
- on:
condition: $TRAVIS_BRANCH =~ ^release
all_branches: true
tags: false
provider: script
script:
- script/release-candidate
skip_cleanup: true
# publish "final" releases on master
- on:
branch: master
tags: false
provider: script
script: script/release
skip_cleanup: true
notifications:
slack: 'github:4OisIoqZYyMlWcw3hFtZgbmh'
### HEAD # 7.3.0
* Fix for heart icon https://github.com/primer/octicons/pull/211
* Adding an archive icon created by @colinkeany
Fixes https://github.com/primer/octicons/issues/182
* Fixed versioning strategy https://github.com/primer/octicons/pull/#208
# Archived releases
### Octicons_node 7.0.0
- Removing `file-text` and `mail-reply` icons. Use `file` and `reply` respectively.
- Removing spritesheet calls and `toSVGUse` method.
### Octicons_gem 5.0.4
- Removing `file-text` and `mail-reply` icons. Use `file` and `reply` respectively.
- Removing spritesheet calls and `to_svg_use` method.
### 6.0.1
Fixes:
- Typo `kebab-veritcal` becomes `kebab-vertical`
### 6.0.0
Added:
- `kebab-horizontal` and `kebab-vertical` icons
- Polyfill for the `Object.assign` function
Removes:
- Removing a duplicate `ellipses` icon from the set. Use `ellipsis` instead.
### 5.0.1 ### 5.0.1
......
var fs = require("fs")
var path = require("path")
module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
cssnano: {
options: {},
dist: {
files: {
'build/octicons.min.css': 'build/octicons.css'
}
}
},
svgmin: {
dist: {
options: {
plugins: [
{removeTitle: true},
{removeStyleElement: true},
{removeAttrs: { attrs: ['id', 'class', 'data-name', 'fill'] }},
{removeEmptyContainers: true},
{sortAttrs: true},
{removeUselessDefs: true},
{removeEmptyText: true},
{removeEditorsNSData: true},
{removeEmptyAttrs: true},
{removeHiddenElems: true}
]
},
files: [{
expand: true,
cwd: 'lib/svg',
src: ['*.svg'],
dest: 'build/svg'
}]
}
},
svgstore: {
options: {
includeTitleElement: false,
inheritviewbox: true,
includedemo: function(arg) {
var octicons = require("./index.js")
var icons = function() {
var result = []
Object.keys(octicons).forEach(function(key){
result.push("<div style=\"width: 10%;min-width: 100px;flex: 0 0 auto;box-sizing:border-box;padding:1em;text-align:center;\">" + octicons[key].toSVGUse({ height: 32 }) + "<div>" + key + "</div></div>")
})
return result.join("\n")
}
return `
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Octicons Spritesheet test</title>
<link rel="stylesheet" href="./octicons.css" media="screen" title="no title">
<style>
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
color: #222;
font-size: 15px;
}
</style>
</head>
<body>
${arg.svg}
<div style="font-size: 2.2em;padding-left: 20px;">Octicons SVG Spritesheet demo</div>
<div style="font-size: 1.2em;margin: 1em 0;padding-left: 20px;">All the icons rendered below use the svg spriteheet located in the <code>/build/</code> directory.</div>
<div style="flex: 0 1 auto;display:flex;flex-wrap: wrap; flex-direction: row;">
${icons()}
</div>
</body>
</html>
`
}
},
default: {
files: {
"build/sprite.octicons.svg": ['build/svg/*.svg']
}
},
},
clean: {
build: [
'build/*'
]
},
copy: {
css: {
src: "lib/octicons.css",
dest: "build/octicons.css"
}
}
});
grunt.loadNpmTasks('grunt-contrib-clean');
grunt.loadNpmTasks('grunt-contrib-copy');
grunt.loadNpmTasks('grunt-svgstore');
grunt.loadNpmTasks('grunt-svgmin');
grunt.loadNpmTasks('grunt-cssnano');
// build tasks
grunt.registerTask('css', ['copy', 'cssnano']);
grunt.registerTask('svg', ['clean', 'svgmin']);
// default task, build /dist/
grunt.registerTask('default', [ 'svg', 'css', 'json:svg', 'svgstore']);
grunt.registerTask('json:svg', 'add svg string to data.json build', function() {
var files = fs.readdirSync("./build/svg/")
var data = JSON.parse(fs.readFileSync("./lib/data.json"))
files.forEach(function(file) {
var svg = fs.readFileSync(path.resolve("./build/svg", file))
var key = path.basename(file, ".svg")
if (data[key]) {
var raw = svg.toString()
data[key].path = /<path.+\/>/g.exec(raw)[0]
data[key].height = /height="(\d+)"/g.exec(raw)[1]
data[key].width = /width="(\d+)"/g.exec(raw)[1]
}
})
fs.writeFileSync("build/data.json", JSON.stringify(data));
})
};
MIT License MIT License
Copyright (c) 2012-2016 GitHub, Inc. Copyright (c) 2018 GitHub Inc.
Permission is hereby granted, free of charge, to any person obtaining a copy Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal of this software and associated documentation files (the "Software"), to deal
......
This diff is collapsed.
{
"lerna": "2.9.0",
"packages": [
"lib/octicons_node",
"lib/octicons_gem",
"lib/octicons_helper",
"lib/octicons_jekyll",
"lib/octicons_react"
],
"version": "8.1.0"
}
This diff is collapsed.
source "https://rubygems.org"
gemspec
group :development, :test do
gem "minitest"
gem "rake"
gem "rubocop", "0.50"
gem "rubocop-github", "0.5.0"
end
MIT License
Copyright (c) 2018 GitHub Inc.
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
# Octicons gem
[![Gem version](https://img.shields.io/gem/v/octicons.svg)](https://rubygems.org/gems/octicons)
[![Build Status](https://travis-ci.org/primer/octicons.svg?branch=master)](https://travis-ci.org/primer/octicons)
> Octicons gem to distribute octicons svg
## Install
Add this to your `Gemfile`
```rb
gem 'octicons'
```
Then `bundle install`.
## Usage
```rb
require 'octicons'
icon = Octicons::Octicon.new("x")
icon.to_svg
# <svg class="octicon octicon-x" viewBox="0 0 16 16" width="16" height="16" version="1.1" "aria-hidden"="true"><path d="M7.48 8l3.75 3.75-1.48 1.48L6 9.48l-3.75 3.75-1.48-1.48L4.52 8 .77 4.25l1.48-1.48L6 6.52l3.75-3.75 1.48 1.48z"></path></svg>
```
## Documentation
The `Octicon` class takes two arguments. The first is the symbol of the icon, and the second is a hash of arguments representing html attributes
#### `symbol` _(required)_
This is the name of the octicon you want to use. For example `alert`. [Full list of icons][octicons-docs]
#### Options
* `:height` - When setting the height to a number, the icon will scale to that size. For example, passing `32`, will calculate the width based on the icon's natural size.
* `:width` - When setting the width to a number, the icon will scale to that size. For example, passing `32`, will calculate the width based on the icon's natural size.
If both `:width, :height` are passed into the options hash, then the icon will be sized exactly at those dimensions.
#### Attributes
Once initialized, you can read a few properties from the icon.
##### `symbol`
Returns the string of the symbol name
```rb
icon = Octicons::Octicon.new("x")
icon.symbol
# "x"
```
##### `path`
Path returns the string representation of the path of the icon.
```rb
icon = Octicons::Octicon.new("x")
icon.path
# <path d="M7.48 8l3.75 3.75-1.48 1.48L6 9.48l-3.75 3.75-1.48-1.48L4.52 8 .77 4.25l1.48-1.48L6 6.52l3.75-3.75 1.48 1.48z"></path>
```
##### `options`
This is a hash of all the `options` that will be added to the output tag.
```rb
icon = Octicons::Octicon.new("x")
icon.options
# {:class=>"octicon octicon-x", :viewBox=>"0 0 12 16", :version=>"1.1", :width=>12, :height=>16, :"aria-hidden"=>"true"}
```
##### `width`
Width is the icon's true width. Based on the svg view box width. _Note, this doesn't change if you scale it up with size options, it only is the natural width of the icon_
##### `height`
Height is the icon's true height. Based on the svg view box height. _Note, this doesn't change if you scale it up with size options, it only is the natural height of the icon_
##### `keywords`
Returns an array of keywords for the icon. The data comes from the [data file in lib](../data.json). Consider contributing more aliases for the icons.
```rb
icon = Octicons::Octicon.new("x")
icon.keywords
# ["remove", "close", "delete"]
```
#### Methods
##### `to_svg`
Returns a string of the svg tag
```rb
icon = Octicons::Octicon.new("x")
icon.to_svg
# <svg class="octicon octicon-x" viewBox="0 0 16 16" width="16" height="16" version="1.1" "aria-hidden"="true"><path d="M7.48 8l3.75 3.75-1.48 1.48L6 9.48l-3.75 3.75-1.48-1.48L4.52 8 .77 4.25l1.48-1.48L6 6.52l3.75-3.75 1.48 1.48z"></path></svg>
```
## Documentation
For a full list of options available, see the [octicons_gem documentation](../octicons_gem/#documentation)
## License
(c) GitHub, Inc.
When using the GitHub logos, be sure to follow the [GitHub logo guidelines](https://github.com/logos).
[MIT](./LICENSE)
[octicons]: https://github.com/primer/octicons
[octicons-docs]: https://octicons.github.com/
require "rake/testtask"
Rake::TestTask.new do |t|
t.libs = ["lib", "test"]
t.test_files = FileList["test/*_test.rb"]
end
desc "Run tests"
task default: :test
require "octicons/version"
require "octicons/octicon"
require "json"
module Octicons
file_data = File.read(File.join(File.dirname(__FILE__), "./build/data.json"))
OCTICON_SYMBOLS = JSON.parse(file_data).freeze
end
module Octicons
class Octicon
attr_reader :path, :options, :width, :height, :symbol, :keywords
def initialize(symbol, options = {})
@symbol = symbol.to_s
if octicon = Octicons::OCTICON_SYMBOLS[@symbol]
@path = octicon["path"]
@width = octicon["width"].to_i
@height = octicon["height"].to_i
@keywords = octicon["keywords"]
@options = options
@options.merge!({
class: classes,
viewBox: viewbox,
version: "1.1"
})
@options.merge!(size)
@options.merge!(a11y)
else
raise "Couldn't find octicon symbol for #{@symbol.inspect}"
end
end
# Returns an string representing a <svg> tag
def to_svg
"<svg #{html_attributes}>#{@path}</svg>"
end
private
def html_attributes
attrs = ""
@options.each { |attr, value| attrs += "#{attr}=\"#{value}\" " }
attrs.strip
end
# add some accessibility features to svg
def a11y
accessible = {}
if @options[:'aria-label'].nil?
accessible[:'aria-hidden'] = "true"
else
accessible[:role] = "img"
end
accessible
end
# prepare the octicon class
def classes
"octicon octicon-#{@symbol} #{@options[:class]} ".strip
end
def viewbox
"0 0 #{@width} #{@height}"
end
# determine the height and width of the octicon based on :size option
def size
size = {
width: @width,
height: @height
}
# Specific size
unless @options[:width].nil? && @options[:height].nil?
size[:width] = @options[:width].nil? ? calculate_width(@options[:height]) : @options[:width]
size[:height] = @options[:height].nil? ? calculate_height(@options[:width]) : @options[:height]
end
size
end
def calculate_width(height)
(height.to_i * @width) / @height
end
def calculate_height