@polygon.io/core/dist/components/Select/ButtonSelect.js

A set of themeable UI components for React

"use strict";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault"),_typeof=require("@babel/runtime/helpers/typeof");Object.defineProperty(exports,"__esModule",{value:!0}),exports["default"]=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends")),_react=_interopRequireWildcard(require("react")),_styledComponents=_interopRequireDefault(require("styled-components")),_reactPopper=require("react-popper"),_useOnClickOutside=_interopRequireDefault(require("../../hooks/useOnClickOutside")),_Button=_interopRequireDefault(require("../Button")),_Text=_interopRequireDefault(require("../Text/Text")),_Padding=_interopRequireDefault(require("../Padding")),_index=require("./index.styles");function _getRequireWildcardCache(a){if("function"!=typeof WeakMap)return null;var b=new WeakMap,c=new WeakMap;return(_getRequireWildcardCache=function(a){return a?c:b})(a)}function _interopRequireWildcard(a,b){if(!b&&a&&a.__esModule)return a;if(null===a||"object"!==_typeof(a)&&"function"!=typeof a)return{default:a};var c=_getRequireWildcardCache(b);if(c&&c.has(a))return c.get(a);var d={},e=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var f in a)if("default"!=f&&Object.prototype.hasOwnProperty.call(a,f)){var g=e?Object.getOwnPropertyDescriptor(a,f):null;g&&(g.get||g.set)?Object.defineProperty(d,f,g):d[f]=a[f]}return d["default"]=a,c&&c.set(a,d),d}var __jsx=_react["default"].createElement,StyledIcon=(0,_styledComponents["default"])(_index.Icon).withConfig({displayName:"ButtonSelect__StyledIcon",componentId:"sc-qpctg2-0"})(["padding:0;"]),StyledOptionList=(0,_styledComponents["default"])(_index.OptionList).withConfig({displayName:"ButtonSelect__StyledOptionList",componentId:"sc-qpctg2-1"})(["display:",";width:auto;"],function(a){var b=a.visible;return b?"block":"none"}),ButtonSelect=function(a){var b,c=a.onSelect,d=a.sections,e=a.options,f=a.addMaxHeight,g=a.disabled,h=(0,_react.useRef)(null),i=(0,_react.useState)(0),j=i[0],k=i[1],l=(0,_react.useRef)(null),m=(0,_react.useRef)(null),n=(0,_react.useState)(!1),o=n[0],p=n[1],q=(0,_reactPopper.usePopper)(l.current,m.current,{placement:"bottom-start",modifiers:[{name:"offset",options:{offset:[0,8]}},{name:"eventListeners",enabled:o}]}),r=q.styles,s=q.attributes;(0,_useOnClickOutside["default"])(h,function(){return p(!1)});var t=(null===(b=h.current)||void 0===b?void 0:b.querySelectorAll("menu button"))||[],u=function(){var a,b;b=j===t.length-1?0:j+1,k(b),null===t||void 0===t||null===(a=t[b])||void 0===a?void 0:a.focus()},v=function(){var a,b;b=0===j?t.length-1:j-1,k(b),null===t||void 0===t||null===(a=t[b])||void 0===a?void 0:a.focus()};return __jsx("div",{ref:h},__jsx("span",{ref:l},__jsx(_Button["default"],{small:!0,secondary:!0,disabled:g,onClick:function onClick(){g||p(!o)},onKeyDown:function onKeyDown(a){if("Escape"===a.code&&(a.preventDefault(),p(!1)),"Tab"===a.code&&o&&a.preventDefault(),("Space"===a.code||"Enter"===a.code)&&(a.preventDefault(),p(!o)),"ArrowDown"===a.code||"ArrowUp"===a.code){var b;a.preventDefault(),p(!0),null===t||void 0===t||null===(b=t[j])||void 0===b?void 0:b.focus()}}},__jsx(StyledIcon,{className:"far fa-ellipsis-h",small:"true"}))),__jsx(StyledOptionList,(0,_extends2["default"])({addMaxHeight:f,ref:m,small:"true",style:r.popper,visible:o// eslint-disable-next-line react/jsx-props-no-spreading
},s.popper),0<(null===d||void 0===d?void 0:d.length)&&d.map(function(a){return __jsx(_react["default"].Fragment,{key:a},__jsx(_index.ListTitle,{small:!0},__jsx(_Text["default"],{as:"span",size:"3",color:"primary",weight:"medium"},a)),e.map(function(b){var d=b.label,e=b.value,f=b.section;return f===a&&__jsx("li",{key:"".concat(a,"-").concat(d,"-").concat(e)},__jsx(_Padding["default"],{l:"3"},__jsx("button",{onClick:function onClick(){c(e),p(!1)},onKeyDown:function onKeyDown(a){a.preventDefault(),"Escape"===a.code&&p(!1),("Space"===a.code||"Enter"===a.code)&&(a.preventDefault(),c(e),p(!1)),"ArrowDown"===a.code&&u(),"ArrowUp"===a.code&&v()},type:"button"},__jsx(_Text["default"],{as:"span",size:"3",color:"primary"},d))))}))}),0<(null===e||void 0===e?void 0:e.length)&&!d&&e.map(function(a){var b=a.label,d=a.value;return __jsx("li",{key:b,style:r.offset},__jsx("button",{onClick:function onClick(){c(d),p(!1)},onKeyDown:function onKeyDown(a){a.preventDefault(),"Escape"===a.code&&p(!1),("Space"===a.code||"Enter"===a.code)&&(a.preventDefault(),c(d),p(!1)),"ArrowDown"===a.code&&u(),"ArrowUp"===a.code&&v()},type:"button"},__jsx(_Text["default"],{as:"span",size:"3",color:"primary"},b)))})))};ButtonSelect.defaultProps={onSelect:function onSelect(){},sections:void 0,options:void 0,addMaxHeight:!1,disabled:!1};var _default=ButtonSelect;exports["default"]=_default;