design-system-starter/dist/cjs/clicker.js

Design system starter

/* design-system-starter v0.0.10 © 2019 Ryan Fitzer */
'use strict';

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

var style = require('./style-d84cd230.js');
var React = require('react');
var React__default = _interopDefault(React);
var button = require('./button.js');
var propTypes = require('prop-types');
var theme = require('./index-fd9ae482.js');

/**
 * Clicker
 *
 * @param {Object} [theme] - A theme object.
 *
 * @returns {HTMLElement}
 */var Clicker=function Clicker(_ref){var theme$1=_ref.theme;var _useState=React.useState(0),_useState2=theme._slicedToArray(_useState,2),count=_useState2[0],setCount=_useState2[1];var tokens=theme.useTheme(theme$1);function updateCount(){setCount(count+1);}React.useEffect(function(){document.title="You clicked ".concat(count," times");});return React__default.createElement(React.Fragment,null,React__default.createElement("div",{className:style._JSXStyle.dynamic([["3821067583",[tokens.fontBase]]])},React__default.createElement("p",{className:style._JSXStyle.dynamic([["3821067583",[tokens.fontBase]]])+" "+'msg'},"You clicked ",count," ",count===1?'time':'times'),React__default.createElement(button,{text:"Click Me!",onClick:updateCount})),React__default.createElement(style._JSXStyle,{id:"3821067583",dynamic:[tokens.fontBase]},[".msg.__jsx-style-dynamic-selector{font-family:".concat(tokens.fontBase,";}")]));};Clicker.propTypes={theme:propTypes.object};

module.exports = Clicker;