design-system-starter
Version:
Design system starter
17 lines (14 loc) • 1.29 kB
JavaScript
/* design-system-starter v0.0.10 © 2019 Ryan Fitzer */
import { _ as _JSXStyle } from './style-9e80a169.js';
import React, { useState, useEffect, Fragment } from 'react';
import Button from './button.js';
import { object } from 'prop-types';
import { _ as _slicedToArray, u as useTheme } from './index-1ee91cde.js';
/**
* Clicker
*
* @param {Object} [theme] - A theme object.
*
* @returns {HTMLElement}
*/var Clicker=function Clicker(_ref){var theme=_ref.theme;var _useState=useState(0),_useState2=_slicedToArray(_useState,2),count=_useState2[0],setCount=_useState2[1];var tokens=useTheme(theme);function updateCount(){setCount(count+1);}useEffect(function(){document.title="You clicked ".concat(count," times");});return React.createElement(Fragment,null,React.createElement("div",{className:_JSXStyle.dynamic([["3821067583",[tokens.fontBase]]])},React.createElement("p",{className:_JSXStyle.dynamic([["3821067583",[tokens.fontBase]]])+" "+'msg'},"You clicked ",count," ",count===1?'time':'times'),React.createElement(Button,{text:"Click Me!",onClick:updateCount})),React.createElement(_JSXStyle,{id:"3821067583",dynamic:[tokens.fontBase]},[".msg.__jsx-style-dynamic-selector{font-family:".concat(tokens.fontBase,";}")]));};Clicker.propTypes={theme:object};
export default Clicker;