@bigbinary/neeto-molecules 5.1.8 → 5.1.10

package/dist/cjs/v2/ConfirmationModal.js

@@ -0,0 +1,125 @@
+'use strict';
+
+var neetoAtoms = require('@bigbinary/neeto-atoms');
+var formik = require('@bigbinary/neeto-atoms/formik');
+var ramda = require('ramda');
+var reactI18next = require('react-i18next');
+var yup = require('yup');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespaceDefault(e) {
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var yup__namespace = /*#__PURE__*/_interopNamespaceDefault(yup);
+
+var INITIAL_VALUES = {
+  confirmationText: ""
+};
+
+var deletionValidationSchema = function deletionValidationSchema(confirmationText) {
+  return yup__namespace.object({
+    confirmationText: yup__namespace.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 = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var formikProps = {
+    initialValues: INITIAL_VALUES,
+    validationSchema: deletionValidationSchema(confirmationText),
+    onSubmit: onSubmit
+  };
+  var deleteInputLabel = deleteConfirmationMessage || /*#__PURE__*/jsxRuntime.jsx(reactI18next.Trans, {
+    components: {
+      strong: /*#__PURE__*/jsxRuntime.jsx("strong", {})
+    },
+    i18nKey: "neetoMolecules.confirmationModal.deleteConfirmationMessage",
+    values: {
+      value: confirmationText
+    }
+  });
+  return /*#__PURE__*/jsxRuntime.jsxs(neetoAtoms.Dialog, {
+    isOpen: isOpen,
+    onClose: onClose,
+    "aria-describedby": undefined,
+    "data-testid": "confirmation-modal",
+    children: [/*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Dialog.Header, {
+      children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Dialog.Title, {
+        "data-testid": "confirmation-modal-title",
+        children: title
+      })
+    }), /*#__PURE__*/jsxRuntime.jsx(formik.Form, {
+      formikProps: formikProps,
+      children: function children(_ref2) {
+        var values = _ref2.values;
+        return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+          children: [/*#__PURE__*/jsxRuntime.jsxs(neetoAtoms.Dialog.Body, {
+            className: "flex flex-col gap-y-4",
+            children: [ramda.type(description) === "String" ? /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Typography, {
+              variant: "body2",
+              children: description
+            }) : description, /*#__PURE__*/jsxRuntime.jsx(formik.Input, {
+              autoFocus: true,
+              "data-testid": "confirmation-modal-input",
+              label: deleteInputLabel,
+              labelProps: {
+                className: "block"
+              },
+              name: "confirmationText",
+              type: "text"
+            })]
+          }), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Dialog.Footer, {
+            children: /*#__PURE__*/jsxRuntime.jsx(formik.ActionBlock, {
+              className: "flex items-center gap-x-2",
+              cancelButtonProps: {
+                label: t("neetoMolecules.common.actions.cancel"),
+                variant: "ghost",
+                onClick: onClose,
+                disabled: false,
+                type: "button"
+              },
+              submitButtonProps: {
+                "data-testid": "delete-continue-button",
+                label: buttonLabel,
+                loading: isSubmitting,
+                variant: "destructive",
+                disabled: isSubmitting || confirmationText !== values.confirmationText
+              }
+            })
+          })]
+        });
+      }
+    })]
+  });
+};
+
+module.exports = ConfirmationModal;
+//# sourceMappingURL=ConfirmationModal.js.map

package/dist/cjs/v2/ConfirmationModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConfirmationModal.js","sources":["../../../src/v2/components/ConfirmationModal/constants.js","../../../src/v2/components/ConfirmationModal/utils.js","../../../src/v2/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 { Dialog, Typography } from \"@bigbinary/neeto-atoms\";\nimport { ActionBlock, Form, Input } from \"@bigbinary/neeto-atoms/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\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  return (\n    <Dialog\n      {...{ isOpen, onClose }}\n      aria-describedby={undefined}\n      data-testid=\"confirmation-modal\"\n    >\n      <Dialog.Header>\n        <Dialog.Title data-testid=\"confirmation-modal-title\">\n          {title}\n        </Dialog.Title>\n      </Dialog.Header>\n      <Form {...{ formikProps }}>\n        {({ values }) => (\n          <>\n            <Dialog.Body className=\"flex flex-col gap-y-4\">\n              {type(description) === \"String\" ? (\n                <Typography variant=\"body2\">{description}</Typography>\n              ) : (\n                description\n              )}\n              <Input\n                autoFocus\n                data-testid=\"confirmation-modal-input\"\n                label={deleteInputLabel}\n                labelProps={{ className: \"block\" }}\n                name=\"confirmationText\"\n                type=\"text\"\n              />\n            </Dialog.Body>\n            <Dialog.Footer>\n              <ActionBlock\n                className=\"flex items-center gap-x-2\"\n                cancelButtonProps={{\n                  label: t(\"neetoMolecules.common.actions.cancel\"),\n                  variant: \"ghost\",\n                  onClick: onClose,\n                  disabled: false,\n                  type: \"button\",\n                }}\n                submitButtonProps={{\n                  \"data-testid\": \"delete-continue-button\",\n                  label: buttonLabel,\n                  loading: isSubmitting,\n                  variant: \"destructive\",\n                  disabled:\n                    isSubmitting ||\n                    confirmationText !== values.confirmationText,\n                }}\n              />\n            </Dialog.Footer>\n          </>\n        )}\n      </Form>\n    </Dialog>\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","_jsxs","Dialog","undefined","children","Header","Title","Form","_ref2","_Fragment","Body","className","type","Typography","variant","Input","autoFocus","label","labelProps","name","Footer","ActionBlock","cancelButtonProps","onClick","disabled","submitButtonProps","loading"],"mappings":"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"}

package/dist/cjs/v2/DateRangeFilter.js

@@ -0,0 +1,187 @@
+'use strict';
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var neetoAtoms = require('@bigbinary/neeto-atoms');
+var initializers = require('@bigbinary/neeto-commons-frontend/v2/initializers');
+var utils = require('@bigbinary/neeto-commons-frontend/v2/utils');
+var i18next = require('i18next');
+var jsxRuntime = require('react/jsx-runtime');
+
+var defaultTimePeriodOptions = function defaultTimePeriodOptions() {
+  var today = utils.dayjs().startOf("day");
+  var startOfLastWeek = today.subtract(7, "day").startOf("week");
+  var endOfLastWeek = today.subtract(7, "day").endOf("week");
+  var lastMonthStart = today.subtract(1, "month").startOf("month");
+  var lastMonthEnd = today.subtract(1, "month").endOf("month");
+  var thisQuarterStart = utils.dayjs().startOf("quarter");
+  var thisQuarterEnd = utils.dayjs().endOf("quarter");
+  var lastQuarterStart = utils.dayjs().subtract(1, "quarter").startOf("quarter");
+  var lastQuarterEnd = utils.dayjs().subtract(1, "quarter").endOf("quarter");
+  var startOfLastYear = utils.dayjs().subtract(1, "year").startOf("year");
+  var endOfLastYear = utils.dayjs().subtract(1, "year").endOf("year");
+  var startOfYear = utils.dayjs().startOf("year");
+  var endOfYear = utils.dayjs().endOf("year");
+  var startOf24Hours = utils.dayjs().subtract(24, "hour");
+  var now = utils.dayjs();
+  var startOfLast7Days = utils.dayjs().subtract(7, "day");
+  var startOfWeek = utils.dayjs().startOf("week");
+  var startOfLast30Days = utils.dayjs().subtract(30, "day");
+  var startOfMonth = today.startOf("month");
+  return [{
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.allTime"),
+    value: {
+      startDate: null,
+      endDate: null,
+      rangeType: "all"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.last24Hours"),
+    value: {
+      startDate: startOf24Hours,
+      endDate: now,
+      rangeType: "hours"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.last7Days"),
+    value: {
+      startDate: startOfLast7Days,
+      endDate: now,
+      rangeType: "days"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.thisWeek"),
+    value: {
+      startDate: startOfWeek,
+      endDate: now,
+      rangeType: "week"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.lastWeek"),
+    value: {
+      startDate: startOfLastWeek,
+      endDate: endOfLastWeek,
+      rangeType: "week"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.last30Days"),
+    value: {
+      startDate: startOfLast30Days,
+      endDate: now,
+      rangeType: "days"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.thisMonth"),
+    value: {
+      startDate: startOfMonth,
+      endDate: now,
+      rangeType: "month"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.lastMonth"),
+    value: {
+      startDate: lastMonthStart,
+      endDate: lastMonthEnd,
+      rangeType: "month"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.thisQuarter"),
+    value: {
+      startDate: thisQuarterStart,
+      endDate: thisQuarterEnd,
+      rangeType: "quarter"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.lastQuarter"),
+    value: {
+      startDate: lastQuarterStart,
+      endDate: lastQuarterEnd,
+      rangeType: "quarter"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.thisYear"),
+    value: {
+      startDate: startOfYear,
+      endDate: endOfYear,
+      rangeType: "year"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.lastYear"),
+    value: {
+      startDate: startOfLastYear,
+      endDate: endOfLastYear,
+      rangeType: "year"
+    }
+  }, {
+    label: i18next.t("neetoMolecules.dateRangeFilter.timePeriodOptions.customDuration"),
+    value: "custom"
+  }];
+};
+
+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), true).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 DateRangeFilter = function DateRangeFilter(_ref) {
+  var _timePeriod$value, _timePeriod$value2, _timePeriod$value3, _globalProps$user, _ref6;
+  var timePeriodOptions = _ref.timePeriodOptions,
+    timePeriod = _ref.timePeriod,
+    setTimePeriod = _ref.setTimePeriod,
+    datePickerProps = _ref.datePickerProps;
+  var isCustom = (timePeriod === null || timePeriod === void 0 ? void 0 : timePeriod.value) === "custom" || (timePeriod === null || timePeriod === void 0 || (_timePeriod$value = timePeriod.value) === null || _timePeriod$value === void 0 ? void 0 : _timePeriod$value.rangeType) === "custom";
+  var startDate = timePeriod === null || timePeriod === void 0 || (_timePeriod$value2 = timePeriod.value) === null || _timePeriod$value2 === void 0 ? void 0 : _timePeriod$value2.startDate;
+  var endDate = timePeriod === null || timePeriod === void 0 || (_timePeriod$value3 = timePeriod.value) === null || _timePeriod$value3 === void 0 ? void 0 : _timePeriod$value3.endDate;
+  var requiredDateFormat = initializers.globalProps === null || initializers.globalProps === void 0 || (_globalProps$user = initializers.globalProps.user) === null || _globalProps$user === void 0 ? void 0 : _globalProps$user.dateFormat;
+  var options = timePeriodOptions || defaultTimePeriodOptions();
+  var selectOptions = options.map(function (_ref2) {
+    var label = _ref2.label;
+    return {
+      label: label,
+      value: label
+    };
+  });
+  var handleChange = function handleChange(selectedLabel) {
+    return setTimePeriod(options.find(function (_ref3) {
+      var label = _ref3.label;
+      return label === selectedLabel;
+    }));
+  };
+  var handleDateRangeChange = function handleDateRangeChange(dateRange) {
+    var _ref4 = dateRange !== null && dateRange !== void 0 ? dateRange : [],
+      _ref5 = _slicedToArray(_ref4, 2),
+      newStartDate = _ref5[0],
+      newEndDate = _ref5[1];
+    setTimePeriod({
+      label: timePeriod === null || timePeriod === void 0 ? void 0 : timePeriod.label,
+      value: {
+        startDate: newStartDate,
+        endDate: newEndDate,
+        rangeType: "custom"
+      }
+    });
+  };
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+    className: "neeto-molecules-date-range-filter flex flex-wrap gap-3",
+    "data-testid": "date-range-filter",
+    children: [/*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "neeto-molecules-date-range-filter__select w-40",
+      children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Select, {
+        required: true,
+        options: selectOptions,
+        value: (_ref6 = timePeriod || options[0]) === null || _ref6 === void 0 ? void 0 : _ref6.label,
+        onChange: handleChange
+      })
+    }), isCustom && /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "neeto-molecules-date-range-filter__custom-duration-picker max-w-sm flex-grow",
+      "data-testid": "date-range-filter-custom-duration-picker",
+      children: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.DatePicker, _objectSpread({
+        className: "w-full",
+        dateFormat: requiredDateFormat,
+        type: "range",
+        value: [startDate ? utils.dayjs(startDate) : null, endDate ? utils.dayjs(endDate) : null],
+        onChange: handleDateRangeChange
+      }, datePickerProps))
+    })]
+  });
+};
+
+module.exports = DateRangeFilter;
+//# sourceMappingURL=DateRangeFilter.js.map

package/dist/cjs/v2/DateRangeFilter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DateRangeFilter.js","sources":["../../../src/v2/components/DateRangeFilter/utils.js","../../../src/v2/components/DateRangeFilter/index.jsx"],"sourcesContent":["import { t } from \"i18next\";\nimport { dayjs } from \"neetocommons/v2/utils\";\n\nexport const defaultTimePeriodOptions = () => {\n  const today = dayjs().startOf(\"day\");\n  const startOfLastWeek = today.subtract(7, \"day\").startOf(\"week\");\n\n  const endOfLastWeek = today.subtract(7, \"day\").endOf(\"week\");\n  const lastMonthStart = today.subtract(1, \"month\").startOf(\"month\");\n  const lastMonthEnd = today.subtract(1, \"month\").endOf(\"month\");\n  const thisQuarterStart = dayjs().startOf(\"quarter\");\n  const thisQuarterEnd = dayjs().endOf(\"quarter\");\n  const lastQuarterStart = dayjs().subtract(1, \"quarter\").startOf(\"quarter\");\n  const lastQuarterEnd = dayjs().subtract(1, \"quarter\").endOf(\"quarter\");\n  const startOfLastYear = dayjs().subtract(1, \"year\").startOf(\"year\");\n  const endOfLastYear = dayjs().subtract(1, \"year\").endOf(\"year\");\n  const startOfYear = dayjs().startOf(\"year\");\n  const endOfYear = dayjs().endOf(\"year\");\n\n  const startOf24Hours = dayjs().subtract(24, \"hour\");\n  const now = dayjs();\n  const startOfLast7Days = dayjs().subtract(7, \"day\");\n  const startOfWeek = dayjs().startOf(\"week\");\n  const startOfLast30Days = dayjs().subtract(30, \"day\");\n  const startOfMonth = today.startOf(\"month\");\n\n  return [\n    {\n      label: t(\"neetoMolecules.dateRangeFilter.timePeriodOptions.allTime\"),\n      value: { startDate: null, endDate: null, rangeType: \"all\" },\n    },\n    {\n      label: t(\"neetoMolecules.dateRangeFilter.timePeriodOptions.last24Hours\"),\n      value: { startDate: startOf24Hours, endDate: now, rangeType: \"hours\" },\n    },\n    {\n      label: t(\"neetoMolecules.dateRangeFilter.timePeriodOptions.last7Days\"),\n      value: {\n        startDate: startOfLast7Days,\n        endDate: now,\n        rangeType: \"days\",\n      },\n    },\n    {\n      label: t(\"neetoMolecules.dateRangeFilter.timePeriodOptions.thisWeek\"),\n      value: { startDate: startOfWeek, endDate: now, rangeType: \"week\" },\n    },\n    {\n      label: t(\"neetoMolecules.dateRangeFilter.timePeriodOptions.lastWeek\"),\n      value: {\n        startDate: startOfLastWeek,\n        endDate: endOfLastWeek,\n        rangeType: \"week\",\n      },\n    },\n    {\n      label: t(\"neetoMolecules.dateRangeFilter.timePeriodOptions.last30Days\"),\n      value: {\n        startDate: startOfLast30Days,\n        endDate: now,\n        rangeType: \"days\",\n      },\n    },\n    {\n      label: t(\"neetoMolecules.dateRangeFilter.timePeriodOptions.thisMonth\"),\n      value: { startDate: startOfMonth, endDate: now, rangeType: \"month\" },\n    },\n    {\n      label: t(\"neetoMolecules.dateRangeFilter.timePeriodOptions.lastMonth\"),\n      value: {\n        startDate: lastMonthStart,\n        endDate: lastMonthEnd,\n        rangeType: \"month\",\n      },\n    },\n    {\n      label: t(\"neetoMolecules.dateRangeFilter.timePeriodOptions.thisQuarter\"),\n      value: {\n        startDate: thisQuarterStart,\n        endDate: thisQuarterEnd,\n        rangeType: \"quarter\",\n      },\n    },\n    {\n      label: t(\"neetoMolecules.dateRangeFilter.timePeriodOptions.lastQuarter\"),\n      value: {\n        startDate: lastQuarterStart,\n        endDate: lastQuarterEnd,\n        rangeType: \"quarter\",\n      },\n    },\n    {\n      label: t(\"neetoMolecules.dateRangeFilter.timePeriodOptions.thisYear\"),\n      value: { startDate: startOfYear, endDate: endOfYear, rangeType: \"year\" },\n    },\n    {\n      label: t(\"neetoMolecules.dateRangeFilter.timePeriodOptions.lastYear\"),\n      value: {\n        startDate: startOfLastYear,\n        endDate: endOfLastYear,\n        rangeType: \"year\",\n      },\n    },\n    {\n      label: t(\n        \"neetoMolecules.dateRangeFilter.timePeriodOptions.customDuration\"\n      ),\n      value: \"custom\",\n    },\n  ];\n};\n","import { DatePicker, Select } from \"@bigbinary/neeto-atoms\";\nimport { globalProps } from \"neetocommons/v2/initializers\";\nimport { dayjs } from \"neetocommons/v2/utils\";\nimport PropTypes from \"prop-types\";\n\nimport { defaultTimePeriodOptions } from \"./utils\";\n\nconst DateRangeFilter = ({\n  timePeriodOptions,\n  timePeriod,\n  setTimePeriod,\n  datePickerProps,\n}) => {\n  const isCustom =\n    timePeriod?.value === \"custom\" || timePeriod?.value?.rangeType === \"custom\";\n\n  const startDate = timePeriod?.value?.startDate;\n  const endDate = timePeriod?.value?.endDate;\n  const requiredDateFormat = globalProps?.user?.dateFormat;\n\n  const options = timePeriodOptions || defaultTimePeriodOptions();\n\n  const selectOptions = options.map(({ label }) => ({ label, value: label }));\n\n  const handleChange = selectedLabel =>\n    setTimePeriod(options.find(({ label }) => label === selectedLabel));\n\n  const handleDateRangeChange = dateRange => {\n    const [newStartDate, newEndDate] = dateRange ?? [];\n    setTimePeriod({\n      label: timePeriod?.label,\n      value: {\n        startDate: newStartDate,\n        endDate: newEndDate,\n        rangeType: \"custom\",\n      },\n    });\n  };\n\n  return (\n    <div\n      className=\"neeto-molecules-date-range-filter flex flex-wrap gap-3\"\n      data-testid=\"date-range-filter\"\n    >\n      <div className=\"neeto-molecules-date-range-filter__select w-40\">\n        <Select\n          required\n          options={selectOptions}\n          value={(timePeriod || options[0])?.label}\n          onChange={handleChange}\n        />\n      </div>\n      {isCustom && (\n        <div\n          className=\"neeto-molecules-date-range-filter__custom-duration-picker max-w-sm flex-grow\"\n          data-testid=\"date-range-filter-custom-duration-picker\"\n        >\n          <DatePicker\n            className=\"w-full\"\n            dateFormat={requiredDateFormat}\n            type=\"range\"\n            value={[\n              startDate ? dayjs(startDate) : null,\n              endDate ? dayjs(endDate) : null,\n            ]}\n            onChange={handleDateRangeChange}\n            {...datePickerProps}\n          />\n        </div>\n      )}\n    </div>\n  );\n};\n\nDateRangeFilter.propTypes = {\n  /**\n   * An array of objects that can be passed to the component which can be used to override default filter options.\n   */\n  timePeriodOptions: PropTypes.arrayOf(\n    PropTypes.shape({ label: PropTypes.string, value: PropTypes.object })\n  ),\n  /**\n   * The state corresponding to the currently selected date range filter.\n   */\n  timePeriod: PropTypes.shape({\n    label: PropTypes.string,\n    value: PropTypes.object,\n  }),\n  /**\n   * The setter method for `timePeriod` state.\n   */\n  setTimePeriod: PropTypes.func,\n  /**\n   * These props will be passed to the date range picker for custom date range selection.\n   */\n  datePickerProps: PropTypes.object,\n};\n\nexport default DateRangeFilter;\n"],"names":["defaultTimePeriodOptions","today","dayjs","startOf","startOfLastWeek","subtract","endOfLastWeek","endOf","lastMonthStart","lastMonthEnd","thisQuarterStart","thisQuarterEnd","lastQuarterStart","lastQuarterEnd","startOfLastYear","endOfLastYear","startOfYear","endOfYear","startOf24Hours","now","startOfLast7Days","startOfWeek","startOfLast30Days","startOfMonth","label","t","value","startDate","endDate","rangeType","DateRangeFilter","_ref","_timePeriod$value","_timePeriod$value2","_timePeriod$value3","_globalProps$user","_ref6","timePeriodOptions","timePeriod","setTimePeriod","datePickerProps","isCustom","requiredDateFormat","globalProps","user","dateFormat","options","selectOptions","map","_ref2","handleChange","selectedLabel","find","_ref3","handleDateRangeChange","dateRange","_ref4","_ref5","_slicedToArray","newStartDate","newEndDate","_jsxs","className","children","_jsx","Select","required","onChange","DatePicker","_objectSpread","type"],"mappings":"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"}

package/dist/cjs/v2/ToggleFeatureCard.js

@@ -0,0 +1,201 @@
+'use strict';
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var React = require('react');
+var neetoAtoms = require('@bigbinary/neeto-atoms');
+var formik = require('@bigbinary/neeto-atoms/formik');
+var classnames = require('classnames');
+var formik$1 = require('formik');
+var neetoCist = require('@bigbinary/neeto-cist');
+var useOnClickOutside = require('@bigbinary/neeto-commons-frontend/v2/react-utils/useOnClickOutside');
+var useHotkeys = require('@bigbinary/neeto-hotkeys');
+var ramda = require('ramda');
+var reactI18next = require('react-i18next');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+var jsxRuntime = require('react/jsx-runtime');
+var x = require('../x-B38UX0_0.js');
+require('../createLucideIcon-DBDhE7kE.js');
+
+var useScrollIntoView = function useScrollIntoView(_ref) {
+  var elementId = _ref.elementId,
+    trigger = _ref.trigger;
+  React.useEffect(function () {
+    var _document$getElementB;
+    if (!trigger) return;
+    (_document$getElementB = document.getElementById(elementId)) === null || _document$getElementB === void 0 || _document$getElementB.scrollIntoView();
+  }, [trigger]);
+};
+
+var _excluded = ["enabledCondition", "name", "isDisabled", "switchDataTestid", "tooltipProps"],
+  _excluded2 = ["enabledSwitchText", "disabledSwitchText"];
+function ownKeys$1(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$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var TooltipSwitch = function TooltipSwitch(_ref) {
+  var enabledCondition = _ref.enabledCondition,
+    _ref$name = _ref.name,
+    name = _ref$name === void 0 ? "" : _ref$name,
+    _ref$isDisabled = _ref.isDisabled,
+    isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
+    switchDataTestid = _ref.switchDataTestid,
+    _ref$tooltipProps = _ref.tooltipProps,
+    tooltipProps = _ref$tooltipProps === void 0 ? {} : _ref$tooltipProps,
+    otherProps = _objectWithoutProperties(_ref, _excluded);
+  var enabledSwitchText = tooltipProps.enabledSwitchText,
+    disabledSwitchText = tooltipProps.disabledSwitchText,
+    neetoAtomsTooltipProps = _objectWithoutProperties(tooltipProps, _excluded2);
+  var tooltipContent = enabledCondition ? enabledSwitchText : disabledSwitchText;
+  return /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Tooltip, _objectSpread$1(_objectSpread$1({
+    content: tooltipContent,
+    disabled: !tooltipContent,
+    position: "top"
+  }, neetoAtomsTooltipProps), {}, {
+    children: /*#__PURE__*/jsxRuntime.jsx("span", {
+      children: /*#__PURE__*/jsxRuntime.jsx(formik.Switch, _objectSpread$1({
+        disabled: isDisabled,
+        "data-testid": neetoCist.isPresent(switchDataTestid) ? switchDataTestid : "toggle-feature-card-switch"
+      }, _objectSpread$1({
+        name: name
+      }, otherProps)))
+    })
+  }));
+};
+
+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), true).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 ToggleFeatureCard = function ToggleFeatureCard(_ref) {
+  var _ref$isCardStyleEnabl = _ref.isCardStyleEnabled,
+    isCardStyleEnabled = _ref$isCardStyleEnabl === void 0 ? true : _ref$isCardStyleEnabl,
+    _ref$title = _ref.title,
+    title = _ref$title === void 0 ? "" : _ref$title,
+    _ref$description = _ref.description,
+    description = _ref$description === void 0 ? null : _ref$description,
+    _ref$switchName = _ref.switchName,
+    switchName = _ref$switchName === void 0 ? "switch" : _ref$switchName,
+    _ref$titleDataTestid = _ref.titleDataTestid,
+    titleDataTestid = _ref$titleDataTestid === void 0 ? "" : _ref$titleDataTestid,
+    _ref$switchDataTestid = _ref.switchDataTestid,
+    switchDataTestid = _ref$switchDataTestid === void 0 ? "" : _ref$switchDataTestid,
+    _ref$descriptionDataT = _ref.descriptionDataTestid,
+    descriptionDataTestid = _ref$descriptionDataT === void 0 ? "" : _ref$descriptionDataT,
+    _ref$isDisabled = _ref.isDisabled,
+    isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
+    _ref$children = _ref.children,
+    children = _ref$children === void 0 ? null : _ref$children,
+    inputProps = _ref.inputProps,
+    _ref$switchProps = _ref.switchProps,
+    switchProps = _ref$switchProps === void 0 ? {} : _ref$switchProps,
+    _ref$editButtonProps = _ref.editButtonProps,
+    editButtonProps = _ref$editButtonProps === void 0 ? {} : _ref$editButtonProps,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? "" : _ref$className;
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var cardRef = React.useRef();
+  var id = neetoCist.slugify(title);
+  var _useState = React.useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isEditing = _useState2[0],
+    setIsEditing = _useState2[1];
+  var _useFormikContext = formik$1.useFormikContext(),
+    setFieldValue = _useFormikContext.setFieldValue,
+    values = _useFormikContext.values,
+    submitCount = _useFormikContext.submitCount,
+    errors = _useFormikContext.errors,
+    initialValues = _useFormikContext.initialValues;
+  React.useEffect(function () {
+    if (!(submitCount >= 1 && ramda.isEmpty(errors))) return;
+    setIsEditing(false);
+  }, [submitCount]);
+  React.useEffect(function () {
+    if (ramda.isEmpty(errors)) return;
+    setIsEditing(true);
+  }, [values, errors]);
+  var _useState3 = React.useState(location.hash.split("#")[1] === id),
+    _useState4 = _slicedToArray(_useState3, 2),
+    shouldHighlight = _useState4[0],
+    setShouldHighlight = _useState4[1];
+  var hasInput = (values === null || values === void 0 ? void 0 : values[switchName]) && (inputProps === null || inputProps === void 0 ? void 0 : inputProps.name);
+  var enabledCondition = values === null || values === void 0 ? void 0 : values[switchName];
+  var handleInputReset = function handleInputReset() {
+    setIsEditing(false);
+    hasInput && setFieldValue(inputProps === null || inputProps === void 0 ? void 0 : inputProps.name, initialValues === null || initialValues === void 0 ? void 0 : initialValues[inputProps === null || inputProps === void 0 ? void 0 : inputProps.name]);
+  };
+  useOnClickOutside(cardRef, function () {
+    return setShouldHighlight(false);
+  });
+  useScrollIntoView({
+    elementId: id,
+    trigger: shouldHighlight
+  });
+  var inputRef = useHotkeys("enter", function () {
+    return setIsEditing(false);
+  }, {
+    mode: "scoped"
+  });
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+    id: id,
+    "data-testid": "feature-card-container",
+    ref: cardRef,
+    className: classnames("flex flex-col gap-y-2 rounded-lg bg-white", {
+      "border p-4": isCardStyleEnabled
+    }, {
+      "border-border": !shouldHighlight
+    }, {
+      "border-primary ring-primary ring-1": shouldHighlight
+    }, className),
+    children: [/*#__PURE__*/jsxRuntime.jsxs(neetoAtoms.Label, {
+      className: "flex flex-row items-center gap-2",
+      children: [/*#__PURE__*/jsxRuntime.jsx(TooltipSwitch, _objectSpread(_objectSpread({}, _objectSpread({
+        enabledCondition: enabledCondition,
+        isDisabled: isDisabled,
+        switchDataTestid: switchDataTestid
+      }, switchProps)), {}, {
+        name: switchName
+      })), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Typography, {
+        as: "span",
+        className: "leading-snug",
+        variant: "h4",
+        weight: "semibold",
+        "data-testid": neetoCist.isPresent(titleDataTestid) ? titleDataTestid : "toggle-feature-card-title",
+        children: title
+      })]
+    }), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Typography, {
+      className: "mb-4 whitespace-pre-line",
+      variant: "body2",
+      "data-testid": neetoCist.isPresent(descriptionDataTestid) ? descriptionDataTestid : "toggle-feature-card-description",
+      children: description
+    }), hasInput && !isEditing && /*#__PURE__*/jsxRuntime.jsxs("div", {
+      className: "m-0 flex flex-row items-center gap-x-2",
+      children: [inputProps === null || inputProps === void 0 ? void 0 : inputProps.display, /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, _objectSpread({
+        label: t("neetoMolecules.common.actions.edit"),
+        size: "sm",
+        type: "button",
+        variant: "link",
+        "data-testid": neetoCist.isPresent(inputProps === null || inputProps === void 0 ? void 0 : inputProps.editButtonDataTestid) ? inputProps === null || inputProps === void 0 ? void 0 : inputProps.editButtonDataTestid : "toggle-feature-card-input-display-edit",
+        onClick: function onClick() {
+          return setIsEditing(true);
+        }
+      }, editButtonProps))]
+    }), hasInput && isEditing && /*#__PURE__*/jsxRuntime.jsx(formik.Input, _objectSpread({
+      autoFocus: true,
+      label: inputProps === null || inputProps === void 0 ? void 0 : inputProps.label,
+      name: inputProps === null || inputProps === void 0 ? void 0 : inputProps.name,
+      placeholder: inputProps === null || inputProps === void 0 ? void 0 : inputProps.placeholder,
+      ref: inputRef,
+      size: "medium",
+      "data-testid": neetoCist.isPresent(inputProps === null || inputProps === void 0 ? void 0 : inputProps.dataTestid) ? inputProps === null || inputProps === void 0 ? void 0 : inputProps.dataTestid : "toggle-feature-card-input-field",
+      suffix: /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, {
+        "data-testid": "toggle-feature-card-input-reset",
+        icon: x.X,
+        size: "sm",
+        type: "button",
+        variant: "ghost",
+        onClick: handleInputReset
+      })
+    }, inputProps)), children]
+  });
+};
+
+module.exports = ToggleFeatureCard;
+//# sourceMappingURL=ToggleFeatureCard.js.map

package/dist/cjs/v2/ToggleFeatureCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleFeatureCard.js","sources":["../../../src/v2/components/ToggleFeatureCard/hooks/useScrollIntoView.js","../../../src/v2/components/ToggleFeatureCard/ToolTipSwitch.jsx","../../../src/v2/components/ToggleFeatureCard/index.jsx"],"sourcesContent":["import { useEffect } from \"react\";\n\nconst useScrollIntoView = ({ elementId, trigger }) => {\n  useEffect(() => {\n    if (!trigger) return;\n    document.getElementById(elementId)?.scrollIntoView();\n  }, [trigger]);\n};\n\nexport default useScrollIntoView;\n","import { Tooltip } from \"@bigbinary/neeto-atoms\";\nimport { Switch as FormikSwitch } from \"@bigbinary/neeto-atoms/formik\";\nimport { isPresent } from \"neetocist\";\n\nconst TooltipSwitch = ({\n  enabledCondition,\n  name = \"\",\n  isDisabled = false,\n  switchDataTestid,\n  tooltipProps = {},\n  ...otherProps\n}) => {\n  const { enabledSwitchText, disabledSwitchText, ...neetoAtomsTooltipProps } =\n    tooltipProps;\n\n  const tooltipContent = enabledCondition\n    ? enabledSwitchText\n    : disabledSwitchText;\n\n  return (\n    <Tooltip\n      content={tooltipContent}\n      disabled={!tooltipContent}\n      position=\"top\"\n      {...neetoAtomsTooltipProps}\n    >\n      <span>\n        <FormikSwitch\n          disabled={isDisabled}\n          data-testid={\n            isPresent(switchDataTestid)\n              ? switchDataTestid\n              : \"toggle-feature-card-switch\"\n          }\n          {...{ name, ...otherProps }}\n        />\n      </span>\n    </Tooltip>\n  );\n};\n\nexport default TooltipSwitch;\n","import { useRef, useState, useEffect } from \"react\";\n\nimport { Button, Label, Typography } from \"@bigbinary/neeto-atoms\";\nimport { Input } from \"@bigbinary/neeto-atoms/formik\";\nimport classnames from \"classnames\";\nimport { useFormikContext } from \"formik\";\nimport { X } from \"lucide-react\";\nimport { isPresent, slugify } from \"neetocist\";\nimport useOnClickOutside from \"neetocommons/v2/react-utils/useOnClickOutside\";\nimport useHotkeys from \"neetohotkeys\";\nimport PropTypes from \"prop-types\";\nimport { isEmpty } from \"ramda\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { SIZES } from \"./constants\";\nimport useScrollIntoView from \"./hooks/useScrollIntoView\";\nimport TooltipSwitch from \"./ToolTipSwitch\";\n\nconst ToggleFeatureCard = ({\n  isCardStyleEnabled = true,\n  title = \"\",\n  description = null,\n  switchName = \"switch\",\n  titleDataTestid = \"\",\n  switchDataTestid = \"\",\n  descriptionDataTestid = \"\",\n  isDisabled = false,\n  children = null,\n  inputProps,\n  switchProps = {},\n  editButtonProps = {},\n  className = \"\",\n}) => {\n  const { t } = useTranslation();\n  const cardRef = useRef();\n  const id = slugify(title);\n\n  const [isEditing, setIsEditing] = useState(false);\n\n  const { setFieldValue, values, submitCount, errors, initialValues } =\n    useFormikContext();\n\n  useEffect(() => {\n    if (!(submitCount >= 1 && isEmpty(errors))) return;\n    setIsEditing(false);\n  }, [submitCount]);\n\n  useEffect(() => {\n    if (isEmpty(errors)) return;\n    setIsEditing(true);\n  }, [values, errors]);\n\n  const [shouldHighlight, setShouldHighlight] = useState(\n    location.hash.split(\"#\")[1] === id\n  );\n\n  const hasInput = values?.[switchName] && inputProps?.name;\n  const enabledCondition = values?.[switchName];\n\n  const handleInputReset = () => {\n    setIsEditing(false);\n    hasInput &&\n      setFieldValue(inputProps?.name, initialValues?.[inputProps?.name]);\n  };\n\n  useOnClickOutside(cardRef, () => setShouldHighlight(false));\n\n  useScrollIntoView({ elementId: id, trigger: shouldHighlight });\n\n  const inputRef = useHotkeys(\"enter\", () => setIsEditing(false), {\n    mode: \"scoped\",\n  });\n\n  return (\n    <div\n      {...{ id }}\n      data-testid=\"feature-card-container\"\n      ref={cardRef}\n      className={classnames(\n        \"flex flex-col gap-y-2 rounded-lg bg-white\",\n        { \"border p-4\": isCardStyleEnabled },\n        { \"border-border\": !shouldHighlight },\n        { \"border-primary ring-primary ring-1\": shouldHighlight },\n        className\n      )}\n    >\n      <Label className=\"flex flex-row items-center gap-2\">\n        <TooltipSwitch\n          {...{\n            enabledCondition,\n            isDisabled,\n            switchDataTestid,\n            ...switchProps,\n          }}\n          name={switchName}\n        />\n        <Typography\n          as=\"span\"\n          className=\"leading-snug\"\n          variant=\"h4\"\n          weight=\"semibold\"\n          data-testid={\n            isPresent(titleDataTestid)\n              ? titleDataTestid\n              : \"toggle-feature-card-title\"\n          }\n        >\n          {title}\n        </Typography>\n      </Label>\n      <Typography\n        className=\"mb-4 whitespace-pre-line\"\n        variant=\"body2\"\n        data-testid={\n          isPresent(descriptionDataTestid)\n            ? descriptionDataTestid\n            : \"toggle-feature-card-description\"\n        }\n      >\n        {description}\n      </Typography>\n      {hasInput && !isEditing && (\n        <div className=\"m-0 flex flex-row items-center gap-x-2\">\n          {inputProps?.display}\n          <Button\n            label={t(\"neetoMolecules.common.actions.edit\")}\n            size=\"sm\"\n            type=\"button\"\n            variant=\"link\"\n            data-testid={\n              isPresent(inputProps?.editButtonDataTestid)\n                ? inputProps?.editButtonDataTestid\n                : \"toggle-feature-card-input-display-edit\"\n            }\n            onClick={() => setIsEditing(true)}\n            {...editButtonProps}\n          />\n        </div>\n      )}\n      {hasInput && isEditing && (\n        <Input\n          autoFocus\n          label={inputProps?.label}\n          name={inputProps?.name}\n          placeholder={inputProps?.placeholder}\n          ref={inputRef}\n          size=\"medium\"\n          data-testid={\n            isPresent(inputProps?.dataTestid)\n              ? inputProps?.dataTestid\n              : \"toggle-feature-card-input-field\"\n          }\n          suffix={\n            <Button\n              data-testid=\"toggle-feature-card-input-reset\"\n              icon={X}\n              size=\"sm\"\n              type=\"button\"\n              variant=\"ghost\"\n              onClick={handleInputReset}\n            />\n          }\n          {...inputProps}\n        />\n      )}\n      {children}\n    </div>\n  );\n};\n\nToggleFeatureCard.propTypes = {\n  /**\n   * The title that will be displayed for the card.\n   */\n  title: PropTypes.string,\n  /**\n   * The descripton text for the particular feature or setting.\n   */\n  description: PropTypes.string,\n  /**\n   * The formik name of the feature or setting to be toggled. eg:\n  {switchName: \"enableEmails\"}.\n   */\n  switchName: PropTypes.string,\n  /**\n   * Can be used to disable the toggle switch conditionally.\n   */\n  isDisabled: PropTypes.bool,\n  /**\n   * Can be used to enable the card appearance.\n   */\n  isCardStyleEnabled: PropTypes.bool,\n  /**\n   * Custom child components to be displayed in the card.\n   */\n  children: PropTypes.node,\n  /**\n   * Can be used to add an input field for a setting or a feature.\n    For example, `Enable email notifications` card can have an email input field.\n   */\n  inputProps: PropTypes.shape({\n    name: PropTypes.string,\n    display: PropTypes.node,\n    label: PropTypes.string,\n    editButtonTooltip: PropTypes.string,\n    editButtonDataTestid: PropTypes.string,\n    placeholder: PropTypes.string,\n    dataTestid: PropTypes.string,\n    onChange: PropTypes.func,\n    suffix: PropTypes.node,\n    prefix: PropTypes.node,\n    className: PropTypes.string,\n    nakedInput: PropTypes.bool,\n    size: PropTypes.oneOf(Object.values(SIZES)),\n    type: PropTypes.string,\n    maxLength: PropTypes.number,\n    contentSize: PropTypes.number,\n    unlimitedChars: PropTypes.bool,\n  }),\n  /**\n   * Can be used to add props to the switch component.\n   */\n  switchProps: PropTypes.shape({\n    onChange: PropTypes.func,\n    className: PropTypes.string,\n    checked: PropTypes.bool,\n    tooltipProps: PropTypes.shape({\n      enabledSwitchText: PropTypes.string,\n      disabledSwitchText: PropTypes.string,\n    }),\n  }),\n  /**\n   * Can be used to add props to the edit button component.\n   */\n  editButtonProps: PropTypes.shape({\n    onClick: PropTypes.func,\n    className: PropTypes.string,\n    style: PropTypes.string,\n    size: PropTypes.string,\n    type: PropTypes.string,\n    tooltipProps: PropTypes.object,\n  }),\n  /**\n   * To specify external classnames as overrides to the ToggleFeatureCard wrapper.\n   */\n  className: PropTypes.string,\n};\n\nexport default ToggleFeatureCard;\n"],"names":["useScrollIntoView","_ref","elementId","trigger","useEffect","_document$getElementB","document","getElementById","scrollIntoView","TooltipSwitch","enabledCondition","_ref$name","name","_ref$isDisabled","isDisabled","switchDataTestid","_ref$tooltipProps","tooltipProps","otherProps","_objectWithoutProperties","_excluded","enabledSwitchText","disabledSwitchText","neetoAtomsTooltipProps","_excluded2","tooltipContent","_jsx","Tooltip","_objectSpread","content","disabled","position","children","FormikSwitch","isPresent","ToggleFeatureCard","_ref$isCardStyleEnabl","isCardStyleEnabled","_ref$title","title","_ref$description","description","_ref$switchName","switchName","_ref$titleDataTestid","titleDataTestid","_ref$switchDataTestid","_ref$descriptionDataT","descriptionDataTestid","_ref$children","inputProps","_ref$switchProps","switchProps","_ref$editButtonProps","editButtonProps","_ref$className","className","_useTranslation","useTranslation","t","cardRef","useRef","id","slugify","_useState","useState","_useState2","_slicedToArray","isEditing","setIsEditing","_useFormikContext","useFormikContext","setFieldValue","values","submitCount","errors","initialValues","isEmpty","_useState3","location","hash","split","_useState4","shouldHighlight","setShouldHighlight","hasInput","handleInputReset","useOnClickOutside","inputRef","useHotkeys","mode","_jsxs","ref","classnames","Label","Typography","as","variant","weight","display","Button","label","size","type","editButtonDataTestid","onClick","Input","autoFocus","placeholder","dataTestid","suffix","icon","X"],"mappings":"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"}