var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

import R from 'ramda';
import React from 'react';
import seeds, { Seed } from 'react-seeds';
import rgba from 'react-sow/rgba';

import * as assets from './assets';
import * as Vanilla from './Vanilla';
import { renderTreeUsing } from './render';

var buttonTagsToClass = R.uncurryN(3, function (resolveContent, contentIsTrue) {
	return R.converge(R.unapply(R.join(' ')), [R.always('btn'), R.cond([[contentIsTrue('primary'), R.always('btn-primary')],
	//[ contentIsTrue('link'), R.always('btn-link') ],
	[R.T, R.always('btn-default')]]), R.cond([[contentIsTrue('large'), R.always('btn-lg')], [contentIsTrue('small'), R.always('btn-sm')], [contentIsTrue('extrasmall'), R.always('btn-xs')], [R.T, R.always('')]])]);
});

export var button = function button(tags, mentions, texts, children, Element, resolveContent) {
	var contentIsTrue = R.propSatisfies(function (value) {
		return resolveContent(value, { single: true }) == true;
	});

	var Component = 'button';
	var url = void 0;
	if (R.has('link', tags)) {
		Component = 'a';
		url = resolveContent(tags.link);
	}

	var onClick = void 0;
	if (R.has('toggle', tags)) {
		onClick = function onClick() {
			resolveContent(tags.toggle, { alter: R.not });
		};
	}

	return React.createElement(Component, _extends({
		href: url
	}, seeds({
		alignSelf: 'center',
		margin: { bottom: '0.5rem' },
		maxWidth: '20em'
	}), {
		className: buttonTagsToClass(resolveContent, contentIsTrue, tags),
		children: texts,
		onClick: onClick
	}));
};
export var cta = button;

var panelTagsToClass = R.uncurryN(3, function (resolveContent, contentIsTrue) {
	return R.converge(R.unapply(R.join(' ')), [R.always('panel'), R.cond([[contentIsTrue('primary'), R.always('panel-primary')], [contentIsTrue('success'), R.always('panel-success')], [contentIsTrue('info'), R.always('panel-info')], [contentIsTrue('warning'), R.always('panel-warning')], [contentIsTrue('danger'), R.always('panel-danger')], [R.T, R.always('panel-default')]])]);
});

export var panel = function panel(tags, mentions, texts, children, Element, resolveContent) {
	var contentIsTrue = R.propSatisfies(function (value) {
		return resolveContent(value, true) == true;
	});

	return React.createElement(
		Seed,
		{ Component: 'div',
			className: panelTagsToClass(resolveContent, contentIsTrue, tags),
			alignSelf: 'center',
			margin: { bottom: '0.5rem' },
			maxWidth: '20em'
		},
		React.createElement(
			'div',
			{ className: 'panel-heading' },
			React.createElement('h2', { className: 'panel-title', children: texts })
		),
		React.createElement(
			'div',
			{ className: 'panel-body' },
			children.map(function (element, index) {
				return React.createElement(Element, _extends({}, element, { key: index }));
			})
		)
	);
};

var elementRendererForTags = Vanilla.extendTagConds([[R.has('field'), R.curry(Vanilla.makeField({ wrapInDiv: true, wrapperClassName: 'form-group', inputClassName: 'form-control' }))], [R.has('card'), R.curry(panel)], [R.has('panel'), R.curry(panel)], [R.has('button'), R.curry(button)], [R.has('cta'), R.curry(cta)]]);

export var Preview = renderTreeUsing({ elementRendererForTags: elementRendererForTags });

export var title = 'Bootstrap 3';

export function head() {
	return [React.createElement('link', { key: 'css',
		rel: 'stylesheet', type: 'text/css',
		href: 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css'
	}), React.createElement('script', { key: 'js',
		src: 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js'
	})];
}