Let <x-icon> pick the optical size 20 cut
M3's optical size axis redraws a symbol so its strokes look equally heavy at every size; drawing the 24 cut at 20px thins them by about a sixth (styles.md § Icons). `optical` picks the cut — 24 by default, 20 for an icon drawn at 20px or smaller — and combines with `filled`; anything else falls back to 24, so no caller can land on a folder that does not exist. SvgFile::symbol() takes the size as a fourth argument and resolves the `-20` folders; the catalogue is the same in both cuts, so symbolNames() and DesignGuard's icon-name check are unchanged. The callers that size their own icons pass it in a later step. Plan step 10; finding C16. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
This commit is contained in:
co-authored by
Claude Fable 5.1
parent
c22d693334
commit
699827d696
+14
-4
@@ -10,7 +10,7 @@ use InvalidArgumentException;
|
||||
* Inline SVGs from the package's own folders: Material Symbols and M3 Expressive shapes.
|
||||
*
|
||||
* Not blade-icons: its view-factory hook registers one Blade component per icon on every
|
||||
* request, which for the ~8,000 symbol files here would be ~8,000 registrations each time.
|
||||
* request, which for the ~16,500 symbol files here would be ~16,500 registrations each time.
|
||||
* A file is read the first time it is drawn and kept for the life of the worker; the
|
||||
* contents never change while the application runs, so nothing request-specific is held.
|
||||
*/
|
||||
@@ -19,13 +19,22 @@ class SvgFile
|
||||
/** @var array<string, string> */
|
||||
protected static array $contents = [];
|
||||
|
||||
public static function symbol(string $name, bool $filled, ComponentAttributeBag $attributes): HtmlString
|
||||
/**
|
||||
* One symbol, from the cut drawn for the optical size it will be seen at.
|
||||
*
|
||||
* The package ships Google's 24 and 20 cuts; the 20 one lives in a `-20` folder under the
|
||||
* same names, so a symbol that exists exists in both. Any optical size but 20 draws the
|
||||
* standard 24 cut, which is also what a caller who says nothing gets.
|
||||
*/
|
||||
public static function symbol(string $name, bool $filled, ComponentAttributeBag $attributes, int $optical = 24): HtmlString
|
||||
{
|
||||
if (preg_match('/^[a-z0-9_]+$/', $name) !== 1) {
|
||||
throw new InvalidArgumentException("[{$name}] is not a Material Symbol name. Symbols are named in lowercase with underscores, as on fonts.google.com/icons: `calendar_month`, `arrow_back`.");
|
||||
}
|
||||
|
||||
$path = static::directory('svg/symbols/'.($filled ? 'filled' : 'outlined'))."/{$name}.svg";
|
||||
$folder = ($filled ? 'filled' : 'outlined').($optical === 20 ? '-20' : '');
|
||||
|
||||
$path = static::directory('svg/symbols/'.$folder)."/{$name}.svg";
|
||||
|
||||
if (! is_file($path)) {
|
||||
throw new InvalidArgumentException("There is no Material Symbol named [{$name}].");
|
||||
@@ -54,7 +63,8 @@ class SvgFile
|
||||
}
|
||||
|
||||
/**
|
||||
* The names of every Material Symbol the package ships.
|
||||
* The names of every Material Symbol the package ships, in either cut: Google draws the
|
||||
* same catalogue at optical size 24 and at 20, so one folder answers for all four.
|
||||
*
|
||||
* @return list<string>
|
||||
*/
|
||||
|
||||
Reference in New Issue
Block a user