carbon-react
Version:
A library of reusable React components for easily building user interfaces.
2 lines (1 loc) • 4.49 kB
JavaScript
;Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),l=require("invariant"),r=require("../../../__internal__/form-field/form-field.component.js"),n=require("../../../__internal__/utils/helpers/tags/tags.js"),i=require("../../../__internal__/utils/helpers/guid/index.js"),o=require("./button-toggle-group.style.js"),a=require("../button-toggle.component.js");require("../../../style/utils/filter-styled-system-padding-props.js");var u=require("../../../style/utils/filter-styled-system-margin-props.js"),s=require("../../../__internal__/tooltip-provider/index.js"),d=require("../../../__internal__/input-behaviour/input-group-behaviour.component.js"),c=require("../../../__internal__/utils/helpers/events/events.js"),p=require("../../carbon-provider/__internal__/new-validation.context.js"),f=require("./__internal__/button-toggle-group.context.js"),b=require("../../../__internal__/hint-text/hint-text.component.js");function g(e){return e&&e.__esModule?e:{default:e}}var y=g(t),h=g(l);function _(e,t,l){return t in e?Object.defineProperty(e,t,{value:l,enumerable:!0,configurable:!0,writable:!0}):e[t]=l,e}function j(e){for(var t=1;t<arguments.length;t++){var l=null!=arguments[t]?arguments[t]:{},r=Object.keys(l);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(l).filter((function(e){return Object.getOwnPropertyDescriptor(l,e).enumerable})))),r.forEach((function(t){_(e,t,l[t])}))}return e}function v(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 l=Object.getOwnPropertySymbols(e);t.push.apply(t,l)}return t}(Object(t)).forEach((function(l){Object.defineProperty(e,l,Object.getOwnPropertyDescriptor(t,l))})),e}const m=l=>{var{children:g,fieldHelp:_,fieldHelpInline:m,"aria-label":O,label:x,labelHelp:q,labelSpacing:w,inputHint:P,inputWidth:H,fullWidth:I,labelInline:B,labelWidth:S,onChange:D,value:T,helpAriaLabel:W,id:A,allowDeselect:C=!1,disabled:E=!1}=l,R=function(e,t){if(null==e)return{};var l,r,n=function(e,t){if(null==e)return{};var l,r,n={},i=Object.keys(e);for(r=0;r<i.length;r++)l=i[r],t.indexOf(l)>=0||(n[l]=e[l]);return n}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)l=i[r],t.indexOf(l)>=0||Object.prototype.propertyIsEnumerable.call(e,l)&&(n[l]=e[l])}return n}(l,["children","fieldHelp","fieldHelpInline","aria-label","label","labelHelp","labelSpacing","inputHint","inputWidth","fullWidth","labelInline","labelWidth","onChange","value","helpAriaLabel","id","allowDeselect","disabled"]);const k=t.useMemo((()=>!y.default.Children.toArray(g).find((e=>!y.default.isValidElement(e)||"ButtonToggle"!==e.type.displayName))),[g]);h.default(k,`\`ButtonToggleGroup\` only accepts children of type \`${a.ButtonToggle.displayName}\``);const G=t.useRef(i.default()),L=t.useRef(i.default()),M=t.useRef(null),{validationRedesignOptIn:K}=t.useContext(p.default),N=e=>K?void 0:e,V=()=>{var e;return null===(e=M.current)||void 0===e?void 0:e.querySelectorAll('[data-element="button-toggle-button"]')},[$,z]=t.useState();var F;return e.jsx(s.TooltipProvider,{helpAriaLabel:W,children:e.jsx(d.InputGroupBehaviour,{children:e.jsx(r.default,v(j({label:x,labelHelp:N(q),labelSpacing:N(w),fieldHelp:N(_),fieldHelpInline:N(m),labelInline:N(B),labelWidth:N(S),labelId:G.current,id:A,labelAs:"span",disabled:E},u.default(R),n.default(null!==(F=R["data-component"])&&void 0!==F?F:"button-toggle-group",R)),{children:e.jsxs(f.ButtonToggleGroupProvider,{value:{onButtonClick:()=>{},handleKeyDown:e=>{const t=V();if(!t||!document.activeElement)return;const l=Array.from(t).indexOf(document.activeElement);let r;c.default.isLeftKey(e)?r=t[0===l?t.length-1:l-1]:c.default.isRightKey(e)&&(r=t[(l+1)%t.length]),r instanceof HTMLButtonElement&&r.focus()},pressedButtonValue:T,onChange:D,allowDeselect:C,isInGroup:!0,isDisabled:E,firstButton:$,childButtonCallbackRef:e=>{setTimeout((()=>{if(e){const t=V();t?e===t[0]&&z(e):z(void 0)}}),0)},hintTextId:P?L.current:void 0},children:[P&&e.jsx(b.HintText,{id:L.current,isDisabled:E,marginBottom:"var(--spacing150)",children:P}),e.jsx(o.default,v(j({ref:M},x?{"aria-labelledby":G.current}:{"aria-label":O}),{labelInline:B,inputWidth:H,fullWidth:I,role:"group",id:A,disabled:E,children:g}))]})}))})})};m.displayName="ButtonToggleGroup",exports.default=m;