carbon-react
Version:
A library of reusable React components for easily building user interfaces.
2 lines (1 loc) • 4.93 kB
JavaScript
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("styled-components"),n=require("@floating-ui/dom"),o=require("../../hooks/__internal__/useClickAwayListener/useClickAwayListener.js"),i=require("../icon/icon.component.js"),l=require("../button/button.component.js"),s=require("./split-button.style.js"),u=require("./split-button-toggle.style.js"),a=require("./split-button-children.style.js"),c=require("../../__internal__/utils/helpers/guid/index.js"),d=require("../../__internal__/popover/popover.component.js");require("../../style/utils/filter-styled-system-padding-props.js");var p=require("../../style/utils/filter-styled-system-margin-props.js"),f=require("../../style/utils/filter-out-styled-system-spacing-props.js");require("../../style/themes/sage/index.js");var b=require("../../style/themes/base/index.js");require("../../style/themes/none/index.js");var y=require("../../hooks/__internal__/useChildButtons/useChildButtons.js"),j=require("../../hooks/__internal__/useAdaptiveSidebarModalFocus/useAdaptiveSidebarModalFocus.js"),m=require("./__internal__/split-button.context.js"),h=require("../../hooks/__internal__/useLocale/useLocale.js"),g=require("../flat-table/__internal__/flat-table.context.js");function _(e){return e&&e.__esModule?e:{default:e}}var v=_(t);function x(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function O(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},n=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(n=n.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),n.forEach((function(t){x(e,t,r[t])}))}return e}function q(e,t){return t=null!=t?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):function(e){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t.push.apply(t,r)}return t}(Object(t)).forEach((function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))})),e}const w=t.forwardRef(((_,x)=>{var{align:w="left",position:P="right",buttonType:k="secondary",children:S,disabled:C=!1,iconPosition:T="before",iconType:B,onClick:D,size:A="medium",subtext:L,text:M,"data-element":R,"data-role":z,"aria-label":F,isWhite:I=!1}=_,W=function(e,t){if(null==e)return{};var r,n,o=function(e,t){if(null==e)return{};var r,n,o={},i=Object.keys(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||(o[r]=e[r]);return o}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(n=0;n<i.length;n++)r=i[n],t.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}(_,["align","position","buttonType","children","disabled","iconPosition","iconType","onClick","size","subtext","text","data-element","data-role","aria-label","isWhite"]);const E=h.default(),K=t.useContext(r.ThemeContext)||b.default,H=t.useRef(c.default()),N=t.useRef(c.default()),U=t.useRef(null),V=t.useRef(null),{isInFlatTable:G}=t.useContext(g.default),J="secondary"===k&&I;t.useImperativeHandle(x,(()=>({focusMainButton(){var e;null===(e=U.current)||void 0===e||e.focus()},focusToggleButton(){var e;null===(e=V.current)||void 0===e||e.focus()}})),[]);const{showAdditionalButtons:Q,showButtons:X,hideButtons:Y,buttonNode:Z,handleToggleButtonKeyDown:$,wrapperProps:ee,contextValue:te}=y.default(V,.75),re=O({onFocus:Y,onTouchStart:Y,iconPosition:T,buttonType:k,disabled:C,iconType:B,onClick:e=>{var t;null===(t=U.current)||void 0===t||t.focus(),D&&D(e)},size:A,subtext:L,isWhite:J},f.default(W));j.default((()=>Y()));const ne={isWhite:J,disabled:C,displayed:Q,onTouchStart:X,onKeyDown:$,onClick:()=>{var e;null===(e=V.current)||void 0===e||e.focus({preventScroll:!0}),Q?Y():X()},buttonType:k,size:A},oe=o.default(Y),ie=p.default(W);return e.jsxs(s.default,q(O({onClick:oe,ref:Z},{"data-component":"split-button","data-element":R,"data-role":z},ie),{children:[[e.jsx(l.default,q(O({"data-element":"main-button",id:H.current,ref:U},re),{children:M}),"main-button"),e.jsx(u.default,q(O({"aria-expanded":Q,"aria-controls":N.current,"aria-label":F||E.splitButton.ariaLabel(),"data-element":"toggle-button",type:"button",ref:V},ne),{children:e.jsx(i.default,{type:"dropdown",color:{primary:K.colors.white,secondary:K.colors.primary}[k],bg:"transparent",disabled:C})}),"toggle-button")],Q?e.jsx(d.default,{disableBackgroundUI:G,disablePortal:!0,placement:"left"===P?"bottom-start":"bottom-end",popoverStrategy:"fixed",reference:Z,middleware:[n.offset(6),n.flip({fallbackStrategy:"initialPlacement"})],children:e.jsx(a.default,q(O({id:N.current},ee),{align:w,children:e.jsx(m.default.Provider,{value:te,children:v.default.Children.map(S,(t=>e.jsx("li",{children:t})))})}))}):null]}))}));exports.SplitButton=w,exports.default=w;