@onewelcome/react-lib-components 8.6.0 → 8.7.0

package/dist/cjs/Form/Wrapper/InputWrapper/InputWrapper.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputWrapper.cjs.js","sources":["../../../../../../../src/components/Form/Wrapper/InputWrapper/InputWrapper.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ForwardRefRenderFunction, ComponentPropsWithRef, useRef } from \"react\";\nimport { Input, Type, Props as InputProps } from \"../../Input/Input\";\nimport classes from \"./InputWrapper.module.scss\";\nimport { Wrapper, WrapperProps } from \"../Wrapper/Wrapper\";\nimport { useWrapper } from \"../../../../hooks/useWrapper\";\nimport { withReadOnly } from \"../../../withReadOnly\";\n\ninterface PartialInputProps extends Partial<InputProps> {}\n\nexport interface Props extends ComponentPropsWithRef<\"div\">, WrapperProps {\n  label: string;\n  type: Type;\n  name: string;\n  inputProps?: PartialInputProps;\n  value: string;\n  onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;\n  onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;\n  onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;\n  success?: boolean;\n}\n\nconst InputWrapperComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  {\n    type,\n    name,\n    inputProps,\n    helperText,\n    helperProps,\n    value,\n    className,\n    error,\n    success,\n    onChange,\n    onBlur,\n    onFocus,\n    disabled,\n    ...rest\n  }: Props,\n  ref\n) => {\n  const { errorId, hasFocus, setHasFocus, helperId, labelId } = useWrapper();\n  const { prefix, suffix } = inputProps ?? {};\n  const input = useRef<HTMLInputElement>(null);\n  const labelClasses = [classes[\"input-label\"]];\n  hasFocus && labelClasses.push(classes[\"focus\"]);\n\n  const inputWrapperClasses = [];\n  inputProps?.wrapperProps?.className &&\n    inputWrapperClasses.push(inputProps?.wrapperProps?.className);\n  disabled && inputWrapperClasses.push(classes[\"disabled\"]);\n  const readValue = rest[\"data-readonlyview\"] as boolean;\n  return (\n    <Wrapper\n      {...rest}\n      ref={ref}\n      name={name}\n      className={`${classes[\"input-wrapper\"]} ${className ?? \"\"}`}\n      labelProps={{\n        id: labelId,\n        className: labelClasses.join(\" \")\n      }}\n      errorId={errorId}\n      error={error}\n      helperId={helperId}\n      helperText={helperText}\n      helperProps={{\n        ...helperProps,\n        className: `${classes[\"input-wrapper-helper\"]} ${helperProps?.className ?? \"\"} `\n      }}\n      disabled={disabled}\n    >\n      <Input\n        {...inputProps}\n        prefix={prefix}\n        suffix={suffix}\n        readOnlyView={readValue}\n        wrapperProps={{\n          className: inputWrapperClasses.join(\" \")\n        }}\n        ref={inputProps?.ref || input}\n        aria-labelledby={labelId}\n        aria-describedby={error ? errorId : helperId}\n        onChange={onChange}\n        onFocus={e => {\n          onFocus?.(e);\n          setHasFocus(true);\n        }}\n        onBlur={e => {\n          onBlur?.(e);\n          setHasFocus(false);\n        }}\n        className={`\n         ${inputProps?.className ?? \"\"}`}\n        name={name}\n        success={success}\n        error={error}\n        id={name}\n        value={value}\n        type={type}\n      />\n    </Wrapper>\n  );\n};\n\nexport const InputWrapper = withReadOnly(React.forwardRef(InputWrapperComponent));\n"],"names":["InputWrapper","withReadOnly","React","forwardRef","type","name","inputProps","helperText","helperProps","value","className","error","success","onChange","onBlur","onFocus","disabled","rest","ref","errorId","hasFocus","setHasFocus","helperId","labelId","useWrapper","prefix","suffix","input","useRef","labelClasses","classes","push","inputWrapperClasses","_a","wrapperProps","_b","readValue","createElement","Wrapper","labelProps","id","join","default","_c","Input","readOnlyView","e","_d"],"mappings":"kNAqCA,MAmFaA,0CAA2BC,aAACC,EAAMC,YAnFgC,EAE3EC,OACAC,OACAC,aACAC,aACAC,cACAC,QACAC,YACAC,QACAC,UACAC,WACAC,SACAC,UACAC,cACGC,GAELC,iBAEA,MAAMC,QAAEA,EAAOC,SAAEA,EAAQC,YAAEA,EAAWC,SAAEA,EAAQC,QAAEA,GAAYC,EAAAA,cACxDC,OAAEA,EAAMC,OAAEA,GAAWpB,QAAAA,EAAc,GACnCqB,EAAQC,SAAyB,MACjCC,EAAe,CAACC,UAAQ,gBAC9BV,GAAYS,EAAaE,KAAKD,EAAAA,QAAe,OAE7C,MAAME,EAAsB,IACJ,QAAxBC,EAAA3B,eAAAA,EAAY4B,oBAAY,IAAAD,OAAA,EAAAA,EAAEvB,YACxBsB,EAAoBD,KAA+B,QAA1BI,EAAA7B,aAAA,EAAAA,EAAY4B,oBAAc,IAAAC,OAAA,EAAAA,EAAAzB,WACrDM,GAAYgB,EAAoBD,KAAKD,EAAAA,QAAkB,UACvD,MAAMM,EAAYnB,EAAK,qBACvB,OACEf,EAAAmC,cAACC,EAAOA,QAAA,IACFrB,EACJC,IAAKA,EACLb,KAAMA,EACNK,UAAW,GAAGoB,UAAQ,oBAAoBpB,QAAAA,EAAa,KACvD6B,WAAY,CACVC,GAAIjB,EACJb,UAAWmB,EAAaY,KAAK,MAE/BtB,QAASA,EACTR,MAAOA,EACPW,SAAUA,EACVf,WAAYA,EACZC,YAAa,IACRA,EACHE,UAAW,GAAGoB,EAAOY,QAAC,2BAAiD,QAAtBC,EAAAnC,aAAA,EAAAA,EAAaE,iBAAS,IAAAiC,EAAAA,EAAI,OAE7E3B,SAAUA,GAEVd,EAAAmC,cAACO,QACK,IAAAtC,EACJmB,OAAQA,EACRC,OAAQA,EACRmB,aAAcT,EACdF,aAAc,CACZxB,UAAWsB,EAAoBS,KAAK,MAEtCvB,KAAKZ,aAAU,EAAVA,EAAYY,MAAOS,EAAK,kBACZJ,EACC,mBAAAZ,EAAQQ,EAAUG,EACpCT,SAAUA,EACVE,QAAS+B,IACP/B,SAAAA,EAAU+B,GACVzB,GAAY,EAAK,EAEnBP,OAAQgC,IACNhC,SAAAA,EAASgC,GACTzB,GAAY,EAAM,EAEpBX,UAAW,cACa,QAArBqC,EAAAzC,aAAA,EAAAA,EAAYI,iBAAS,IAAAqC,EAAAA,EAAI,KAC5B1C,KAAMA,EACNO,QAASA,EACTD,MAAOA,EACP6B,GAAInC,EACJI,MAAOA,EACPL,KAAMA,IAGV"}
+{"version":3,"file":"InputWrapper.cjs.js","sources":["../../../../../../../src/components/Form/Wrapper/InputWrapper/InputWrapper.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ForwardRefRenderFunction, ComponentPropsWithRef, useRef } from \"react\";\nimport { Input, Type, Props as InputProps } from \"../../Input/Input\";\nimport classes from \"./InputWrapper.module.scss\";\nimport { Wrapper, WrapperProps } from \"../Wrapper/Wrapper\";\nimport { useWrapper } from \"../../../../hooks/useWrapper\";\nimport { withReadOnly } from \"../../../withReadOnly\";\n\ninterface PartialInputProps extends Partial<InputProps> {}\n\nexport interface Props extends ComponentPropsWithRef<\"div\">, WrapperProps {\n  label: string;\n  type: Type;\n  name: string;\n  inputProps?: PartialInputProps;\n  value: string;\n  onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;\n  onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;\n  onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;\n  success?: boolean;\n}\n\nconst InputWrapperComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  {\n    type,\n    name,\n    inputProps,\n    helperText,\n    helperProps,\n    value,\n    className,\n    error,\n    errorMessageProps,\n    success,\n    onChange,\n    onBlur,\n    onFocus,\n    disabled,\n    ...rest\n  }: Props,\n  ref\n) => {\n  const { errorId, hasFocus, setHasFocus, helperId, labelId } = useWrapper();\n  const { prefix, suffix } = inputProps ?? {};\n  const input = useRef<HTMLInputElement>(null);\n  const labelClasses = [classes[\"input-label\"]];\n  hasFocus && labelClasses.push(classes[\"focus\"]);\n\n  const inputWrapperClasses = [];\n  inputProps?.wrapperProps?.className &&\n    inputWrapperClasses.push(inputProps?.wrapperProps?.className);\n  disabled && inputWrapperClasses.push(classes[\"disabled\"]);\n  const readValue = rest[\"data-readonlyview\"] as boolean;\n  return (\n    <Wrapper\n      {...rest}\n      ref={ref}\n      name={name}\n      className={`${classes[\"input-wrapper\"]} ${className ?? \"\"}`}\n      labelProps={{\n        id: labelId,\n        className: labelClasses.join(\" \")\n      }}\n      errorId={errorId}\n      error={error}\n      errorMessageProps={errorMessageProps}\n      helperId={helperId}\n      helperText={helperText}\n      helperProps={{\n        ...helperProps,\n        className: `${classes[\"input-wrapper-helper\"]} ${helperProps?.className ?? \"\"} `\n      }}\n      disabled={disabled}\n    >\n      <Input\n        {...inputProps}\n        prefix={prefix}\n        suffix={suffix}\n        readOnlyView={readValue}\n        wrapperProps={{\n          className: inputWrapperClasses.join(\" \")\n        }}\n        ref={inputProps?.ref || input}\n        aria-labelledby={labelId}\n        aria-describedby={error ? errorId : helperId}\n        onChange={onChange}\n        onFocus={e => {\n          onFocus?.(e);\n          setHasFocus(true);\n        }}\n        onBlur={e => {\n          onBlur?.(e);\n          setHasFocus(false);\n        }}\n        className={`\n         ${inputProps?.className ?? \"\"}`}\n        name={name}\n        success={success}\n        error={error}\n        id={name}\n        value={value}\n        type={type}\n      />\n    </Wrapper>\n  );\n};\n\nexport const InputWrapper = withReadOnly(React.forwardRef(InputWrapperComponent));\n"],"names":["InputWrapper","withReadOnly","React","forwardRef","type","name","inputProps","helperText","helperProps","value","className","error","errorMessageProps","success","onChange","onBlur","onFocus","disabled","rest","ref","errorId","hasFocus","setHasFocus","helperId","labelId","useWrapper","prefix","suffix","input","useRef","labelClasses","classes","push","inputWrapperClasses","_a","wrapperProps","_b","readValue","createElement","Wrapper","labelProps","id","join","default","_c","Input","readOnlyView","e","_d"],"mappings":"kNAqCA,MAqFaA,0CAA2BC,aAACC,EAAMC,YArFgC,EAE3EC,OACAC,OACAC,aACAC,aACAC,cACAC,QACAC,YACAC,QACAC,oBACAC,UACAC,WACAC,SACAC,UACAC,cACGC,GAELC,iBAEA,MAAMC,QAAEA,EAAOC,SAAEA,EAAQC,YAAEA,EAAWC,SAAEA,EAAQC,QAAEA,GAAYC,EAAAA,cACxDC,OAAEA,EAAMC,OAAEA,GAAWrB,QAAAA,EAAc,GACnCsB,EAAQC,SAAyB,MACjCC,EAAe,CAACC,UAAQ,gBAC9BV,GAAYS,EAAaE,KAAKD,EAAAA,QAAe,OAE7C,MAAME,EAAsB,IACJ,QAAxBC,EAAA5B,eAAAA,EAAY6B,oBAAY,IAAAD,OAAA,EAAAA,EAAExB,YACxBuB,EAAoBD,KAA+B,QAA1BI,EAAA9B,aAAA,EAAAA,EAAY6B,oBAAc,IAAAC,OAAA,EAAAA,EAAA1B,WACrDO,GAAYgB,EAAoBD,KAAKD,EAAAA,QAAkB,UACvD,MAAMM,EAAYnB,EAAK,qBACvB,OACEhB,EAAAoC,cAACC,EAAOA,QAAA,IACFrB,EACJC,IAAKA,EACLd,KAAMA,EACNK,UAAW,GAAGqB,UAAQ,oBAAoBrB,QAAAA,EAAa,KACvD8B,WAAY,CACVC,GAAIjB,EACJd,UAAWoB,EAAaY,KAAK,MAE/BtB,QAASA,EACTT,MAAOA,EACPC,kBAAmBA,EACnBW,SAAUA,EACVhB,WAAYA,EACZC,YAAa,IACRA,EACHE,UAAW,GAAGqB,EAAOY,QAAC,2BAAiD,QAAtBC,EAAApC,aAAA,EAAAA,EAAaE,iBAAS,IAAAkC,EAAAA,EAAI,OAE7E3B,SAAUA,GAEVf,EAAAoC,cAACO,QACK,IAAAvC,EACJoB,OAAQA,EACRC,OAAQA,EACRmB,aAAcT,EACdF,aAAc,CACZzB,UAAWuB,EAAoBS,KAAK,MAEtCvB,KAAKb,aAAU,EAAVA,EAAYa,MAAOS,EAAK,kBACZJ,EACC,mBAAAb,EAAQS,EAAUG,EACpCT,SAAUA,EACVE,QAAS+B,IACP/B,SAAAA,EAAU+B,GACVzB,GAAY,EAAK,EAEnBP,OAAQgC,IACNhC,SAAAA,EAASgC,GACTzB,GAAY,EAAM,EAEpBZ,UAAW,cACa,QAArBsC,EAAA1C,aAAA,EAAAA,EAAYI,iBAAS,IAAAsC,EAAAA,EAAI,KAC5B3C,KAAMA,EACNQ,QAASA,EACTF,MAAOA,EACP8B,GAAIpC,EACJI,MAAOA,EACPL,KAAMA,IAGV"}

package/dist/cjs/Form/Wrapper/Wrapper/Wrapper.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("react"),r=require("../../FormGroup/FormGroup.cjs.js"),s=require("../../Label/Label.cjs.js"),a=require("./Wrapper.module.scss.cjs.js");const l=e.forwardRef((({children:l,className:o,error:t,errorMessage:d,errorId:n,errorMessageIcon:p,errorMessageIconPosition:u,helperText:c,helperId:i,required:m,helperProps:h,helperIndent:b,labelProps:f,label:I,disabled:j,name:N,innerClassName:g,...q},M)=>{const E=[a.default["form-input-label"]];return(null==f?void 0:f.className)&&E.push(f.className),m&&E.push(a.default.required),t&&E.push(a.default.error),j&&E.push(a.default.disabled),e.createElement("div",{...q,ref:M,className:`${a.default.wrapper} ${null!=o?o:""}`},e.createElement(r.FormGroup,{disabled:j,error:t,errorMessage:d,errorId:n,errorMessageIcon:p,errorMessageIconPosition:u,helperText:c,helperId:i,helperProps:h},e.createElement("div",{className:` ${g||""}`},I&&e.createElement(s.Label,{...f,className:`${a.default.label} ${E.join(" ")}`,htmlFor:N},I),e.Children.map(l,(r=>e.cloneElement(r,{disabled:j}))))))}));exports.Wrapper=l;
+"use strict";var e=require("react"),r=require("../../FormGroup/FormGroup.cjs.js"),s=require("../../Label/Label.cjs.js"),a=require("./Wrapper.module.scss.cjs.js");const l=e.forwardRef((({children:l,className:o,error:t,errorMessage:d,errorId:p,errorMessageIcon:n,errorMessageIconPosition:u,errorMessageProps:c,helperText:i,helperId:m,required:h,helperProps:b,helperIndent:f,labelProps:I,label:g,disabled:M,name:j,innerClassName:N,...P},q)=>{const E=[a.default["form-input-label"]];return(null==I?void 0:I.className)&&E.push(I.className),h&&E.push(a.default.required),t&&E.push(a.default.error),M&&E.push(a.default.disabled),e.createElement("div",{...P,ref:q,className:`${a.default.wrapper} ${null!=o?o:""}`},e.createElement(r.FormGroup,{disabled:M,error:t,errorMessage:d,errorId:p,errorMessageIcon:n,errorMessageIconPosition:u,errorMessageProps:c,helperText:i,helperId:m,helperProps:b},e.createElement("div",{className:` ${N||""}`},g&&e.createElement(s.Label,{...I,className:`${a.default.label} ${E.join(" ")}`,htmlFor:j},g),e.Children.map(l,(r=>e.cloneElement(r,{disabled:M}))))))}));exports.Wrapper=l;
 //# sourceMappingURL=Wrapper.cjs.js.map

package/dist/cjs/Form/Wrapper/Wrapper/Wrapper.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Wrapper.cjs.js","sources":["../../../../../../../src/components/Form/Wrapper/Wrapper/Wrapper.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ForwardRefRenderFunction, ComponentPropsWithRef, ReactElement } from \"react\";\nimport { FormGroup, Props as FormGroupProps } from \"../../FormGroup/FormGroup\";\nimport { Label, Props as LabelProps } from \"../../Label/Label\";\nimport classes from \"./Wrapper.module.scss\";\nimport { Props as HelperProps } from \"../../FormHelperText/FormHelperText\";\nimport { FormElement } from \"../../form.interfaces\";\n\nexport interface Props extends ComponentPropsWithRef<\"div\">, FormGroupProps {\n  children: ReactElement | ReactElement[];\n  helperIndent?: number;\n  label?: string;\n  labelProps?: LabelProps;\n  name: string;\n  /** This does NOT add validation! It simply adds an asterix on the Label! */\n  required?: boolean;\n  innerClassName?: string;\n}\n\n/** For components that extend this component we create an interface (InputWrapper, SelectWrapper, etc.) */\nexport interface WrapperProps extends Omit<FormElement, \"success\"> {\n  errorMessage?: string;\n  helperText?: string;\n  helperProps?: HelperProps;\n  label?: string;\n  name: string;\n  required?: boolean;\n  disabled?: boolean;\n}\n\nconst WrapperComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  {\n    children,\n    className,\n    error,\n    errorMessage,\n    errorId,\n    errorMessageIcon,\n    errorMessageIconPosition,\n    helperText,\n    helperId,\n    required,\n    helperProps,\n    helperIndent,\n    labelProps,\n    label,\n    disabled,\n    name,\n    innerClassName,\n    ...rest\n  }: Props,\n  ref\n) => {\n  const renderChildren = () =>\n    React.Children.map(children, child =>\n      React.cloneElement(child, {\n        disabled\n      })\n    );\n\n  const labelClasses = [classes[\"form-input-label\"]];\n\n  labelProps?.className && labelClasses.push(labelProps.className);\n  required && labelClasses.push(classes[\"required\"]);\n  error && labelClasses.push(classes[\"error\"]);\n  disabled && labelClasses.push(classes[\"disabled\"]);\n\n  return (\n    <div {...rest} ref={ref} className={`${classes.wrapper} ${className ?? \"\"}`}>\n      <FormGroup\n        disabled={disabled}\n        error={error}\n        errorMessage={errorMessage}\n        errorId={errorId}\n        errorMessageIcon={errorMessageIcon}\n        errorMessageIconPosition={errorMessageIconPosition}\n        helperText={helperText}\n        helperId={helperId}\n        helperProps={helperProps}\n      >\n        <div className={` ${innerClassName ? innerClassName : \"\"}`}>\n          {label && (\n            <Label\n              {...labelProps}\n              className={`${classes.label} ${labelClasses.join(\" \")}`}\n              htmlFor={name}\n            >\n              {label}\n            </Label>\n          )}\n          {renderChildren()}\n        </div>\n      </FormGroup>\n    </div>\n  );\n};\n\nexport const Wrapper = React.forwardRef(WrapperComponent);\n"],"names":["Wrapper","React","forwardRef","children","className","error","errorMessage","errorId","errorMessageIcon","errorMessageIconPosition","helperText","helperId","required","helperProps","helperIndent","labelProps","label","disabled","name","innerClassName","rest","ref","labelClasses","classes","push","default","wrapper","createElement","FormGroup","Label","join","htmlFor","Children","map","child","cloneElement"],"mappings":"kKA6CA,MAmEaA,EAAUC,EAAMC,YAnE6C,EAEtEC,WACAC,YACAC,QACAC,eACAC,UACAC,mBACAC,2BACAC,aACAC,WACAC,WACAC,cACAC,eACAC,aACAC,QACAC,WACAC,OACAC,oBACGC,GAELC,KAEA,MAOMC,EAAe,CAACC,UAAQ,qBAO9B,OALAR,aAAA,EAAAA,EAAYX,YAAakB,EAAaE,KAAKT,EAAWX,WACtDQ,GAAYU,EAAaE,KAAKD,EAAAA,QAAkB,UAChDlB,GAASiB,EAAaE,KAAKD,EAAAA,QAAe,OAC1CN,GAAYK,EAAaE,KAAKD,EAAAA,QAAkB,UAG9CtB,0BAASmB,EAAMC,IAAKA,EAAKjB,UAAW,GAAGmB,EAAOE,QAACC,WAAWtB,QAAAA,EAAa,MACrEH,EAAA0B,cAACC,EAASA,UACR,CAAAX,SAAUA,EACVZ,MAAOA,EACPC,aAAcA,EACdC,QAASA,EACTC,iBAAkBA,EAClBC,yBAA0BA,EAC1BC,WAAYA,EACZC,SAAUA,EACVE,YAAaA,GAEbZ,EAAA0B,cAAA,MAAA,CAAKvB,UAAW,IAAIe,GAAkC,MACnDH,GACCf,EAAC0B,cAAAE,EAAKA,MACA,IAAAd,EACJX,UAAW,GAAGmB,UAAQP,SAASM,EAAaQ,KAAK,OACjDC,QAASb,GAERF,GAjCXf,EAAM+B,SAASC,IAAI9B,GAAU+B,GAC3BjC,EAAMkC,aAAaD,EAAO,CACxBjB,iBAsCJ"}
+{"version":3,"file":"Wrapper.cjs.js","sources":["../../../../../../../src/components/Form/Wrapper/Wrapper/Wrapper.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ForwardRefRenderFunction, ComponentPropsWithRef, ReactElement } from \"react\";\nimport { FormGroup, Props as FormGroupProps } from \"../../FormGroup/FormGroup\";\nimport { Label, Props as LabelProps } from \"../../Label/Label\";\nimport classes from \"./Wrapper.module.scss\";\nimport { Props as HelperProps } from \"../../FormHelperText/FormHelperText\";\nimport { FormElement } from \"../../form.interfaces\";\n\nexport interface Props extends ComponentPropsWithRef<\"div\">, FormGroupProps {\n  children: ReactElement | ReactElement[];\n  helperIndent?: number;\n  label?: string;\n  labelProps?: LabelProps;\n  name: string;\n  /** This does NOT add validation! It simply adds an asterix on the Label! */\n  required?: boolean;\n  innerClassName?: string;\n}\n\n/** For components that extend this component we create an interface (InputWrapper, SelectWrapper, etc.) */\nexport interface WrapperProps extends Omit<FormElement, \"success\"> {\n  errorMessage?: string;\n  helperText?: string;\n  helperProps?: HelperProps;\n  errorMessageProps?: ComponentPropsWithRef<\"span\">;\n  label?: string;\n  name: string;\n  required?: boolean;\n  disabled?: boolean;\n}\n\nconst WrapperComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  {\n    children,\n    className,\n    error,\n    errorMessage,\n    errorId,\n    errorMessageIcon,\n    errorMessageIconPosition,\n    errorMessageProps,\n    helperText,\n    helperId,\n    required,\n    helperProps,\n    helperIndent,\n    labelProps,\n    label,\n    disabled,\n    name,\n    innerClassName,\n    ...rest\n  }: Props,\n  ref\n) => {\n  const renderChildren = () =>\n    React.Children.map(children, child =>\n      React.cloneElement(child, {\n        disabled\n      })\n    );\n\n  const labelClasses = [classes[\"form-input-label\"]];\n\n  labelProps?.className && labelClasses.push(labelProps.className);\n  required && labelClasses.push(classes[\"required\"]);\n  error && labelClasses.push(classes[\"error\"]);\n  disabled && labelClasses.push(classes[\"disabled\"]);\n\n  return (\n    <div {...rest} ref={ref} className={`${classes.wrapper} ${className ?? \"\"}`}>\n      <FormGroup\n        disabled={disabled}\n        error={error}\n        errorMessage={errorMessage}\n        errorId={errorId}\n        errorMessageIcon={errorMessageIcon}\n        errorMessageIconPosition={errorMessageIconPosition}\n        errorMessageProps={errorMessageProps}\n        helperText={helperText}\n        helperId={helperId}\n        helperProps={helperProps}\n      >\n        <div className={` ${innerClassName ? innerClassName : \"\"}`}>\n          {label && (\n            <Label\n              {...labelProps}\n              className={`${classes.label} ${labelClasses.join(\" \")}`}\n              htmlFor={name}\n            >\n              {label}\n            </Label>\n          )}\n          {renderChildren()}\n        </div>\n      </FormGroup>\n    </div>\n  );\n};\n\nexport const Wrapper = React.forwardRef(WrapperComponent);\n"],"names":["Wrapper","React","forwardRef","children","className","error","errorMessage","errorId","errorMessageIcon","errorMessageIconPosition","errorMessageProps","helperText","helperId","required","helperProps","helperIndent","labelProps","label","disabled","name","innerClassName","rest","ref","labelClasses","classes","push","default","wrapper","createElement","FormGroup","Label","join","htmlFor","Children","map","child","cloneElement"],"mappings":"kKA8CA,MAqEaA,EAAUC,EAAMC,YArE6C,EAEtEC,WACAC,YACAC,QACAC,eACAC,UACAC,mBACAC,2BACAC,oBACAC,aACAC,WACAC,WACAC,cACAC,eACAC,aACAC,QACAC,WACAC,OACAC,oBACGC,GAELC,KAEA,MAOMC,EAAe,CAACC,UAAQ,qBAO9B,OALAR,aAAA,EAAAA,EAAYZ,YAAamB,EAAaE,KAAKT,EAAWZ,WACtDS,GAAYU,EAAaE,KAAKD,EAAAA,QAAkB,UAChDnB,GAASkB,EAAaE,KAAKD,EAAAA,QAAe,OAC1CN,GAAYK,EAAaE,KAAKD,EAAAA,QAAkB,UAG9CvB,0BAASoB,EAAMC,IAAKA,EAAKlB,UAAW,GAAGoB,EAAOE,QAACC,WAAWvB,QAAAA,EAAa,MACrEH,EAAA2B,cAACC,YACC,CAAAX,SAAUA,EACVb,MAAOA,EACPC,aAAcA,EACdC,QAASA,EACTC,iBAAkBA,EAClBC,yBAA0BA,EAC1BC,kBAAmBA,EACnBC,WAAYA,EACZC,SAAUA,EACVE,YAAaA,GAEbb,EAAA2B,cAAA,MAAA,CAAKxB,UAAW,IAAIgB,GAAkC,MACnDH,GACChB,EAAC2B,cAAAE,EAAKA,MACA,IAAAd,EACJZ,UAAW,GAAGoB,UAAQP,SAASM,EAAaQ,KAAK,OACjDC,QAASb,GAERF,GAlCXhB,EAAMgC,SAASC,IAAI/B,GAAUgC,GAC3BlC,EAAMmC,aAAaD,EAAO,CACxBjB,iBAuCJ"}

package/dist/cjs/src/components/DataGrid/DataGridFilters/DataGridDateFilter.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { DateTimeFilter } from "./DataGridFilters.interfaces";
+type Props = {
+    domRoot?: HTMLElement;
+    dateFilterValue?: DateTimeFilter;
+    onDateFilterValueChange?: (dateTimeFilter: DateTimeFilter) => void;
+};
+export declare const DataGridDateFilter: ({ domRoot, dateFilterValue, onDateFilterValueChange }: Props) => React.JSX.Element;
+export {};

package/dist/cjs/src/components/DataGrid/DataGridFilters/DataGridFilterTag.d.ts

@@ -5,9 +5,10 @@ export interface DataGridFilterTagProps extends ComponentPropsWithRef<"div"> {
     triggerRef: React.Ref<HTMLButtonElement>;
     filter?: Filter;
     mode: FilterEditorMode;
-    onFilterRemove: () => void;
+    onFilterRemove?: () => void;
     onFilterOpen: () => void;
     translations?: TagTranslations;
+    dateTagCaption?: string;
 }
 export declare const DataGridFilterTagComponent: ForwardRefRenderFunction<HTMLDivElement, DataGridFilterTagProps>;
 export declare const DataGridFilterTag: React.ForwardRefExoticComponent<Omit<DataGridFilterTagProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/cjs/src/components/DataGrid/DataGridFilters/DataGridFilters.interfaces.d.ts

@@ -21,7 +21,7 @@ export type FiltersAction = {
 export type FiltersState = {
     filters: Filter[];
 };
-export type FilterEditorMode = "ADD" | "EDIT";
+export type FilterEditorMode = "ADD" | "EDIT" | "ADD_DATE";
 export declare enum DefaultOperators {
     is = "is",
     isNot = "is not",
@@ -47,6 +47,9 @@ export interface PopoverTranslations {
 }
 export interface TagTranslations {
     addButtonCaption?: string;
+    or?: string;
+    other?: string;
+    dateIs?: string;
 }
 export interface ToolbarTranslations {
     clearButtonCaption?: string;
@@ -60,3 +63,9 @@ export interface KeyValuePair<TKey = string, TValue = string> {
     key: TKey;
     value: TValue;
 }
+export type DateTimeFilterType = "THIRTY_SECONDS" | "ONE_MINUTE" | "FIVE_MINUTES" | "ONE_HOUR" | "TWENTY_FOUR_HOURS" | "CUSTOM";
+export interface DateTimeFilter {
+    fromDate: string;
+    toDate: string;
+    type: DateTimeFilterType;
+}

package/dist/cjs/src/components/DataGrid/DataGridFilters/DataGridToolbar.d.ts

@@ -1,8 +1,10 @@
 import React from "react";
-import { DataGridColumnMetadata, Filter, FiltersTranslations } from "./DataGridFilters.interfaces";
+import { DataGridColumnMetadata, DateTimeFilter, Filter, FiltersTranslations } from "./DataGridFilters.interfaces";
 export interface DataGridToolbarProps {
-    columnsMetadata: DataGridColumnMetadata[];
+    columnsMetadata?: DataGridColumnMetadata[];
     customEditTagContent?: React.ReactElement;
+    dateFilterValue?: DateTimeFilter;
+    onDateFilterValueChange?: (dateTimeFilter: DateTimeFilter) => void;
     filterValues?: Filter[];
     translations?: FiltersTranslations;
     onFilterAdd?: (filter: Filter) => void;
@@ -10,4 +12,4 @@ export interface DataGridToolbarProps {
     onFilterDelete?: (id: string) => void;
     onFiltersClear?: () => void;
 }
-export declare const DataGridToolbar: ({ columnsMetadata, filterValues, translations, onFilterAdd, onFilterEdit, onFilterDelete, onFiltersClear, customEditTagContent }: DataGridToolbarProps) => React.JSX.Element;
+export declare const DataGridToolbar: ({ columnsMetadata, filterValues, translations, onFilterAdd, onFilterEdit, onFilterDelete, dateFilterValue, onDateFilterValueChange, onFiltersClear, customEditTagContent }: DataGridToolbarProps) => React.JSX.Element;

package/dist/cjs/src/components/DataGrid/DataGridFilters/DateTimePicker/DateTimePicker.d.ts

@@ -0,0 +1,31 @@
+import React from "react";
+import { DateTimeFilter, DateTimeFilterType } from "../DataGridFilters.interfaces";
+export type DateTimePickerTranslations = {
+    errors: {
+        dateFormatError: string;
+    };
+    previousMonth: string;
+    nextMonth: string;
+    from: string;
+    to: string;
+    cancel: string;
+    apply: string;
+    dateInputPlaceholder: string;
+};
+export type Props = {
+    popoverRef: React.RefObject<HTMLDivElement>;
+    anchorRef?: React.RefObject<HTMLDivElement>;
+    isOpen: boolean;
+    onTagCaptionChange: (value: string) => void;
+    setPickerOpen: (open: boolean) => void;
+    translations?: DateTimePickerTranslations;
+    dateFilterValue?: DateTimeFilter;
+    onDateFilterValueChange?: (dateTimeFilter: DateTimeFilter) => void;
+};
+export type SideMenuItem = {
+    id: DateTimeFilterType;
+    name: string;
+    rangeSeconds?: number;
+};
+export declare const dateFormat = "yyyy-mm-dd hh:mm:ss";
+export declare const DateTimePicker: ({ anchorRef, popoverRef, isOpen, setPickerOpen, onTagCaptionChange, translations, dateFilterValue, onDateFilterValueChange }: Props) => React.JSX.Element;

package/dist/cjs/src/components/DataGrid/DataGridFilters/DateTimePicker/DateTimePickerCalendarSection.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import { DateRange } from "react-day-picker";
+type Props = {
+    previousMonth: string;
+    nextMonth: string;
+    selectedDate: DateRange | undefined;
+    disableDateRangePickers: boolean;
+    setSelectedDate: React.Dispatch<React.SetStateAction<DateRange>>;
+    setFromDateText: React.Dispatch<React.SetStateAction<string>>;
+    setToDateText: React.Dispatch<React.SetStateAction<string>>;
+    setFromDateError: React.Dispatch<React.SetStateAction<string>>;
+    setToDateError: React.Dispatch<React.SetStateAction<string>>;
+};
+export declare const DateTimePickerCalendarSection: ({ previousMonth, nextMonth, selectedDate, disableDateRangePickers, setSelectedDate, setFromDateText, setFromDateError, setToDateError, setToDateText }: Props) => React.JSX.Element;
+export {};

package/dist/cjs/src/components/DataGrid/DataGridFilters/DateTimePicker/DateTimePickerInputSection.d.ts

@@ -0,0 +1,18 @@
+import React from "react";
+import { DateRange } from "react-day-picker";
+export type Props = {
+    from: string;
+    to: string;
+    dateInputPlaceholder: string;
+    dateFormatError: string;
+    fromDateText: string;
+    toDateText: string;
+    fromDateError: string;
+    toDateError: string;
+    setSelectedDate: React.Dispatch<React.SetStateAction<DateRange>>;
+    setFromDateText: React.Dispatch<React.SetStateAction<string>>;
+    setToDateText: React.Dispatch<React.SetStateAction<string>>;
+    setFromDateError: React.Dispatch<React.SetStateAction<string>>;
+    setToDateError: React.Dispatch<React.SetStateAction<string>>;
+};
+export declare const DateTimePickerInputSection: ({ from, to, dateInputPlaceholder, dateFormatError, toDateText, fromDateText, fromDateError, toDateError, setSelectedDate, setFromDateText, setToDateText, setFromDateError, setToDateError }: Props) => React.JSX.Element;

package/dist/cjs/src/components/DataGrid/DataGridFilters/DateTimePicker/DateTimeService.d.ts

@@ -0,0 +1,10 @@
+import { Locale } from "date-fns";
+export declare const THIRTY_SECONDS = "THIRTY_SECONDS";
+export declare const ONE_MINUTE = "ONE_MINUTE";
+export declare const FIVE_MINUTES = "FIVE_MINUTES";
+export declare const ONE_HOUR = "ONE_HOUR";
+export declare const TWENTY_FOUR_HOURS = "TWENTY_FOUR_HOURS";
+export declare const CUSTOM_DATE_RANGE = "CUSTOM";
+export declare const getMonthName: (date: Date, locale?: Locale) => string;
+export declare const getYearFromDate: (date: Date) => string;
+export declare const formatInputDate: (date: Date) => string;

package/dist/cjs/src/components/DataGrid/DataGridFilters/DateTimePicker/SideMenu.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import { SideMenuItem } from "./DateTimePicker";
+import { DateTimeFilterType } from "../DataGridFilters.interfaces";
+type Props = {
+    sideMenuItems: SideMenuItem[];
+    selectedItemId: string;
+    onItemSelect: (id: DateTimeFilterType) => void;
+};
+export declare const SideMenu: ({ sideMenuItems, selectedItemId, onItemSelect }: Props) => React.JSX.Element;
+export {};

package/dist/cjs/src/components/DataGrid/testUtils.d.ts

@@ -1,4 +1,4 @@
-import { Filter } from "./DataGridFilters/DataGridFilters.interfaces";
+import { DateTimeFilter, Filter } from "./DataGridFilters/DataGridFilters.interfaces";
 /**
  * @scope .
  * @scopeException stories/DataGrid/DataGrid.stories.tsx
@@ -14,3 +14,9 @@ export declare const useMockFilteringLogic: <T extends {
     setGridData: import("react").Dispatch<import("react").SetStateAction<T[]>>;
     filters: Filter[];
 };
+export declare const useMockFilteringByDateLogic: <T extends {
+    [k: string]: string | Date;
+}>(data: T[], dateFieldKey: string, filterValue: DateTimeFilter | undefined) => {
+    gridData: T[];
+    setGridData: import("react").Dispatch<import("react").SetStateAction<T[]>>;
+};

package/dist/cjs/src/components/DatePicker/DatePicker.d.ts

@@ -1,5 +1,5 @@
 import React, { ComponentPropsWithoutRef } from "react";
-import { DateRange } from "react-day-picker";
+import { DateRange, CustomComponents } from "react-day-picker";
 import * as locales from "date-fns/locale";
 export interface Props extends ComponentPropsWithoutRef<any> {
     onSelect: (date: Date | DateRange | undefined) => void;
@@ -7,5 +7,8 @@ export interface Props extends ComponentPropsWithoutRef<any> {
     value: Date | DateRange | undefined;
     required?: boolean;
     locale?: keyof typeof locales;
+    numberOfMonths?: number;
+    components?: Partial<CustomComponents>;
+    disabled?: boolean;
 }
 export declare const DatePicker: ({ onSelect, value, required, mode, locale, ...rest }: Props) => React.JSX.Element;

package/dist/cjs/src/components/Form/FormGroup/FormGroup.d.ts

@@ -9,6 +9,7 @@ export interface Props extends ComponentPropsWithRef<"div"> {
     errorMessageIconPosition?: "before" | "after";
     errorMessage?: string;
     errorId?: string;
+    errorMessageProps?: ComponentPropsWithRef<"span">;
     helperText?: string;
     helperId?: string;
     helperProps?: HelperProps;

package/dist/cjs/src/components/Form/Wrapper/Wrapper/Wrapper.d.ts

@@ -18,6 +18,7 @@ export interface WrapperProps extends Omit<FormElement, "success"> {
     errorMessage?: string;
     helperText?: string;
     helperProps?: HelperProps;
+    errorMessageProps?: ComponentPropsWithRef<"span">;
     label?: string;
     name: string;
     required?: boolean;

package/dist/cjs/src/hooks/useClickOutside.cjs.js

@@ -0,0 +1,2 @@
+"use strict";var e=require("react");exports.useClickOutside=(t,i,n)=>{function r(e){const n=null==t?void 0:t.current;if(!n)return;n.contains(e.target)||i(e)}e.useEffect((()=>(setTimeout((()=>window.addEventListener("click",r))),()=>{setTimeout((()=>window.removeEventListener("click",r)))})),n)};
+//# sourceMappingURL=useClickOutside.cjs.js.map

package/dist/cjs/src/hooks/useClickOutside.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useClickOutside.cjs.js","sources":["../../../../../../src/hooks/useClickOutside.ts"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport { DependencyList, useEffect } from \"react\";\n\nexport const useClickOutside = (\n  myElementRef: React.RefObject<HTMLElement>,\n  onClickOutside: (event: MouseEvent) => void,\n  dependencies?: DependencyList\n) => {\n  function eventListener(event: MouseEvent) {\n    const myElement = myElementRef?.current;\n    if (!myElement) {\n      return;\n    }\n    const clickedInsideMyElement = myElement.contains(event.target as Node);\n\n    if (!clickedInsideMyElement) {\n      onClickOutside(event);\n    }\n  }\n  useEffect(() => {\n    setTimeout(() => window.addEventListener(\"click\", eventListener));\n\n    return () => {\n      setTimeout(() => window.removeEventListener(\"click\", eventListener));\n    };\n  }, dependencies);\n};\n"],"names":["myElementRef","onClickOutside","dependencies","eventListener","event","myElement","current","contains","target","useEffect","setTimeout","window","addEventListener","removeEventListener"],"mappings":"4DAkB+B,CAC7BA,EACAC,EACAC,KAEA,SAASC,EAAcC,GACrB,MAAMC,EAAYL,aAAA,EAAAA,EAAcM,QAChC,IAAKD,EACH,OAE6BA,EAAUE,SAASH,EAAMI,SAGtDP,EAAeG,EAElB,CACDK,EAAAA,WAAU,KACRC,YAAW,IAAMC,OAAOC,iBAAiB,QAAST,KAE3C,KACLO,YAAW,IAAMC,OAAOE,oBAAoB,QAASV,IAAe,IAErED,EAAa"}

package/dist/cjs/src/hooks/useClickOutside.d.ts

@@ -0,0 +1,2 @@
+import { DependencyList } from "react";
+export declare const useClickOutside: (myElementRef: React.RefObject<HTMLElement>, onClickOutside: (event: MouseEvent) => void, dependencies?: DependencyList) => void;

package/dist/cjs/src/index.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var e=require("../_BaseStyling_/BaseStyling.cjs.js"),r=require("../Button/Button.cjs.js"),t=require("../Breadcrumbs/Breadcrumbs.cjs.js"),o=require("../ContextMenu/ContextMenu.cjs.js"),s=require("../ContextMenu/ContextMenuItem.cjs.js"),i=require("../Link/Link.cjs.js"),a=require("../Icon/Icon.cjs.js"),p=require("../Button/IconButton.cjs.js"),l=require("../Tabs/Tab.cjs.js"),n=require("../Tabs/Tabs.cjs.js"),c=require("../Tag/Tag.cjs.js"),u=require("../TextEllipsis/TextEllipsis.cjs.js"),j=require("../Tiles/Tile.cjs.js"),d=require("../Tiles/Tiles.cjs.js"),x=require("../Tooltip/Tooltip.cjs.js"),S=require("../Typography/Typography.cjs.js"),F=require("../ProgressBar/ProgressBar.cjs.js"),q=require("../Skeleton/Skeleton.cjs.js"),m=require("../Spinner/Spinner.cjs.js"),M=require("../Stepper/Stepper.cjs.js"),C=require("../Pagination/Pagination.cjs.js"),T=require("./hooks/useRepeater.cjs.js"),g=require("./hooks/useFullHeightCollapse.cjs.js"),h=require("./hooks/usePosition.cjs.js"),D=require("./hooks/useDebouncedCallback.cjs.js"),B=require("./hooks/useUploadFile.cjs.js"),I=require("./util/helper.cjs.js"),b=require("../Notifications/BaseModal/BaseModal.cjs.js"),W=require("../Notifications/Alert/useAlert.cjs.js"),f=require("../Notifications/Alert/AlertProvider/AlertProvider.cjs.js"),G=require("../Notifications/Alert/AlertItem/AlertItem.cjs.js"),k=require("../Notifications/Dialog/Dialog.cjs.js"),P=require("../Notifications/DiscardChangesModal/DiscardChangesModal.cjs.js"),y=require("../Notifications/BaseModal/BaseModalActions/BaseModalActions.cjs.js"),A=require("../Notifications/BaseModal/BaseModalContent/BaseModalContent.cjs.js"),N=require("../Notifications/BaseModal/BaseModalHeader/BaseModalHeader.cjs.js"),H=require("../Notifications/NotificationProvider/NotificationContext.cjs.js"),R=require("../Notifications/SlideInModal/SlideInModal.cjs.js"),L=require("../Notifications/SideSheet/SideSheet.cjs.js"),O=require("../Notifications/SideSheet/SideSheetContent/SideSheetContent.cjs.js"),U=require("../Notifications/SideSheet/SideSheetHeader/SideSheetHeader.cjs.js"),v=require("../Form/Checkbox/Checkbox.cjs.js"),w=require("../Form/Fieldset/Fieldset.cjs.js"),E=require("../Form/Form.cjs.js"),_=require("../Form/FormControl/FormControl.cjs.js"),K=require("../Form/FormGroup/FormGroup.cjs.js"),z=require("../Form/FormHelperText/FormHelperText.cjs.js"),J=require("../Form/Input/Input.cjs.js"),Q=require("../Form/Wrapper/InputWrapper/InputWrapper.cjs.js"),V=require("../Form/Label/Label.cjs.js"),X=require("../Form/Radio/Radio.cjs.js"),Y=require("../Form/Wrapper/RadioWrapper/RadioWrapper.cjs.js"),Z=require("../Form/Select/SingleSelect/Select.cjs.js"),$=require("../Form/Select/MultiSelect/MultiSelect.cjs.js"),ee=require("../Form/Select/SingleSelect/Option.cjs.js"),re=require("../Form/Select/MultiSelect/MultiOption.cjs.js"),te=require("../Form/Textarea/Textarea.cjs.js"),oe=require("../Form/Toggle/Toggle.cjs.js"),se=require("../Form/Wrapper/CheckboxWrapper/CheckboxWrapper.cjs.js"),ie=require("../Form/Wrapper/TextareaWrapper/TextareaWrapper.cjs.js"),ae=require("../Form/Wrapper/SelectWrapper/SelectWrapper.cjs.js"),pe=require("../Form/FileUpload/FileUpload.cjs.js"),le=require("../Form/FileUpload/FileItem/FileItem.cjs.js"),ne=require("../Form/Wrapper/MultiSelectWrapper/MultiSelectWrapper.cjs.js"),ce=require("../Form/Select/MultiSelect/useMultiSelect.cjs.js"),ue=require("../Layout/ContentHeader/ContentHeader.cjs.js"),je=require("../Layout/FormPage/FormWithStepper/FormStepper/FormStepper.cjs.js"),de=require("../Layout/FormPage/FormWithStepper/FormSection/FormSection.cjs.js"),xe=require("../Layout/FormPage/FormWithStepper/FormWithStepper.cjs.js"),Se=require("../DataGrid/DataGrid.cjs.js"),Fe=require("../DataGrid/DataGridBody/DataGridRow/DataGridRow.cjs.js"),qe=require("../DataGrid/DataGridBody/DataGridDrawer/DataGridDrawerItem.cjs.js"),me=require("../DataGrid/DataGridBody/DataGridCell/DataGridCell.cjs.js"),Me=require("../DataGrid/DataGridFilters/FilterKeyMapper.cjs.js"),Ce=require("../DataGrid/DataGridFilters/useFiltersReducer.cjs.js"),Te=require("../Notifications/Banner/Banner.cjs.js"),ge=require("../DatePicker/DatePicker.cjs.js"),he=require("../admin/layout/MicrofrontendContainer/MicrofrontendContainer.cjs.js");exports.BaseStyling=e.BaseStyling,exports.Button=r.Button,exports.Breadcrumbs=t.Breadcrumbs,exports.ContextMenu=o.ContextMenu,exports.ContextMenuItem=s.ContextMenuItem,exports.Link=i.Link,exports.Icon=a.Icon,Object.defineProperty(exports,"Icons",{enumerable:!0,get:function(){return a.Icons}}),exports.IconButton=p.IconButton,exports.Tab=l.Tab,exports.Tabs=n.Tabs,exports.Tag=c.Tag,exports.TextEllipsis=u.TextEllipsis,exports.Tile=j.Tile,exports.Tiles=d.Tiles,exports.Tooltip=x.Tooltip,exports.Typography=S.Typography,exports.ProgressBar=F.ProgressBar,exports.Skeleton=q.Skeleton,exports.Spinner=m.Spinner,exports.Stepper=M.Stepper,exports.Pagination=C.Pagination,exports.useRepeater=T.useRepeater,exports.useFullHeightCollapse=g.useFullHeightCollapse,exports.usePosition=h.usePosition,exports.useDebouncedCallback=D.useDebouncedCallback,exports.useUploadFile=B.useUploadFile,exports.debounce=I.debounce,exports.generateID=I.generateID,exports.throttle=I.throttle,exports.Modal=b.BaseModal,exports.useAlert=W.useAlert,exports.AlertProvider=f.AlertProvider,exports.AlertItem=G.AlertItem,exports.Dialog=k.Dialog,exports.DiscardChangesModal=P.DiscardChangesModal,exports.ModalActions=y.BaseModalActions,exports.SideSheetActions=y.BaseModalActions,exports.ModalContent=A.BaseModalContent,exports.ModalHeader=N.BaseModalHeader,exports.NotificationProvider=H.NotificationProvider,exports.useNotificationContext=H.useNotificationContext,exports.SlideInModal=R.SlideInModal,exports.SideSheet=L.SideSheet,exports.SideSheetContent=O.SideSheetContent,exports.SideSheetHeader=U.SideSheetHeader,exports.Checkbox=v.Checkbox,exports.Fieldset=w.Fieldset,exports.Form=E.Form,exports.FormControl=_.FormControl,exports.FormGroup=K.FormGroup,exports.FormHelperText=z.FormHelperText,exports.Input=J.Input,exports.InputWrapper=Q.InputWrapper,exports.Label=V.Label,exports.Radio=X.Radio,exports.RadioWrapper=Y.RadioWrapper,exports.Select=Z.Select,exports.MultiSelect=$.MultiSelect,exports.Option=ee.Option,exports.MultiOption=re.MultiOption,exports.Textarea=te.Textarea,exports.Toggle=oe.Toggle,exports.CheckboxWrapper=se.CheckboxWrapper,exports.TextareaWrapper=ie.TextareaWrapper,exports.SelectWrapper=ae.SelectWrapper,exports.FileUpload=pe.FileUpload,Object.defineProperty(exports,"ACTION_STATUS",{enumerable:!0,get:function(){return le.ACTION_STATUS}}),Object.defineProperty(exports,"FILE_ACTION",{enumerable:!0,get:function(){return le.FILE_ACTION}}),exports.MultiSelectWrapper=ne.MultiSelectWrapper,exports.useMultiSelect=ce.useMultiSelect,exports.ContentHeader=ue.ContentHeader,exports.FormStepper=je.FormStepper,exports.FormSection=de.FormSection,exports.FormWithStepper=xe.FormWithStepper,exports.DataGrid=Se.DataGrid,exports.DataGridRow=Fe.DataGridRow,exports.DataGridDrawerItem=qe.DataGridDrawerItem,exports.DataGridCell=me.DataGridCell,exports.FilterKeyMapper=Me.FilterKeyMapper,exports.useFiltersReducer=Ce.useFiltersReducer,exports.Banner=Te.Banner,exports.DatePicker=ge.DatePicker,exports.MicrofrontendContainer=he.MicrofrontendContainer;
+"use strict";var e=require("../_BaseStyling_/BaseStyling.cjs.js"),r=require("../Button/Button.cjs.js"),t=require("../Breadcrumbs/Breadcrumbs.cjs.js"),o=require("../ContextMenu/ContextMenu.cjs.js"),s=require("../ContextMenu/ContextMenuItem.cjs.js"),i=require("../Link/Link.cjs.js"),a=require("../Icon/Icon.cjs.js"),p=require("../Button/IconButton.cjs.js"),l=require("../Tabs/Tab.cjs.js"),n=require("../Tabs/Tabs.cjs.js"),c=require("../Tag/Tag.cjs.js"),u=require("../TextEllipsis/TextEllipsis.cjs.js"),j=require("../Tiles/Tile.cjs.js"),d=require("../Tiles/Tiles.cjs.js"),x=require("../Tooltip/Tooltip.cjs.js"),S=require("../Typography/Typography.cjs.js"),F=require("../ProgressBar/ProgressBar.cjs.js"),q=require("../Skeleton/Skeleton.cjs.js"),m=require("../Spinner/Spinner.cjs.js"),C=require("../Stepper/Stepper.cjs.js"),M=require("../Pagination/Pagination.cjs.js"),T=require("./hooks/useRepeater.cjs.js"),g=require("./hooks/useClickOutside.cjs.js"),h=require("./hooks/useFullHeightCollapse.cjs.js"),D=require("./hooks/usePosition.cjs.js"),B=require("./hooks/useDebouncedCallback.cjs.js"),I=require("./hooks/useUploadFile.cjs.js"),b=require("./util/helper.cjs.js"),W=require("../Notifications/BaseModal/BaseModal.cjs.js"),k=require("../Notifications/Alert/useAlert.cjs.js"),f=require("../Notifications/Alert/AlertProvider/AlertProvider.cjs.js"),G=require("../Notifications/Alert/AlertItem/AlertItem.cjs.js"),P=require("../Notifications/Dialog/Dialog.cjs.js"),y=require("../Notifications/DiscardChangesModal/DiscardChangesModal.cjs.js"),A=require("../Notifications/BaseModal/BaseModalActions/BaseModalActions.cjs.js"),N=require("../Notifications/BaseModal/BaseModalContent/BaseModalContent.cjs.js"),H=require("../Notifications/BaseModal/BaseModalHeader/BaseModalHeader.cjs.js"),R=require("../Notifications/NotificationProvider/NotificationContext.cjs.js"),O=require("../Notifications/SlideInModal/SlideInModal.cjs.js"),L=require("../Notifications/SideSheet/SideSheet.cjs.js"),U=require("../Notifications/SideSheet/SideSheetContent/SideSheetContent.cjs.js"),v=require("../Notifications/SideSheet/SideSheetHeader/SideSheetHeader.cjs.js"),w=require("../Form/Checkbox/Checkbox.cjs.js"),E=require("../Form/Fieldset/Fieldset.cjs.js"),_=require("../Form/Form.cjs.js"),K=require("../Form/FormControl/FormControl.cjs.js"),z=require("../Form/FormGroup/FormGroup.cjs.js"),J=require("../Form/FormHelperText/FormHelperText.cjs.js"),Q=require("../Form/Input/Input.cjs.js"),V=require("../Form/Wrapper/InputWrapper/InputWrapper.cjs.js"),X=require("../Form/Label/Label.cjs.js"),Y=require("../Form/Radio/Radio.cjs.js"),Z=require("../Form/Wrapper/RadioWrapper/RadioWrapper.cjs.js"),$=require("../Form/Select/SingleSelect/Select.cjs.js"),ee=require("../Form/Select/MultiSelect/MultiSelect.cjs.js"),re=require("../Form/Select/SingleSelect/Option.cjs.js"),te=require("../Form/Select/MultiSelect/MultiOption.cjs.js"),oe=require("../Form/Textarea/Textarea.cjs.js"),se=require("../Form/Toggle/Toggle.cjs.js"),ie=require("../Form/Wrapper/CheckboxWrapper/CheckboxWrapper.cjs.js"),ae=require("../Form/Wrapper/TextareaWrapper/TextareaWrapper.cjs.js"),pe=require("../Form/Wrapper/SelectWrapper/SelectWrapper.cjs.js"),le=require("../Form/FileUpload/FileUpload.cjs.js"),ne=require("../Form/FileUpload/FileItem/FileItem.cjs.js"),ce=require("../Form/Wrapper/MultiSelectWrapper/MultiSelectWrapper.cjs.js"),ue=require("../Form/Select/MultiSelect/useMultiSelect.cjs.js"),je=require("../Layout/ContentHeader/ContentHeader.cjs.js"),de=require("../Layout/FormPage/FormWithStepper/FormStepper/FormStepper.cjs.js"),xe=require("../Layout/FormPage/FormWithStepper/FormSection/FormSection.cjs.js"),Se=require("../Layout/FormPage/FormWithStepper/FormWithStepper.cjs.js"),Fe=require("../DataGrid/DataGrid.cjs.js"),qe=require("../DataGrid/DataGridBody/DataGridRow/DataGridRow.cjs.js"),me=require("../DataGrid/DataGridBody/DataGridDrawer/DataGridDrawerItem.cjs.js"),Ce=require("../DataGrid/DataGridBody/DataGridCell/DataGridCell.cjs.js"),Me=require("../DataGrid/DataGridFilters/FilterKeyMapper.cjs.js"),Te=require("../DataGrid/DataGridFilters/useFiltersReducer.cjs.js"),ge=require("../Notifications/Banner/Banner.cjs.js"),he=require("../DatePicker/DatePicker.cjs.js"),De=require("../admin/layout/MicrofrontendContainer/MicrofrontendContainer.cjs.js");exports.BaseStyling=e.BaseStyling,exports.Button=r.Button,exports.Breadcrumbs=t.Breadcrumbs,exports.ContextMenu=o.ContextMenu,exports.ContextMenuItem=s.ContextMenuItem,exports.Link=i.Link,exports.Icon=a.Icon,Object.defineProperty(exports,"Icons",{enumerable:!0,get:function(){return a.Icons}}),exports.IconButton=p.IconButton,exports.Tab=l.Tab,exports.Tabs=n.Tabs,exports.Tag=c.Tag,exports.TextEllipsis=u.TextEllipsis,exports.Tile=j.Tile,exports.Tiles=d.Tiles,exports.Tooltip=x.Tooltip,exports.Typography=S.Typography,exports.ProgressBar=F.ProgressBar,exports.Skeleton=q.Skeleton,exports.Spinner=m.Spinner,exports.Stepper=C.Stepper,exports.Pagination=M.Pagination,exports.useRepeater=T.useRepeater,exports.useClickOutside=g.useClickOutside,exports.useFullHeightCollapse=h.useFullHeightCollapse,exports.usePosition=D.usePosition,exports.useDebouncedCallback=B.useDebouncedCallback,exports.useUploadFile=I.useUploadFile,exports.debounce=b.debounce,exports.generateID=b.generateID,exports.throttle=b.throttle,exports.Modal=W.BaseModal,exports.useAlert=k.useAlert,exports.AlertProvider=f.AlertProvider,exports.AlertItem=G.AlertItem,exports.Dialog=P.Dialog,exports.DiscardChangesModal=y.DiscardChangesModal,exports.ModalActions=A.BaseModalActions,exports.SideSheetActions=A.BaseModalActions,exports.ModalContent=N.BaseModalContent,exports.ModalHeader=H.BaseModalHeader,exports.NotificationProvider=R.NotificationProvider,exports.useNotificationContext=R.useNotificationContext,exports.SlideInModal=O.SlideInModal,exports.SideSheet=L.SideSheet,exports.SideSheetContent=U.SideSheetContent,exports.SideSheetHeader=v.SideSheetHeader,exports.Checkbox=w.Checkbox,exports.Fieldset=E.Fieldset,exports.Form=_.Form,exports.FormControl=K.FormControl,exports.FormGroup=z.FormGroup,exports.FormHelperText=J.FormHelperText,exports.Input=Q.Input,exports.InputWrapper=V.InputWrapper,exports.Label=X.Label,exports.Radio=Y.Radio,exports.RadioWrapper=Z.RadioWrapper,exports.Select=$.Select,exports.MultiSelect=ee.MultiSelect,exports.Option=re.Option,exports.MultiOption=te.MultiOption,exports.Textarea=oe.Textarea,exports.Toggle=se.Toggle,exports.CheckboxWrapper=ie.CheckboxWrapper,exports.TextareaWrapper=ae.TextareaWrapper,exports.SelectWrapper=pe.SelectWrapper,exports.FileUpload=le.FileUpload,Object.defineProperty(exports,"ACTION_STATUS",{enumerable:!0,get:function(){return ne.ACTION_STATUS}}),Object.defineProperty(exports,"FILE_ACTION",{enumerable:!0,get:function(){return ne.FILE_ACTION}}),exports.MultiSelectWrapper=ce.MultiSelectWrapper,exports.useMultiSelect=ue.useMultiSelect,exports.ContentHeader=je.ContentHeader,exports.FormStepper=de.FormStepper,exports.FormSection=xe.FormSection,exports.FormWithStepper=Se.FormWithStepper,exports.DataGrid=Fe.DataGrid,exports.DataGridRow=qe.DataGridRow,exports.DataGridDrawerItem=me.DataGridDrawerItem,exports.DataGridCell=Ce.DataGridCell,exports.FilterKeyMapper=Me.FilterKeyMapper,exports.useFiltersReducer=Te.useFiltersReducer,exports.Banner=ge.Banner,exports.DatePicker=he.DatePicker,exports.MicrofrontendContainer=De.MicrofrontendContainer;
 //# sourceMappingURL=index.cjs.js.map

package/dist/cjs/src/index.d.ts

@@ -42,6 +42,7 @@ export type { Props as StepProps } from "./components/Stepper/Step";
 export { Pagination } from "./components/Pagination/Pagination";
 export type { Props as PaginationProps, PageChangeLabels, PaginationTranslations, PageSize } from "./components/Pagination/Pagination";
 export { useRepeater } from "./hooks/useRepeater";
+export { useClickOutside } from "./hooks/useClickOutside";
 export { useFullHeightCollapse } from "./hooks/useFullHeightCollapse";
 export { usePosition } from "./hooks/usePosition";
 export type { Placement } from "./hooks/usePosition";

package/dist/esm/Button/BaseButton.esm.js

@@ -17,12 +17,15 @@ import { ButtonSpinner } from './Spinner.esm.js';
  *    See the License for the specific language governing permissions and
  *    limitations under the License.
  */
-const BaseButtonComponent = ({ children, type = "button", className, loading, disabled, ...rest }, ref) => {
+const BaseButtonComponent = ({ children, type = "button", className, loading, disabled, hidden, ...rest }, ref) => {
     const validTypes = ["submit", "button", "reset"];
     const isDisabled = disabled !== null && disabled !== void 0 ? disabled : loading;
     if (!validTypes.includes(type))
         throw new Error(`You have entered an invalid button type. Expected 'submit', 'button' or 'reset' got ${type}`);
-    return (React.createElement("button", { ...rest, disabled: isDisabled, ref: ref, type: type, className: `${classes.button} ${loading ? classes.loading : ""} ${className ? className : ""}` }, loading ? (React.createElement(Fragment, null,
+    const buttonClasses = [classes.button];
+    loading && buttonClasses.push(classes.loading);
+    className && buttonClasses.push(className);
+    return (React.createElement("button", { ...rest, disabled: isDisabled, ref: ref, type: type, hidden: hidden, className: hidden ? "" : buttonClasses.join(" ") }, loading ? (React.createElement(Fragment, null,
         React.createElement("div", { className: classes["content-hidden"] }, children),
         React.createElement(ButtonSpinner, { className: classes["spinner"] }))) : (children)));
 };

package/dist/esm/Button/BaseButton.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseButton.esm.js","sources":["../../../../../src/components/Button/BaseButton.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ForwardRefRenderFunction, ComponentPropsWithRef, Fragment } from \"react\";\nimport classes from \"./BaseButton.module.scss\";\nimport { ButtonSpinner } from \"./Spinner\";\n\nexport interface Props extends ComponentPropsWithRef<\"button\"> {\n  type?: \"submit\" | \"button\" | \"reset\";\n  disabled?: boolean;\n  loading?: boolean;\n  color?: \"primary\" | \"danger\" | \"default\" | \"success\" | \"warning\";\n}\n\nconst BaseButtonComponent: ForwardRefRenderFunction<HTMLButtonElement, Props> = (\n  { children, type = \"button\", className, loading, disabled, ...rest },\n  ref\n) => {\n  const validTypes = [\"submit\", \"button\", \"reset\"];\n  const isDisabled = disabled ?? loading;\n  if (!validTypes.includes(type))\n    throw new Error(\n      `You have entered an invalid button type. Expected 'submit', 'button' or 'reset' got ${type}`\n    );\n\n  return (\n    <button\n      {...rest}\n      disabled={isDisabled}\n      ref={ref}\n      type={type}\n      className={`${classes.button} ${loading ? classes.loading : \"\"} ${\n        className ? className : \"\"\n      }`}\n    >\n      {loading ? (\n        <Fragment>\n          <div className={classes[\"content-hidden\"]}>{children}</div>\n          <ButtonSpinner className={classes[\"spinner\"]} />\n        </Fragment>\n      ) : (\n        children\n      )}\n    </button>\n  );\n};\n\nexport const BaseButton = React.forwardRef(BaseButtonComponent);\n"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;AAcG;AAaH,MAAM,mBAAmB,GAAuD,CAC9E,EAAE,QAAQ,EAAE,IAAI,GAAG,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EACpE,GAAG,KACD;IACF,MAAM,UAAU,GAAG,CAAC,QAAQ,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC;IACjD,MAAM,UAAU,GAAG,QAAQ,KAAA,IAAA,IAAR,QAAQ,KAAR,KAAA,CAAA,GAAA,QAAQ,GAAI,OAAO,CAAC;AACvC,IAAA,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,IAAI,CAAC;AAC5B,QAAA,MAAM,IAAI,KAAK,CACb,uFAAuF,IAAI,CAAA,CAAE,CAC9F,CAAC;IAEJ,QACE,KACM,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,GAAA,IAAI,EACR,QAAQ,EAAE,UAAU,EACpB,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,CAAA,EAAG,OAAO,CAAC,MAAM,CAAI,CAAA,EAAA,OAAO,GAAG,OAAO,CAAC,OAAO,GAAG,EAAE,CAC5D,CAAA,EAAA,SAAS,GAAG,SAAS,GAAG,EAC1B,CAAA,CAAE,EAED,EAAA,OAAO,IACN,KAAA,CAAA,aAAA,CAAC,QAAQ,EAAA,IAAA;QACP,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,OAAO,CAAC,gBAAgB,CAAC,EAAA,EAAG,QAAQ,CAAO;AAC3D,QAAA,KAAA,CAAA,aAAA,CAAC,aAAa,EAAC,EAAA,SAAS,EAAE,OAAO,CAAC,SAAS,CAAC,EAAA,CAAI,CACvC,KAEX,QAAQ,CACT,CACM,EACT;AACJ,CAAC,CAAC;AAEW,MAAA,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC,mBAAmB;;;;"}
+{"version":3,"file":"BaseButton.esm.js","sources":["../../../../../src/components/Button/BaseButton.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ForwardRefRenderFunction, ComponentPropsWithRef, Fragment } from \"react\";\nimport classes from \"./BaseButton.module.scss\";\nimport { ButtonSpinner } from \"./Spinner\";\n\nexport interface Props extends ComponentPropsWithRef<\"button\"> {\n  type?: \"submit\" | \"button\" | \"reset\";\n  disabled?: boolean;\n  loading?: boolean;\n  color?: \"primary\" | \"danger\" | \"default\" | \"success\" | \"warning\";\n}\n\nconst BaseButtonComponent: ForwardRefRenderFunction<HTMLButtonElement, Props> = (\n  { children, type = \"button\", className, loading, disabled, hidden, ...rest },\n  ref\n) => {\n  const validTypes = [\"submit\", \"button\", \"reset\"];\n  const isDisabled = disabled ?? loading;\n  if (!validTypes.includes(type))\n    throw new Error(\n      `You have entered an invalid button type. Expected 'submit', 'button' or 'reset' got ${type}`\n    );\n\n  const buttonClasses = [classes.button];\n  loading && buttonClasses.push(classes.loading);\n  className && buttonClasses.push(className);\n\n  return (\n    <button\n      {...rest}\n      disabled={isDisabled}\n      ref={ref}\n      type={type}\n      hidden={hidden}\n      className={hidden ? \"\" : buttonClasses.join(\" \")}\n    >\n      {loading ? (\n        <Fragment>\n          <div className={classes[\"content-hidden\"]}>{children}</div>\n          <ButtonSpinner className={classes[\"spinner\"]} />\n        </Fragment>\n      ) : (\n        children\n      )}\n    </button>\n  );\n};\n\nexport const BaseButton = React.forwardRef(BaseButtonComponent);\n"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;AAcG;AAaH,MAAM,mBAAmB,GAAuD,CAC9E,EAAE,QAAQ,EAAE,IAAI,GAAG,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,IAAI,EAAE,EAC5E,GAAG,KACD;IACF,MAAM,UAAU,GAAG,CAAC,QAAQ,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC;IACjD,MAAM,UAAU,GAAG,QAAQ,KAAA,IAAA,IAAR,QAAQ,KAAR,KAAA,CAAA,GAAA,QAAQ,GAAI,OAAO,CAAC;AACvC,IAAA,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,IAAI,CAAC;AAC5B,QAAA,MAAM,IAAI,KAAK,CACb,uFAAuF,IAAI,CAAA,CAAE,CAC9F,CAAC;AAEJ,IAAA,MAAM,aAAa,GAAG,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;IACvC,OAAO,IAAI,aAAa,CAAC,IAAI,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;AAC/C,IAAA,SAAS,IAAI,aAAa,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;AAE3C,IAAA,QACE,KACM,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,GAAA,IAAI,EACR,QAAQ,EAAE,UAAU,EACpB,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,MAAM,GAAG,EAAE,GAAG,aAAa,CAAC,IAAI,CAAC,GAAG,CAAC,IAE/C,OAAO,IACN,oBAAC,QAAQ,EAAA,IAAA;QACP,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,OAAO,CAAC,gBAAgB,CAAC,EAAA,EAAG,QAAQ,CAAO;AAC3D,QAAA,KAAA,CAAA,aAAA,CAAC,aAAa,EAAC,EAAA,SAAS,EAAE,OAAO,CAAC,SAAS,CAAC,EAAA,CAAI,CACvC,KAEX,QAAQ,CACT,CACM,EACT;AACJ,CAAC,CAAC;AAEW,MAAA,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC,mBAAmB;;;;"}

package/dist/esm/ContextMenu/ContextMenu.esm.js

@@ -1,7 +1,7 @@
 import React, { useRef, createRef, useState, useEffect, useCallback } from 'react';
 import { Popover } from '../Popover/Popover.esm.js';
 import classes from './ContextMenu.module.scss.esm.js';
-import { useBodyClick } from '../src/hooks/useBodyClick.esm.js';
+import { useClickOutside } from '../src/hooks/useClickOutside.esm.js';
 import { createPortal } from 'react-dom';
 import { useGetDomRoot } from '../src/hooks/useGetDomRoot.esm.js';
 import { useFocusAnchorElement, useDefaultOffset, useArrowNavigation } from './ContextMenuService.esm.js';
@@ -47,13 +47,11 @@ const ContextMenuComponent = ({ trigger, children, decorativeElement, id = `ID-$
         childrenCount,
         setShouldClick
     });
-    useBodyClick(event => {
-        return (showContextMenu &&
-            anchorEl.current !== event.target &&
-            anchorEl.current !== event.target.parentElement);
-    }, () => {
-        setShowContextMenu(false);
-    }, showContextMenu);
+    useClickOutside(anchorEl, () => {
+        if (showContextMenu) {
+            setShowContextMenu(false);
+        }
+    }, [showContextMenu]);
     useFocusAnchorElement(anchorEl, id, showContextMenu, setShowContextMenu, setFocusedContextMenuItem, onShow, onClose);
     const renderTrigger = () => React.cloneElement(trigger, {
         id: id,

package/dist/esm/ContextMenu/ContextMenu.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.esm.js","sources":["../../../../../src/components/ContextMenu/ContextMenu.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, {\n  ComponentPropsWithRef,\n  createRef,\n  ForwardRefRenderFunction,\n  ReactElement,\n  ReactNode,\n  RefObject,\n  useCallback,\n  useEffect,\n  useRef,\n  useState\n} from \"react\";\nimport { Props as ButtonProps } from \"../Button/Button\";\nimport { Props as IconButtonProps } from \"../Button/IconButton\";\nimport { Popover, Props as PopoverProps } from \"../Popover/Popover\";\nimport { Placement, Offset } from \"../../hooks/usePosition\";\nimport classes from \"./ContextMenu.module.scss\";\nimport { useBodyClick } from \"../../hooks/useBodyClick\";\nimport { Props as ContextMenuItemProps } from \"./ContextMenuItem\";\nimport { createPortal } from \"react-dom\";\nimport { useGetDomRoot } from \"../../hooks/useGetDomRoot\";\nimport { useArrowNavigation, useDefaultOffset, useFocusAnchorElement } from \"./ContextMenuService\";\nimport { generateID } from \"../../util/helper\";\n\nexport interface Props extends Omit<ComponentPropsWithRef<\"div\">, \"onChange\"> {\n  trigger: ReactElement<ButtonProps> | ReactElement<IconButtonProps>;\n  decorativeElement?: ReactNode;\n  children: ReactElement<ContextMenuItemProps> | ReactElement<ContextMenuItemProps>[];\n  placement?: Placement;\n  transformOrigin?: Placement;\n  offset?: Offset;\n  debounceAmount?: number;\n  id?: string;\n  show?: boolean;\n  domRoot?: HTMLElement;\n  onShow?: () => void;\n  onClose?: () => void;\n  popoverProps?: PopoverProps;\n  value?: number;\n  onChange?: (event: React.MouseEvent<HTMLButtonElement>, childIndex: number) => void;\n}\n\nconst ContextMenuComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  {\n    trigger,\n    children,\n    decorativeElement,\n    id = `ID-${generateID()}`,\n    show = false,\n    onShow,\n    onClose,\n    placement = { horizontal: \"right\", vertical: \"top\" },\n    offset,\n    transformOrigin = { horizontal: \"left\", vertical: \"top\" },\n    debounceAmount,\n    domRoot,\n    popoverProps,\n    value,\n    onChange,\n    ...rest\n  }: Props,\n  ref\n) => {\n  const anchorEl = useRef<HTMLButtonElement>(null);\n  const wrappingDivRef = (ref as RefObject<HTMLDivElement>) || createRef<HTMLDivElement>();\n  const [showContextMenu, setShowContextMenu] = useState(show);\n  const [selectedContextMenuItem, setSelectedContextMenuItem] = useState(-1);\n  const [focusedContextMenuItem, setFocusedContextMenuItem] = useState(-1);\n  const [shouldClick, setShouldClick] =\n    useState(\n      false\n    ); /** We need this, because whenever we use the arrow keys to select the contextmenu item, and we focus the currently selected item it fires the \"click\" listener in ContextMenuItem component. Instead, we only want this to fire if we press \"enter\" or \"spacebar\" so we set this to true whenever that is the case, and back to false when it has been executed. */\n  const [childrenCount] = useState(React.Children.count(children));\n\n  const { root } = useGetDomRoot(domRoot, wrappingDivRef);\n\n  const syncSelectedContextMenuItem = setSelectedContextMenuItem;\n\n  useEffect(() => {\n    value !== undefined && syncSelectedContextMenuItem(value);\n  }, [value]);\n\n  const { calculateDefaultOffset } = useDefaultOffset();\n  const calculatedOffset = offset ?? calculateDefaultOffset(placement, transformOrigin);\n\n  const { onArrowNavigation } = useArrowNavigation({\n    selectedContextMenuItem,\n    setSelectedContextMenuItem,\n    focusedContextMenuItem,\n    setFocusedContextMenuItem,\n    showContextMenu,\n    setShowContextMenu,\n    childrenCount,\n    setShouldClick\n  });\n\n  useBodyClick(\n    event => {\n      return (\n        showContextMenu &&\n        anchorEl.current !== event.target &&\n        anchorEl.current !== (event.target as HTMLElement).parentElement\n      );\n    },\n    () => {\n      setShowContextMenu(false);\n    },\n    showContextMenu\n  );\n\n  useFocusAnchorElement(\n    anchorEl,\n    id,\n    showContextMenu,\n    setShowContextMenu,\n    setFocusedContextMenuItem,\n    onShow,\n    onClose\n  );\n\n  const renderTrigger = () =>\n    React.cloneElement(trigger, {\n      id: id,\n      \"aria-haspopup\": \"true\",\n      \"aria-controls\": `${id}-menu`,\n      \"aria-expanded\": showContextMenu,\n      onClick: () => setShowContextMenu(!showContextMenu),\n      tabIndex: 0,\n      ref: anchorEl\n    });\n\n  const renderChildren = () =>\n    React.Children.map(children, (child, index) =>\n      React.cloneElement(child as ReactElement, {\n        onFocusChange: (childIndex: number) => setFocusedContextMenuItem(childIndex),\n        onSelectedChange: (event: React.MouseEvent<HTMLButtonElement>, childIndex: number) => {\n          setSelectedContextMenuItem(childIndex);\n          setShouldClick(false);\n          onChange?.(event, childIndex);\n        },\n        childIndex: index,\n        hasFocus: focusedContextMenuItem === index,\n        isSelected: selectedContextMenuItem === index,\n        showActiveState:\n          child?.props.showActiveState ??\n          (value !== undefined && selectedContextMenuItem === index),\n        contextMenuOpened: showContextMenu,\n        shouldClick: shouldClick\n      })\n    );\n\n  const onOutOfViewHandler = useCallback(() => {\n    setShowContextMenu(false);\n  }, []);\n\n  if (!root) {\n    return null;\n  }\n\n  return (\n    <div\n      {...rest}\n      ref={wrappingDivRef}\n      onKeyDown={onArrowNavigation}\n      className={classes[\"context-menu\"]}\n    >\n      {renderTrigger()}\n      {createPortal(\n        <Popover\n          {...popoverProps}\n          placement={placement}\n          transformOrigin={transformOrigin}\n          offset={calculatedOffset}\n          anchorEl={anchorEl}\n          debounceAmount={debounceAmount}\n          show={showContextMenu}\n          onAnchorOutOfView={onOutOfViewHandler}\n        >\n          {decorativeElement && (\n            <div className={classes[\"decorative-element\"]}>{decorativeElement}</div>\n          )}\n          <ul\n            className={`${classes[\"menu\"]} ${decorativeElement ? classes[\"no-margin-top\"] : \"\"}`}\n            id={`${id}-menu`}\n            aria-describedby={id}\n            role=\"menu\"\n          >\n            {renderChildren()}\n          </ul>\n        </Popover>,\n        root\n      )}\n    </div>\n  );\n};\n\nexport const ContextMenu = React.forwardRef(ContextMenuComponent);\n"],"names":[],"mappings":";;;;;;;;;AAAA;;;;;;;;;;;;;;AAcG;AA4CH,MAAM,oBAAoB,GAAoD,CAC5E,EACE,OAAO,EACP,QAAQ,EACR,iBAAiB,EACjB,EAAE,GAAG,MAAM,UAAU,EAAE,CAAE,CAAA,EACzB,IAAI,GAAG,KAAK,EACZ,MAAM,EACN,OAAO,EACP,SAAS,GAAG,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,EACpD,MAAM,EACN,eAAe,GAAG,EAAE,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,EACzD,cAAc,EACd,OAAO,EACP,YAAY,EACZ,KAAK,EACL,QAAQ,EACR,GAAG,IAAI,EACD,EACR,GAAG,KACD;AACF,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;AACjD,IAAA,MAAM,cAAc,GAAI,GAAiC,IAAI,SAAS,EAAkB,CAAC;IACzF,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC7D,MAAM,CAAC,uBAAuB,EAAE,0BAA0B,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;IAC3E,MAAM,CAAC,sBAAsB,EAAE,yBAAyB,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;AACzE,IAAA,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GACjC,QAAQ,CACN,KAAK,CACN,CAAC;AACJ,IAAA,MAAM,CAAC,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEjE,MAAM,EAAE,IAAI,EAAE,GAAG,aAAa,CAAC,OAAO,EAAE,cAAc,CAAC,CAAC;IAExD,MAAM,2BAA2B,GAAG,0BAA0B,CAAC;IAE/D,SAAS,CAAC,MAAK;AACb,QAAA,KAAK,KAAK,SAAS,IAAI,2BAA2B,CAAC,KAAK,CAAC,CAAC;AAC5D,KAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;AAEZ,IAAA,MAAM,EAAE,sBAAsB,EAAE,GAAG,gBAAgB,EAAE,CAAC;AACtD,IAAA,MAAM,gBAAgB,GAAG,MAAM,KAAA,IAAA,IAAN,MAAM,KAAN,KAAA,CAAA,GAAA,MAAM,GAAI,sBAAsB,CAAC,SAAS,EAAE,eAAe,CAAC,CAAC;AAEtF,IAAA,MAAM,EAAE,iBAAiB,EAAE,GAAG,kBAAkB,CAAC;QAC/C,uBAAuB;QACvB,0BAA0B;QAC1B,sBAAsB;QACtB,yBAAyB;QACzB,eAAe;QACf,kBAAkB;QAClB,aAAa;QACb,cAAc;AACf,KAAA,CAAC,CAAC;IAEH,YAAY,CACV,KAAK,IAAG;AACN,QAAA,QACE,eAAe;AACf,YAAA,QAAQ,CAAC,OAAO,KAAK,KAAK,CAAC,MAAM;YACjC,QAAQ,CAAC,OAAO,KAAM,KAAK,CAAC,MAAsB,CAAC,aAAa,EAChE;KACH,EACD,MAAK;QACH,kBAAkB,CAAC,KAAK,CAAC,CAAC;KAC3B,EACD,eAAe,CAChB,CAAC;AAEF,IAAA,qBAAqB,CACnB,QAAQ,EACR,EAAE,EACF,eAAe,EACf,kBAAkB,EAClB,yBAAyB,EACzB,MAAM,EACN,OAAO,CACR,CAAC;IAEF,MAAM,aAAa,GAAG,MACpB,KAAK,CAAC,YAAY,CAAC,OAAO,EAAE;AAC1B,QAAA,EAAE,EAAE,EAAE;AACN,QAAA,eAAe,EAAE,MAAM;QACvB,eAAe,EAAE,CAAG,EAAA,EAAE,CAAO,KAAA,CAAA;AAC7B,QAAA,eAAe,EAAE,eAAe;QAChC,OAAO,EAAE,MAAM,kBAAkB,CAAC,CAAC,eAAe,CAAC;AACnD,QAAA,QAAQ,EAAE,CAAC;AACX,QAAA,GAAG,EAAE,QAAQ;AACd,KAAA,CAAC,CAAC;AAEL,IAAA,MAAM,cAAc,GAAG,MACrB,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,KAAI;;AAC5C,QAAA,OAAA,KAAK,CAAC,YAAY,CAAC,KAAqB,EAAE;YACxC,aAAa,EAAE,CAAC,UAAkB,KAAK,yBAAyB,CAAC,UAAU,CAAC;AAC5E,YAAA,gBAAgB,EAAE,CAAC,KAA0C,EAAE,UAAkB,KAAI;gBACnF,0BAA0B,CAAC,UAAU,CAAC,CAAC;gBACvC,cAAc,CAAC,KAAK,CAAC,CAAC;gBACtB,QAAQ,KAAA,IAAA,IAAR,QAAQ,KAAR,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,QAAQ,CAAG,KAAK,EAAE,UAAU,CAAC,CAAC;aAC/B;AACD,YAAA,UAAU,EAAE,KAAK;YACjB,QAAQ,EAAE,sBAAsB,KAAK,KAAK;YAC1C,UAAU,EAAE,uBAAuB,KAAK,KAAK;YAC7C,eAAe,EACb,MAAA,KAAK,KAAA,IAAA,IAAL,KAAK,KAAL,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,KAAK,CAAE,KAAK,CAAC,eAAe,MAC5B,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,IAAC,KAAK,KAAK,SAAS,IAAI,uBAAuB,KAAK,KAAK,CAAC;AAC5D,YAAA,iBAAiB,EAAE,eAAe;AAClC,YAAA,WAAW,EAAE,WAAW;AACzB,SAAA,CAAC,CAAA;AAAA,KAAA,CACH,CAAC;AAEJ,IAAA,MAAM,kBAAkB,GAAG,WAAW,CAAC,MAAK;QAC1C,kBAAkB,CAAC,KAAK,CAAC,CAAC;KAC3B,EAAE,EAAE,CAAC,CAAC;IAEP,IAAI,CAAC,IAAI,EAAE;AACT,QAAA,OAAO,IAAI,CAAC;KACb;AAED,IAAA,QACE,KACM,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAA,IAAI,EACR,GAAG,EAAE,cAAc,EACnB,SAAS,EAAE,iBAAiB,EAC5B,SAAS,EAAE,OAAO,CAAC,cAAc,CAAC,EAAA;AAEjC,QAAA,aAAa,EAAE;AACf,QAAA,YAAY,CACX,KAAA,CAAA,aAAA,CAAC,OAAO,EAAA,EAAA,GACF,YAAY,EAChB,SAAS,EAAE,SAAS,EACpB,eAAe,EAAE,eAAe,EAChC,MAAM,EAAE,gBAAgB,EACxB,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,IAAI,EAAE,eAAe,EACrB,iBAAiB,EAAE,kBAAkB,EAAA;AAEpC,YAAA,iBAAiB,KAChB,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,OAAO,CAAC,oBAAoB,CAAC,EAAA,EAAG,iBAAiB,CAAO,CACzE;AACD,YAAA,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EACE,SAAS,EAAE,CAAA,EAAG,OAAO,CAAC,MAAM,CAAC,CAAI,CAAA,EAAA,iBAAiB,GAAG,OAAO,CAAC,eAAe,CAAC,GAAG,EAAE,CAAA,CAAE,EACpF,EAAE,EAAE,GAAG,EAAE,CAAA,KAAA,CAAO,sBACE,EAAE,EACpB,IAAI,EAAC,MAAM,IAEV,cAAc,EAAE,CACd,CACG,EACV,IAAI,CACL,CACG,EACN;AACJ,CAAC,CAAC;AAEW,MAAA,WAAW,GAAG,KAAK,CAAC,UAAU,CAAC,oBAAoB;;;;"}
+{"version":3,"file":"ContextMenu.esm.js","sources":["../../../../../src/components/ContextMenu/ContextMenu.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, {\n  ComponentPropsWithRef,\n  createRef,\n  ForwardRefRenderFunction,\n  ReactElement,\n  ReactNode,\n  RefObject,\n  useCallback,\n  useEffect,\n  useRef,\n  useState\n} from \"react\";\nimport { Props as ButtonProps } from \"../Button/Button\";\nimport { Props as IconButtonProps } from \"../Button/IconButton\";\nimport { Popover, Props as PopoverProps } from \"../Popover/Popover\";\nimport { Placement, Offset } from \"../../hooks/usePosition\";\nimport classes from \"./ContextMenu.module.scss\";\nimport { useClickOutside } from \"../../hooks/useClickOutside\";\nimport { Props as ContextMenuItemProps } from \"./ContextMenuItem\";\nimport { createPortal } from \"react-dom\";\nimport { useGetDomRoot } from \"../../hooks/useGetDomRoot\";\nimport { useArrowNavigation, useDefaultOffset, useFocusAnchorElement } from \"./ContextMenuService\";\nimport { generateID } from \"../../util/helper\";\n\nexport interface Props extends Omit<ComponentPropsWithRef<\"div\">, \"onChange\"> {\n  trigger: ReactElement<ButtonProps> | ReactElement<IconButtonProps>;\n  decorativeElement?: ReactNode;\n  children: ReactElement<ContextMenuItemProps> | ReactElement<ContextMenuItemProps>[];\n  placement?: Placement;\n  transformOrigin?: Placement;\n  offset?: Offset;\n  debounceAmount?: number;\n  id?: string;\n  show?: boolean;\n  domRoot?: HTMLElement;\n  onShow?: () => void;\n  onClose?: () => void;\n  popoverProps?: PopoverProps;\n  value?: number;\n  onChange?: (event: React.MouseEvent<HTMLButtonElement>, childIndex: number) => void;\n}\n\nconst ContextMenuComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  {\n    trigger,\n    children,\n    decorativeElement,\n    id = `ID-${generateID()}`,\n    show = false,\n    onShow,\n    onClose,\n    placement = { horizontal: \"right\", vertical: \"top\" },\n    offset,\n    transformOrigin = { horizontal: \"left\", vertical: \"top\" },\n    debounceAmount,\n    domRoot,\n    popoverProps,\n    value,\n    onChange,\n    ...rest\n  }: Props,\n  ref\n) => {\n  const anchorEl = useRef<HTMLButtonElement>(null);\n  const wrappingDivRef = (ref as RefObject<HTMLDivElement>) || createRef<HTMLDivElement>();\n  const [showContextMenu, setShowContextMenu] = useState(show);\n  const [selectedContextMenuItem, setSelectedContextMenuItem] = useState(-1);\n  const [focusedContextMenuItem, setFocusedContextMenuItem] = useState(-1);\n  const [shouldClick, setShouldClick] =\n    useState(\n      false\n    ); /** We need this, because whenever we use the arrow keys to select the contextmenu item, and we focus the currently selected item it fires the \"click\" listener in ContextMenuItem component. Instead, we only want this to fire if we press \"enter\" or \"spacebar\" so we set this to true whenever that is the case, and back to false when it has been executed. */\n  const [childrenCount] = useState(React.Children.count(children));\n\n  const { root } = useGetDomRoot(domRoot, wrappingDivRef);\n\n  const syncSelectedContextMenuItem = setSelectedContextMenuItem;\n\n  useEffect(() => {\n    value !== undefined && syncSelectedContextMenuItem(value);\n  }, [value]);\n\n  const { calculateDefaultOffset } = useDefaultOffset();\n  const calculatedOffset = offset ?? calculateDefaultOffset(placement, transformOrigin);\n\n  const { onArrowNavigation } = useArrowNavigation({\n    selectedContextMenuItem,\n    setSelectedContextMenuItem,\n    focusedContextMenuItem,\n    setFocusedContextMenuItem,\n    showContextMenu,\n    setShowContextMenu,\n    childrenCount,\n    setShouldClick\n  });\n\n  useClickOutside(anchorEl, () => {\n    if (showContextMenu) {\n      setShowContextMenu(false);\n    }\n  }, [showContextMenu]);\n\n  useFocusAnchorElement(\n    anchorEl,\n    id,\n    showContextMenu,\n    setShowContextMenu,\n    setFocusedContextMenuItem,\n    onShow,\n    onClose\n  );\n\n  const renderTrigger = () =>\n    React.cloneElement(trigger, {\n      id: id,\n      \"aria-haspopup\": \"true\",\n      \"aria-controls\": `${id}-menu`,\n      \"aria-expanded\": showContextMenu,\n      onClick: () => setShowContextMenu(!showContextMenu),\n      tabIndex: 0,\n      ref: anchorEl\n    });\n\n  const renderChildren = () =>\n    React.Children.map(children, (child, index) =>\n      React.cloneElement(child as ReactElement, {\n        onFocusChange: (childIndex: number) => setFocusedContextMenuItem(childIndex),\n        onSelectedChange: (event: React.MouseEvent<HTMLButtonElement>, childIndex: number) => {\n          setSelectedContextMenuItem(childIndex);\n          setShouldClick(false);\n          onChange?.(event, childIndex);\n        },\n        childIndex: index,\n        hasFocus: focusedContextMenuItem === index,\n        isSelected: selectedContextMenuItem === index,\n        showActiveState:\n          child?.props.showActiveState ??\n          (value !== undefined && selectedContextMenuItem === index),\n        contextMenuOpened: showContextMenu,\n        shouldClick: shouldClick\n      })\n    );\n\n  const onOutOfViewHandler = useCallback(() => {\n    setShowContextMenu(false);\n  }, []);\n\n  if (!root) {\n    return null;\n  }\n\n  return (\n    <div\n      {...rest}\n      ref={wrappingDivRef}\n      onKeyDown={onArrowNavigation}\n      className={classes[\"context-menu\"]}\n    >\n      {renderTrigger()}\n      {createPortal(\n        <Popover\n          {...popoverProps}\n          placement={placement}\n          transformOrigin={transformOrigin}\n          offset={calculatedOffset}\n          anchorEl={anchorEl}\n          debounceAmount={debounceAmount}\n          show={showContextMenu}\n          onAnchorOutOfView={onOutOfViewHandler}\n        >\n          {decorativeElement && (\n            <div className={classes[\"decorative-element\"]}>{decorativeElement}</div>\n          )}\n          <ul\n            className={`${classes[\"menu\"]} ${decorativeElement ? classes[\"no-margin-top\"] : \"\"}`}\n            id={`${id}-menu`}\n            aria-describedby={id}\n            role=\"menu\"\n          >\n            {renderChildren()}\n          </ul>\n        </Popover>,\n        root\n      )}\n    </div>\n  );\n};\n\nexport const ContextMenu = React.forwardRef(ContextMenuComponent);\n"],"names":[],"mappings":"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"}

package/dist/esm/ContextMenu/ContextMenuItem.esm.js

@@ -1,5 +1,5 @@
 import React, { createRef, useEffect } from 'react';
-import classes from './ContextMenuItem.module.scss.esm.js';
+import contextMenuItemClasses from './ContextMenuItem.module.scss.esm.js';
 
 /*
  * Copyright 2022 OneWelcome B.V.
@@ -29,8 +29,8 @@ const ContextMenuItemComponent = ({ children, onClick, onFocusChange, onSelected
             innerButtonRef.current.focus();
         }
     }, [hasFocus, innerButtonRef, contextMenuOpened]);
-    return (React.createElement("li", { role: "none", className: `${classes["context-menu-item"]} ${className !== null && className !== void 0 ? className : ""}` },
-        React.createElement("button", { role: "menuitem", className: showActiveState ? classes["active"] : undefined, ...rest, ref: innerButtonRef, "data-focus": hasFocus, tabIndex: -1, onClick: event => {
+    return (React.createElement("li", { role: "none", className: `${contextMenuItemClasses["context-menu-item"]} ${className !== null && className !== void 0 ? className : ""}` },
+        React.createElement("button", { role: "menuitem", className: showActiveState ? contextMenuItemClasses["active"] : undefined, ...rest, ref: innerButtonRef, "data-focus": hasFocus, tabIndex: -1, onClick: event => {
                 onClick === null || onClick === void 0 ? void 0 : onClick(event);
                 childIndex !== undefined && (onSelectedChange === null || onSelectedChange === void 0 ? void 0 : onSelectedChange(event, childIndex));
             } }, children)));

package/dist/esm/ContextMenu/ContextMenuItem.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenuItem.esm.js","sources":["../../../../../src/components/ContextMenu/ContextMenuItem.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, {\n  ComponentPropsWithRef,\n  createRef,\n  ForwardRefRenderFunction,\n  ReactNode,\n  RefObject,\n  useEffect\n} from \"react\";\nimport classes from \"./ContextMenuItem.module.scss\";\n\nexport interface Props extends Omit<ComponentPropsWithRef<\"button\">, \"onClick\"> {\n  children?: ReactNode;\n  hasFocus?: boolean;\n  isSelected?: boolean;\n  showActiveState?: boolean;\n  childIndex?: number;\n  shouldClick?: boolean;\n  contextMenuOpened?: boolean;\n  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  onFocusChange?: (childIndex: number) => void;\n  onSelectedChange?: (event: React.MouseEvent<HTMLButtonElement>, childIndex: number) => void;\n}\n\nconst ContextMenuItemComponent: ForwardRefRenderFunction<HTMLButtonElement, Props> = (\n  {\n    children,\n    onClick,\n    onFocusChange,\n    onSelectedChange,\n    hasFocus,\n    isSelected,\n    showActiveState,\n    childIndex,\n    contextMenuOpened,\n    shouldClick,\n    className,\n    ...rest\n  }: Props,\n  ref\n) => {\n  let innerButtonRef = (ref as RefObject<HTMLButtonElement>) || createRef<HTMLButtonElement>();\n\n  useEffect(() => {\n    if (isSelected && innerButtonRef.current && shouldClick) {\n      innerButtonRef.current.click();\n    }\n  }, [isSelected, shouldClick]);\n\n  useEffect(() => {\n    if (innerButtonRef.current && hasFocus && contextMenuOpened) {\n      onFocusChange && childIndex && onFocusChange(childIndex);\n      innerButtonRef.current.focus();\n    }\n  }, [hasFocus, innerButtonRef, contextMenuOpened]);\n\n  return (\n    <li role=\"none\" className={`${classes[\"context-menu-item\"]} ${className ?? \"\"}`}>\n      <button\n        role=\"menuitem\"\n        className={showActiveState ? classes[\"active\"] : undefined}\n        {...rest}\n        ref={innerButtonRef}\n        data-focus={hasFocus}\n        tabIndex={-1}\n        onClick={event => {\n          onClick?.(event);\n          childIndex !== undefined && onSelectedChange?.(event, childIndex);\n        }}\n      >\n        {children}\n      </button>\n    </li>\n  );\n};\n\nexport const ContextMenuItem = React.forwardRef(ContextMenuItemComponent);\n"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;AAcG;AAyBH,MAAM,wBAAwB,GAAuD,CACnF,EACE,QAAQ,EACR,OAAO,EACP,aAAa,EACb,gBAAgB,EAChB,QAAQ,EACR,UAAU,EACV,eAAe,EACf,UAAU,EACV,iBAAiB,EACjB,WAAW,EACX,SAAS,EACT,GAAG,IAAI,EACD,EACR,GAAG,KACD;AACF,IAAA,IAAI,cAAc,GAAI,GAAoC,IAAI,SAAS,EAAqB,CAAC;IAE7F,SAAS,CAAC,MAAK;QACb,IAAI,UAAU,IAAI,cAAc,CAAC,OAAO,IAAI,WAAW,EAAE;AACvD,YAAA,cAAc,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;SAChC;AACH,KAAC,EAAE,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC,CAAC;IAE9B,SAAS,CAAC,MAAK;QACb,IAAI,cAAc,CAAC,OAAO,IAAI,QAAQ,IAAI,iBAAiB,EAAE;AAC3D,YAAA,aAAa,IAAI,UAAU,IAAI,aAAa,CAAC,UAAU,CAAC,CAAC;AACzD,YAAA,cAAc,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;SAChC;KACF,EAAE,CAAC,QAAQ,EAAE,cAAc,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAElD,QACE,4BAAI,IAAI,EAAC,MAAM,EAAC,SAAS,EAAE,CAAG,EAAA,OAAO,CAAC,mBAAmB,CAAC,IAAI,SAAS,KAAA,IAAA,IAAT,SAAS,KAAT,KAAA,CAAA,GAAA,SAAS,GAAI,EAAE,CAAE,CAAA,EAAA;AAC7E,QAAA,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EACE,IAAI,EAAC,UAAU,EACf,SAAS,EAAE,eAAe,GAAG,OAAO,CAAC,QAAQ,CAAC,GAAG,SAAS,EACtD,GAAA,IAAI,EACR,GAAG,EAAE,cAAc,EAAA,YAAA,EACP,QAAQ,EACpB,QAAQ,EAAE,CAAC,CAAC,EACZ,OAAO,EAAE,KAAK,IAAG;AACf,gBAAA,OAAO,aAAP,OAAO,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAP,OAAO,CAAG,KAAK,CAAC,CAAC;AACjB,gBAAA,UAAU,KAAK,SAAS,KAAI,gBAAgB,aAAhB,gBAAgB,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAhB,gBAAgB,CAAG,KAAK,EAAE,UAAU,CAAC,CAAA,CAAC;AACpE,aAAC,EAEA,EAAA,QAAQ,CACF,CACN,EACL;AACJ,CAAC,CAAC;AAEW,MAAA,eAAe,GAAG,KAAK,CAAC,UAAU,CAAC,wBAAwB;;;;"}
+{"version":3,"file":"ContextMenuItem.esm.js","sources":["../../../../../src/components/ContextMenu/ContextMenuItem.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, {\n  ComponentPropsWithRef,\n  createRef,\n  ForwardRefRenderFunction,\n  ReactNode,\n  RefObject,\n  useEffect\n} from \"react\";\nimport classes from \"./ContextMenuItem.module.scss\";\n\nexport interface Props extends Omit<ComponentPropsWithRef<\"button\">, \"onClick\"> {\n  children?: ReactNode;\n  hasFocus?: boolean;\n  isSelected?: boolean;\n  showActiveState?: boolean;\n  childIndex?: number;\n  shouldClick?: boolean;\n  contextMenuOpened?: boolean;\n  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n  onFocusChange?: (childIndex: number) => void;\n  onSelectedChange?: (event: React.MouseEvent<HTMLButtonElement>, childIndex: number) => void;\n}\n\nconst ContextMenuItemComponent: ForwardRefRenderFunction<HTMLButtonElement, Props> = (\n  {\n    children,\n    onClick,\n    onFocusChange,\n    onSelectedChange,\n    hasFocus,\n    isSelected,\n    showActiveState,\n    childIndex,\n    contextMenuOpened,\n    shouldClick,\n    className,\n    ...rest\n  }: Props,\n  ref\n) => {\n  let innerButtonRef = (ref as RefObject<HTMLButtonElement>) || createRef<HTMLButtonElement>();\n\n  useEffect(() => {\n    if (isSelected && innerButtonRef.current && shouldClick) {\n      innerButtonRef.current.click();\n    }\n  }, [isSelected, shouldClick]);\n\n  useEffect(() => {\n    if (innerButtonRef.current && hasFocus && contextMenuOpened) {\n      onFocusChange && childIndex && onFocusChange(childIndex);\n      innerButtonRef.current.focus();\n    }\n  }, [hasFocus, innerButtonRef, contextMenuOpened]);\n\n  return (\n    <li role=\"none\" className={`${classes[\"context-menu-item\"]} ${className ?? \"\"}`}>\n      <button\n        role=\"menuitem\"\n        className={showActiveState ? classes[\"active\"] : undefined}\n        {...rest}\n        ref={innerButtonRef}\n        data-focus={hasFocus}\n        tabIndex={-1}\n        onClick={event => {\n          onClick?.(event);\n          childIndex !== undefined && onSelectedChange?.(event, childIndex);\n        }}\n      >\n        {children}\n      </button>\n    </li>\n  );\n};\n\nexport const ContextMenuItem = React.forwardRef(ContextMenuItemComponent);\n"],"names":["classes"],"mappings":";;;AAAA;;;;;;;;;;;;;;AAcG;AAyBH,MAAM,wBAAwB,GAAuD,CACnF,EACE,QAAQ,EACR,OAAO,EACP,aAAa,EACb,gBAAgB,EAChB,QAAQ,EACR,UAAU,EACV,eAAe,EACf,UAAU,EACV,iBAAiB,EACjB,WAAW,EACX,SAAS,EACT,GAAG,IAAI,EACD,EACR,GAAG,KACD;AACF,IAAA,IAAI,cAAc,GAAI,GAAoC,IAAI,SAAS,EAAqB,CAAC;IAE7F,SAAS,CAAC,MAAK;QACb,IAAI,UAAU,IAAI,cAAc,CAAC,OAAO,IAAI,WAAW,EAAE;AACvD,YAAA,cAAc,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;SAChC;AACH,KAAC,EAAE,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC,CAAC;IAE9B,SAAS,CAAC,MAAK;QACb,IAAI,cAAc,CAAC,OAAO,IAAI,QAAQ,IAAI,iBAAiB,EAAE;AAC3D,YAAA,aAAa,IAAI,UAAU,IAAI,aAAa,CAAC,UAAU,CAAC,CAAC;AACzD,YAAA,cAAc,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;SAChC;KACF,EAAE,CAAC,QAAQ,EAAE,cAAc,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAElD,QACE,4BAAI,IAAI,EAAC,MAAM,EAAC,SAAS,EAAE,CAAG,EAAAA,sBAAO,CAAC,mBAAmB,CAAC,IAAI,SAAS,KAAA,IAAA,IAAT,SAAS,KAAT,KAAA,CAAA,GAAA,SAAS,GAAI,EAAE,CAAE,CAAA,EAAA;AAC7E,QAAA,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EACE,IAAI,EAAC,UAAU,EACf,SAAS,EAAE,eAAe,GAAGA,sBAAO,CAAC,QAAQ,CAAC,GAAG,SAAS,EACtD,GAAA,IAAI,EACR,GAAG,EAAE,cAAc,EAAA,YAAA,EACP,QAAQ,EACpB,QAAQ,EAAE,CAAC,CAAC,EACZ,OAAO,EAAE,KAAK,IAAG;AACf,gBAAA,OAAO,aAAP,OAAO,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAP,OAAO,CAAG,KAAK,CAAC,CAAC;AACjB,gBAAA,UAAU,KAAK,SAAS,KAAI,gBAAgB,aAAhB,gBAAgB,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAhB,gBAAgB,CAAG,KAAK,EAAE,UAAU,CAAC,CAAA,CAAC;AACpE,aAAC,EAEA,EAAA,QAAQ,CACF,CACN,EACL;AACJ,CAAC,CAAC;AAEW,MAAA,eAAe,GAAG,KAAK,CAAC,UAAU,CAAC,wBAAwB;;;;"}

package/dist/esm/ContextMenu/ContextMenuItem.module.scss.esm.js

@@ -1,8 +1,8 @@
 import styleInject from '../node_modules/style-inject/dist/style-inject.es.esm.js';
 
 var css_248z = "/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.ContextMenuItem-module_sr-only__ITnHm{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.ContextMenuItem-module_hidden__Az6RN{display:none}.ContextMenuItem-module_slide-in__hCX3P{animation:ContextMenuItem-module_slide-in__hCX3P .5s forwards}@media (prefers-reduced-motion:reduce){.ContextMenuItem-module_slide-in__hCX3P{animation-duration:.1ms}}.ContextMenuItem-module_slide-out__RpZ-J{animation:ContextMenuItem-module_slide-out__RpZ-J .5s forwards}@media (prefers-reduced-motion:reduce){.ContextMenuItem-module_slide-out__RpZ-J{animation-duration:.1ms}}@keyframes ContextMenuItem-module_slide-in__hCX3P{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes ContextMenuItem-module_slide-out__RpZ-J{0%{transform:translateY(0)}to{transform:translateY(100vh)}}\n/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.ContextMenuItem-module_context-menu-item__LwybO{position:relative}.ContextMenuItem-module_context-menu-item__LwybO button{background-color:initial;border:0;box-sizing:border-box;cursor:pointer;font-family:var(--font-family);font-size:var(--font-size-form-label);height:100%;line-height:1.25rem;padding:.62rem .75rem;width:100%}.ContextMenuItem-module_context-menu-item__LwybO button:focus-visible{outline:none}.ContextMenuItem-module_context-menu-item__LwybO button:focus-visible:after{border-radius:var(--focus-border-radius);content:\"\";height:100%;left:0;outline:.125rem solid var(--color-focus);outline-offset:0;position:absolute;top:0;width:100%;z-index:101}.ContextMenuItem-module_context-menu-item__LwybO button:hover{background-color:var(--context-menu-hover-color)}.ContextMenuItem-module_context-menu-item__LwybO button:active{background-color:var(--context-menu-pressed-color)}.ContextMenuItem-module_context-menu-item__LwybO button.ContextMenuItem-module_active__QsUfr{color:var(--color-primary)}.ContextMenuItem-module_context-menu-item__LwybO button.ContextMenuItem-module_active__QsUfr:before{border-bottom-right-radius:.125rem;border-left:.25rem solid var(--color-primary);border-top-right-radius:.125rem;content:\"\";height:100%;left:0;position:absolute;top:0}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvbnRleHRNZW51SXRlbS5tb2R1bGUuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7Ozs7Ozs7RUFjRTtBQUNGOzs7Ozs7Ozs7Ozs7OztFQWNFO0FBQ0Y7Ozs7Ozs7Ozs7Ozs7O0VBY0UsQ0FDRix1Q0FPRSxrQkFBc0IsQ0FDdEIsUUFBUyxDQUxULFVBQVcsQ0FFWCxXQUFZLENBQ1osZUFBZ0IsQ0FGaEIsU0FBVSxDQUhWLGlCQUFrQixDQUNsQixTQU9GLENBRUEsc0NBQ0UsWUFDRixDQUVBLHdDQUNFLDZEQUNGLENBQ0EsdUNBQ0Usd0NBQ0UsdUJBQ0YsQ0FDRixDQUVBLHlDQUNFLDhEQUNGLENBQ0EsdUNBQ0UseUNBQ0UsdUJBQ0YsQ0FDRixDQUVBLGtEQUNFLEdBQ0UsMkJBQ0YsQ0FDQSxHQUNFLHVCQUNGLENBQ0YsQ0FDQSxtREFDRSxHQUNFLHVCQUNGLENBQ0EsR0FDRSwyQkFDRixDQUNGO0FBQ0E7Ozs7Ozs7Ozs7Ozs7O0VBY0UsQ0FDRixpREFDRSxpQkFDRixDQUNBLHdEQUNFLHdCQUE2QixDQUM3QixRQUFTLENBUVQscUJBQXNCLENBSnRCLGNBQWUsQ0FIZiw4QkFBK0IsQ0FDL0IscUNBQXNDLENBSXRDLFdBQVksQ0FIWixtQkFBb0IsQ0FJcEIscUJBQXdCLENBRnhCLFVBSUYsQ0FDQSxzRUFDRSxZQUNGLENBQ0EsNEVBVUUsd0NBQXlDLENBVHpDLFVBQVcsQ0FJWCxXQUFZLENBRFosTUFBTyxDQUlQLHdDQUEwQyxDQUMxQyxnQkFBaUIsQ0FQakIsaUJBQWtCLENBQ2xCLEtBQU0sQ0FHTixVQUFXLENBQ1gsV0FJRixDQUNBLDhEQUNFLGdEQUNGLENBQ0EsK0RBQ0Usa0RBQ0YsQ0FDQSw2RkFDRSwwQkFDRixDQUNBLG9HQU9FLGtDQUFvQyxDQUNwQyw2Q0FBK0MsQ0FGL0MsK0JBQWlDLENBTGpDLFVBQVcsQ0FJWCxXQUFZLENBRFosTUFBTyxDQUZQLGlCQUFrQixDQUNsQixLQU1GIiwiZmlsZSI6IkNvbnRleHRNZW51SXRlbS5tb2R1bGUuc2NzcyIsInNvdXJjZXNDb250ZW50IjpbIi8qIVxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4vKiFcbiAqIENvcHlyaWdodCAyMDIyIE9uZVdlbGNvbWUgQi5WLlxuICpcbiAqICAgIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiAgICB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiAgICBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogICAgVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogICAgZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogICAgV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiAgICBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiAgICBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqL1xuLyohXG4gKiBDb3B5cmlnaHQgMjAyMiBPbmVXZWxjb21lIEIuVi5cbiAqXG4gKiAgICBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogICAgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogICAgWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqICAgIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqICAgIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqICAgIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogICAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogICAgbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbi5zci1vbmx5IHtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB3aWR0aDogMXB4O1xuICBoZWlnaHQ6IDFweDtcbiAgcGFkZGluZzogMDtcbiAgbWFyZ2luOiAtMXB4O1xuICBvdmVyZmxvdzogaGlkZGVuO1xuICBjbGlwOiByZWN0KDAsIDAsIDAsIDApO1xuICBib3JkZXI6IDA7XG59XG5cbi5oaWRkZW4ge1xuICBkaXNwbGF5OiBub25lO1xufVxuXG4uc2xpZGUtaW4ge1xuICBhbmltYXRpb246IHNsaWRlLWluIDAuNXMgZm9yd2FyZHM7XG59XG5AbWVkaWEgKHByZWZlcnMtcmVkdWNlZC1tb3Rpb246IHJlZHVjZSkge1xuICAuc2xpZGUtaW4ge1xuICAgIGFuaW1hdGlvbi1kdXJhdGlvbjogMC4xbXM7XG4gIH1cbn1cblxuLnNsaWRlLW91dCB7XG4gIGFuaW1hdGlvbjogc2xpZGUtb3V0IDAuNXMgZm9yd2FyZHM7XG59XG5AbWVkaWEgKHByZWZlcnMtcmVkdWNlZC1tb3Rpb246IHJlZHVjZSkge1xuICAuc2xpZGUtb3V0IHtcbiAgICBhbmltYXRpb24tZHVyYXRpb246IDAuMW1zO1xuICB9XG59XG5cbkBrZXlmcmFtZXMgc2xpZGUtaW4ge1xuICAwJSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDEwMHZoKTtcbiAgfVxuICAxMDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMCUpO1xuICB9XG59XG5Aa2V5ZnJhbWVzIHNsaWRlLW91dCB7XG4gIDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMCUpO1xuICB9XG4gIDEwMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgxMDB2aCk7XG4gIH1cbn1cbi8qIVxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4uY29udGV4dC1tZW51LWl0ZW0ge1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG59XG4uY29udGV4dC1tZW51LWl0ZW0gYnV0dG9uIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGJvcmRlcjogMDtcbiAgZm9udC1mYW1pbHk6IHZhcigtLWZvbnQtZmFtaWx5KTtcbiAgZm9udC1zaXplOiB2YXIoLS1mb250LXNpemUtZm9ybS1sYWJlbCk7XG4gIGxpbmUtaGVpZ2h0OiAxLjI1cmVtO1xuICBjdXJzb3I6IHBvaW50ZXI7XG4gIHdpZHRoOiAxMDAlO1xuICBoZWlnaHQ6IDEwMCU7XG4gIHBhZGRpbmc6IDAuNjJyZW0gMC43NXJlbTtcbiAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbn1cbi5jb250ZXh0LW1lbnUtaXRlbSBidXR0b246Zm9jdXMtdmlzaWJsZSB7XG4gIG91dGxpbmU6IG5vbmU7XG59XG4uY29udGV4dC1tZW51LWl0ZW0gYnV0dG9uOmZvY3VzLXZpc2libGU6OmFmdGVyIHtcbiAgY29udGVudDogXCJcIjtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB0b3A6IDA7XG4gIGxlZnQ6IDA7XG4gIGhlaWdodDogMTAwJTtcbiAgd2lkdGg6IDEwMCU7XG4gIHotaW5kZXg6IDEwMTtcbiAgb3V0bGluZTogMC4xMjVyZW0gc29saWQgdmFyKC0tY29sb3ItZm9jdXMpO1xuICBvdXRsaW5lLW9mZnNldDogMDtcbiAgYm9yZGVyLXJhZGl1czogdmFyKC0tZm9jdXMtYm9yZGVyLXJhZGl1cyk7XG59XG4uY29udGV4dC1tZW51LWl0ZW0gYnV0dG9uOmhvdmVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tY29udGV4dC1tZW51LWhvdmVyLWNvbG9yKTtcbn1cbi5jb250ZXh0LW1lbnUtaXRlbSBidXR0b246YWN0aXZlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tY29udGV4dC1tZW51LXByZXNzZWQtY29sb3IpO1xufVxuLmNvbnRleHQtbWVudS1pdGVtIGJ1dHRvbi5hY3RpdmUge1xuICBjb2xvcjogdmFyKC0tY29sb3ItcHJpbWFyeSk7XG59XG4uY29udGV4dC1tZW51LWl0ZW0gYnV0dG9uLmFjdGl2ZTo6YmVmb3JlIHtcbiAgY29udGVudDogXCJcIjtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB0b3A6IDA7XG4gIGxlZnQ6IDA7XG4gIGhlaWdodDogMTAwJTtcbiAgYm9yZGVyLXRvcC1yaWdodC1yYWRpdXM6IDAuMTI1cmVtO1xuICBib3JkZXItYm90dG9tLXJpZ2h0LXJhZGl1czogMC4xMjVyZW07XG4gIGJvcmRlci1sZWZ0OiAwLjI1cmVtIHNvbGlkIHZhcigtLWNvbG9yLXByaW1hcnkpO1xufSJdfQ== */";
-var classes = {"sr-only":"ContextMenuItem-module_sr-only__ITnHm","hidden":"ContextMenuItem-module_hidden__Az6RN","slide-in":"ContextMenuItem-module_slide-in__hCX3P","slide-out":"ContextMenuItem-module_slide-out__RpZ-J","context-menu-item":"ContextMenuItem-module_context-menu-item__LwybO","active":"ContextMenuItem-module_active__QsUfr"};
+var contextMenuItemClasses = {"sr-only":"ContextMenuItem-module_sr-only__ITnHm","hidden":"ContextMenuItem-module_hidden__Az6RN","slide-in":"ContextMenuItem-module_slide-in__hCX3P","slide-out":"ContextMenuItem-module_slide-out__RpZ-J","context-menu-item":"ContextMenuItem-module_context-menu-item__LwybO","active":"ContextMenuItem-module_active__QsUfr"};
 styleInject(css_248z);
 
-export { classes as default };
+export { contextMenuItemClasses as default };
 //# sourceMappingURL=ContextMenuItem.module.scss.esm.js.map