import Vue from "vue";
import Vuetify from "vuetify/lib";

//---------------------------
//ICONS
//tree shaking compatible icon method
//https://stackoverflow.com/a/58261449/8939
import { library } from "@fortawesome/fontawesome-svg-core";
import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome"; //https://github.com/FortAwesome/vue-fontawesome

/*
NOTES: in case need to get fancy 
https://github.com/FortAwesome/vue-fontawesome#advanced
import {
  FontAwesomeIcon,
  FontAwesomeLayers,
  FontAwesomeLayersText
} from "@fortawesome/vue-fontawesome"; //https://github.com/FortAwesome/vue-fontawesome
Vue.component("font-awesome-layers", FontAwesomeLayers);
Vue.component("font-awesome-layers-text", FontAwesomeLayersText);


classes seem to work when props don't for
  let classes = {
    'fa-spin': props.spin,
    'fa-pulse': props.pulse,
    'fa-fw': props.fixedWidth,
    'fa-border': props.border,
    'fa-li': props.listItem,
    'fa-inverse': props.inverse,
    'fa-flip-horizontal': props.flip === 'horizontal' || props.flip === 'both',
    'fa-flip-vertical': props.flip === 'vertical' || props.flip === 'both',
    [`fa-${props.size}`]: props.size !== null,
    [`fa-rotate-${props.rotation}`]: props.rotation !== null,
    [`fa-pull-${props.pull}`]: props.pull !== null,
    'fa-swap-opacity': props.swapOpacity
  }
*/

Vue.component("font-awesome-icon", FontAwesomeIcon); // Register component globally

//REGULAR
import {
  faSquare as farSquare,
  faCircle as farCircle,
  faDotCircle as farDotCircle
} from "@fortawesome/free-regular-svg-icons";

//SOLID
import {
  faAddressBook,
  faAddressCard,
  faArrowsAltH,
  faArrowsAltV,
  faAt,
  faBackward,
  faBarcode,
  faBars,
  faBell,
  faBinoculars,
  faBold,
  faBox,
  faBoxes,
  faBoxOpen,
  faBriefcase,
  faCampground,
  faBullhorn,
  faBusinessTime,
  faCalculator,
  faCalendarAlt,
  faCalendarCheck,
  faCalendarDay,
  faCarBattery,
  faCaretDown,
  faChartBar,
  faChartLine,
  faCheckCircle,
  faCheckSquare,
  faChevronDown,
  faChevronLeft,
  faChevronRight,
  faCircle,
  faClipboard,
  faClipboardList,
  faClock,
  faClone,
  faCloud,
  faCode,
  faCoffee,
  faCog,
  faCogs,
  faCoins,
  faColumns,
  faCommentAlt,
  faCommentDollar,
  faConciergeBell,
  faCopy,
  faDiceD20,
  faDolly,
  //faDollyFlatbed,
  faDoorOpen,
  faDraftingCompass,
  faDragon,
  faDumpster,
  faEdit,
  faEgg,
  faEllipsisV,
  faEnvelopeOpenText,
  faExchangeAlt,
  faExclamation,
  faExclamationCircle,
  faExclamationTriangle,
  faExternalLinkAlt,
  faEye,
  faEyeSlash,
  faFan,
  faFeather,
  faFile,
  faFileAlt,
  faFileArchive,
  faFileAudio,
  faFileCode,
  faFileContract,
  faFileCsv,
  faFileDownload,
  faFileExcel,
  faFileImage,
  faFileImport,
  faFileMedicalAlt,
  faFilePdf,
  faFilePowerpoint,
  faFileUpload,
  faFileVideo,
  faFileWord,
  faFilter,
  faFireAlt,
  faFlag,
  faFolder,
  faForward,
  faGem,
  faGenderless,
  faGlasses,
  faGlobe,
  faHammer,
  faHandHoldingWater,
  faHeading,
  faHistory,
  faHome,
  faImage,
  faInbox,
  faInfoCircle,
  faItalic,
  faKey,
  faLanguage,
  faLayerGroup,
  faLifeRing,
  faLink,
  faListAlt,
  faListOl,
  faListUl,
  faLock,
  faLuggageCart,
  faMagic,
  faMapMarkerAlt,
  faMapMarkedAlt,
  faMinus,
  faMinusSquare,
  faMoneyBillWave,
  faMoon,
  faObjectGroup,
  faPallet,
  faPaperclip,
  //faPaperPlane,
  faParachuteBox,
  faPencilAlt,
  faPencilRuler,
  faPeopleCarry,
  faPercent,
  faPhoneAlt,
  faPlug,
  faPlus,
  faPlusCircle,
  faPrint,
  faProjectDiagram,
  faPuzzlePiece,
  faQuestionCircle,
  faQuoteLeft,
  faReply,
  faRobot,
  faRocket,
  faSave,
  faSearch,
  faSeedling,
  faServer,
  faShare,
  faShippingFast,
  faShoppingCart,
  faSignInAlt,
  faSignOutAlt,
  faSitemap,
  faSkullCrossbones,
  faSlidersH,
  faSort,
  faSortAmountDown,
  faSortAmountUp,
  faSplotch,
  faSquareFull,
  faStamp,
  faStepBackward,
  faStepForward,
  faStickyNote,
  faStore,
  faStopCircle,
  faStrikethrough,
  faSun,
  faSync,
  faTable,
  faTachometerAlt,
  faTags,
  faTasks,
  faTerminal,
  faThList,
  faTicketAlt,
  faTimesCircle,
  faToolbox,
  faTools,
  faTrashAlt,
  faTrashRestoreAlt,
  faTruckLoading,
  faTruckMonster,
  faUndo,
  faUser,
  faUserClock,
  faUserCog,
  faUsers,
  faUserTie,
  faVial,
  faWarehouse,
  faWeight,
  faWrench
} from "@fortawesome/free-solid-svg-icons";

Vue.component("font-awesome-icon", FontAwesomeIcon);

library.add(
  faAddressBook,
  faAddressCard,
  faArrowsAltH,
  faArrowsAltV,
  faAt,
  faBackward,
  faBarcode,
  faBars,
  faBell,
  faBinoculars,
  faBold,
  faBox,
  faBoxes,
  faBoxOpen,
  faBriefcase,
  faCampground,
  faBullhorn,
  faBusinessTime,
  faCalculator,
  faCalendarAlt,
  faCalendarCheck,
  faCalendarDay,
  faCarBattery,
  faCaretDown,
  faChartBar,
  faChartLine,
  faCheckCircle,
  faCheckSquare,
  faChevronDown,
  faChevronLeft,
  faChevronRight,
  faClipboard,
  faClipboardList,
  faCircle,
  farCircle,
  faClock,
  faClone,
  faCloud,
  faCode,
  faCoffee,
  faCog,
  faCogs,
  faCoins,
  faColumns,
  faCommentAlt,
  faCommentDollar,
  faConciergeBell,
  faCopy,
  faDiceD20,
  faDolly,
  //faDollyFlatbed,
  faDoorOpen,
  farDotCircle,
  faDraftingCompass,
  faDragon,
  faDumpster,
  faEdit,
  faEgg,
  faEllipsisV,
  faEnvelopeOpenText,
  faExchangeAlt,
  faExclamation,
  faExclamationCircle,
  faExclamationTriangle,
  faExternalLinkAlt,
  faEye,
  faEyeSlash,
  faFan,
  faFeather,
  faFile,
  faFileAlt,
  faFileArchive,
  faFileAudio,
  faFileCode,
  faFileContract,
  faFileCsv,
  faFileDownload,
  faFileExcel,
  faFileImage,
  faFileImport,
  faFileMedicalAlt,
  faFilePdf,
  faFilePowerpoint,
  faFileUpload,
  faFileVideo,
  faFileWord,
  faFilter,
  faFireAlt,
  faFlag,
  faFolder,
  faForward,
  faGem,
  faGenderless,
  faGlasses,
  faGlobe,
  faHammer,
  faHandHoldingWater,
  faHeading,
  faHistory,
  faHome,
  faImage,
  faInbox,
  faInfoCircle,
  faItalic,
  faKey,
  faLanguage,
  faLayerGroup,
  faLifeRing,
  faLink,
  faListAlt,
  faListOl,
  faListUl,
  faLock,
  faLuggageCart,
  faMagic,
  faMapMarkerAlt,
  faMapMarkedAlt,
  faMinus,
  faMinusSquare,
  faMoneyBillWave,
  faMoon,
  faObjectGroup,
  faPallet,
  faPaperclip,
  //faPaperPlane,
  faParachuteBox,
  faPencilAlt,
  faPencilRuler,
  faPeopleCarry,
  faPercent,
  faPhoneAlt,
  faPlug,
  faPlus,
  faPlusCircle,
  faPrint,
  faProjectDiagram,
  faPuzzlePiece,
  faQuestionCircle,
  faQuoteLeft,
  faReply,
  faRobot,
  faRocket,
  faSave,
  faSearch,
  faSeedling,
  faServer,
  faShare,
  faShippingFast,
  faShoppingCart,
  faSignInAlt,
  faSignOutAlt,
  faSitemap,
  faSkullCrossbones,
  faSlidersH,
  faSort,
  faSortAmountDown,
  faSortAmountUp,
  faSplotch,
  farSquare,
  faSquareFull,
  faStamp,
  faStepBackward,
  faStepForward,
  faStickyNote,
  faStore,
  faStopCircle,
  faStrikethrough,
  faSun,
  faSync,
  faTable,
  faTachometerAlt,
  faTags,
  faTasks,
  faTerminal,
  faThList,
  faTicketAlt,
  faTimesCircle,
  faToolbox,
  faTools,
  faTrashAlt,
  faTrashRestoreAlt,
  faTruckLoading,
  faTruckMonster,
  faUndo,
  faUser,
  faUserClock,
  faUserCog,
  faUsers,
  faUserTie,
  faVial,
  faWarehouse,
  faWeight,
  faWrench
);

const CUSTOM_ICONS = {
  sockiAddressBook: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "address-book"]
    }
  },
  sockiAddressCard: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "address-card"]
    }
  },
  sockiArrowsAltH: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "arrows-alt-h"]
    }
  },
  sockiArrowsAltV: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "arrows-alt-v"]
    }
  },
  sockiAt: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "at"]
    }
  },
  sockiBackward: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "backward"]
    }
  },
  sockiBarCode: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "barcode"]
    }
  },
  sockiBell: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "bell"]
    }
  },
  sockiBinoculars: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "binoculars"]
    }
  },
  sockiBold: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "bold"]
    }
  },
  sockiBox: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "box"]
    }
  },
  sockiBoxes: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "boxes"]
    }
  },
  sockiBoxOpen: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "box-open"]
    }
  },
  sockiBriefcase: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "briefcase"]
    }
  },
  sockiCampground: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "campground"]
    }
  },
  sockiBullhorn: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "bullhorn"]
    }
  },
  sockiBusinessTime: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "business-time"]
    }
  },
  sockiCalculator: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "calculator"]
    }
  },
  sockiCalendarAlt: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "calendar-alt"]
    }
  },
  sockiCalendarCheck: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "calendar-check"]
    }
  },
  sockiCalendarDay: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "calendar-day"]
    }
  },
  sockiCarBattery: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "car-battery"]
    }
  },
  sockiChartBar: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "chart-bar"]
    }
  },
  sockiChartLine: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "chart-line"]
    }
  },
  sockiCheckCircle: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "check-circle"]
    }
  },
  sockiCheckSquare: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "check-square"]
    }
  },
  sockiCircle: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "circle"]
    }
  },
  sockiClipboard: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "clipboard"]
    }
  },
  sockiClipboardList: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "clipboard-list"]
    }
  },
  sockiClock: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "clock"]
    }
  },
  sockiClone: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "clone"]
    }
  },
  sockiCloud: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "cloud"]
    }
  },
  sockiCode: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "code"]
    }
  },
  sockiCoffee: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "coffee"]
    }
  },
  sockiCog: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "cog"]
    }
  },
  sockiCogs: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "cogs"]
    }
  },
  sockiCoins: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "coins"]
    }
  },
  sockiColumns: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "columns"]
    }
  },
  sockiCommentAlt: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "comment-alt"]
    }
  },
  sockiCommentDollar: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "comment-dollar"]
    }
  },
  sockiConciergeBell: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "concierge-bell"]
    }
  },
  sockiCopy: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "copy"]
    }
  },
  sockiCustomize: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "sliders-h"]
    }
  },
  sockiDiceD20: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "dice-d20"]
    }
  },
  sockiDolly: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "dolly"]
    }
  },
  // sockiDollyFlatbed: {
  //   component: FontAwesomeIcon,
  //   props: {
  //     icon: ["fas", "dolly-flatbed"]
  //   }
  // },
  sockiDoorOpen: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "door-open"]
    }
  },
  sockiDraftingCompass: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "drafting-compass"]
    }
  },
  sockiDragon: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "dragon"]
    }
  },
  sockiDumpster: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "dumpster"]
    }
  },
  sockiEdit: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "edit"]
    }
  },
  sockiEgg: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "egg"]
    }
  },
  sockiEnvelopeOpenText: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "envelope-open-text"]
    }
  },
  sockiExchangeAlt: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "exchange-alt"]
    }
  },
  sockiExclamationCircle: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "exclamation-circle"]
    }
  },
  sockiExclamationTriangle: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "exclamation-triangle"]
    }
  },
  sockiExternalLinkAlt: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "external-link-alt"]
    }
  },
  sockiEye: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "eye"]
    }
  },
  sockiEyeSlash: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "eye-slash"]
    }
  },
  sockiEllipsisV: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "ellipsis-v"]
    }
  },
  sockiFan: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "fan"]
    }
  },
  sockiFeather: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "feather"]
    }
  },
  sockiFile: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "file"]
    }
  },
  sockiFileArchive: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "file-archive"]
    }
  },
  sockiFileAlt: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "file-alt"]
    }
  },
  sockiFileAudio: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "file-audio"]
    }
  },
  sockiFileCode: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "file-code"]
    }
  },
  sockiFileContract: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "file-contract"]
    }
  },
  sockiFileCsv: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "file-csv"]
    }
  },
  sockiFileDownload: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "file-download"]
    }
  },
  sockiFileExcel: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "file-excel"]
    }
  },
  sockiFileImage: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "file-image"]
    }
  },
  sockiFileImport: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "file-import"]
    }
  },
  sockiFileMedicalAlt: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "file-medical-alt"]
    }
  },
  sockiFilePdf: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "file-pdf"]
    }
  },
  sockiFilePowerpoint: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "file-powerpoint"]
    }
  },
  sockiFileUpload: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "file-upload"]
    }
  },
  sockiFileVidio: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "file-vidio"]
    }
  },
  sockiFileWord: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "file-word"]
    }
  },
  sockiFilter: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "filter"]
    }
  },
  sockiFireAlt: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "fire-alt"]
    }
  },
  sockiFlag: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "flag"]
    }
  },
  sockiFolder: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "folder"]
    }
  },
  sockiForward: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "forward"]
    }
  },
  sockiGem: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "gem"]
    }
  },
  sockiGenderless: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "genderless"]
    }
  },
  sockiGlasses: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "glasses"]
    }
  },
  sockiGlobe: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "globe"]
    }
  },
  sockiHammer: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "hammer"]
    }
  },
  sockiHandHoldingWater: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "hand-holding-water"]
    }
  },
  sockiHeading: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "heading"]
    }
  },
  sockiHistory: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "history"]
    }
  },
  sockiHome: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "home"]
    }
  },
  sockiImage: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "image"]
    }
  },
  sockiInbox: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "inbox"]
    }
  },
  sockiInfoCircle: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "info-circle"]
    }
  },
  sockiItalic: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "italic"]
    }
  },
  sockiKey: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "key"]
    }
  },
  sockiLanguage: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "language"]
    }
  },
  sockiLayerGroup: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "layer-group"]
    }
  },
  sockiLifeRing: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "life-ring"]
    }
  },
  sockiLink: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "link"]
    }
  },
  sockiListAlt: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "list-alt"]
    }
  },
  sockiListOl: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "list-ol"]
    }
  },
  sockiListUl: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "list-ul"]
    }
  },
  sockiLock: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "lock"]
    }
  },
  sockiLuggageCart: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "luggage-cart"]
    }
  },
  sockiMagic: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "magic"]
    }
  },
  sockiMapMarker: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "map-marker-alt"]
    }
  },
  sockiMapMarked: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "map-marked-alt"]
    }
  },
  sockiMinus: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "minus"]
    }
  },
  sockiMoneyBillWave: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "money-bill-wave"]
    }
  },
  sockiMoon: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "moon"]
    }
  },
  sockiObjectGroup: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "object-group"]
    }
  },
  sockiPallet: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "pallet"]
    }
  },
  sockiPaperclip: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "paperclip"]
    }
  },
  // sockiPaperPlane: {
  //   component: FontAwesomeIcon,
  //   props: {
  //     icon: ["fas", "paper-plane"]
  //   }
  // },
  sockiParachuteBox: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "parachute-box"]
    }
  },
  sockiPencilAlt: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "pencil-alt"]
    }
  },
  sockiPencilRuler: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "pencil-ruler"]
    }
  },
  sockiPeopleCarry: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "people-carry"]
    }
  },
  sockiPercent: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "percent"]
    }
  },
  sockiPhoneAlt: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "phone-alt"]
    }
  },
  sockiPlug: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "plug"]
    }
  },
  sockiPlus: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "plus"]
    }
  },
  sockiPlusCircle: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "plus-circle"]
    }
  },
  sockiPrint: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "print"]
    }
  },
  sockiProjectDiagram: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "project-diagram"]
    }
  },
  sockiPuzzlePiece: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "puzzle-piece"]
    }
  },
  sockiQuestionCircle: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "question-circle"]
    }
  },
  sockiQuoteLeft: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "quote-left"]
    }
  },
  sockiReply: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "reply"]
    }
  },
  sockiRobot: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "robot"]
    }
  },
  sockiRocket: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "rocket"]
    }
  },
  sockiSave: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "save"]
    }
  },
  sockiSearch: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "search"]
    }
  },
  sockiSeedling: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "seedling"]
    }
  },
  sockiServer: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "server"]
    }
  },
  sockiShare: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "share"]
    }
  },
  sockiShippingFast: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "shipping-fast"]
    }
  },
  sockiShoppingCart: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "shopping-cart"]
    }
  },
  sockiSignIn: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "sign-in-alt"]
    }
  },
  sockiSignOut: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "sign-out-alt"]
    }
  },
  sockiSitemap: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "sitemap"]
    }
  },
  sockiSkullCrossbones: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "skull-crossbones"]
    }
  },
  sockiSort: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "sort"]
    }
  },
  sockiSortAmountDown: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "sort-amount-down"]
    }
  },
  sockiSortAmountUp: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "sort-amount-up"]
    }
  },
  sockiSplotch: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "splotch"]
    }
  },
  sockiStamp: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "stamp"]
    }
  },
  sockiSquare: {
    component: FontAwesomeIcon,
    props: {
      icon: ["far", "square"]
    }
  },
  sockiSquareFull: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "square-full"]
    }
  },
  sockiStepBackward: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "step-backward"]
    }
  },
  sockiStepForward: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "step-forward"]
    }
  },
  sockiStickyNote: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "sticky-note"]
    }
  },
  sockiStore: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "store"]
    }
  },
  sockiStopCircle: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "stop-circle"]
    }
  },
  sockiStrikethrough: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "strikethrough"]
    }
  },
  sockiSun: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "sun"]
    }
  },
  sockiSync: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "sync"]
    }
  },
  sockiTable: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "table"]
    }
  },
  sockiTachometer: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "tachometer-alt"]
    }
  },
  sockiTags: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "tags"]
    }
  },
  sockiTasks: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "tasks"]
    }
  },
  sockiTerminal: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "terminal"]
    }
  },
  sockiThList: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "th-list"]
    }
  },
  sockiTicket: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "ticket-alt"]
    }
  },
  sockiToolbox: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "toolbox"]
    }
  },
  sockiTools: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "tools"]
    }
  },
  sockiTrashAlt: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "trash-alt"]
    }
  },
  sockiTrashRestoreAlt: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "trash-restore-alt"]
    }
  },
  sockiTruckLoading: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "truck-loading"]
    }
  },
  sockiTruckMonster: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "truck-monster"]
    }
  },
  sockiUndo: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "undo"]
    }
  },
  sockiUser: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "user"]
    }
  },
  sockiUserClock: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "user-clock"]
    }
  },
  sockiUserCog: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "user-cog"]
    }
  },
  sockiUsers: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "users"]
    }
  },
  sockiUserTie: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "user-tie"]
    }
  },
  sockiVial: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "vial"]
    }
  },
  sockiWarehouse: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "warehouse"]
    }
  },
  sockiWeight: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "weight"]
    }
  },
  sockiWrench: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "wrench"]
    }
  },
  //VUETIFY REQUIRED ONES
  //https://vuetifyjs.com/en/features/icons/#using-custom-icons
  checkboxIndeterminate: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "minus-square"]
    }
  },
  clear: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "times-circle"]
    }
  },
  dropdown: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "caret-down"]
    }
  },
  exclamation: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "exclamation"]
    }
  },
  info: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "info-circle"]
    }
  },
  menu: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "bars"]
    }
  },
  prev: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "chevron-left"]
    }
  },
  radioOn: {
    component: FontAwesomeIcon,
    props: {
      icon: ["far", "dot-circle"]
    }
  },
  radioOff: {
    component: FontAwesomeIcon,
    props: {
      icon: ["far", "circle"]
    }
  },
  next: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "chevron-right"]
    }
  },
  sort: {
    component: FontAwesomeIcon,
    props: {
      icon: ["fas", "chevron-down"]
    }
  }
};
//-------------

Vue.use(Vuetify);

export default new Vuetify({
  theme: {
    themes: {
      light: {
        primary: "#263238",
        secondary: "#37474F",
        accent: "#DB7022", //lighter orangey red, more friendly looking
        error: "#FF5252", //lighter red
        disabled: "#C7C7C7",
        readonlybanner: "#808080"
      },
      dark: {
        //color adjuster tool: https://www.hexcolortool.com/#00205c
        primary: "#7F9FDA", //dark blue LIGHTENED 50%
        secondary: "#006B24", //green DARKENED 10%
        accent: "#DB7022", //lighter orangey red, more friendly looking
        error: "#FF5252", //lighter red
        disabled: "#C7C7C7",
        readonlybanner: "#808080"
      }
    },
    options: { variations: false }
  },
  icons: {
    iconfont: "faSvg",
    values: CUSTOM_ICONS
  }
});
