inner SVG markup (16x16 viewBox, currentColor). * * @var array */ const GLYPHS = array( 'activity' => '', 'arrow-counterclockwise' => '', 'arrow-down-up' => '', 'arrow-left-right' => '', 'arrow-left' => '', 'arrow-repeat' => '', 'arrow-right' => '', 'book' => '', 'box-arrow-up-right' => '', 'chat-dots' => '', 'check-circle-fill' => '', 'check-circle' => '', 'check-lg' => '', 'check2-circle' => '', 'chevron-down' => '', 'clock-history' => '', 'cloud' => '', 'columns-gap' => '', 'dash-lg' => '', 'database' => '', 'diagram-3' => '', 'download' => '', 'exclamation-triangle-fill' => '', 'eye-slash' => '', 'eye' => '', 'fast-forward-fill' => '', 'file-earmark-code' => '', 'file-earmark-image' => '', 'filetype-js' => '', 'gear' => '', 'globe2' => '', 'graph-up' => '', 'hourglass-split' => '', 'house' => '', 'image' => '', 'info-circle-fill' => '', 'info-circle' => '', 'key-fill' => '', 'key' => '', 'lightbulb' => '', 'lightning-charge' => '', 'list-ol' => '', 'lock' => '', 'magic' => '', 'pencil-square' => '', 'play-fill' => '', 'plus-lg' => '', 'puzzle' => '', 'question-circle' => '', 'robot' => '', 'save' => '', 'scissors' => '', 'search' => '', 'send-fill' => '', 'share' => '', 'shield-check' => '', 'shield-lock' => '', 'speedometer2' => '', 'stars' => '', 'trash' => '', 'trash3' => '', 'x-lg' => '', 'x-octagon-fill' => '', ); /** * Build the SVG markup for an icon. * * Decorative by default (aria-hidden). Pass $label for an icon that * carries meaning on its own, such as an icon-only button; it then * renders with role="img" and the label. * * @since 1.22.0 * * @param string $name Glyph name, a key of self::GLYPHS. * @param string $class Extra class names, e.g. 'rs-icon--lg'. * @param string $label Accessible name; empty for a decorative icon. * @return string SVG markup, or '' for an unknown name. */ public static function svg( string $name, string $class = '', string $label = '' ): string { if ( ! isset( self::GLYPHS[ $name ] ) ) { if ( function_exists( '_doing_it_wrong' ) ) { _doing_it_wrong( __METHOD__, esc_html( 'Unknown icon: ' . $name ), '1.22.0' ); } return ''; } $classes = 'rs-icon' . ( '' !== $class ? ' ' . $class : '' ); $a11y = '' === $label ? ' aria-hidden="true"' : ' role="img" aria-label="' . esc_attr( $label ) . '"'; return ''; } /** * Echo an icon, escaped through wp_kses with the SVG elements allowed. * * @since 1.22.0 * * @param string $name Glyph name. * @param string $class Extra class names. * @param string $label Accessible name; empty for decorative. * @return void */ public static function render( string $name, string $class = '', string $label = '' ): void { echo wp_kses( self::svg( $name, $class, $label ), self::allowed_html() ); } /** * The wp_kses allow-list for the icon markup. * * @since 1.22.0 * @return array> */ public static function allowed_html(): array { return array( 'svg' => array( 'class' => true, 'aria-hidden' => true, 'aria-label' => true, 'role' => true, 'focusable' => true, 'viewbox' => true, 'fill' => true, 'xmlns' => true, ), 'path' => array( 'd' => true, 'fill' => true, 'fill-rule' => true, 'clip-rule' => true, ), 'circle' => array( 'cx' => true, 'cy' => true, 'r' => true, ), 'rect' => array( 'x' => true, 'y' => true, 'width' => true, 'height' => true, 'rx' => true, ), ); } /** * Icon markup for scripts that build their own elements: name => svg, * for the names given. Localized as `cachingOutIcons` on the admin * shell script, so a script writes `cachingOutIcons.search` where PHP * would call render( 'search' ). * * @since 1.22.0 * * @param string[] $names Glyph names. * @return array */ public static function for_script( array $names ): array { $out = array(); foreach ( $names as $name ) { $svg = self::svg( (string) $name ); if ( '' !== $svg ) { $out[ (string) $name ] = $svg; } } return $out; } /** * Every glyph name in the set. * * @since 1.22.0 * @return string[] */ public static function names(): array { return array_keys( self::GLYPHS ); } }