import React, { forwardRef } from "react";
import classNames from "classnames";
import * as Symbols from "./symbols";
import {
  MaterialIconConfig,
  MaterialIconName,
  MaterialIconSize,
  materialIconSizeMap,
  MaterialIconWeight,
} from "./types";

export const MATERIAL_ICON_MAP: MaterialIconConfig = {
  "accessibility-new": {
    400: {
      fill: Symbols.AccessibilityNewFill400,
      outline: Symbols.AccessibilityNewOutline400,
    },
    600: {
      fill: Symbols.AccessibilityNewFill600,
      outline: Symbols.AccessibilityNewOutline600,
    },
  },
  add: {
    400: {
      fill: Symbols.AddFill400,
      outline: Symbols.AddOutline400,
    },
    600: {
      fill: Symbols.AddFill600,
      outline: Symbols.AddOutline600,
    },
  },
  "add-circle": {
    400: {
      fill: Symbols.AddCircleFill400,
      outline: Symbols.AddCircleOutline400,
    },
    600: {
      fill: Symbols.AddCircleFill600,
      outline: Symbols.AddCircleOutline600,
    },
  },
  "align-center": {
    400: {
      fill: Symbols.AlignCenterFill400,
      outline: Symbols.AlignCenterOutline400,
    },
    600: {
      fill: Symbols.AlignCenterFill600,
      outline: Symbols.AlignCenterOutline600,
    },
  },
  "align-end": {
    400: {
      fill: Symbols.AlignEndFill400,
      outline: Symbols.AlignEndOutline400,
    },
    600: {
      fill: Symbols.AlignEndFill600,
      outline: Symbols.AlignEndOutline600,
    },
  },
  "align-start": {
    400: {
      fill: Symbols.AlignStartFill400,
      outline: Symbols.AlignStartOutline400,
    },
    600: {
      fill: Symbols.AlignStartFill600,
      outline: Symbols.AlignStartOutline600,
    },
  },
  "android-cell-5-bar": {
    400: {
      fill: Symbols.AndroidCell5BarFill400,
      outline: Symbols.AndroidCell5BarOutline400,
    },
    600: {
      fill: Symbols.AndroidCell5BarFill600,
      outline: Symbols.AndroidCell5BarOutline600,
    },
  },
  approval: {
    400: {
      fill: Symbols.ApprovalFill400,
      outline: Symbols.ApprovalOutline400,
    },
    600: {
      fill: Symbols.ApprovalFill600,
      outline: Symbols.ApprovalOutline600,
    },
  },
  "arrow-back": {
    400: {
      fill: Symbols.ArrowBackFill400,
      outline: Symbols.ArrowBackOutline400,
    },
    600: {
      fill: Symbols.ArrowBackFill600,
      outline: Symbols.ArrowBackOutline600,
    },
  },
  "arrow-back-ios-new": {
    400: {
      fill: Symbols.ArrowBackIosNewFill400,
      outline: Symbols.ArrowBackIosNewOutline400,
    },
    600: {
      fill: Symbols.ArrowBackIosNewFill600,
      outline: Symbols.ArrowBackIosNewOutline600,
    },
  },
  "arrow-downward": {
    400: {
      fill: Symbols.ArrowDownwardFill400,
      outline: Symbols.ArrowDownwardOutline400,
    },
    600: {
      fill: Symbols.ArrowDownwardFill600,
      outline: Symbols.ArrowDownwardOutline600,
    },
  },
  "arrow-drop-down": {
    400: {
      fill: Symbols.ArrowDropDownFill400,
      outline: Symbols.ArrowDropDownOutline400,
    },
    600: {
      fill: Symbols.ArrowDropDownFill600,
      outline: Symbols.ArrowDropDownOutline600,
    },
  },
  "arrow-drop-up": {
    400: {
      fill: Symbols.ArrowDropUpFill400,
      outline: Symbols.ArrowDropUpOutline400,
    },
    600: {
      fill: Symbols.ArrowDropUpFill600,
      outline: Symbols.ArrowDropUpOutline600,
    },
  },
  "arrow-forward": {
    400: {
      fill: Symbols.ArrowForwardFill400,
      outline: Symbols.ArrowForwardOutline400,
    },
    600: {
      fill: Symbols.ArrowForwardFill600,
      outline: Symbols.ArrowForwardOutline600,
    },
  },
  "arrow-forward-ios": {
    400: {
      fill: Symbols.ArrowForwardIosFill400,
      outline: Symbols.ArrowForwardIosOutline400,
    },
    600: {
      fill: Symbols.ArrowForwardIosFill600,
      outline: Symbols.ArrowForwardIosOutline600,
    },
  },
  "arrow-left": {
    400: {
      fill: Symbols.ArrowLeftFill400,
      outline: Symbols.ArrowLeftOutline400,
    },
    600: {
      fill: Symbols.ArrowLeftFill600,
      outline: Symbols.ArrowLeftOutline600,
    },
  },
  "arrow-right": {
    400: {
      fill: Symbols.ArrowRightFill400,
      outline: Symbols.ArrowRightOutline400,
    },
    600: {
      fill: Symbols.ArrowRightFill600,
      outline: Symbols.ArrowRightOutline600,
    },
  },
  "arrow-right-alt": {
    400: {
      fill: Symbols.ArrowRightAltFill400,
      outline: Symbols.ArrowRightAltOutline400,
    },
    600: {
      fill: Symbols.ArrowRightAltFill600,
      outline: Symbols.ArrowRightAltOutline600,
    },
  },
  "arrow-upward": {
    400: {
      fill: Symbols.ArrowUpwardFill400,
      outline: Symbols.ArrowUpwardOutline400,
    },
    600: {
      fill: Symbols.ArrowUpwardFill600,
      outline: Symbols.ArrowUpwardOutline600,
    },
  },
  "attach-file": {
    400: {
      fill: Symbols.AttachFileFill400,
      outline: Symbols.AttachFileOutline400,
    },
    600: {
      fill: Symbols.AttachFileFill600,
      outline: Symbols.AttachFileOutline600,
    },
  },
  automation: {
    400: {
      fill: Symbols.AutomationFill400,
      outline: Symbols.AutomationOutline400,
    },
    600: {
      fill: Symbols.AutomationFill600,
      outline: Symbols.AutomationOutline600,
    },
  },
  badge: {
    400: {
      fill: Symbols.BadgeFill400,
      outline: Symbols.BadgeOutline400,
    },
    600: {
      fill: Symbols.BadgeFill600,
      outline: Symbols.BadgeOutline600,
    },
  },
  balance: {
    400: {
      fill: Symbols.BalanceFill400,
      outline: Symbols.BalanceOutline400,
    },
    600: {
      fill: Symbols.BalanceFill600,
      outline: Symbols.BalanceOutline600,
    },
  },
  "battery-horiz-050": {
    400: {
      fill: Symbols.BatteryHoriz050Fill400,
      outline: Symbols.BatteryHoriz050Outline400,
    },
    600: {
      fill: Symbols.BatteryHoriz050Fill600,
      outline: Symbols.BatteryHoriz050Outline600,
    },
  },
  block: {
    400: {
      fill: Symbols.BlockFill400,
      outline: Symbols.BlockOutline400,
    },
    600: {
      fill: Symbols.BlockFill600,
      outline: Symbols.BlockOutline600,
    },
  },
  bolt: {
    400: {
      fill: Symbols.BoltFill400,
      outline: Symbols.BoltOutline400,
    },
    600: {
      fill: Symbols.BoltFill600,
      outline: Symbols.BoltOutline600,
    },
  },
  "book-2": {
    400: {
      fill: Symbols.Book2Fill400,
      outline: Symbols.Book2Outline400,
    },
    600: {
      fill: Symbols.Book2Fill600,
      outline: Symbols.Book2Outline600,
    },
  },
  build: {
    400: {
      fill: Symbols.BuildFill400,
      outline: Symbols.BuildOutline400,
    },
    600: {
      fill: Symbols.BuildFill600,
      outline: Symbols.BuildOutline600,
    },
  },
  cake: {
    400: {
      fill: Symbols.CakeFill400,
      outline: Symbols.CakeOutline400,
    },
    600: {
      fill: Symbols.CakeFill600,
      outline: Symbols.CakeOutline600,
    },
  },
  calculate: {
    400: {
      fill: Symbols.CalculateFill400,
      outline: Symbols.CalculateOutline400,
    },
    600: {
      fill: Symbols.CalculateFill600,
      outline: Symbols.CalculateOutline600,
    },
  },
  "calendar-today": {
    400: {
      fill: Symbols.CalendarTodayFill400,
      outline: Symbols.CalendarTodayOutline400,
    },
    600: {
      fill: Symbols.CalendarTodayFill600,
      outline: Symbols.CalendarTodayOutline600,
    },
  },
  campaign: {
    400: {
      fill: Symbols.CampaignFill400,
      outline: Symbols.CampaignOutline400,
    },
    600: {
      fill: Symbols.CampaignFill600,
      outline: Symbols.CampaignOutline600,
    },
  },
  cancel: {
    400: {
      fill: Symbols.CancelFill400,
      outline: Symbols.CancelOutline400,
    },
    600: {
      fill: Symbols.CancelFill600,
      outline: Symbols.CancelOutline600,
    },
  },
  "chart-data": {
    400: {
      fill: Symbols.ChartDataFill400,
      outline: Symbols.ChartDataOutline400,
    },
    600: {
      fill: Symbols.ChartDataFill600,
      outline: Symbols.ChartDataOutline600,
    },
  },
  "chat-bubble": {
    400: {
      fill: Symbols.ChatBubbleFill400,
      outline: Symbols.ChatBubbleOutline400,
    },
    600: {
      fill: Symbols.ChatBubbleFill600,
      outline: Symbols.ChatBubbleOutline600,
    },
  },
  check: {
    400: {
      fill: Symbols.CheckFill400,
      outline: Symbols.CheckOutline400,
    },
    600: {
      fill: Symbols.CheckFill600,
      outline: Symbols.CheckOutline600,
    },
  },
  "check-box": {
    400: {
      fill: Symbols.CheckBoxFill400,
      outline: Symbols.CheckBoxOutline400,
    },
    600: {
      fill: Symbols.CheckBoxFill600,
      outline: Symbols.CheckBoxOutline600,
    },
  },
  "check-circle": {
    400: {
      fill: Symbols.CheckCircleFill400,
      outline: Symbols.CheckCircleOutline400,
    },
    600: {
      fill: Symbols.CheckCircleFill600,
      outline: Symbols.CheckCircleOutline600,
    },
  },
  checklist: {
    400: {
      fill: Symbols.ChecklistFill400,
      outline: Symbols.ChecklistOutline400,
    },
    600: {
      fill: Symbols.ChecklistFill600,
      outline: Symbols.ChecklistOutline600,
    },
  },
  circle: {
    400: {
      fill: Symbols.CircleFill400,
      outline: Symbols.CircleOutline400,
    },
    600: {
      fill: Symbols.CircleFill600,
      outline: Symbols.CircleOutline600,
    },
  },
  close: {
    400: {
      fill: Symbols.CloseFill400,
      outline: Symbols.CloseOutline400,
    },
    600: {
      fill: Symbols.CloseFill600,
      outline: Symbols.CloseOutline600,
    },
  },
  "cloud-download": {
    400: {
      fill: Symbols.CloudDownloadFill400,
      outline: Symbols.CloudDownloadOutline400,
    },
    600: {
      fill: Symbols.CloudDownloadFill600,
      outline: Symbols.CloudDownloadOutline600,
    },
  },
  "cloud-upload": {
    400: {
      fill: Symbols.CloudUploadFill400,
      outline: Symbols.CloudUploadOutline400,
    },
    600: {
      fill: Symbols.CloudUploadFill600,
      outline: Symbols.CloudUploadOutline600,
    },
  },
  colors: {
    400: {
      fill: Symbols.ColorsFill400,
      outline: Symbols.ColorsOutline400,
    },
    600: {
      fill: Symbols.ColorsFill600,
      outline: Symbols.ColorsOutline600,
    },
  },
  "confirmation-number": {
    400: {
      fill: Symbols.ConfirmationNumberFill400,
      outline: Symbols.ConfirmationNumberOutline400,
    },
    600: {
      fill: Symbols.ConfirmationNumberFill600,
      outline: Symbols.ConfirmationNumberOutline600,
    },
  },
  construction: {
    400: {
      fill: Symbols.ConstructionFill400,
      outline: Symbols.ConstructionOutline400,
    },
    600: {
      fill: Symbols.ConstructionFill600,
      outline: Symbols.ConstructionOutline600,
    },
  },
  "content-copy": {
    400: {
      fill: Symbols.ContentCopyFill400,
      outline: Symbols.ContentCopyOutline400,
    },
    600: {
      fill: Symbols.ContentCopyFill600,
      outline: Symbols.ContentCopyOutline600,
    },
  },
  "content-paste": {
    400: {
      fill: Symbols.ContentPasteFill400,
      outline: Symbols.ContentPasteOutline400,
    },
    600: {
      fill: Symbols.ContentPasteFill600,
      outline: Symbols.ContentPasteOutline600,
    },
  },
  "content-paste-go": {
    400: {
      fill: Symbols.ContentPasteGoFill400,
      outline: Symbols.ContentPasteGoOutline400,
    },
    600: {
      fill: Symbols.ContentPasteGoFill600,
      outline: Symbols.ContentPasteGoOutline600,
    },
  },
  crown: {
    400: {
      fill: Symbols.CrownFill400,
      outline: Symbols.CrownOutline400,
    },
    600: {
      fill: Symbols.CrownFill600,
      outline: Symbols.CrownOutline600,
    },
  },
  "data-alert": {
    400: {
      fill: Symbols.DataAlertFill400,
      outline: Symbols.DataAlertOutline400,
    },
    600: {
      fill: Symbols.DataAlertFill600,
      outline: Symbols.DataAlertOutline600,
    },
  },
  delete: {
    400: {
      fill: Symbols.DeleteFill400,
      outline: Symbols.DeleteOutline400,
    },
    600: {
      fill: Symbols.DeleteFill600,
      outline: Symbols.DeleteOutline600,
    },
  },
  description: {
    400: {
      fill: Symbols.DescriptionFill400,
      outline: Symbols.DescriptionOutline400,
    },
    600: {
      fill: Symbols.DescriptionFill600,
      outline: Symbols.DescriptionOutline600,
    },
  },
  "design-services": {
    400: {
      fill: Symbols.DesignServicesFill400,
      outline: Symbols.DesignServicesOutline400,
    },
    600: {
      fill: Symbols.DesignServicesFill600,
      outline: Symbols.DesignServicesOutline600,
    },
  },
  "do-not-disturb-on": {
    400: {
      fill: Symbols.DoNotDisturbOnFill400,
      outline: Symbols.DoNotDisturbOnOutline400,
    },
    600: {
      fill: Symbols.DoNotDisturbOnFill600,
      outline: Symbols.DoNotDisturbOnOutline600,
    },
  },
  docs: {
    400: {
      fill: Symbols.DocsFill400,
      outline: Symbols.DocsOutline400,
    },
    600: {
      fill: Symbols.DocsFill600,
      outline: Symbols.DocsOutline600,
    },
  },
  "door-front": {
    400: {
      fill: Symbols.DoorFrontFill400,
      outline: Symbols.DoorFrontOutline400,
    },
    600: {
      fill: Symbols.DoorFrontFill600,
      outline: Symbols.DoorFrontOutline600,
    },
  },
  "door-open": {
    400: {
      fill: Symbols.DoorOpenFill400,
      outline: Symbols.DoorOpenOutline400,
    },
    600: {
      fill: Symbols.DoorOpenFill600,
      outline: Symbols.DoorOpenOutline600,
    },
  },
  download: {
    400: {
      fill: Symbols.DownloadFill400,
      outline: Symbols.DownloadOutline400,
    },
    600: {
      fill: Symbols.DownloadFill600,
      outline: Symbols.DownloadOutline600,
    },
  },
  draft: {
    400: {
      fill: Symbols.DraftFill400,
      outline: Symbols.DraftOutline400,
    },
    600: {
      fill: Symbols.DraftFill600,
      outline: Symbols.DraftOutline600,
    },
  },
  "drag-handle": {
    400: {
      fill: Symbols.DragHandleFill400,
      outline: Symbols.DragHandleOutline400,
    },
    600: {
      fill: Symbols.DragHandleFill600,
      outline: Symbols.DragHandleOutline600,
    },
  },
  "drag-indicator": {
    400: {
      fill: Symbols.DragIndicatorFill400,
      outline: Symbols.DragIndicatorOutline400,
    },
    600: {
      fill: Symbols.DragIndicatorFill600,
      outline: Symbols.DragIndicatorOutline600,
    },
  },
  "drag-pan": {
    400: {
      fill: Symbols.DragPanFill400,
      outline: Symbols.DragPanOutline400,
    },
    600: {
      fill: Symbols.DragPanFill600,
      outline: Symbols.DragPanOutline600,
    },
  },
  edit: {
    400: {
      fill: Symbols.EditFill400,
      outline: Symbols.EditOutline400,
    },
    600: {
      fill: Symbols.EditFill600,
      outline: Symbols.EditOutline600,
    },
  },
  "edit-square": {
    400: {
      fill: Symbols.EditSquareFill400,
      outline: Symbols.EditSquareOutline400,
    },
    600: {
      fill: Symbols.EditSquareFill600,
      outline: Symbols.EditSquareOutline600,
    },
  },
  error: {
    400: {
      fill: Symbols.ErrorFill400,
      outline: Symbols.ErrorOutline400,
    },
    600: {
      fill: Symbols.ErrorFill600,
      outline: Symbols.ErrorOutline600,
    },
  },
  exclamation: {
    400: {
      fill: Symbols.ExclamationFill400,
      outline: Symbols.ExclamationOutline400,
    },
    600: {
      fill: Symbols.ExclamationFill600,
      outline: Symbols.ExclamationOutline600,
    },
  },
  experiment: {
    400: {
      fill: Symbols.ExperimentFill400,
      outline: Symbols.ExperimentOutline400,
    },
    600: {
      fill: Symbols.ExperimentFill600,
      outline: Symbols.ExperimentOutline600,
    },
  },
  explore: {
    400: {
      fill: Symbols.ExploreFill400,
      outline: Symbols.ExploreOutline400,
    },
    600: {
      fill: Symbols.ExploreFill600,
      outline: Symbols.ExploreOutline600,
    },
  },
  "fact-check": {
    400: {
      fill: Symbols.FactCheckFill400,
      outline: Symbols.FactCheckOutline400,
    },
    600: {
      fill: Symbols.FactCheckFill600,
      outline: Symbols.FactCheckOutline600,
    },
  },
  "fast-forward": {
    400: {
      fill: Symbols.FastForwardFill400,
      outline: Symbols.FastForwardOutline400,
    },
    600: {
      fill: Symbols.FastForwardFill600,
      outline: Symbols.FastForwardOutline600,
    },
  },
  "fast-rewind": {
    400: {
      fill: Symbols.FastRewindFill400,
      outline: Symbols.FastRewindOutline400,
    },
    600: {
      fill: Symbols.FastRewindFill600,
      outline: Symbols.FastRewindOutline600,
    },
  },
  "file-export": {
    400: {
      fill: Symbols.FileExportFill400,
      outline: Symbols.FileExportOutline400,
    },
    600: {
      fill: Symbols.FileExportFill600,
      outline: Symbols.FileExportOutline600,
    },
  },
  "file-save": {
    400: {
      fill: Symbols.FileSaveFill400,
      outline: Symbols.FileSaveOutline400,
    },
    600: {
      fill: Symbols.FileSaveFill600,
      outline: Symbols.FileSaveOutline600,
    },
  },
  "filter-alt": {
    400: {
      fill: Symbols.FilterAltFill400,
      outline: Symbols.FilterAltOutline400,
    },
    600: {
      fill: Symbols.FilterAltFill600,
      outline: Symbols.FilterAltOutline600,
    },
  },
  flag: {
    400: {
      fill: Symbols.FlagFill400,
      outline: Symbols.FlagOutline400,
    },
    600: {
      fill: Symbols.FlagFill600,
      outline: Symbols.FlagOutline600,
    },
  },
  folder: {
    400: {
      fill: Symbols.FolderFill400,
      outline: Symbols.FolderOutline400,
    },
    600: {
      fill: Symbols.FolderFill600,
      outline: Symbols.FolderOutline600,
    },
  },
  "folder-copy": {
    400: {
      fill: Symbols.FolderCopyFill400,
      outline: Symbols.FolderCopyOutline400,
    },
    600: {
      fill: Symbols.FolderCopyFill600,
      outline: Symbols.FolderCopyOutline600,
    },
  },
  "folder-open": {
    400: {
      fill: Symbols.FolderOpenFill400,
      outline: Symbols.FolderOpenOutline400,
    },
    600: {
      fill: Symbols.FolderOpenFill600,
      outline: Symbols.FolderOpenOutline600,
    },
  },
  "format-bold": {
    400: {
      fill: Symbols.FormatBoldFill400,
      outline: Symbols.FormatBoldOutline400,
    },
    600: {
      fill: Symbols.FormatBoldFill600,
      outline: Symbols.FormatBoldOutline600,
    },
  },
  "format-italic": {
    400: {
      fill: Symbols.FormatItalicFill400,
      outline: Symbols.FormatItalicOutline400,
    },
    600: {
      fill: Symbols.FormatItalicFill600,
      outline: Symbols.FormatItalicOutline600,
    },
  },
  fullscreen: {
    400: {
      fill: Symbols.FullscreenFill400,
      outline: Symbols.FullscreenOutline400,
    },
    600: {
      fill: Symbols.FullscreenFill600,
      outline: Symbols.FullscreenOutline600,
    },
  },
  "fullscreen-exit": {
    400: {
      fill: Symbols.FullscreenExitFill400,
      outline: Symbols.FullscreenExitOutline400,
    },
    600: {
      fill: Symbols.FullscreenExitFill600,
      outline: Symbols.FullscreenExitOutline600,
    },
  },
  gavel: {
    400: {
      fill: Symbols.GavelFill400,
      outline: Symbols.GavelOutline400,
    },
    600: {
      fill: Symbols.GavelFill600,
      outline: Symbols.GavelOutline600,
    },
  },
  globe: {
    400: {
      fill: Symbols.GlobeFill400,
      outline: Symbols.GlobeOutline400,
    },
    600: {
      fill: Symbols.GlobeFill600,
      outline: Symbols.GlobeOutline600,
    },
  },
  "globe-uk": {
    400: {
      fill: Symbols.GlobeUkFill400,
      outline: Symbols.GlobeUkOutline400,
    },
    600: {
      fill: Symbols.GlobeUkFill600,
      outline: Symbols.GlobeUkOutline600,
    },
  },
  "graph-8": {
    400: {
      fill: Symbols.Graph8Fill400,
      outline: Symbols.Graph8Outline400,
    },
    600: {
      fill: Symbols.Graph8Fill600,
      outline: Symbols.Graph8Outline600,
    },
  },
  "grid-view": {
    400: {
      fill: Symbols.GridViewFill400,
      outline: Symbols.GridViewOutline400,
    },
    600: {
      fill: Symbols.GridViewFill600,
      outline: Symbols.GridViewOutline600,
    },
  },
  group: {
    400: {
      fill: Symbols.GroupFill400,
      outline: Symbols.GroupOutline400,
    },
    600: {
      fill: Symbols.GroupFill600,
      outline: Symbols.GroupOutline600,
    },
  },
  groups: {
    400: {
      fill: Symbols.GroupsFill400,
      outline: Symbols.GroupsOutline400,
    },
    600: {
      fill: Symbols.GroupsFill600,
      outline: Symbols.GroupsOutline600,
    },
  },
  handshake: {
    400: {
      fill: Symbols.HandshakeFill400,
      outline: Symbols.HandshakeOutline400,
    },
    600: {
      fill: Symbols.HandshakeFill600,
      outline: Symbols.HandshakeOutline600,
    },
  },
  healing: {
    400: {
      fill: Symbols.HealingFill400,
      outline: Symbols.HealingOutline400,
    },
    600: {
      fill: Symbols.HealingFill600,
      outline: Symbols.HealingOutline600,
    },
  },
  "heart-broken": {
    400: {
      fill: Symbols.HeartBrokenFill400,
      outline: Symbols.HeartBrokenOutline400,
    },
    600: {
      fill: Symbols.HeartBrokenFill600,
      outline: Symbols.HeartBrokenOutline600,
    },
  },
  help: {
    400: {
      fill: Symbols.HelpFill400,
      outline: Symbols.HelpOutline400,
    },
    600: {
      fill: Symbols.HelpFill600,
      outline: Symbols.HelpOutline600,
    },
  },
  history: {
    400: {
      fill: Symbols.HistoryFill400,
      outline: Symbols.HistoryOutline400,
    },
    600: {
      fill: Symbols.HistoryFill600,
      outline: Symbols.HistoryOutline600,
    },
  },
  hotel: {
    400: {
      fill: Symbols.HotelFill400,
      outline: Symbols.HotelOutline400,
    },
    600: {
      fill: Symbols.HotelFill600,
      outline: Symbols.HotelOutline600,
    },
  },
  image: {
    400: {
      fill: Symbols.ImageFill400,
      outline: Symbols.ImageOutline400,
    },
    600: {
      fill: Symbols.ImageFill600,
      outline: Symbols.ImageOutline600,
    },
  },
  "inbox-text": {
    400: {
      fill: Symbols.InboxTextFill400,
      outline: Symbols.InboxTextOutline400,
    },
    600: {
      fill: Symbols.InboxTextFill600,
      outline: Symbols.InboxTextOutline600,
    },
  },
  info: {
    400: {
      fill: Symbols.InfoFill400,
      outline: Symbols.InfoOutline400,
    },
    600: {
      fill: Symbols.InfoFill600,
      outline: Symbols.InfoOutline600,
    },
  },
  "ink-eraser": {
    400: {
      fill: Symbols.InkEraserFill400,
      outline: Symbols.InkEraserOutline400,
    },
    600: {
      fill: Symbols.InkEraserFill600,
      outline: Symbols.InkEraserOutline600,
    },
  },
  "ink-highlighter": {
    400: {
      fill: Symbols.InkHighlighterFill400,
      outline: Symbols.InkHighlighterOutline400,
    },
    600: {
      fill: Symbols.InkHighlighterFill600,
      outline: Symbols.InkHighlighterOutline600,
    },
  },
  "insert-chart": {
    400: {
      fill: Symbols.InsertChartFill400,
      outline: Symbols.InsertChartOutline400,
    },
    600: {
      fill: Symbols.InsertChartFill600,
      outline: Symbols.InsertChartOutline600,
    },
  },
  "inventory-2": {
    400: {
      fill: Symbols.Inventory2Fill400,
      outline: Symbols.Inventory2Outline400,
    },
    600: {
      fill: Symbols.Inventory2Fill600,
      outline: Symbols.Inventory2Outline600,
    },
  },
  key: {
    400: {
      fill: Symbols.KeyFill400,
      outline: Symbols.KeyOutline400,
    },
    600: {
      fill: Symbols.KeyFill600,
      outline: Symbols.KeyOutline600,
    },
  },
  keyboard: {
    400: {
      fill: Symbols.KeyboardFill400,
      outline: Symbols.KeyboardOutline400,
    },
    600: {
      fill: Symbols.KeyboardFill600,
      outline: Symbols.KeyboardOutline600,
    },
  },
  "keyboard-arrow-down": {
    400: {
      fill: Symbols.KeyboardArrowDownFill400,
      outline: Symbols.KeyboardArrowDownOutline400,
    },
    600: {
      fill: Symbols.KeyboardArrowDownFill600,
      outline: Symbols.KeyboardArrowDownOutline600,
    },
  },
  "keyboard-arrow-left": {
    400: {
      fill: Symbols.KeyboardArrowLeftFill400,
      outline: Symbols.KeyboardArrowLeftOutline400,
    },
    600: {
      fill: Symbols.KeyboardArrowLeftFill600,
      outline: Symbols.KeyboardArrowLeftOutline600,
    },
  },
  "keyboard-arrow-right": {
    400: {
      fill: Symbols.KeyboardArrowRightFill400,
      outline: Symbols.KeyboardArrowRightOutline400,
    },
    600: {
      fill: Symbols.KeyboardArrowRightFill600,
      outline: Symbols.KeyboardArrowRightOutline600,
    },
  },
  "keyboard-arrow-up": {
    400: {
      fill: Symbols.KeyboardArrowUpFill400,
      outline: Symbols.KeyboardArrowUpOutline400,
    },
    600: {
      fill: Symbols.KeyboardArrowUpFill600,
      outline: Symbols.KeyboardArrowUpOutline600,
    },
  },
  labs: {
    400: {
      fill: Symbols.LabsFill400,
      outline: Symbols.LabsOutline400,
    },
    600: {
      fill: Symbols.LabsFill600,
      outline: Symbols.LabsOutline600,
    },
  },
  language: {
    400: {
      fill: Symbols.LanguageFill400,
      outline: Symbols.LanguageOutline400,
    },
    600: {
      fill: Symbols.LanguageFill600,
      outline: Symbols.LanguageOutline600,
    },
  },
  "laptop-mac": {
    400: {
      fill: Symbols.LaptopMacFill400,
      outline: Symbols.LaptopMacOutline400,
    },
    600: {
      fill: Symbols.LaptopMacFill600,
      outline: Symbols.LaptopMacOutline600,
    },
  },
  "left-click": {
    400: {
      fill: Symbols.LeftClickFill400,
      outline: Symbols.LeftClickOutline400,
    },
    600: {
      fill: Symbols.LeftClickFill600,
      outline: Symbols.LeftClickOutline600,
    },
  },
  link: {
    400: {
      fill: Symbols.LinkFill400,
      outline: Symbols.LinkOutline400,
    },
    600: {
      fill: Symbols.LinkFill600,
      outline: Symbols.LinkOutline600,
    },
  },
  "link-2": {
    400: {
      fill: Symbols.Link2Fill400,
      outline: Symbols.Link2Outline400,
    },
    600: {
      fill: Symbols.Link2Fill600,
      outline: Symbols.Link2Outline600,
    },
  },
  "link-off": {
    400: {
      fill: Symbols.LinkOffFill400,
      outline: Symbols.LinkOffOutline400,
    },
    600: {
      fill: Symbols.LinkOffFill600,
      outline: Symbols.LinkOffOutline600,
    },
  },
  list: {
    400: {
      fill: Symbols.ListFill400,
      outline: Symbols.ListOutline400,
    },
    600: {
      fill: Symbols.ListFill600,
      outline: Symbols.ListOutline600,
    },
  },
  "location-on": {
    400: {
      fill: Symbols.LocationOnFill400,
      outline: Symbols.LocationOnOutline400,
    },
    600: {
      fill: Symbols.LocationOnFill600,
      outline: Symbols.LocationOnOutline600,
    },
  },
  lock: {
    400: {
      fill: Symbols.LockFill400,
      outline: Symbols.LockOutline400,
    },
    600: {
      fill: Symbols.LockFill600,
      outline: Symbols.LockOutline600,
    },
  },
  "lock-open": {
    400: {
      fill: Symbols.LockOpenFill400,
      outline: Symbols.LockOpenOutline400,
    },
    600: {
      fill: Symbols.LockOpenFill600,
      outline: Symbols.LockOpenOutline600,
    },
  },
  "lock-person": {
    400: {
      fill: Symbols.LockPersonFill400,
      outline: Symbols.LockPersonOutline400,
    },
    600: {
      fill: Symbols.LockPersonFill600,
      outline: Symbols.LockPersonOutline600,
    },
  },
  login: {
    400: {
      fill: Symbols.LoginFill400,
      outline: Symbols.LoginOutline400,
    },
    600: {
      fill: Symbols.LoginFill600,
      outline: Symbols.LoginOutline600,
    },
  },
  logout: {
    400: {
      fill: Symbols.LogoutFill400,
      outline: Symbols.LogoutOutline400,
    },
    600: {
      fill: Symbols.LogoutFill600,
      outline: Symbols.LogoutOutline600,
    },
  },
  luggage: {
    400: {
      fill: Symbols.LuggageFill400,
      outline: Symbols.LuggageOutline400,
    },
    600: {
      fill: Symbols.LuggageFill600,
      outline: Symbols.LuggageOutline600,
    },
  },
  mail: {
    400: {
      fill: Symbols.MailFill400,
      outline: Symbols.MailOutline400,
    },
    600: {
      fill: Symbols.MailFill600,
      outline: Symbols.MailOutline600,
    },
  },
  "mark-chat-read": {
    400: {
      fill: Symbols.MarkChatReadFill400,
      outline: Symbols.MarkChatReadOutline400,
    },
    600: {
      fill: Symbols.MarkChatReadFill600,
      outline: Symbols.MarkChatReadOutline600,
    },
  },
  menu: {
    400: {
      fill: Symbols.MenuFill400,
      outline: Symbols.MenuOutline400,
    },
    600: {
      fill: Symbols.MenuFill600,
      outline: Symbols.MenuOutline600,
    },
  },
  mop: {
    400: {
      fill: Symbols.MopFill400,
      outline: Symbols.MopOutline400,
    },
    600: {
      fill: Symbols.MopFill600,
      outline: Symbols.MopOutline600,
    },
  },
  "more-horiz": {
    400: {
      fill: Symbols.MoreHorizFill400,
      outline: Symbols.MoreHorizOutline400,
    },
    600: {
      fill: Symbols.MoreHorizFill600,
      outline: Symbols.MoreHorizOutline600,
    },
  },
  "more-vert": {
    400: {
      fill: Symbols.MoreVertFill400,
      outline: Symbols.MoreVertOutline400,
    },
    600: {
      fill: Symbols.MoreVertFill600,
      outline: Symbols.MoreVertOutline600,
    },
  },
  "my-location": {
    400: {
      fill: Symbols.MyLocationFill400,
      outline: Symbols.MyLocationOutline400,
    },
    600: {
      fill: Symbols.MyLocationFill600,
      outline: Symbols.MyLocationOutline600,
    },
  },
  notifications: {
    400: {
      fill: Symbols.NotificationsFill400,
      outline: Symbols.NotificationsOutline400,
    },
    600: {
      fill: Symbols.NotificationsFill600,
      outline: Symbols.NotificationsOutline600,
    },
  },
  "notifications-off": {
    400: {
      fill: Symbols.NotificationsOffFill400,
      outline: Symbols.NotificationsOffOutline400,
    },
    600: {
      fill: Symbols.NotificationsOffFill600,
      outline: Symbols.NotificationsOffOutline600,
    },
  },
  "open-in-new": {
    400: {
      fill: Symbols.OpenInNewFill400,
      outline: Symbols.OpenInNewOutline400,
    },
    600: {
      fill: Symbols.OpenInNewFill600,
      outline: Symbols.OpenInNewOutline600,
    },
  },
  "package-2": {
    400: {
      fill: Symbols.Package2Fill400,
      outline: Symbols.Package2Outline400,
    },
    600: {
      fill: Symbols.Package2Fill600,
      outline: Symbols.Package2Outline600,
    },
  },
  palette: {
    400: {
      fill: Symbols.PaletteFill400,
      outline: Symbols.PaletteOutline400,
    },
    600: {
      fill: Symbols.PaletteFill600,
      outline: Symbols.PaletteOutline600,
    },
  },
  pause: {
    400: {
      fill: Symbols.PauseFill400,
      outline: Symbols.PauseOutline400,
    },
    600: {
      fill: Symbols.PauseFill600,
      outline: Symbols.PauseOutline600,
    },
  },
  person: {
    400: {
      fill: Symbols.PersonFill400,
      outline: Symbols.PersonOutline400,
    },
    600: {
      fill: Symbols.PersonFill600,
      outline: Symbols.PersonOutline600,
    },
  },
  "person-add": {
    400: {
      fill: Symbols.PersonAddFill400,
      outline: Symbols.PersonAddOutline400,
    },
    600: {
      fill: Symbols.PersonAddFill600,
      outline: Symbols.PersonAddOutline600,
    },
  },
  "person-shield": {
    400: {
      fill: Symbols.PersonShieldFill400,
      outline: Symbols.PersonShieldOutline400,
    },
    600: {
      fill: Symbols.PersonShieldFill600,
      outline: Symbols.PersonShieldOutline600,
    },
  },
  "pest-control": {
    400: {
      fill: Symbols.PestControlFill400,
      outline: Symbols.PestControlOutline400,
    },
    600: {
      fill: Symbols.PestControlFill600,
      outline: Symbols.PestControlOutline600,
    },
  },
  "photo-camera": {
    400: {
      fill: Symbols.PhotoCameraFill400,
      outline: Symbols.PhotoCameraOutline400,
    },
    600: {
      fill: Symbols.PhotoCameraFill600,
      outline: Symbols.PhotoCameraOutline600,
    },
  },
  "play-arrow": {
    400: {
      fill: Symbols.PlayArrowFill400,
      outline: Symbols.PlayArrowOutline400,
    },
    600: {
      fill: Symbols.PlayArrowFill600,
      outline: Symbols.PlayArrowOutline600,
    },
  },
  power: {
    400: {
      fill: Symbols.PowerFill400,
      outline: Symbols.PowerOutline400,
    },
    600: {
      fill: Symbols.PowerFill600,
      outline: Symbols.PowerOutline600,
    },
  },
  preview: {
    400: {
      fill: Symbols.PreviewFill400,
      outline: Symbols.PreviewOutline400,
    },
    600: {
      fill: Symbols.PreviewFill600,
      outline: Symbols.PreviewOutline600,
    },
  },
  "preview-off": {
    400: {
      fill: Symbols.PreviewOffFill400,
      outline: Symbols.PreviewOffOutline400,
    },
    600: {
      fill: Symbols.PreviewOffFill600,
      outline: Symbols.PreviewOffOutline600,
    },
  },
  "progress-activity": {
    400: {
      fill: Symbols.ProgressActivityFill400,
      outline: Symbols.ProgressActivityOutline400,
    },
    600: {
      fill: Symbols.ProgressActivityFill600,
      outline: Symbols.ProgressActivityOutline600,
    },
  },
  psychiatry: {
    400: {
      fill: Symbols.PsychiatryFill400,
      outline: Symbols.PsychiatryOutline400,
    },
    600: {
      fill: Symbols.PsychiatryFill600,
      outline: Symbols.PsychiatryOutline600,
    },
  },
  "query-stats": {
    400: {
      fill: Symbols.QueryStatsFill400,
      outline: Symbols.QueryStatsOutline400,
    },
    600: {
      fill: Symbols.QueryStatsFill600,
      outline: Symbols.QueryStatsOutline600,
    },
  },
  "question-mark": {
    400: {
      fill: Symbols.QuestionMarkFill400,
      outline: Symbols.QuestionMarkOutline400,
    },
    600: {
      fill: Symbols.QuestionMarkFill600,
      outline: Symbols.QuestionMarkOutline600,
    },
  },
  rainy: {
    400: {
      fill: Symbols.RainyFill400,
      outline: Symbols.RainyOutline400,
    },
    600: {
      fill: Symbols.RainyFill600,
      outline: Symbols.RainyOutline600,
    },
  },
  recenter: {
    400: {
      fill: Symbols.RecenterFill400,
      outline: Symbols.RecenterOutline400,
    },
    600: {
      fill: Symbols.RecenterFill600,
      outline: Symbols.RecenterOutline600,
    },
  },
  redeem: {
    400: {
      fill: Symbols.RedeemFill400,
      outline: Symbols.RedeemOutline400,
    },
    600: {
      fill: Symbols.RedeemFill600,
      outline: Symbols.RedeemOutline600,
    },
  },
  redo: {
    400: {
      fill: Symbols.RedoFill400,
      outline: Symbols.RedoOutline400,
    },
    600: {
      fill: Symbols.RedoFill600,
      outline: Symbols.RedoOutline600,
    },
  },
  remove: {
    400: {
      fill: Symbols.RemoveFill400,
      outline: Symbols.RemoveOutline400,
    },
    600: {
      fill: Symbols.RemoveFill600,
      outline: Symbols.RemoveOutline600,
    },
  },
  reply: {
    400: {
      fill: Symbols.ReplyFill400,
      outline: Symbols.ReplyOutline400,
    },
    600: {
      fill: Symbols.ReplyFill600,
      outline: Symbols.ReplyOutline600,
    },
  },
  robot: {
    400: {
      fill: Symbols.RobotFill400,
      outline: Symbols.RobotOutline400,
    },
    600: {
      fill: Symbols.RobotFill600,
      outline: Symbols.RobotOutline600,
    },
  },
  "rocket-launch": {
    400: {
      fill: Symbols.RocketLaunchFill400,
      outline: Symbols.RocketLaunchOutline400,
    },
    600: {
      fill: Symbols.RocketLaunchFill600,
      outline: Symbols.RocketLaunchOutline600,
    },
  },
  save: {
    400: {
      fill: Symbols.SaveFill400,
      outline: Symbols.SaveOutline400,
    },
    600: {
      fill: Symbols.SaveFill600,
      outline: Symbols.SaveOutline600,
    },
  },
  schedule: {
    400: {
      fill: Symbols.ScheduleFill400,
      outline: Symbols.ScheduleOutline400,
    },
    600: {
      fill: Symbols.ScheduleFill600,
      outline: Symbols.ScheduleOutline600,
    },
  },
  search: {
    400: {
      fill: Symbols.SearchFill400,
      outline: Symbols.SearchOutline400,
    },
    600: {
      fill: Symbols.SearchFill600,
      outline: Symbols.SearchOutline600,
    },
  },
  sell: {
    400: {
      fill: Symbols.SellFill400,
      outline: Symbols.SellOutline400,
    },
    600: {
      fill: Symbols.SellFill600,
      outline: Symbols.SellOutline600,
    },
  },
  send: {
    400: {
      fill: Symbols.SendFill400,
      outline: Symbols.SendOutline400,
    },
    600: {
      fill: Symbols.SendFill600,
      outline: Symbols.SendOutline600,
    },
  },
  settings: {
    400: {
      fill: Symbols.SettingsFill400,
      outline: Symbols.SettingsOutline400,
    },
    600: {
      fill: Symbols.SettingsFill600,
      outline: Symbols.SettingsOutline600,
    },
  },
  "shadow-add": {
    400: {
      fill: Symbols.ShadowAddFill400,
      outline: Symbols.ShadowAddOutline400,
    },
    600: {
      fill: Symbols.ShadowAddFill600,
      outline: Symbols.ShadowAddOutline600,
    },
  },
  share: {
    400: {
      fill: Symbols.ShareFill400,
      outline: Symbols.ShareOutline400,
    },
    600: {
      fill: Symbols.ShareFill600,
      outline: Symbols.ShareOutline600,
    },
  },
  "share-windows": {
    400: {
      fill: Symbols.ShareWindowsFill400,
      outline: Symbols.ShareWindowsOutline400,
    },
    600: {
      fill: Symbols.ShareWindowsFill600,
      outline: Symbols.ShareWindowsOutline600,
    },
  },
  shield: {
    400: {
      fill: Symbols.ShieldFill400,
      outline: Symbols.ShieldOutline400,
    },
    600: {
      fill: Symbols.ShieldFill600,
      outline: Symbols.ShieldOutline600,
    },
  },
  shuffle: {
    400: {
      fill: Symbols.ShuffleFill400,
      outline: Symbols.ShuffleOutline400,
    },
    600: {
      fill: Symbols.ShuffleFill600,
      outline: Symbols.ShuffleOutline600,
    },
  },
  signature: {
    400: {
      fill: Symbols.SignatureFill400,
      outline: Symbols.SignatureOutline400,
    },
    600: {
      fill: Symbols.SignatureFill600,
      outline: Symbols.SignatureOutline600,
    },
  },
  signpost: {
    400: {
      fill: Symbols.SignpostFill400,
      outline: Symbols.SignpostOutline400,
    },
    600: {
      fill: Symbols.SignpostFill600,
      outline: Symbols.SignpostOutline600,
    },
  },
  "sim-card-download": {
    400: {
      fill: Symbols.SimCardDownloadFill400,
      outline: Symbols.SimCardDownloadOutline400,
    },
    600: {
      fill: Symbols.SimCardDownloadFill600,
      outline: Symbols.SimCardDownloadOutline600,
    },
  },
  "skip-next": {
    400: {
      fill: Symbols.SkipNextFill400,
      outline: Symbols.SkipNextOutline400,
    },
    600: {
      fill: Symbols.SkipNextFill600,
      outline: Symbols.SkipNextOutline600,
    },
  },
  "skip-previous": {
    400: {
      fill: Symbols.SkipPreviousFill400,
      outline: Symbols.SkipPreviousOutline400,
    },
    600: {
      fill: Symbols.SkipPreviousFill600,
      outline: Symbols.SkipPreviousOutline600,
    },
  },
  skull: {
    400: {
      fill: Symbols.SkullFill400,
      outline: Symbols.SkullOutline400,
    },
    600: {
      fill: Symbols.SkullFill600,
      outline: Symbols.SkullOutline600,
    },
  },
  square: {
    400: {
      fill: Symbols.SquareFill400,
      outline: Symbols.SquareOutline400,
    },
    600: {
      fill: Symbols.SquareFill600,
      outline: Symbols.SquareOutline600,
    },
  },
  stacks: {
    400: {
      fill: Symbols.StacksFill400,
      outline: Symbols.StacksOutline400,
    },
    600: {
      fill: Symbols.StacksFill600,
      outline: Symbols.StacksOutline600,
    },
  },
  star: {
    400: {
      fill: Symbols.StarFill400,
      outline: Symbols.StarOutline400,
    },
    600: {
      fill: Symbols.StarFill600,
      outline: Symbols.StarOutline600,
    },
  },
  straighten: {
    400: {
      fill: Symbols.StraightenFill400,
      outline: Symbols.StraightenOutline400,
    },
    600: {
      fill: Symbols.StraightenFill600,
      outline: Symbols.StraightenOutline600,
    },
  },
  support: {
    400: {
      fill: Symbols.SupportFill400,
      outline: Symbols.SupportOutline400,
    },
    600: {
      fill: Symbols.SupportFill600,
      outline: Symbols.SupportOutline600,
    },
  },
  "swap-horiz": {
    400: {
      fill: Symbols.SwapHorizFill400,
      outline: Symbols.SwapHorizOutline400,
    },
    600: {
      fill: Symbols.SwapHorizFill600,
      outline: Symbols.SwapHorizOutline600,
    },
  },
  "swap-vert": {
    400: {
      fill: Symbols.SwapVertFill400,
      outline: Symbols.SwapVertOutline400,
    },
    600: {
      fill: Symbols.SwapVertFill600,
      outline: Symbols.SwapVertOutline600,
    },
  },
  sync: {
    400: {
      fill: Symbols.SyncFill400,
      outline: Symbols.SyncOutline400,
    },
    600: {
      fill: Symbols.SyncFill600,
      outline: Symbols.SyncOutline600,
    },
  },
  "sync-alt": {
    400: {
      fill: Symbols.SyncAltFill400,
      outline: Symbols.SyncAltOutline400,
    },
    600: {
      fill: Symbols.SyncAltFill600,
      outline: Symbols.SyncAltOutline600,
    },
  },
  table: {
    400: {
      fill: Symbols.TableFill400,
      outline: Symbols.TableOutline400,
    },
    600: {
      fill: Symbols.TableFill600,
      outline: Symbols.TableOutline600,
    },
  },
  tag: {
    400: {
      fill: Symbols.TagFill400,
      outline: Symbols.TagOutline400,
    },
    600: {
      fill: Symbols.TagFill600,
      outline: Symbols.TagOutline600,
    },
  },
  target: {
    400: {
      fill: Symbols.TargetFill400,
      outline: Symbols.TargetOutline400,
    },
    600: {
      fill: Symbols.TargetFill600,
      outline: Symbols.TargetOutline600,
    },
  },
  "thumb-down": {
    400: {
      fill: Symbols.ThumbDownFill400,
      outline: Symbols.ThumbDownOutline400,
    },
    600: {
      fill: Symbols.ThumbDownFill600,
      outline: Symbols.ThumbDownOutline600,
    },
  },
  "thumb-up": {
    400: {
      fill: Symbols.ThumbUpFill400,
      outline: Symbols.ThumbUpOutline400,
    },
    600: {
      fill: Symbols.ThumbUpFill600,
      outline: Symbols.ThumbUpOutline600,
    },
  },
  timer: {
    400: {
      fill: Symbols.TimerFill400,
      outline: Symbols.TimerOutline400,
    },
    600: {
      fill: Symbols.TimerFill600,
      outline: Symbols.TimerOutline600,
    },
  },
  trophy: {
    400: {
      fill: Symbols.TrophyFill400,
      outline: Symbols.TrophyOutline400,
    },
    600: {
      fill: Symbols.TrophyFill600,
      outline: Symbols.TrophyOutline600,
    },
  },
  tune: {
    400: {
      fill: Symbols.TuneFill400,
      outline: Symbols.TuneOutline400,
    },
    600: {
      fill: Symbols.TuneFill600,
      outline: Symbols.TuneOutline600,
    },
  },
  undo: {
    400: {
      fill: Symbols.UndoFill400,
      outline: Symbols.UndoOutline400,
    },
    600: {
      fill: Symbols.UndoFill600,
      outline: Symbols.UndoOutline600,
    },
  },
  "upload-file": {
    400: {
      fill: Symbols.UploadFileFill400,
      outline: Symbols.UploadFileOutline400,
    },
    600: {
      fill: Symbols.UploadFileFill600,
      outline: Symbols.UploadFileOutline600,
    },
  },
  verified: {
    400: {
      fill: Symbols.VerifiedFill400,
      outline: Symbols.VerifiedOutline400,
    },
    600: {
      fill: Symbols.VerifiedFill600,
      outline: Symbols.VerifiedOutline600,
    },
  },
  videocam: {
    400: {
      fill: Symbols.VideocamFill400,
      outline: Symbols.VideocamOutline400,
    },
    600: {
      fill: Symbols.VideocamFill600,
      outline: Symbols.VideocamOutline600,
    },
  },
  "view-column-2": {
    400: {
      fill: Symbols.ViewColumn2Fill400,
      outline: Symbols.ViewColumn2Outline400,
    },
    600: {
      fill: Symbols.ViewColumn2Fill600,
      outline: Symbols.ViewColumn2Outline600,
    },
  },
  visibility: {
    400: {
      fill: Symbols.VisibilityFill400,
      outline: Symbols.VisibilityOutline400,
    },
    600: {
      fill: Symbols.VisibilityFill600,
      outline: Symbols.VisibilityOutline600,
    },
  },
  "visibility-off": {
    400: {
      fill: Symbols.VisibilityOffFill400,
      outline: Symbols.VisibilityOffOutline400,
    },
    600: {
      fill: Symbols.VisibilityOffFill600,
      outline: Symbols.VisibilityOffOutline600,
    },
  },
  "volunteer-activism": {
    400: {
      fill: Symbols.VolunteerActivismFill400,
      outline: Symbols.VolunteerActivismOutline400,
    },
    600: {
      fill: Symbols.VolunteerActivismFill600,
      outline: Symbols.VolunteerActivismOutline600,
    },
  },
  "wand-shine": {
    400: {
      fill: Symbols.WandShineFill400,
      outline: Symbols.WandShineOutline400,
    },
    600: {
      fill: Symbols.WandShineFill600,
      outline: Symbols.WandShineOutline600,
    },
  },
  warning: {
    400: {
      fill: Symbols.WarningFill400,
      outline: Symbols.WarningOutline400,
    },
    600: {
      fill: Symbols.WarningFill600,
      outline: Symbols.WarningOutline600,
    },
  },
  "zoom-in": {
    400: {
      fill: Symbols.ZoomInFill400,
      outline: Symbols.ZoomInOutline400,
    },
    600: {
      fill: Symbols.ZoomInFill600,
      outline: Symbols.ZoomInOutline600,
    },
  },
};

type MaterialIconProps = React.HTMLAttributes<HTMLSpanElement> & {
  name: MaterialIconName;
  weight?: MaterialIconWeight;
  filled?: boolean;
  size?: MaterialIconSize;
  className?: string;
  style?: React.CSSProperties;
};

export const MaterialIcon = forwardRef<HTMLSpanElement, MaterialIconProps>(
  function MaterialSymbol(props, ref) {
    const {
      name,
      weight = 400,
      filled = false,
      size = "md",
      className,
      style,
      ...rest
    } = props;

    const iconSize = materialIconSizeMap[size];

    const weightEntry = MATERIAL_ICON_MAP[name]?.[weight];
    const variant = filled ? "fill" : "outline";
    const SvgIconComponent = weightEntry?.[variant];

    if (!SvgIconComponent) {
      if (process.env.NODE_ENV !== "production") {
        console.warn(
          `Material Icon "${name}" with weight "${weight}" (filled=${filled}) not found`,
        );
      }
      return null;
    }

    return (
      <span
        ref={ref}
        className={classNames(
          "inline-flex items-center justify-center",
          className,
        )}
        style={{
          width: iconSize,
          height: iconSize,
          ...style,
        }}
        {...rest}
      >
        <SvgIconComponent
          fill="currentColor"
          width="100%"
          height="100%"
          role="img"
          focusable="false"
          aria-hidden="true"
        />
      </span>
    );
  },
);