jobiqo-cl/lib/src/components/03-molecules/08-theme-toggle/index.js

[](https://circleci.com/gh/jobiqo/jobiqo-cl)

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }

var React = require('react');
var React__default = _interopDefault(React);
var index = require('../../02-atoms/01-forms/10-toggle/index.js');

/**
 * @file index.tsx
 *
 * @fileoverview A theme toggle to swith between light and dark mode.
 */
const modes = [
    {
        name: 'light',
        title: 'Light',
        icon: 'sun'
    },
    {
        name: 'dark',
        title: 'Dark',
        icon: 'moon'
    }
];
/**
 * A theme toggle to swith between light and dark mode.
 */
const ToggleDarkTheme = ({ onClick }) => {
    const [currentTheme, setTheme] = React.useState(modes[0].name);
    return (React__default.createElement(index.default, { id: "toggle-theme-mode", label: modes.filter(f => f.name === currentTheme)[0].title, onChange: () => {
            setTheme(currentTheme === 'light' ? 'dark' : 'light');
            onClick(currentTheme === 'light' ? 'dark' : 'light');
        }, switchStyle: "primary", textOn: "\uD83C\uDF19", textOff: "\uD83D\uDD05", width: 50 }));
};

exports.ToggleDarkTheme = ToggleDarkTheme;