WPEX-3002

.descriptiveArray.txt

@@ -0,0 +1,134 @@
+[
+  "accessible" => "A person in a wheelchair",
+  "album" => "A vinyl record",
+  "alert" => "A bell, could be used for a warning, an alert or a sound",
+  "allinclusive" => "The infinite symbol",
+  "animation" => "A stack of three circles, progressing to the right",
+  "aperture" => "A camera aperture",
+  "audiotrack" => "A musical note",
+  "author" => "A person",
+  "brush" => "A paint brush",
+  "bubble" => "A conversation bubble",
+  "build" => "A wrench",
+  "cake" => "A cake with a candle on top",
+  "calendar" => "A calendar",
+  "camera" => "A camera",
+  "caret" => "A caret pointing up",
+  "checklist" => "A set of three horizontal lines with a checkmark on the left side",
+  "checkmark-circle" => "A circle with a checkmark",
+  "circle-add" => "A circle with the plus sign",
+  "circle-remove" => "A circle with the minus sign",
+  "city" => "A set of buildings",
+  "cloud" => "A cloud",
+  "color-palette" => "A paint palette",
+  "color-picker" => "An eye dropper",
+  "confirmationnumber" => "A voucher or a coupon",
+  "content" => "Three uneven horizontal lines of text",
+  "couch" => "A couch",
+  "credit-card" => "A credit card",
+  "data-usage" => "A pie chart",
+  "desktop-mac" => "A desktop computer or a desktop monitor",
+  "device-hub" => "A circle and two squares, joined by lines",
+  "devices" => "A laptop with a mobile phone",
+  "devicesalternate" => "Multiple devices (smartwatch, mobile phone and laptop)",
+  "dining" => "A knife and a spoon, crossing",
+  "drafts" => "An opened letter",
+  "emoticon" => "The smiley face emoji",
+  "event-item" => "A calendar showing a single day",
+  "events" => "A calendar showing multiple days",
+  "explore" => "A compass",
+  "extension" => "A puzzle piece",
+  "face" => "A human face",
+  "facebook" => "Facebook logo",
+  "faq" => "A circle with a question mark in it",
+  "feature" => "A marker with three lines, representing a featured text",
+  "film" => "A camera film roll",
+  "fingerprint" => "A human fingerprint",
+  "fire" => "A fire, a flame",
+  "fish" => "A fish",
+  "flare" => "A flare, could also represent the sun, a light or a flower",
+  "flower" => "A flower",
+  "font" => "A square with the letter A in it, could be used to represent the alphabet or typography",
+  "food-drink" => "A food bell",
+  "food-item" => "A tomato",
+  "form-checkbox" => "A circle with a checkmark inside",
+  "form-email" => "The arobace symbol, used to represent email addresses",
+  "form-hidden" => "An eye with a slash through it, indicating that something is hidden",
+  "form-textarea" => "Four horizontal lines representing a paragraph of text",
+  "form-website" => "A circle with a compass in it, representing a web browser",
+  "form" => "An envelope",
+  "gallery" => "A stack of cards representing a collection of images or a gallery",
+  "gesture" => "A doodle consisting of a single line with loops",
+  "gif" => "A square with the word GIF in it",
+  "github" => "GitHub icon",
+  "globe" => "The globe, planet Earth",
+  "gluten-free" => "Letters G and F in a circle, indicating that the food is gluten free",
+  "groupadd" => "Two user icons with a plus sign",
+  "groupwork" => "A full circle with three empty circles inside, could represent a team or a group",
+  "headset" => "A headset",
+  "heart" => "A heart",
+  "highlight" => "A pen with a line, representing highlighting or writing a text",
+  "https" => "A locked padlock, as used to secure a latch or as an icon for a secure internet connection",
+  "icon" => "Four arrows pointing in the middle, representing a d-pad, a video game",
+  "keyboard-voice" => "A microphone",
+  "keyboard" => "A computer keyboard",
+  "laptop-mac" => "A laptop device",
+  "layers" => "Two squares, one on top of the other, rotated 45 degrees",
+  "livetv" => "A TV icon with a play symbol inside",
+  "lockopen" => "An opened lock",
+  "logos" => "A circle inside a badge with a checkmark",
+  "map" => "A map with a marker pin",
+  "marker" => "A pin with a checkmark inside, indicating a verified location",
+  "menu" => "A book, could also represent a menu or a magazine",
+  "merge" => "Two arrows pointing up and merging into one",
+  "mountains" => "Two mountains",
+  "multimedia" => "A square representing a video with a square representing a photo",
+  "new" => "An alert badge with an exclamation mark",
+  "offlinebolt" => "A circle with a lightning bolt inside of it",
+  "open" => "A horizontal line with arrows on both ends, pointing up and down",
+  "opentable" => "OpenTable icon",
+  "page-duplicate" => "A rectangle with a corner folded over, representing a page, with a ghosted duplicate of the page behind it",
+  "page" => "A rectangle with a corner folded over, representing a page",
+  "paint-can" => "A paint can slightly tilted to the right, with a drop coming out of it",
+  "paint" => "A paint roller brush",
+  "poll" => "A square with three uneven lines inside, representing a bar graph or a poll",
+  "pricing-table-item" => "A card with a dollar sign on top",
+  "pricing-table" => "A stack of cards with a dollar sign on top",
+  "recordvoiceover" => "A character with two curved lines coming out of their mouth, indicating they are speaking",
+  "reply-all" => "Two arrows, used when replying to all recipients of an email",
+  "request" => "A piece of paper with a list of bullets on it",
+  "row" => "A square with a horizontal line in the middle, could represent a divider or a row",
+  "scatter-plot" => "Three dots representing a scatter plot",
+  "school" => "A graduation cap",
+  "security" => "A shield",
+  "send" => "A paper airplane icon to represent sending an email or message",
+  "settings" => "Three vertical sliders representend as dots and lines",
+  "shape-divider" => "A square with the shape of a wave inside",
+  "share" => "Three dots connected by a line, usually used to indicate sharing",
+  "shipping" => "A delivery truck, could represent shipping, commerce, or transport",
+  "signal" => "Two circles with a dot at the center, representing a signal",
+  "snowflake" => "A snowflake",
+  "social-profiles" => "Two users outlined in a circle",
+  "spa" => "A lotus flower, symbol of purity and health",
+  "spicy" => "A flame, representing a fire or something spicy",
+  "star" => "A star",
+  "style" => "A stack of color swatches",
+  "sync" => "A circle consisting of two arrows, clockwise",
+  "tablet-mac" => "A tablet device",
+  "testimonial" => "A user outlined by a circle with a quote bubble next to them",
+  "timer" => "A stop watch",
+  "trackchanges" => "A radar with 3 circles",
+  "translate" => "A chinese sign with the letter A, representing translation",
+  "trash-confirm" => "A trash can slighlty tilted with garbage",
+  "trash" => "A trash can",
+  "twitter" => "Twitter icon",
+  "update" => "A clock symbol where the outline is a circle with an arrow pointing clockwise",
+  "vegan" => "The letter V with a leaf at the end representing a vegan diet",
+  "vegetarian" => "A carrot",
+  "verifieduser" => "A shield with a checkmark inside indicating that a website is verified and secure",
+  "video" => "A cinema clap board",
+  "vintage-filter" => "A flower representing the vintage filter",
+  "volume" => "A speaker icon with 2 curved lines representing sound waves",
+  "watch" => "A watch with no arrows",
+  "waves" => "A set of 4 horizontal wavy lines",
+]

build.js

@@ -21,6 +21,7 @@ const init = async () => {
 
 	createIndex( manifests );
 	createIconsMD( manifests );
+	createAssociativeArray( manifests );
 };
 
 /**
@@ -154,6 +155,35 @@ createIconsMD = async ( files ) => {
 	await fs.writeFile( `${ __dirname }/icons.md`, content );
 };
 
+/**
+ * Create the Icons associative array
+ *
+ * @param {array} files - An array of all the files
+ */
+createAssociativeArray = async ( files ) => {
+	console.log( `Creating icons associative array` );
+
+	let content = `[\r\n`;
+
+	for( const file of files ) {
+		let data = await fs.readFile( manifestDirectory + file, 'utf-8' );
+		data = JSON.parse( data );
+		const filename = file.replace( '.json', '' );
+
+		data.styles.forEach( ( style ) => {
+			if( !data.description ) return;
+			content = style === 'default'
+				? content +
+				`  "${ filename }" => "${ data.description }",\r\n`
+				: content;
+		} );
+	};
+
+	content = content + `]`;
+
+	await fs.writeFile( `${ __dirname }/.descriptiveArray.txt`, content );
+};
+
 /**
  * Replace primitives in SVG to match React imports
  *

src/manifest/accessible.json

@@ -1,6 +1,8 @@
 {
 	"label": "Accessible",
 
+	"description": "A person in a wheelchair",
+
 	"keywords": [
 		"handicapped",
 		"health care",

src/manifest/album.json

@@ -1,6 +1,8 @@
 {
 	"label": "Album",
 
+	"description": "A vinyl record",
+
 	"keywords": [
 		"audio",
 		"bullseye",

src/manifest/alert.json

@@ -1,6 +1,8 @@
 {
 	"label": "Alert",
 
+	"description": "A bell, could be used for a warning, an alert or a sound",
+
 	"keywords": [
 		"bell",
 		"danger",

src/manifest/allinclusive.json

@@ -1,6 +1,8 @@
 {
 	"label": "Infinity",
 
+	"description": "The infinite symbol",
+
 	"keywords": [
 		"cycle",
 		"eternal",

src/manifest/animation.json

@@ -1,6 +1,8 @@
 {
 	"label": "Animation",
 
+	"description": "A stack of three circles, progressing to the right",
+
 	"keywords": [
 		"balls",
 		"loading",

src/manifest/aperture.json

@@ -1,6 +1,8 @@
 {
 	"label": "Aperture",
 
+	"description": "A camera aperture",
+
 	"keywords": [
 		"camera",
 		"creative",

src/manifest/audiotrack.json

@@ -1,6 +1,8 @@
 {
 	"label": "Audiotrack",
 
+	"description": "A musical note",
+
 	"keywords": [
 		"media",
 		"music",

src/manifest/author.json

@@ -1,6 +1,8 @@
 {
 	"label": "Author",
 
+	"description": "A person",
+
 	"keywords": [
 		"head",
 		"human",

src/manifest/brush.json

@@ -1,6 +1,8 @@
 {
 	"label": "Brush",
 
+	"description": "A paint brush",
+
 	"keywords": [
 		"artist",
 		"colors",

src/manifest/bubble.json

@@ -1,6 +1,8 @@
 {
 	"label": "Bubble",
 
+	"description": "A conversation bubble",
+
 	"keywords": [
 		"conversation",
 		"head",

src/manifest/build.json

@@ -1,6 +1,8 @@
 {
 	"label": "Tools",
 
+	"description": "A wrench",
+
 	"keywords": [
 		"build",
 		"construction",

src/manifest/cake.json

@@ -1,6 +1,8 @@
 {
 	"label": "Cake",
 
+	"description": "A cake with a candle on top",
+
 	"keywords": [
 		"baking",
 		"birthday",

src/manifest/calendar.json

@@ -1,6 +1,8 @@
 {
 	"label": "Calendar",
 
+	"description": "A calendar",
+
 	"keywords": [
 		"date",
 		"day",

src/manifest/camera.json

@@ -1,6 +1,8 @@
 {
 	"label": "Camera",
 
+	"description": "A camera",
+
 	"keywords": [
 		"aperture",
 		"creative",

src/manifest/caret.json

@@ -1,6 +1,8 @@
 {
 	"label": "Caret",
 
+	"description": "A caret pointing up",
+
 	"keywords": [
 		"arrow",
 		"direction",

src/manifest/checklist.json

@@ -1,6 +1,8 @@
 {
 	"label": "Checklist",
 
+	"description": "A set of three horizontal lines with a checkmark on the left side",
+
 	"keywords": [
 		"check",
 		"done",

src/manifest/checkmark-circle.json

@@ -1,6 +1,8 @@
 {
 	"label": "Checkmark circle",
 
+	"description": "A circle with a checkmark",
+
 	"keywords": [
 		"check",
 		"confirm",

src/manifest/circle-add.json

@@ -1,6 +1,8 @@
 {
 	"label": "Add Circle",
 
+	"description": "A circle with the plus sign",
+
 	"keywords": [
 		"add",
 		"circle",

src/manifest/circle-remove.json

@@ -1,6 +1,8 @@
 {
 	"label": "Substract Circle",
 
+	"description": "A circle with the minus sign",
+
 	"keywords": [
 		"remove",
 		"circle",

src/manifest/city.json

@@ -1,6 +1,8 @@
 {
 	"label": "City",
 
+	"description": "A set of buildings",
+
 	"keywords": [
 		"building",
 		"business",

src/manifest/cloud.json

@@ -1,6 +1,8 @@
 {
 	"label": "Cloud",
 
+	"description": "A cloud",
+
 	"keywords": [
 		"forecast",
 		"internet",

src/manifest/color-palette.json

@@ -1,6 +1,8 @@
 {
 	"label": "Color Palette",
 
+	"description": "A paint palette",
+
 	"keywords": [
 		"artist",
 		"creative",

src/manifest/color-picker.json

@@ -1,6 +1,8 @@
 {
 	"label": "Color Picker",
 
+	"description": "An eye dropper",
+
 	"keywords": [
 		"artist",
 		"creative",

src/manifest/confirmationnumber.json

@@ -1,6 +1,8 @@
 {
 	"label": "Ticket",
 
+	"description": "A voucher or a coupon",
+
 	"keywords": [
 		"admission",
 		"coupon",