Merge pull request #43 from Pixelrobin/accessible-icons

Accessible icons

Author: Nate Wiebe

src/Icon.php

@@ -10,22 +10,48 @@ class Icon
 
     private $content;
 
-    public function __construct(string $name, array $attributes, string $content)
+    private $altText;
+
+    public function __construct(string $name, string $content, array $attributes = [], ?string $altText = null)
     {
         $this->name       = $name;
-        $this->attributes = $attributes;
         $this->content    = $content;
+        $this->attributes = $attributes;
+        $this->altText    = $altText;
     }
 
     public function getName(): string
     {
         return $this->name;
     }
 
+    public function setAltText(?string $altText): self
+    {
+        $this->altText = $altText;
+
+        return $this;
+    }
+
+    public function getAltText(): ?string
+    {
+        return $this->altText;
+    }
+
     public function render(): string
     {
+        $altText    = '';
         $attributes = $this->filterAttributes($this->attributes);
 
+        if (!empty($this->altText)) {
+            $uniqId = \uniqid(\sprintf('feather-%s-title-', $this->getName()));
+
+            $attributes['role']            = $attributes['role'] ?? 'img';
+            $attributes['aria-labelledby'] = $uniqId;
+            $altText                       = \sprintf('<title id="%s">%s</title>', $this->escapeString($uniqId), $this->escapeString((string)$this->getAltText()));
+        } else {
+            $attributes['aria-hidden'] = true;
+        }
+
         $svgAttributes = \array_reduce(
             \array_keys($attributes),
             function ($final, $current) use ($attributes): string {
@@ -35,14 +61,14 @@ function ($final, $current) use ($attributes): string {
                     $attributeValue = $attributeValue ? 'true' : 'false';
                 }
 
-                $attributeValue = \htmlspecialchars((string)$attributeValue, ENT_QUOTES | ENT_SUBSTITUTE, 'UTF-8', false);
+                $attributeValue = $this->escapeString((string)$attributeValue);
 
                 return \sprintf('%s %s="%s"', $final, $current, $attributeValue);
             },
             ''
         );
 
-        return '<svg ' . $svgAttributes . '>' . $this->content . '</svg>';
+        return '<svg ' . $svgAttributes . '>' . $altText . $this->content . '</svg>';
     }
 
     private function filterAttributes(array $attributes): array
@@ -63,6 +89,11 @@ function ($item): bool {
         );
     }
 
+    private function escapeString(string $string): string
+    {
+        return \htmlspecialchars($string, \ENT_QUOTES | \ENT_SUBSTITUTE, 'UTF-8', false);
+    }
+
     public function __toString(): string
     {
         return $this->render();

src/IconManager.php

@@ -21,12 +21,12 @@ public function getIconNames(): array
         return \array_keys($this->icons);
     }
 
-    public function getIcon(string $name, array $attributes = []): Icon
+    public function getIcon(string $name, array $attributes = [], ?string $altText = null): Icon
     {
         if (!isset($this->icons[$name])) {
             throw new IconNotFoundException(\sprintf('Icon `%s` not found', $name));
         }
 
-        return new Icon($name, \array_merge($this->attributes, $attributes), $this->icons[$name]);
+        return new Icon($name, $this->icons[$name], \array_merge($this->attributes, $attributes), $altText);
     }
 }