simplereactcontrols/dist/index.js

Simple react controls to make prototyping easy!

!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define("simplecontrols",["React"],t):"object"==typeof exports?exports.simplecontrols=t(require("react")):e.simplecontrols=t(e.React)}(window,(function(e){return function(e){var t={};function n(o){if(t[o])return t[o].exports;var a=t[o]={i:o,l:!1,exports:{}};return e[o].call(a.exports,a,a.exports,n),a.l=!0,a.exports}return n.m=e,n.c=t,n.d=function(e,t,o){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:o})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(n.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var a in e)n.d(o,a,function(t){return e[t]}.bind(null,a));return o},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="/dist/",n(n.s=8)}([function(t,n){t.exports=e},function(e,t,n){e.exports=n(6)()},function(e,t,n){var o=n(3),a=n(4);"string"==typeof(a=a.__esModule?a.default:a)&&(a=[[e.i,a,""]]);var r={insert:"head",singleton:!1},i=(o(a,r),a.locals?a.locals:{});e.exports=i},function(e,t,n){"use strict";var o,a=function(){return void 0===o&&(o=Boolean(window&&document&&document.all&&!window.atob)),o},r=function(){var e={};return function(t){if(void 0===e[t]){var n=document.querySelector(t);if(window.HTMLIFrameElement&&n instanceof window.HTMLIFrameElement)try{n=n.contentDocument.head}catch(e){n=null}e[t]=n}return e[t]}}(),i=[];function s(e){for(var t=-1,n=0;n<i.length;n++)if(i[n].identifier===e){t=n;break}return t}function c(e,t){for(var n={},o=[],a=0;a<e.length;a++){var r=e[a],c=t.base?r[0]+t.base:r[0],l=n[c]||0,u="".concat(c," ").concat(l);n[c]=l+1;var p=s(u),d={css:r[1],media:r[2],sourceMap:r[3]};-1!==p?(i[p].references++,i[p].updater(d)):i.push({identifier:u,updater:b(d,t),references:1}),o.push(u)}return o}function l(e){var t=document.createElement("style"),o=e.attributes||{};if(void 0===o.nonce){var a=n.nc;a&&(o.nonce=a)}if(Object.keys(o).forEach((function(e){t.setAttribute(e,o[e])})),"function"==typeof e.insert)e.insert(t);else{var i=r(e.insert||"head");if(!i)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");i.appendChild(t)}return t}var u,p=(u=[],function(e,t){return u[e]=t,u.filter(Boolean).join("\n")});function d(e,t,n,o){var a=n?"":o.media?"@media ".concat(o.media," {").concat(o.css,"}"):o.css;if(e.styleSheet)e.styleSheet.cssText=p(t,a);else{var r=document.createTextNode(a),i=e.childNodes;i[t]&&e.removeChild(i[t]),i.length?e.insertBefore(r,i[t]):e.appendChild(r)}}function f(e,t,n){var o=n.css,a=n.media,r=n.sourceMap;if(a?e.setAttribute("media",a):e.removeAttribute("media"),r&&btoa&&(o+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(r))))," */")),e.styleSheet)e.styleSheet.cssText=o;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(o))}}var m=null,h=0;function b(e,t){var n,o,a;if(t.singleton){var r=h++;n=m||(m=l(t)),o=d.bind(null,n,r,!1),a=d.bind(null,n,r,!0)}else n=l(t),o=f.bind(null,n,t),a=function(){!function(e){if(null===e.parentNode)return!1;e.parentNode.removeChild(e)}(n)};return o(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap)return;o(e=t)}else a()}}e.exports=function(e,t){(t=t||{}).singleton||"boolean"==typeof t.singleton||(t.singleton=a());var n=c(e=e||[],t);return function(e){if(e=e||[],"[object Array]"===Object.prototype.toString.call(e)){for(var o=0;o<n.length;o++){var a=s(n[o]);i[a].references--}for(var r=c(e,t),l=0;l<n.length;l++){var u=s(n[l]);0===i[u].references&&(i[u].updater(),i.splice(u,1))}n=r}}}},function(e,t,n){(t=n(5)(!1)).push([e.i,'@-moz-keyframes spin{100%{-moz-transform:rotate(360deg)}}@-webkit-keyframes spin{100%{-webkit-transform:rotate(360deg)}}@keyframes spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,footer,header,nav,section{display:block}h1{font-size:2em;margin:0.67em 0}figcaption,figure,main{display:block}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace, monospace;font-size:1em}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em}dfn{font-style:italic}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}audio,video{display:inline-block}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,html [type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{display:inline-block;vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px}[type="search"]::-webkit-search-cancel-button,[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details,menu{display:block}summary{display:list-item}canvas{display:inline-block}template{display:none}[hidden]{display:none}html{box-sizing:border-box}*,*::before,*::after{box-sizing:inherit}a{color:#e50050;text-decoration:none}a:hover,a:active,a:focus{color:#222;text-decoration:underline}body{color:#222;font:normal 125%/1.4 "Open Sans","Helvetica Neue Light","Helvetica Neue","Helvetica","Arial",sans-serif}.clearfix::after{clear:both;content:"";display:table}.container{max-width:1180px;margin-left:auto;margin-right:auto;padding-left:20px;padding-right:20px;width:100%}.hide-text{overflow:hidden;padding:0;text-indent:101%;white-space:nowrap}.visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.autocomplete{display:flex;position:relative;border:1px solid grey;margin:auto auto;display:flex;position:relative;width:100%}.autocomplete__searchbox{flex-grow:1;position:relative}.autocomplete__searchbox input{padding-left:1rem;width:90%;border:none}.autocomplete__searchbox input:focus,.autocomplete__searchbox textarea:focus,.autocomplete__searchbox select:focus{outline:none}.autocomplete__clearbutton:hover:after,.autocomplete__clearbutton:hover:before{color:red;background-color:red;cursor:pointer}.autocomplete__clearbutton::before,.autocomplete__clearbutton::after{margin:auto auto;position:absolute;right:20px;content:" ";height:100%;height:50%;width:2px;background-color:#333;top:25%;transform:translate(-25%, -25%)}.autocomplete__clearbutton::before{transform:rotate(45deg)}.autocomplete__clearbutton::after{transform:rotate(-45deg)}.autocomplete__searching{transition:all 0.5s ease-in-out;position:absolute;width:100%;top:100%}.autocomplete__searchresults{transition:all 0.5s ease-in-out;position:absolute;width:100%;top:100%}.autocomplete ul{list-style:none;padding-inline-start:0;margin:0;border:1px solid grey;background-color:#fff;z-index:5}.autocomplete ul li{padding:0;padding-left:0.5rem;margin:0;text-align:left;transition:all 0.5s ease-in-out}.autocomplete ul li:hover{background-color:#f2f2f2;text-decoration:underline}.checkboxlist{width:100%;display:flex;flex-flow:row wrap;padding:0 0.5rem 0 0.5rem;justify-content:space-between;flex-wrap:wrap}@media only screen and (max-width: 800px){.checkboxlist{display:block}}@media only screen and (max-width: 800px){.checkboxlistitem{display:block}.checkboxlistitem__label{display:inline-flex;width:40%;padding-right:1rem;padding-left:0.5rem;word-wrap:wrap}}\n',""]),e.exports=t},function(e,t,n){"use strict";e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n=function(e,t){var n=e[1]||"",o=e[3];if(!o)return n;if(t&&"function"==typeof btoa){var a=(i=o,s=btoa(unescape(encodeURIComponent(JSON.stringify(i)))),c="sourceMappingURL=data:application/json;charset=utf-8;base64,".concat(s),"/*# ".concat(c," */")),r=o.sources.map((function(e){return"/*# sourceURL=".concat(o.sourceRoot||"").concat(e," */")}));return[n].concat(r).concat([a]).join("\n")}var i,s,c;return[n].join("\n")}(t,e);return t[2]?"@media ".concat(t[2]," {").concat(n,"}"):n})).join("")},t.i=function(e,n,o){"string"==typeof e&&(e=[[null,e,""]]);var a={};if(o)for(var r=0;r<this.length;r++){var i=this[r][0];null!=i&&(a[i]=!0)}for(var s=0;s<e.length;s++){var c=[].concat(e[s]);o&&a[c[0]]||(n&&(c[2]?c[2]="".concat(n," and ").concat(c[2]):c[2]=n),t.push(c))}},t}},function(e,t,n){"use strict";var o=n(7);function a(){}function r(){}r.resetWarningCache=a,e.exports=function(){function e(e,t,n,a,r,i){if(i!==o){var s=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw s.name="Invariant Violation",s}}function t(){return e}e.isRequired=e;var n={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,elementType:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t,checkPropTypes:r,resetWarningCache:a};return n.PropTypes=n,n}},function(e,t,n){"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(e,t,n){"use strict";n.r(t),n.d(t,"Autocomplete",(function(){return c})),n.d(t,"CheckboxList",(function(){return u})),n.d(t,"DropdownList",(function(){return d}));n(2);var o=n(0),a=n.n(o),r=n(1),i=n.n(r);class s extends o.Component{constructor(e){super(e),this.state={resultsExpanded:!1,searching:!1,searchvalue:"",results:[]}}render(){const e=e=>{this.props.onSelectedResult(e),this.setState({searching:!1,resultsExpanded:!1,searchvalue:e.DisplayText})};return a.a.createElement("div",{className:"autocomplete",id:"autocomplete"},a.a.createElement("div",{className:"autocomplete__searchbox",id:"instance-id"},a.a.createElement("input",{type:"text",className:"autocomplete__input",onChange:e=>{""===e.target.value?this.setState({searchvalue:e.target.value,searching:!1,resultsExpanded:!1,results:[]}):this.setState({searchvalue:e.target.value,searching:!0,resultsExpanded:!1,results:[]}),this.props.onFetchData(e.target.value,e=>{this.setState({searching:!0,resultsExpanded:!0,results:e})})},value:this.state.searchvalue}),a.a.createElement("a",{onClick:()=>{this.setState({searching:!1,resultsExpanded:!1,searchvalue:""})}},a.a.createElement("span",{className:"autocomplete__clearbutton"}))),(()=>this.state.resultsExpanded?a.a.createElement("div",{className:"autocomplete__searchresults"},a.a.createElement("ul",null,this.state.results.map(t=>a.a.createElement("li",{key:t.DisplayText,onClick:()=>e(t)},t.DisplayText||"")))):this.state.searching?a.a.createElement("div",{className:"autocomplete__searching"},a.a.createElement("ul",null,a.a.createElement("li",null,this.props.searchText||"Searching..."))):void 0)())}}s.propTypes={onSelectedResult:i.a.func.isRequired,onFetchData:i.a.func,searchText:i.a.string};var c=s;class l extends o.Component{constructor(e){super(e),this.state={data:this.props.data}}render(){const e=(e,t)=>{"on"===e.target.value?this.props.onSelect(e,t):this.props.onDeselect(e,t)};return a.a.createElement("div",{className:"checkboxlist",id:"checkboxlist"},this.state.data.map((t,n)=>a.a.createElement("div",{key:n,className:"checkboxlistitem"},a.a.createElement("label",{className:"checkboxlistitem__label"},t.DisplayText),a.a.createElement("input",{type:"checkbox",className:"checkboxlistitem__checkbox",onChange:n=>e(n,t)}))))}}l.propTypes={data:i.a.arrayOf(i.a.shape({DisplayText:i.a.string,DefaultValue:i.a.bool,Value:i.a.string})).isRequired,onSelect:i.a.func.isRequired,onDeselect:i.a.func.isRequired};var u=l;class p extends o.Component{constructor(e){super(e),this.state={data:this.props.data}}render(){const e=(e,t)=>{let n=this.state.data.find(t=>t.value===e.target.value);this.props.onSelect(e,n)};return a.a.createElement("select",{className:"dropdownlist",defaultValue:this.props.DefaultValue,onChange:(t,n)=>e(t)},this.state.data.map((e,t)=>a.a.createElement("option",{key:t,value:e.value},e.DisplayText)))}}p.propTypes={data:i.a.arrayOf(i.a.shape({DisplayText:i.a.string,Value:i.a.string})).isRequired,onSelect:i.a.func.isRequired,DefaultValue:i.a.bool};var d=p}])}));