Skip to content

Commit

Permalink
Merge pull request #329 from department-of-veterans-affairs/feature/2…
Browse files Browse the repository at this point in the history
…44-narin-import-icon-sprite-script

[Feature] Add script to extract SVGs from VADS sprite sheet
  • Loading branch information
narin authored May 28, 2024
2 parents e5dc229 + 23302f4 commit ca246e2
Show file tree
Hide file tree
Showing 265 changed files with 700 additions and 3 deletions.
28 changes: 28 additions & 0 deletions packages/assets/extract-svgs.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
/**
* Extracts icons from VADS icon sprite as single svgs
* Adapted from https://gist.github.com/mhmdnsr/18343cceb12858c8b148ef31d1e5a32b
*/

import * as fs from 'fs'
import { parse } from 'svg-parser'
import { toHtml } from 'hast-util-to-html'

fs.readFile(
'../../node_modules/@department-of-veterans-affairs/component-library/dist/img/sprite.svg',
'utf8',
function (err, contents) {
const parsed = parse(contents)
const symbols = parsed.children[0].children
let length = 0
symbols.forEach((symbol) => {
const name = symbol.properties.id
symbol.tagName = 'svg'
let newIcon = toHtml(symbol)
fs.writeFile(`icons/vads/${name}.svg`, newIcon, () => {
console.log(name)
length += 1
})
console.log(length, ' icons extracted')
})
},
)
1 change: 1 addition & 0 deletions packages/assets/icons/vads/accessibility_new.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/accessible_forward.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/account_balance.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/account_box.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/account_circle.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/add.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/add_circle.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/add_circle_outline.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/adjust.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/alarm.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/alternate_email.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/announcement.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/api.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/app_store.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/arrow_back.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/arrow_downward.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/arrow_drop_down.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/arrow_drop_up.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/arrow_forward.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/arrow_upward.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/assessment.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/assignment.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/assignment_turned_in.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/attach_file.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/attach_money.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions packages/assets/icons/vads/autorenew.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/backpack.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/bathtub.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/bedding.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/bookmark.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/bug_report.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/build.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/calendar_today.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/campaign.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/camping.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/cancel.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/chat.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/check.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/check_box_outline_blank.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/check_circle.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/check_circle_outline.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/checkroom.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/chevron_left.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/chevron_right.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/clean_hands.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/close.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/closed_caption.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/clothes.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/cloud.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/code.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/comment.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/connect_without_contact.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/construction.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/construction_worker.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/contact_page.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/content_copy.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/coronavirus.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/credit_card.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/deck.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/delete.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/description.svg
1 change: 1 addition & 0 deletions packages/assets/icons/vads/device_thermostat.svg
Loading

0 comments on commit ca246e2

Please sign in to comment.