import {
  global,
  TagProps
// } from '@declaration'
} from '../@declaration/_'

import { $,getInstance } from './_'

export const ColorObjects: {
  key: TagProps.ThemeColor
  isBrand: boolean
  isAvocado: boolean
}[] = [
    { key: 'comun',isBrand: false,isAvocado: true },
    { key: 'leaf',isBrand: false,isAvocado: true },
    { key: 'heart',isBrand: false,isAvocado: true },
    { key: 'droplet',isBrand: false,isAvocado: true },
    { key: 'brick',isBrand: false,isAvocado: false },
    { key: 'flower',isBrand: false,isAvocado: false },
    { key: 'lip',isBrand: false,isAvocado: false },
    { key: 'wine',isBrand: false,isAvocado: false },
    { key: 'theater',isBrand: false,isAvocado: false },
    { key: 'bat',isBrand: false,isAvocado: false },
    { key: 'poizon',isBrand: false,isAvocado: false },
    { key: 'eggplant',isBrand: false,isAvocado: false },
    { key: 'ufo',isBrand: false,isAvocado: false },
    { key: 'alien',isBrand: false,isAvocado: false },
    { key: 'tombstone',isBrand: false,isAvocado: false },
    { key: 'ninja',isBrand: false,isAvocado: false },
    { key: 'moon',isBrand: false,isAvocado: false },
    { key: 'rain',isBrand: false,isAvocado: false },
    { key: 'unicorn',isBrand: false,isAvocado: false },
    { key: 'axe',isBrand: false,isAvocado: false },
    { key: 'gem',isBrand: false,isAvocado: false },
    { key: 'soap',isBrand: false,isAvocado: false },
    { key: 'drizzle',isBrand: false,isAvocado: false },
    { key: 'building',isBrand: false,isAvocado: false },
    { key: 'fish',isBrand: false,isAvocado: false },
    { key: 'icicles',isBrand: false,isAvocado: false },
    { key: 'water',isBrand: false,isAvocado: false },
    { key: 'tree1',isBrand: false,isAvocado: false },
    { key: 'tree2',isBrand: false,isAvocado: false },
    { key: 'tree3',isBrand: false,isAvocado: false },
    { key: 'battery',isBrand: false,isAvocado: false },
    { key: 'seedle',isBrand: false,isAvocado: false },
    { key: 'greenTea',isBrand: false,isAvocado: false },
    { key: 'oak',isBrand: false,isAvocado: false },
    { key: 'salad',isBrand: false,isAvocado: false },
    { key: 'cloudy',isBrand: false,isAvocado: false },
    { key: 'lemon',isBrand: false,isAvocado: false },
    { key: 'angel',isBrand: false,isAvocado: false },
    { key: 'parasol',isBrand: false,isAvocado: false },
    { key: 'pizza',isBrand: false,isAvocado: false },
    { key: 'thunder',isBrand: false,isAvocado: false },
    { key: 'latte',isBrand: false,isAvocado: false },
    { key: 'island',isBrand: false,isAvocado: false },
    { key: 'shovel',isBrand: false,isAvocado: false },
    { key: 'coffee',isBrand: false,isAvocado: false },
    { key: 'carrot',isBrand: false,isAvocado: false },
    { key: 'cactus',isBrand: false,isAvocado: false },
    { key: 'volcano',isBrand: false,isAvocado: false },
    { key: 'choco',isBrand: false,isAvocado: false },
    { key: 'industry',isBrand: false,isAvocado: false },
    { key: 'gun',isBrand: false,isAvocado: false },
    { key: 'galaxy',isBrand: false,isAvocado: false },
    { key: 'line',isBrand: true,isAvocado: false },
    { key: 'twitter',isBrand: true,isAvocado: false },
    { key: 'amazon',isBrand: true,isAvocado: false },
    { key: 'facebook',isBrand: true,isAvocado: false },
    { key: 'android',isBrand: true,isAvocado: false },
    { key: 'slackBlue',isBrand: true,isAvocado: false },
    { key: 'slackGreen',isBrand: true,isAvocado: false },
    { key: 'slackRed',isBrand: true,isAvocado: false },
    { key: 'slackYellow',isBrand: true,isAvocado: false },
    { key: 'slackBase',isBrand: true,isAvocado: false },
    { key: 'googleBlue',isBrand: true,isAvocado: false },
    { key: 'googleGreen',isBrand: true,isAvocado: false },
    { key: 'googleYellow',isBrand: true,isAvocado: false },
    { key: 'googleRed',isBrand: true,isAvocado: false },
  ]

export const SetThemeColorTag = () => {
  let hex = '#45515c'
  let meta = $( '#ThemeColorMetaTag' )
  if ( !meta[ 0 ] ) return
  meta.setAttribute( 'content',hex )
}

const DarkmodeColors: {
  light: string
  dark: string
  dim: string
  auto(): string
} = {
  light: '#FFF',
  dark: '#333',
  dim: '#666',
  auto: () => {
    return getInstance().config.device.isSystemDarkmode() ? '#333' : '#FFF'
  }
}

const ThemeColors: {
  [ key in TagProps.ThemeColor ]: {
    alfa( alfa?: number ): string
    isBrand: boolean
    isAvocado: boolean
  }
} = {} as any
ColorObjects.forEach( ( ColorObject ) => {
  let { key,isAvocado,isBrand } = ColorObject

  ThemeColors[ key ] = {
    alfa: ( alfa?: number ) => ( `hsla( var( --cH_${ key } ),var( --cS_${ key } ),var( --cL_${ key } ),${ alfa ?? 1 } ) ` ),
    isAvocado,
    isBrand,
  }
} )

export {
  DarkmodeColors,
  ThemeColors
}