feat(Label): add font prop to purge custom classes

src/shared/ui/Label/Label.svelte

@@ -6,6 +6,7 @@
 import { cn } from '$shared/shadcn/utils/shadcn-utils';
 import type { Snippet } from 'svelte';
 import {
+    type LabelFont,
     type LabelSize,
     type LabelVariant,
     labelSizeConfig,
@@ -28,6 +29,11 @@ interface Props {
      * @default true
      */
     uppercase?: boolean;
+    /**
+     * Font family
+     * @default 'mono'
+     */
+    font?: LabelFont;
     /**
      * Bold text
      * @default false
@@ -55,6 +61,7 @@ interface Props {
 let {
     variant = 'default',
     size = 'sm',
+    font = 'mono',
     uppercase = true,
     bold = false,
     icon,
@@ -68,6 +75,7 @@ let {
     class={cn(
         'font-mono tracking-widest leading-none',
         'inline-flex items-center gap-1.5',
+        font === 'primary' && 'font-primary tracking-tight',
         labelSizeConfig[size],
         labelVariantConfig[variant],
         uppercase && 'uppercase',

src/shared/ui/Label/config.ts

@@ -3,6 +3,8 @@
  * Import from here in each component to keep maps DRY.
  */
 
+export type LabelFont = 'mono' | 'primary';
+
 export type LabelVariant =
     | 'default'
     | 'accent'

src/widgets/ComparisonView/ui/FontList/FontList.svelte

@@ -72,7 +72,7 @@ $effect(() => {
 <div class="flex-1 min-h-0 h-full">
     <div class="py-2 relative flex flex-col min-h-0 h-full">
         <div class="py-2 mx-6 sticky border-b border-subtle">
-            <Label class="font-primary text-neutral-400" bold variant="default" size="sm" uppercase>
+            <Label font="primary" variant="muted" bold size="sm" uppercase>
                 Typeface Selection
             </Label>
         </div>