@bigbinary/neeto-molecules 3.15.43 → 3.15.45

package/dist/ConfirmationModal.js

@@ -0,0 +1,110 @@
+import { useRef } from 'react';
+import Modal from '@bigbinary/neetoui/Modal';
+import Typography from '@bigbinary/neetoui/Typography';
+import ActionBlock from '@bigbinary/neetoui/formik/ActionBlock';
+import Form from '@bigbinary/neetoui/formik/Form';
+import Input from '@bigbinary/neetoui/formik/Input';
+import { type } from 'ramda';
+import { useTranslation, Trans } from 'react-i18next';
+import * as yup from 'yup';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+var INITIAL_VALUES = {
+  confirmationText: ""
+};
+
+var deletionValidationSchema = function deletionValidationSchema(confirmationText) {
+  return yup.object({
+    confirmationText: yup.string().required("").oneOf([confirmationText], "")
+  });
+};
+
+var ConfirmationModal = function ConfirmationModal(_ref) {
+  var buttonLabel = _ref.buttonLabel,
+    confirmationText = _ref.confirmationText,
+    _ref$description = _ref.description,
+    description = _ref$description === void 0 ? "" : _ref$description,
+    _ref$isOpen = _ref.isOpen,
+    isOpen = _ref$isOpen === void 0 ? true : _ref$isOpen,
+    _ref$isSubmitting = _ref.isSubmitting,
+    isSubmitting = _ref$isSubmitting === void 0 ? false : _ref$isSubmitting,
+    _ref$title = _ref.title,
+    title = _ref$title === void 0 ? "" : _ref$title,
+    onClose = _ref.onClose,
+    onSubmit = _ref.onSubmit,
+    deleteConfirmationMessage = _ref.deleteConfirmationMessage;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var formikProps = {
+    initialValues: INITIAL_VALUES,
+    validationSchema: deletionValidationSchema(confirmationText),
+    onSubmit: onSubmit
+  };
+  var deleteInputLabel = deleteConfirmationMessage || /*#__PURE__*/jsx(Trans, {
+    components: {
+      strong: /*#__PURE__*/jsx("strong", {})
+    },
+    i18nKey: "neetoMolecules.confirmationModal.deleteConfirmationMessage",
+    values: {
+      value: confirmationText
+    }
+  });
+  var initialFocusRef = useRef(null);
+  return /*#__PURE__*/jsxs(Modal, {
+    initialFocusRef: initialFocusRef,
+    isOpen: isOpen,
+    onClose: onClose,
+    "data-testid": "confirmation-modal",
+    children: [/*#__PURE__*/jsx(Modal.Header, {
+      children: /*#__PURE__*/jsx(Typography, {
+        "data-cy": "confirmation-modal",
+        style: "h2",
+        children: title
+      })
+    }), /*#__PURE__*/jsx(Form, {
+      formikProps: formikProps,
+      children: function children(_ref2) {
+        var values = _ref2.values;
+        return /*#__PURE__*/jsxs(Fragment, {
+          children: [/*#__PURE__*/jsxs(Modal.Body, {
+            className: "space-y-4",
+            children: [type(description) === "String" ? /*#__PURE__*/jsx(Typography, {
+              style: "body2",
+              children: description
+            }) : description, /*#__PURE__*/jsx(Input, {
+              "data-testid": "confirmation-modal-input",
+              label: deleteInputLabel,
+              labelProps: {
+                className: "block"
+              },
+              name: "confirmationText",
+              ref: initialFocusRef,
+              type: "text"
+            })]
+          }), /*#__PURE__*/jsx(Modal.Footer, {
+            children: /*#__PURE__*/jsx(ActionBlock, {
+              className: "space-x-2",
+              cancelButtonProps: {
+                label: t("neetoMolecules.common.actions.cancel"),
+                style: "text",
+                onClick: onClose,
+                disabled: false,
+                type: "button"
+              },
+              submitButtonProps: {
+                "data-cy": "delete-continue-button",
+                label: buttonLabel,
+                loading: isSubmitting,
+                style: "danger",
+                disabled: isSubmitting || confirmationText !== values.confirmationText
+              }
+            })
+          })]
+        });
+      }
+    })]
+  });
+};
+
+export { ConfirmationModal as default };
+//# sourceMappingURL=ConfirmationModal.js.map

package/dist/ConfirmationModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConfirmationModal.js","sources":["../src/components/ConfirmationModal/constants.js","../src/components/ConfirmationModal/utils.js","../src/components/ConfirmationModal/index.jsx"],"sourcesContent":["export const INITIAL_VALUES = { confirmationText: \"\" };\n","import * as yup from \"yup\";\n\nexport const deletionValidationSchema = confirmationText =>\n  yup.object({\n    confirmationText: yup.string().required(\"\").oneOf([confirmationText], \"\"),\n  });\n","import { useRef } from \"react\";\n\nimport { Modal, Typography } from \"neetoui\";\nimport { ActionBlock, Form, Input } from \"neetoui/formik\";\nimport PropTypes from \"prop-types\";\nimport { type } from \"ramda\";\nimport { Trans, useTranslation } from \"react-i18next\";\n\nimport { INITIAL_VALUES } from \"./constants\";\nimport { deletionValidationSchema } from \"./utils\";\n\nconst ConfirmationModal = ({\n  buttonLabel,\n  confirmationText,\n  description = \"\",\n  isOpen = true,\n  isSubmitting = false,\n  title = \"\",\n  onClose,\n  onSubmit,\n  deleteConfirmationMessage,\n}) => {\n  const { t } = useTranslation();\n  const formikProps = {\n    initialValues: INITIAL_VALUES,\n    validationSchema: deletionValidationSchema(confirmationText),\n    onSubmit,\n  };\n\n  const deleteInputLabel = deleteConfirmationMessage || (\n    <Trans\n      components={{ strong: <strong /> }}\n      i18nKey=\"neetoMolecules.confirmationModal.deleteConfirmationMessage\"\n      values={{ value: confirmationText }}\n    />\n  );\n\n  const initialFocusRef = useRef(null);\n\n  return (\n    <Modal\n      {...{ initialFocusRef, isOpen, onClose }}\n      data-testid=\"confirmation-modal\"\n    >\n      <Modal.Header>\n        <Typography data-cy=\"confirmation-modal\" style=\"h2\">\n          {title}\n        </Typography>\n      </Modal.Header>\n      <Form {...{ formikProps }}>\n        {({ values }) => (\n          <>\n            <Modal.Body className=\"space-y-4\">\n              {type(description) === \"String\" ? (\n                <Typography style=\"body2\">{description}</Typography>\n              ) : (\n                description\n              )}\n              <Input\n                data-testid=\"confirmation-modal-input\"\n                label={deleteInputLabel}\n                labelProps={{ className: \"block\" }}\n                name=\"confirmationText\"\n                ref={initialFocusRef}\n                type=\"text\"\n              />\n            </Modal.Body>\n            <Modal.Footer>\n              <ActionBlock\n                className=\"space-x-2\"\n                cancelButtonProps={{\n                  label: t(\"neetoMolecules.common.actions.cancel\"),\n                  style: \"text\",\n                  onClick: onClose,\n                  disabled: false,\n                  type: \"button\",\n                }}\n                submitButtonProps={{\n                  \"data-cy\": \"delete-continue-button\",\n                  label: buttonLabel,\n                  loading: isSubmitting,\n                  style: \"danger\",\n                  disabled:\n                    isSubmitting ||\n                    confirmationText !== values.confirmationText,\n                }}\n              />\n            </Modal.Footer>\n          </>\n        )}\n      </Form>\n    </Modal>\n  );\n};\n\nConfirmationModal.propTypes = {\n  /**\n   * Label of the action button in the Modal\n   */\n  buttonLabel: PropTypes.string,\n  /**\n   * Text that is expected to be entered by the user\n   */\n  confirmationText: PropTypes.string,\n  /**\n   * Modal description\n   */\n  description: PropTypes.oneOfType([\n    PropTypes.arrayOf(PropTypes.node),\n    PropTypes.node,\n    PropTypes.string,\n  ]),\n  /**\n   * To be passed to loading prop of the action button\n   */\n  isSubmitting: PropTypes.bool,\n  /**\n   * To specify whether the modal should be opened or closed.\n   */\n  isOpen: PropTypes.bool,\n  /**\n   * Title of the modal\n   */\n  title: PropTypes.string,\n  /**\n   * Handler function that is invoked when the close button is clicked\n   */\n  onClose: PropTypes.func,\n  /**\n   * Handler function that is invoked when the action button is clicked\n   */\n  onSubmit: PropTypes.func,\n  /**\n   * Message that will be shown as the label of the confirmation input field.\n   */\n  deleteConfirmationMessage: PropTypes.string,\n};\n\nexport default ConfirmationModal;\n"],"names":["INITIAL_VALUES","confirmationText","deletionValidationSchema","yup","object","string","required","oneOf","ConfirmationModal","_ref","buttonLabel","_ref$description","description","_ref$isOpen","isOpen","_ref$isSubmitting","isSubmitting","_ref$title","title","onClose","onSubmit","deleteConfirmationMessage","_useTranslation","useTranslation","t","formikProps","initialValues","validationSchema","deleteInputLabel","_jsx","Trans","components","strong","i18nKey","values","value","initialFocusRef","useRef","_jsxs","Modal","children","Header","Typography","style","Form","_ref2","_Fragment","Body","className","type","Input","label","labelProps","name","ref","Footer","ActionBlock","cancelButtonProps","onClick","disabled","submitButtonProps","loading"],"mappings":"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"}

package/dist/Container.js

@@ -0,0 +1,38 @@
+import { forwardRef } from 'react';
+import classnames from 'classnames';
+import { P as PropTypes } from './index-DAYCJu79.js';
+import { n } from './inject-css-DmrvuTKK.js';
+import { jsx } from 'react/jsx-runtime';
+import './_commonjsHelpers-BFTU3MAI.js';
+
+var css = ".neeto-molecules-container{align-items:flex-start;display:flex;flex-direction:column;flex-grow:1;height:100vh;justify-content:flex-start;overflow-y:auto;padding:0 2.5rem}@media screen and (max-width:768px){.neeto-molecules-container{padding:0 1.25rem}}.neeto-molecules-container--header-fixed{padding:0}.neeto-molecules-container--header-fixed>.neeto-molecules-header,.neeto-molecules-container--header-fixed>.neeto-molecules-scrollable,.neeto-molecules-container--header-fixed>.neeto-molecules-subheader{padding-left:2.5rem;padding-right:2.5rem}@media screen and (max-width:768px){.neeto-molecules-container--header-fixed>.neeto-molecules-header,.neeto-molecules-container--header-fixed>.neeto-molecules-scrollable,.neeto-molecules-container--header-fixed>.neeto-molecules-subheader{padding-left:1.25rem;padding-right:1.25rem}}";
+n(css,{});
+
+var Container = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var _ref$isHeaderFixed = _ref.isHeaderFixed,
+    isHeaderFixed = _ref$isHeaderFixed === void 0 ? false : _ref$isHeaderFixed,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? "" : _ref$className,
+    children = _ref.children;
+  return /*#__PURE__*/jsx("div", {
+    ref: ref,
+    className: classnames("neeto-molecules-container", {
+      "neeto-molecules-container--header-fixed": isHeaderFixed
+    }, className),
+    children: children
+  });
+});
+Container.displayName = "Container";
+Container.propTypes = {
+  /**
+   * Decides whether the `Header` component should be stickied at the top on scroll.
+   */
+  isHeaderFixed: PropTypes.bool,
+  /**
+   * Additional classes to be added to the modal
+   */
+  className: PropTypes.string
+};
+
+export { Container as default };
+//# sourceMappingURL=Container.js.map

package/dist/Container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.js","sources":["../src/components/Container/index.jsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport classnames from \"classnames\";\nimport PropTypes from \"prop-types\";\n\nimport \"./container.scss\";\n\nconst Container = forwardRef(\n  ({ isHeaderFixed = false, className = \"\", children }, ref) => (\n    <div\n      {...{ ref }}\n      className={classnames(\n        \"neeto-molecules-container\",\n        { \"neeto-molecules-container--header-fixed\": isHeaderFixed },\n        className\n      )}\n    >\n      {children}\n    </div>\n  )\n);\n\nContainer.displayName = \"Container\";\n\nContainer.propTypes = {\n  /**\n   * Decides whether the `Header` component should be stickied at the top on scroll.\n   */\n  isHeaderFixed: PropTypes.bool,\n  /**\n   * Additional classes to be added to the modal\n   */\n  className: PropTypes.string,\n};\n\nexport default Container;\n"],"names":["Container","forwardRef","_ref","ref","_ref$isHeaderFixed","isHeaderFixed","_ref$className","className","children","_jsx","classnames","displayName","propTypes","PropTypes","bool","string"],"mappings":";;;;;;;;;;AAOA,IAAMA,SAAS,gBAAGC,UAAU,CAC1B,UAAAC,IAAA,EAAsDC,GAAG,EAAA;AAAA,EAAA,IAAAC,kBAAA,GAAAF,IAAA,CAAtDG,aAAa;AAAbA,IAAAA,aAAa,GAAAD,kBAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,kBAAA;IAAAE,cAAA,GAAAJ,IAAA,CAAEK,SAAS;AAATA,IAAAA,SAAS,GAAAD,cAAA,KAAG,KAAA,CAAA,GAAA,EAAE,GAAAA,cAAA;IAAEE,QAAQ,GAAAN,IAAA,CAARM,QAAQ,CAAA;AAAA,EAAA,oBAChDC,GAAA,CAAA,KAAA,EAAA;AACQN,IAAAA,GAAG,EAAHA,GAAG;AACTI,IAAAA,SAAS,EAAEG,UAAU,CACnB,2BAA2B,EAC3B;AAAE,MAAA,yCAAyC,EAAEL,aAAAA;KAAe,EAC5DE,SACF,CAAE;AAAAC,IAAAA,QAAA,EAEDA,QAAAA;AAAQ,GACN,CAAC,CAAA;AAAA,CAEV,EAAC;AAEDR,SAAS,CAACW,WAAW,GAAG,WAAW,CAAA;AAEnCX,SAAS,CAACY,SAAS,GAAG;AACpB;AACF;AACA;EACEP,aAAa,EAAEQ,SAAS,CAACC,IAAI;AAC7B;AACF;AACA;EACEP,SAAS,EAAEM,SAAS,CAACE,MAAAA;AACvB,CAAC;;;;"}

package/dist/CopyToClipboardButton.js

@@ -0,0 +1,82 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import { useState, useRef, useEffect } from 'react';
+import classnames from 'classnames';
+import { copyToClipboard } from '@bigbinary/neeto-commons-frontend/utils/general';
+import Copy from '@bigbinary/neeto-icons/Copy';
+import Check from '@bigbinary/neeto-icons/Check';
+import Button from '@bigbinary/neetoui/Button';
+import { mergeAll } from 'ramda';
+import { useTranslation } from 'react-i18next';
+import { n } from './inject-css-DmrvuTKK.js';
+import { jsx } from 'react/jsx-runtime';
+
+var TIME_OUT = 2000;
+var TOOLTIP_CONFIG = {
+  trigger: "click mouseenter",
+  hideAfter: TIME_OUT,
+  position: "top"
+};
+
+var css = ".neeto-molecules-copy-button{display:flex;justify-content:space-between}.neeto-molecules-copy-button .neeto-ui-btn:active,.neeto-molecules-copy-button .neeto-ui-btn:focus,.neeto-molecules-copy-button .neeto-ui-btn:hover{box-shadow:none}.neeto-molecules-copy-button--active{background:rgba(var(--neeto-ui-success-500));color:rgba(var(--neeto-ui-white))}.neeto-molecules-copy-button--active.neeto-ui-btn:active,.neeto-molecules-copy-button--active.neeto-ui-btn:focus,.neeto-molecules-copy-button--active.neeto-ui-btn:hover{background:rgba(var(--neeto-ui-success-500));box-shadow:none;color:rgba(var(--neeto-ui-white))}";
+n(css,{});
+
+var _excluded = ["className", "icon", "label", "successLabel", "tooltipContent", "successTooltipContent", "value", "style", "tooltipProps"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var CopyToClipboardButton = function CopyToClipboardButton(_ref) {
+  var className = _ref.className,
+    _ref$icon = _ref.icon,
+    icon = _ref$icon === void 0 ? Copy : _ref$icon,
+    _ref$label = _ref.label,
+    label = _ref$label === void 0 ? "" : _ref$label,
+    successLabel = _ref.successLabel,
+    tooltipContent = _ref.tooltipContent,
+    successTooltipContent = _ref.successTooltipContent,
+    value = _ref.value,
+    style = _ref.style,
+    tooltipProps = _ref.tooltipProps,
+    otherProps = _objectWithoutProperties(_ref, _excluded);
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isChecked = _useState2[0],
+    setIsChecked = _useState2[1];
+  var ref = useRef();
+  var onHandleClick = function onHandleClick(event) {
+    event.preventDefault();
+    copyToClipboard(value, {
+      showToastr: false
+    });
+    setIsChecked(true);
+    setTimeout(function () {
+      setIsChecked(false);
+    }, TIME_OUT); // Reset copied state after 2 seconds
+  };
+  useEffect(function () {
+    if (!ref.current) return;
+    var buttonWidth = ref.current.clientWidth;
+    ref.current.style.minWidth = "".concat(buttonWidth, "px");
+  }, []);
+  var tooltipOptions = label ? null : mergeAll([TOOLTIP_CONFIG, {
+    content: isChecked ? successTooltipContent || t("neetoMolecules.common.copied") : tooltipContent || t("neetoMolecules.common.copyToClipboard")
+  }, tooltipProps]);
+  var buttonLabel = isChecked && label ? successLabel || t("neetoMolecules.common.copied") : label;
+  var buttonIcon = isChecked ? Check : icon;
+  return /*#__PURE__*/jsx(Button, _objectSpread({
+    ref: ref,
+    style: style,
+    "data-cy": "copy-to-clipboard-button",
+    "data-testid": "copy-button",
+    icon: buttonIcon,
+    label: buttonLabel,
+    tooltipProps: tooltipOptions,
+    className: classnames("neeto-molecules-copy-button", _defineProperty(_defineProperty({}, className, className), "neeto-molecules-copy-button--active", isChecked)),
+    onClick: onHandleClick
+  }, otherProps));
+};
+
+export { CopyToClipboardButton as default };
+//# sourceMappingURL=CopyToClipboardButton.js.map

package/dist/CopyToClipboardButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CopyToClipboardButton.js","sources":["../src/components/CopyToClipboardButton/constants.js","../src/components/CopyToClipboardButton/index.jsx"],"sourcesContent":["const TIME_OUT = 2000;\n\nconst TOOLTIP_CONFIG = {\n  trigger: \"click mouseenter\",\n  hideAfter: TIME_OUT,\n  position: \"top\",\n};\n\nconst BUTTON_STYLES = {\n  primary: \"primary\",\n  secondary: \"secondary\",\n  text: \"text\",\n};\n\nexport { TOOLTIP_CONFIG, TIME_OUT, BUTTON_STYLES };\n","import { useState, useEffect, useRef } from \"react\";\n\nimport classnames from \"classnames\";\nimport { copyToClipboard } from \"neetocommons/utils/general\";\nimport { Copy, Check } from \"neetoicons\";\nimport { Button } from \"neetoui\";\nimport PropTypes from \"prop-types\";\nimport { mergeAll } from \"ramda\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { TOOLTIP_CONFIG, TIME_OUT, BUTTON_STYLES } from \"./constants\";\nimport \"./copyToClipboard.scss\";\n\nconst CopyToClipboardButton = ({\n  className,\n  icon = Copy,\n  label = \"\",\n  successLabel,\n  tooltipContent,\n  successTooltipContent,\n  value,\n  style,\n  tooltipProps,\n  ...otherProps\n}) => {\n  const { t } = useTranslation();\n\n  const [isChecked, setIsChecked] = useState(false);\n\n  const ref = useRef();\n\n  const onHandleClick = event => {\n    event.preventDefault();\n    copyToClipboard(value, { showToastr: false });\n    setIsChecked(true);\n    setTimeout(() => {\n      setIsChecked(false);\n    }, TIME_OUT); // Reset copied state after 2 seconds\n  };\n\n  useEffect(() => {\n    if (!ref.current) return;\n    const buttonWidth = ref.current.clientWidth;\n    ref.current.style.minWidth = `${buttonWidth}px`;\n  }, []);\n\n  const tooltipOptions = label\n    ? null\n    : mergeAll([\n        TOOLTIP_CONFIG,\n        {\n          content: isChecked\n            ? successTooltipContent || t(\"neetoMolecules.common.copied\")\n            : tooltipContent || t(\"neetoMolecules.common.copyToClipboard\"),\n        },\n        tooltipProps,\n      ]);\n\n  const buttonLabel =\n    isChecked && label\n      ? successLabel || t(\"neetoMolecules.common.copied\")\n      : label;\n  const buttonIcon = isChecked ? Check : icon;\n\n  return (\n    <Button\n      {...{ ref, style }}\n      data-cy=\"copy-to-clipboard-button\"\n      data-testid=\"copy-button\"\n      icon={buttonIcon}\n      label={buttonLabel}\n      tooltipProps={tooltipOptions}\n      className={classnames(\"neeto-molecules-copy-button\", {\n        [className]: className,\n        \"neeto-molecules-copy-button--active\": isChecked,\n      })}\n      onClick={onHandleClick}\n      {...otherProps}\n    />\n  );\n};\n\nCopyToClipboardButton.propTypes = {\n  /**\n   * To provide additional classnames to the button.\n   */\n  className: PropTypes.string,\n  /**\n   * To provide the icon to be passed to the button. Defaults to the Copy icon.\n   */\n  icon: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),\n  /**\n   * To provide the label to the button. By default there is no label.\n   */\n  label: PropTypes.string,\n  /**\n   * The label of button when the value is copied to clipboard. Defaults to 'Copied'.\n   */\n  successLabel: PropTypes.string,\n  /**\n   * The value to be copied to clipboard. (required)\n   */\n  value: PropTypes.string,\n  /**\n   * To specify the style of the Button.\n   */\n  style: PropTypes.oneOf(Object.values(BUTTON_STYLES)),\n  /**\n   * The content of the tooltip when the value is copied to clipboard. Defaults to 'Copy to clipboard'.\n   */\n  tooltipContent: PropTypes.string,\n  /**\n   * The content of the tooltip when the value is copied to clipboard. Defaults to 'Copied'.\n   */\n  successTooltipContent: PropTypes.string,\n};\n\nexport default CopyToClipboardButton;\n"],"names":["TIME_OUT","TOOLTIP_CONFIG","trigger","hideAfter","position","CopyToClipboardButton","_ref","className","_ref$icon","icon","Copy","_ref$label","label","successLabel","tooltipContent","successTooltipContent","value","style","tooltipProps","otherProps","_objectWithoutProperties","_excluded","_useTranslation","useTranslation","t","_useState","useState","_useState2","_slicedToArray","isChecked","setIsChecked","ref","useRef","onHandleClick","event","preventDefault","copyToClipboard","showToastr","setTimeout","useEffect","current","buttonWidth","clientWidth","minWidth","concat","tooltipOptions","mergeAll","content","buttonLabel","buttonIcon","Check","_jsx","Button","_objectSpread","classnames","_defineProperty","onClick"],"mappings":"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"}