carbon-react
Version:
A library of reusable React components for easily building user interfaces.
2 lines (1 loc) • 4.58 kB
JavaScript
import o,{css as t}from"styled-components";import{margin as e}from"styled-system";import i from"../../style/themes/apply-base-theme.js";import n from"../icon/icon.component.js";import r from"../icon/icon.style.js";import a from"../button/button.style.js";import c from"../../style/utils/add-focus-styling.js";const s=o.ul.attrs(i).withConfig({displayName:"action-popover.style__Menu",componentId:"sc-57e29bef-0"})(["visibility:",";display:grid;"," align-items:center;min-width:fit-content;text-align:",";justify-content:",";margin:0;list-style:none;padding:var(--spacing100) 0;box-shadow:var(--boxShadow100);position:absolute;border-radius:var(--borderRadius100);background-color:var(--colorsUtilityYang100);z-index:",';&[data-submenu-placement="top"] &{bottom:calc(-1 * var(--spacing100));top:auto;}&[data-submenu-placement="bottom"] &{top:calc(-1 * var(--spacing100));bottom:auto;}'],(({isOpen:o})=>o?"visible":"hidden"),(({submenuLeft:o,iconLeft:e})=>{const i="[chevron_column] auto",n="[icon_column] auto",r="[text_column] auto";return t(["grid-template-columns:"," "," ",";"],o?i:"",e?`${n} ${r}`:`${r} ${n}`,o?"":i)}),(({iconLeft:o})=>o?"left":"right"),(({iconLeft:o})=>o?"left":"right"),(({theme:o})=>{var t;return`${null===(t=o.zIndex)||void 0===t?void 0:t.popover}`})),l=o.div.withConfig({displayName:"action-popover.style__StyledMenuItemInnerText",componentId:"sc-57e29bef-1"})(["grid-column:text_column;&:only-child{padding:0;}padding:0 var(--spacing100);"]),d=o.button.withConfig({displayName:"action-popover.style__StyledMenuItem",componentId:"sc-57e29bef-2"})(["display:grid;grid-template-columns:subgrid;grid-template-rows:subgrid;grid-column:span 3;align-items:inherit;text-align:inherit;justify-content:inherit;text-decoration:none;background-color:var(--colorsActionMajorYang100);cursor:pointer;box-sizing:border-box;padding:0 var(--spacing150);position:relative;line-height:40px;white-space:nowrap;user-select:none;border:none;color:var(--colorsUtilityYin090);font-size:14px;font-weight:500;&:focus{"," z-index:1;border-radius:var(--borderRadius000);}"," ",""],c(),(({isDisabled:o})=>o&&t(["color:var(--colorsUtilityYin030);cursor:not-allowed;&& ","{cursor:not-allowed;color:var(--colorsUtilityYin030);}:focus{border:none;outline:none;-webkit-appearance:none;-webkit-box-shadow:none;box-shadow:none;}"],r)),(({isDisabled:o})=>!o&&t(["&:focus,&:hover{background-color:var(--colorsUtilityMajor100);}&& ","{cursor:pointer;}"],r))),p=o.li.withConfig({displayName:"action-popover.style__StyledMenuItemWrapper",componentId:"sc-57e29bef-3"})(["display:grid;grid-template-columns:subgrid;grid-template-rows:subgrid;grid-column:span 3;text-align:inherit;align-items:inherit;justify-content:inherit;position:relative;"]),m=o.li.attrs({"data-element":"action-popover-divider"}).withConfig({displayName:"action-popover.style__MenuItemDivider",componentId:"sc-57e29bef-4"})(["grid-column:span 3;background-color:var(--colorsUtilityMajor050);height:var(--borderWidth100);margin:var(--spacing100) var(--spacing150);"]),u=o.div.attrs(i).withConfig({displayName:"action-popover.style__MenuButton",componentId:"sc-57e29bef-5"})(["position:relative;&& ","{cursor:pointer;}width:fit-content;margin:auto;",""],r,e),g=o(n).withConfig({displayName:"action-popover.style__ButtonIcon",componentId:"sc-57e29bef-6"})(["color:var(--colorsActionMinor500);:hover{color:var(--colorsActionMinor600);}"]),v=o.div.withConfig({displayName:"action-popover.style__StyledButtonIcon",componentId:"sc-57e29bef-7"})(["&:focus{","}border-radius:var(--borderRadius050);"],c()),b=o(n).withConfig({displayName:"action-popover.style__MenuItemIcon",componentId:"sc-57e29bef-8"})(["justify-content:inherit;grid-column:icon_column;padding:var(--spacing100);color:var(--colorsUtilityYin065);"]),y=o(g).withConfig({displayName:"action-popover.style__SubMenuItemIcon",componentId:"sc-57e29bef-9"})(["grid-column:chevron_column;",""],(({type:o})=>t([""," ",""],"chevron_left_thick"===o&&t(["left:-5px;"]),"chevron_right_thick"===o&&t(["right:-5px;"])))),f=o.div.withConfig({displayName:"action-popover.style__MenuButtonOverrideWrapper",componentId:"sc-57e29bef-10"})(["","{padding:0px var(--sizing100);width:100%;&:hover,&:focus{background-color:var(--colorsActionMajorTransparent);color:var(--colorsActionMajor600);span[color]{color:var(--colorsActionMajor600);}}}"],a);export{g as ButtonIcon,s as Menu,u as MenuButton,f as MenuButtonOverrideWrapper,m as MenuItemDivider,b as MenuItemIcon,v as StyledButtonIcon,d as StyledMenuItem,l as StyledMenuItemInnerText,p as StyledMenuItemWrapper,y as SubMenuItemIcon};