@bigbinary/neeto-molecules 5.1.19 → 5.1.21

package/dist/v2/PublishYourItem.js

@@ -0,0 +1,58 @@
+import { Typography } from '@bigbinary/neeto-atoms';
+import { withT } from '@bigbinary/neeto-commons-frontend/v2/react-utils';
+import { P as PropTypes } from '../index-DAYCJu79.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import '../_commonjsHelpers-BFTU3MAI.js';
+
+var PublishYourItem = withT(function (_ref) {
+  var t = _ref.t,
+    item = _ref.item,
+    description = _ref.description;
+  return /*#__PURE__*/jsxs("div", {
+    className: "relative mx-auto flex max-w-sm flex-col gap-y-3",
+    children: [/*#__PURE__*/jsx(Typography, {
+      className: "pt-6 text-center",
+      "data-testid": "publish-your-item-header",
+      variant: "h2",
+      weight: "semibold",
+      children: /*#__PURE__*/jsxs("span", {
+        className: "relative inline-flex flex-col-reverse items-center gap-6 whitespace-nowrap",
+        children: [t("neetoMolecules.publishYourItem.title", {
+          item: item
+        }), /*#__PURE__*/jsxs("svg", {
+          className: "start-full bottom-0 sm:absolute sm:ms-2",
+          fill: "none",
+          height: "53",
+          viewBox: "0 0 58 53",
+          width: "58",
+          xmlns: "http://www.w3.org/2000/svg",
+          children: [/*#__PURE__*/jsx("path", {
+            d: "M7.31443 51.7732C12.2565 52.0622 16.7513 49.6192 20.5942 46.7584C23.9346 44.2309 26.9993 41.3397 29.7741 38.2342C35.221 32.0755 39.4754 24.8436 42.2528 17.0968C43.808 12.7381 44.9292 8.18667 45.4884 3.57236C45.6449 2.40707 43.8096 2.20391 43.6892 3.36379C42.7055 11.2831 40.1442 18.9973 36.2536 25.9536C32.3935 32.8685 27.251 39.092 21.0745 44.0712C17.2642 47.1481 12.6506 50.2719 7.523 49.974C7.03852 49.9362 6.57212 50.2641 6.49837 50.754C6.46065 51.2385 6.82995 51.7355 7.31443 51.7732Z",
+            fill: "#68737D"
+          }), /*#__PURE__*/jsx("path", {
+            d: "M30.2178 13.9691C33.8174 10.9607 37.4585 7.98292 41.0582 4.97452C41.4831 4.61603 41.8775 4.29898 42.3025 3.9405C42.6968 3.62344 43.0749 3.19834 43.5576 2.97852C44.1735 2.66502 44.6058 3.3367 44.8671 3.84994C45.9733 5.82004 46.9462 7.88381 47.9912 9.93677C49.193 12.2977 50.4307 14.6532 51.6325 17.0141C52.155 18.0405 53.8496 17.3072 53.2911 16.2861C52.1416 14.0279 50.9921 11.7696 49.8066 9.51679C48.7093 7.36119 47.6787 5.15873 46.4788 3.05538C45.9834 2.209 45.3385 1.34824 44.3479 1.12871C43.1303 0.869604 42.1471 1.68026 41.2972 2.39723C39.3974 3.97169 37.4977 5.54615 35.5979 7.12061C33.401 8.92386 31.2401 10.7217 29.0486 12.561C28.1627 13.2833 29.2958 14.6969 30.2178 13.9691Z",
+            fill: "#68737D"
+          })]
+        })]
+      })
+    }), /*#__PURE__*/jsx(Typography, {
+      className: "text-foreground w-full text-center",
+      "data-testid": "publish-your-item-description",
+      variant: "body2",
+      children: description
+    })]
+  });
+});
+PublishYourItem.propTypes = {
+  /**
+   * Item that need to be published
+   */
+  item: PropTypes.string,
+  /**
+   * Description to display on component
+   */
+  description: PropTypes.string
+};
+
+export { PublishYourItem as default };
+//# sourceMappingURL=PublishYourItem.js.map

package/dist/v2/PublishYourItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PublishYourItem.js","sources":["../../src/v2/components/PublishYourItem.jsx"],"sourcesContent":["import { Typography } from \"@bigbinary/neeto-atoms\";\nimport { withT } from \"neetocommons/v2/react-utils\";\nimport PropTypes from \"prop-types\";\n\nconst PublishYourItem = withT(({ t, item, description }) => (\n  <div className=\"relative mx-auto flex max-w-sm flex-col gap-y-3\">\n    <Typography\n      className=\"pt-6 text-center\"\n      data-testid=\"publish-your-item-header\"\n      variant=\"h2\"\n      weight=\"semibold\"\n    >\n      <span className=\"relative inline-flex flex-col-reverse items-center gap-6 whitespace-nowrap\">\n        {t(\"neetoMolecules.publishYourItem.title\", { item })}\n        <svg\n          className=\"start-full bottom-0 sm:absolute sm:ms-2\"\n          fill=\"none\"\n          height=\"53\"\n          viewBox=\"0 0 58 53\"\n          width=\"58\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          <path\n            d=\"M7.31443 51.7732C12.2565 52.0622 16.7513 49.6192 20.5942 46.7584C23.9346 44.2309 26.9993 41.3397 29.7741 38.2342C35.221 32.0755 39.4754 24.8436 42.2528 17.0968C43.808 12.7381 44.9292 8.18667 45.4884 3.57236C45.6449 2.40707 43.8096 2.20391 43.6892 3.36379C42.7055 11.2831 40.1442 18.9973 36.2536 25.9536C32.3935 32.8685 27.251 39.092 21.0745 44.0712C17.2642 47.1481 12.6506 50.2719 7.523 49.974C7.03852 49.9362 6.57212 50.2641 6.49837 50.754C6.46065 51.2385 6.82995 51.7355 7.31443 51.7732Z\"\n            fill=\"#68737D\"\n          />\n          <path\n            d=\"M30.2178 13.9691C33.8174 10.9607 37.4585 7.98292 41.0582 4.97452C41.4831 4.61603 41.8775 4.29898 42.3025 3.9405C42.6968 3.62344 43.0749 3.19834 43.5576 2.97852C44.1735 2.66502 44.6058 3.3367 44.8671 3.84994C45.9733 5.82004 46.9462 7.88381 47.9912 9.93677C49.193 12.2977 50.4307 14.6532 51.6325 17.0141C52.155 18.0405 53.8496 17.3072 53.2911 16.2861C52.1416 14.0279 50.9921 11.7696 49.8066 9.51679C48.7093 7.36119 47.6787 5.15873 46.4788 3.05538C45.9834 2.209 45.3385 1.34824 44.3479 1.12871C43.1303 0.869604 42.1471 1.68026 41.2972 2.39723C39.3974 3.97169 37.4977 5.54615 35.5979 7.12061C33.401 8.92386 31.2401 10.7217 29.0486 12.561C28.1627 13.2833 29.2958 14.6969 30.2178 13.9691Z\"\n            fill=\"#68737D\"\n          />\n        </svg>\n      </span>\n    </Typography>\n    <Typography\n      className=\"text-foreground w-full text-center\"\n      data-testid=\"publish-your-item-description\"\n      variant=\"body2\"\n    >\n      {description}\n    </Typography>\n  </div>\n));\n\nPublishYourItem.propTypes = {\n  /**\n   * Item that need to be published\n   */\n  item: PropTypes.string,\n  /**\n   * Description to display on component\n   */\n  description: PropTypes.string,\n};\n\nexport default PublishYourItem;\n"],"names":["PublishYourItem","withT","_ref","t","item","description","_jsxs","className","children","_jsx","Typography","variant","weight","fill","height","viewBox","width","xmlns","d","propTypes","PropTypes","string"],"mappings":";;;;;;AAIA,IAAMA,eAAe,GAAGC,KAAK,CAAC,UAAAC,IAAA,EAAA;AAAA,EAAA,IAAGC,CAAC,GAAAD,IAAA,CAADC,CAAC;IAAEC,IAAI,GAAAF,IAAA,CAAJE,IAAI;IAAEC,WAAW,GAAAH,IAAA,CAAXG,WAAW;AAAA,EAAA,oBACnDC,IAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,iDAAiD;IAAAC,QAAA,EAAA,cAC9DC,GAAA,CAACC,UAAU,EAAA;AACTH,MAAAA,SAAS,EAAC,kBAAkB;AAC5B,MAAA,aAAA,EAAY,0BAA0B;AACtCI,MAAAA,OAAO,EAAC,IAAI;AACZC,MAAAA,MAAM,EAAC,UAAU;AAAAJ,MAAAA,QAAA,eAEjBF,IAAA,CAAA,MAAA,EAAA;AAAMC,QAAAA,SAAS,EAAC,4EAA4E;AAAAC,QAAAA,QAAA,EAAA,CACzFL,CAAC,CAAC,sCAAsC,EAAE;AAAEC,UAAAA,IAAI,EAAJA;SAAM,CAAC,eACpDE,IAAA,CAAA,KAAA,EAAA;AACEC,UAAAA,SAAS,EAAC,yCAAyC;AACnDM,UAAAA,IAAI,EAAC,MAAM;AACXC,UAAAA,MAAM,EAAC,IAAI;AACXC,UAAAA,OAAO,EAAC,WAAW;AACnBC,UAAAA,KAAK,EAAC,IAAI;AACVC,UAAAA,KAAK,EAAC,4BAA4B;AAAAT,UAAAA,QAAA,gBAElCC,GAAA,CAAA,MAAA,EAAA;AACES,YAAAA,CAAC,EAAC,2eAA2e;AAC7eL,YAAAA,IAAI,EAAC;WACN,CAAC,eACFJ,GAAA,CAAA,MAAA,EAAA;AACES,YAAAA,CAAC,EAAC,4qBAA4qB;AAC9qBL,YAAAA,IAAI,EAAC;AAAS,WACf,CAAC;AAAA,SACC,CAAC;OACF;AAAC,KACG,CAAC,eACbJ,GAAA,CAACC,UAAU,EAAA;AACTH,MAAAA,SAAS,EAAC,oCAAoC;AAC9C,MAAA,aAAA,EAAY,+BAA+B;AAC3CI,MAAAA,OAAO,EAAC,OAAO;AAAAH,MAAAA,QAAA,EAEdH;AAAW,KACF,CAAC;AAAA,GACV,CAAC;AAAA,CACP;AAEDL,eAAe,CAACmB,SAAS,GAAG;AAC1B;AACF;AACA;EACEf,IAAI,EAAEgB,SAAS,CAACC,MAAM;AACtB;AACF;AACA;EACEhB,WAAW,EAAEe,SAAS,CAACC;AACzB,CAAC;;;;"}

package/dist/v2/ResponsiveDevicePicker.js

@@ -0,0 +1,86 @@
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
+import { Button } from '@bigbinary/neeto-atoms';
+import classnames from 'classnames';
+import { t } from 'i18next';
+import { M as Monitor, S as Smartphone } from '../smartphone-B-jv1y8j.js';
+import { c as createLucideIcon } from '../createLucideIcon-mNMhCCpf.js';
+import { createElement } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+/**
+ * @license lucide-react v1.7.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode = [
+  ["rect", { width: "16", height: "20", x: "4", y: "2", rx: "2", ry: "2", key: "76otgf" }],
+  ["line", { x1: "12", x2: "12.01", y1: "18", y2: "18", key: "1dp563" }]
+];
+const Tablet = createLucideIcon("tablet", __iconNode);
+
+var RESPONSIVE_DEVICES = {
+  DESKTOP: "desktop",
+  TABLET: "tablet",
+  MOBILE: "mobile"
+};
+var RESPONSIVE_DEVICES_MAP = _defineProperty(_defineProperty(_defineProperty({}, RESPONSIVE_DEVICES.DESKTOP, {
+  icon: Monitor,
+  label: t("neetoMolecules.responsiveDevicePicker.desktop")
+}), RESPONSIVE_DEVICES.TABLET, {
+  icon: Tablet,
+  label: t("neetoMolecules.responsiveDevicePicker.tablet")
+}), RESPONSIVE_DEVICES.MOBILE, {
+  icon: Smartphone,
+  label: t("neetoMolecules.responsiveDevicePicker.mobile")
+});
+
+var _excluded = ["className", "selectedDevice", "onDeviceChange"];
+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 ResponsiveDevicePicker = function ResponsiveDevicePicker(_ref) {
+  var _ref$className = _ref.className,
+    className = _ref$className === void 0 ? "" : _ref$className,
+    selectedDevice = _ref.selectedDevice,
+    onDeviceChange = _ref.onDeviceChange,
+    otherProps = _objectWithoutProperties(_ref, _excluded);
+  var devices = Object.entries(RESPONSIVE_DEVICES_MAP);
+  return /*#__PURE__*/jsx("div", _objectSpread(_objectSpread({
+    className: classnames("flex items-center justify-center", className)
+  }, otherProps), {}, {
+    children: devices.map(function (_ref2, index) {
+      var _ref3 = _slicedToArray(_ref2, 2),
+        key = _ref3[0],
+        _ref3$ = _ref3[1],
+        icon = _ref3$.icon,
+        label = _ref3$.label;
+      var isFirst = index === 0;
+      var isLast = index === devices.length - 1;
+      var isActive = key === selectedDevice;
+      return /*#__PURE__*/createElement(Button, {
+        icon: icon,
+        "data-testid": "".concat(label.toLowerCase(), "-device-button"),
+        key: key,
+        size: "icon",
+        title: label,
+        variant: "outline",
+        className: classnames("focus:z-10", {
+          "rounded-e-none": isFirst,
+          "-ms-px rounded-none": !isFirst && !isLast,
+          "-ms-px rounded-s-none": isLast,
+          "border-primary bg-primary/10 text-primary hover:bg-primary/10 hover:text-primary z-10": isActive
+        }),
+        onClick: function onClick() {
+          return onDeviceChange(key);
+        }
+      });
+    })
+  }));
+};
+
+export { ResponsiveDevicePicker as default };
+//# sourceMappingURL=ResponsiveDevicePicker.js.map

package/dist/v2/ResponsiveDevicePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ResponsiveDevicePicker.js","sources":["../../node_modules/lucide-react/dist/esm/icons/tablet.js","../../src/v2/components/ResponsiveDevicePicker/constants.js","../../src/v2/components/ResponsiveDevicePicker/index.jsx"],"sourcesContent":["/**\n * @license lucide-react v1.7.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.js';\n\nconst __iconNode = [\n  [\"rect\", { width: \"16\", height: \"20\", x: \"4\", y: \"2\", rx: \"2\", ry: \"2\", key: \"76otgf\" }],\n  [\"line\", { x1: \"12\", x2: \"12.01\", y1: \"18\", y2: \"18\", key: \"1dp563\" }]\n];\nconst Tablet = createLucideIcon(\"tablet\", __iconNode);\n\nexport { __iconNode, Tablet as default };\n//# sourceMappingURL=tablet.js.map\n","import { t } from \"i18next\";\nimport { Monitor, Tablet, Smartphone } from \"lucide-react\";\n\nexport const RESPONSIVE_DEVICES = {\n  DESKTOP: \"desktop\",\n  TABLET: \"tablet\",\n  MOBILE: \"mobile\",\n};\n\nexport const RESPONSIVE_DEVICES_MAP = {\n  [RESPONSIVE_DEVICES.DESKTOP]: {\n    icon: Monitor,\n    label: t(\"neetoMolecules.responsiveDevicePicker.desktop\"),\n  },\n  [RESPONSIVE_DEVICES.TABLET]: {\n    icon: Tablet,\n    label: t(\"neetoMolecules.responsiveDevicePicker.tablet\"),\n  },\n  [RESPONSIVE_DEVICES.MOBILE]: {\n    icon: Smartphone,\n    label: t(\"neetoMolecules.responsiveDevicePicker.mobile\"),\n  },\n};\n","import { Button } from \"@bigbinary/neeto-atoms\";\nimport classnames from \"classnames\";\nimport PropTypes from \"prop-types\";\n\nimport { RESPONSIVE_DEVICES_MAP } from \"./constants\";\n\nconst ResponsiveDevicePicker = ({\n  className = \"\",\n  selectedDevice,\n  onDeviceChange,\n  ...otherProps\n}) => {\n  const devices = Object.entries(RESPONSIVE_DEVICES_MAP);\n\n  return (\n    <div\n      className={classnames(\"flex items-center justify-center\", className)}\n      {...otherProps}\n    >\n      {devices.map(([key, { icon, label }], index) => {\n        const isFirst = index === 0;\n        const isLast = index === devices.length - 1;\n        const isActive = key === selectedDevice;\n\n        return (\n          <Button\n            {...{ icon }}\n            data-testid={`${label.toLowerCase()}-device-button`}\n            key={key}\n            size=\"icon\"\n            title={label}\n            variant=\"outline\"\n            className={classnames(\"focus:z-10\", {\n              \"rounded-e-none\": isFirst,\n              \"-ms-px rounded-none\": !isFirst && !isLast,\n              \"-ms-px rounded-s-none\": isLast,\n              \"border-primary bg-primary/10 text-primary hover:bg-primary/10 hover:text-primary z-10\":\n                isActive,\n            })}\n            onClick={() => onDeviceChange(key)}\n          />\n        );\n      })}\n    </div>\n  );\n};\n\nResponsiveDevicePicker.propTypes = {\n  /**\n   * To specify external classnames as overrides.\n   */\n  className: PropTypes.string,\n  /**\n   * To show the active device.\n   */\n  selectedDevice: PropTypes.string,\n  /**\n   * Handler function that is triggered when one of the device options are selected.\n   */\n  onDeviceChange: PropTypes.func,\n};\n\nexport default ResponsiveDevicePicker;\n"],"names":["RESPONSIVE_DEVICES","DESKTOP","TABLET","MOBILE","RESPONSIVE_DEVICES_MAP","_defineProperty","icon","Monitor","label","t","Tablet","Smartphone","ResponsiveDevicePicker","_ref","_ref$className","className","selectedDevice","onDeviceChange","otherProps","_objectWithoutProperties","_excluded","devices","Object","entries","_jsx","_objectSpread","classnames","children","map","_ref2","index","_ref3","_slicedToArray","key","_ref3$","isFirst","isLast","length","isActive","_createElement","Button","concat","toLowerCase","size","title","variant","onClick"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/v2/SessionEnvironment.js

@@ -0,0 +1,477 @@
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import { memo, useState, useMemo, useEffect, createElement } from 'react';
+import { Input, Button, Tooltip, Typography, Spinner } from '@bigbinary/neeto-atoms';
+import { isPresent, hyphenate, noop, filterBy, removeBy } from '@bigbinary/neeto-cist';
+import { pipe, prop, isNil, pluck, not } from 'ramda';
+import { useTranslation } from 'react-i18next';
+import _defineProperty from '@babel/runtime/helpers/defineProperty';
+import classnames from 'classnames';
+import Apple from '@bigbinary/neeto-icons/misc/Apple';
+import Chrome from '@bigbinary/neeto-icons/misc/Chrome';
+import Edge from '@bigbinary/neeto-icons/misc/Edge';
+import Firefox from '@bigbinary/neeto-icons/misc/Firefox';
+import Safari from '@bigbinary/neeto-icons/misc/Safari';
+import Ubuntu from '@bigbinary/neeto-icons/misc/Ubuntu';
+import Windows from '@bigbinary/neeto-icons/misc/Windows';
+import { M as Monitor, S as Smartphone } from '../smartphone-B-jv1y8j.js';
+import { G as Globe } from '../globe-rBiI1CjO.js';
+import { c as createLucideIcon } from '../createLucideIcon-mNMhCCpf.js';
+import { U as User } from '../user-A843PT-q.js';
+import useHotkeys from '@bigbinary/neeto-hotkeys';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import '@babel/runtime/helpers/objectWithoutProperties';
+import 'formik';
+import { P as PhoneNumberInput } from '../phone-number-CGZtDB_n.js';
+import '../index.es5.min-B2AiaKmd.js';
+import '@babel/runtime/helpers/asyncToGenerator';
+import 'i18next';
+import 'libphonenumber-js/min';
+import '@bigbinary/neeto-commons-frontend/v2/utils';
+import 'yup';
+import 'axios';
+import '@bigbinary/neeto-commons-frontend/v2/utils/general';
+import { X } from '../x-B1Er0oV4.js';
+import { C as Check } from '../check-DvxzqR83.js';
+import CopyToClipboardButton from './CopyToClipboardButton.js';
+import TimeFormat from './TimeFormat.js';
+import HelpPopover from './HelpPopover.js';
+import { C as ChevronUp } from '../chevron-up-B2_LTx_h.js';
+import { C as ChevronDown } from '../chevron-down-BMerqYpK.js';
+import '@bigbinary/neeto-atoms/primitives';
+import '@tanstack/react-query';
+import '../inject-css-C2dztUxs.js';
+import '../_commonjsHelpers-BFTU3MAI.js';
+import '../copy-DhbOoOav.js';
+import './DateFormat.js';
+import '@bigbinary/neeto-commons-frontend/v2/react-utils/useTimer';
+import '@bigbinary/neeto-commons-frontend/v2/utils/datetime';
+import '../circle-question-mark-Dib48f5Z.js';
+
+/**
+ * @license lucide-react v1.7.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode$2 = [
+  ["path", { d: "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7", key: "132q7q" }],
+  ["rect", { x: "2", y: "4", width: "20", height: "16", rx: "2", key: "izxlao" }]
+];
+const Mail = createLucideIcon("mail", __iconNode$2);
+
+/**
+ * @license lucide-react v1.7.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode$1 = [
+  [
+    "path",
+    {
+      d: "M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0",
+      key: "1r0f0z"
+    }
+  ],
+  ["circle", { cx: "12", cy: "10", r: "3", key: "ilqhr7" }]
+];
+const MapPin = createLucideIcon("map-pin", __iconNode$1);
+
+/**
+ * @license lucide-react v1.7.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode = [
+  [
+    "path",
+    {
+      d: "M13.832 16.568a1 1 0 0 0 1.213-.303l.355-.465A2 2 0 0 1 17 15h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2A18 18 0 0 1 2 4a2 2 0 0 1 2-2h3a2 2 0 0 1 2 2v3a2 2 0 0 1-.8 1.6l-.468.351a1 1 0 0 0-.292 1.233 14 14 0 0 0 6.392 6.384",
+      key: "9njp5v"
+    }
+  ]
+];
+const Phone = createLucideIcon("phone", __iconNode);
+
+var BOOLEAN_VALUES_MAP = {
+  "true": "Yes",
+  "false": "No"
+};
+var ENTER = "enter";
+var ESCAPE = "escape";
+var PHONE_NUMBER = "phone_number";
+var INTEGER = "integer";
+var ICONS_MAP = {
+  name: User,
+  user: User,
+  email: Mail,
+  phone_number: Phone,
+  location: MapPin,
+  timezone: Globe,
+  chrome: Chrome,
+  safari: Safari,
+  firefox: Firefox,
+  edge: Edge,
+  ie: Edge,
+  windows: Windows,
+  mac_os: Apple,
+  linux: Ubuntu,
+  mobile: Smartphone,
+  desktop: Monitor
+};
+
+var getInputType = function getInputType(_ref) {
+  var name = _ref.name,
+    kind = _ref.kind;
+  if (name === PHONE_NUMBER) return "tel";else if (kind === INTEGER) return "number";
+  return "text";
+};
+var getIcon = function getIcon(_ref2) {
+  var iconSize = _ref2.iconSize,
+    name = _ref2.name,
+    value = _ref2.value;
+  var Icon = name === "browser" || name === "os" ? ICONS_MAP[value === null || value === void 0 ? void 0 : value.toLowerCase().replace(" ", "_")] : ICONS_MAP[name];
+  return isPresent(Icon) ? /*#__PURE__*/jsx(Icon, {
+    size: iconSize
+  }) : null;
+};
+var isValuePresent = pipe(prop("value"), isPresent);
+var mergeRefs = function mergeRefs() {
+  for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
+    refs[_key] = arguments[_key];
+  }
+  return function (node) {
+    return refs.filter(Boolean).forEach(function (ref) {
+      return typeof ref === "function" ? ref(node) : ref.current = node;
+    });
+  };
+};
+
+var EditField = function EditField(_ref) {
+  var name = _ref.name,
+    error = _ref.error,
+    label = _ref.label,
+    kind = _ref.kind,
+    value = _ref.value,
+    handleChange = _ref.handleChange,
+    handleMetadataCancel = _ref.handleMetadataCancel,
+    handleMetadataSubmit = _ref.handleMetadataSubmit;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var enterRef = useHotkeys(ENTER, handleMetadataSubmit, {
+    mode: "scoped"
+  });
+  var cancelRef = useHotkeys(ESCAPE, handleMetadataCancel, {
+    mode: "scoped"
+  });
+  var InputComponent = name === PHONE_NUMBER ? PhoneNumberInput : Input;
+  return /*#__PURE__*/jsxs("div", {
+    className: "relative flex min-w-0 flex-grow items-center",
+    children: [/*#__PURE__*/jsx(InputComponent, {
+      error: error,
+      autoFocus: true,
+      className: "w-full [&_input]:pe-[2.8125rem]",
+      "data-testid": "metadata-input-".concat(hyphenate(name)),
+      placeholder: t("neetoMolecules.common.enter", {
+        what: label
+      }),
+      ref: mergeRefs(enterRef, cancelRef),
+      type: getInputType({
+        name: name,
+        kind: kind
+      }),
+      value: value || "",
+      onChange: handleChange
+    }), /*#__PURE__*/jsxs("div", {
+      className: "absolute end-0 top-0 flex h-8 items-center pe-1",
+      children: [/*#__PURE__*/jsx(Button, {
+        "data-testid": "metadata-cancel-".concat(hyphenate(name)),
+        icon: X,
+        size: "sm",
+        variant: "ghost",
+        tooltipProps: {
+          content: t("neetoMolecules.common.actions.cancel"),
+          position: "top"
+        },
+        onClick: handleMetadataCancel
+      }), /*#__PURE__*/jsx(Button, {
+        "data-testid": "metadata-submit-".concat(hyphenate(name)),
+        icon: Check,
+        size: "sm",
+        variant: "ghost",
+        tooltipProps: {
+          content: t("neetoMolecules.common.actions.save"),
+          position: "top"
+        },
+        onClick: handleMetadataSubmit
+      })]
+    })]
+  });
+};
+var EditField$1 = /*#__PURE__*/memo(EditField);
+
+var Item = function Item(_ref) {
+  var allowMultiline = _ref.allowMultiline,
+    handleCancel = _ref.handleCancel,
+    handleSubmit = _ref.handleSubmit,
+    iconSize = _ref.iconSize,
+    item = _ref.item,
+    showIcons = _ref.showIcons;
+  var _useState = useState(item.isEditing),
+    _useState2 = _slicedToArray(_useState, 2),
+    isEditing = _useState2[0],
+    setIsEditing = _useState2[1];
+  var _useState3 = useState(item.value),
+    _useState4 = _slicedToArray(_useState3, 2),
+    value = _useState4[0],
+    setValue = _useState4[1];
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var icon = item.icon,
+    _item$isEditable = item.isEditable,
+    isEditable = _item$isEditable === void 0 ? false : _item$isEditable,
+    _item$extraClasses = item.extraClasses,
+    extraClasses = _item$extraClasses === void 0 ? "" : _item$extraClasses,
+    _item$extraWrapperCla = item.extraWrapperClasses,
+    extraWrapperClasses = _item$extraWrapperCla === void 0 ? "" : _item$extraWrapperCla,
+    id = item.id,
+    fieldValueId = item.fieldValueId,
+    _item$custom = item.custom,
+    custom = _item$custom === void 0 ? false : _item$custom,
+    name = item.name,
+    kind = item.kind,
+    error = item.error,
+    label = item.label,
+    _item$showCopyButton = item.showCopyButton,
+    showCopyButton = _item$showCopyButton === void 0 ? false : _item$showCopyButton;
+  var valueToRender = useMemo(function () {
+    if (isNil(value)) return "-";
+    if (typeof value === "boolean") return BOOLEAN_VALUES_MAP[value.toString()];
+    if (name === "email") return value.toLowerCase();
+    return value;
+  }, [value]);
+  var iconToRender = useMemo(function () {
+    return icon || getIcon({
+      iconSize: iconSize,
+      name: name,
+      value: value
+    });
+  }, [icon, iconSize, name, value]);
+  var onSuccess = function onSuccess() {
+    return setIsEditing(false);
+  };
+  var handleMetadataSubmit = function handleMetadataSubmit() {
+    return handleSubmit({
+      fieldId: id,
+      fieldValueId: fieldValueId,
+      name: name,
+      value: value,
+      custom: custom,
+      onSuccess: onSuccess
+    });
+  };
+  var handleMetadataCancel = function handleMetadataCancel() {
+    setIsEditing(false);
+    setValue(item.value);
+    handleCancel(name);
+  };
+  var handleChange = function handleChange(event) {
+    var value = name === PHONE_NUMBER ? event : event.target.value;
+    setValue(value);
+  };
+  useEffect(function () {
+    setValue(item.value);
+  }, [item]);
+  var labelKey = hyphenate(name !== null && name !== void 0 ? name : label);
+  return /*#__PURE__*/jsxs("div", {
+    "data-testid": "metadata-".concat(labelKey, "-container"),
+    className: classnames("mb-3 flex place-items-center gap-2 align-middle", extraWrapperClasses, {
+      "flex-wrap": name !== PHONE_NUMBER && allowMultiline,
+      "flex-nowrap": !allowMultiline
+    }),
+    children: [showIcons && isPresent(iconToRender) ? /*#__PURE__*/jsx(Tooltip, {
+      content: label || t("neetoMolecules.sessionEnvironment.details.keys.".concat(name)),
+      children: /*#__PURE__*/jsx("div", {
+        className: "flex-shrink-0",
+        children: iconToRender
+      })
+    }) : /*#__PURE__*/jsx(Typography, {
+      className: "text-muted-foreground whitespace-nowrap",
+      "data-testid": "metadata-label-".concat(labelKey),
+      variant: "body2",
+      children: label || t("neetoMolecules.sessionEnvironment.details.keys.".concat(name))
+    }), !isEditing ? /*#__PURE__*/jsxs(Fragment, {
+      children: [kind === "datetime" ? /*#__PURE__*/jsx(TimeFormat.DateWeekTime, {
+        date: value,
+        typographyProps: {
+          variant: "body2",
+          weight: "medium",
+          className: classnames("overflow-hidden truncate whitespace-normal break-all ".concat(extraClasses), {
+            "whitespace-nowrap": !allowMultiline
+          })
+        }
+      }) : /*#__PURE__*/jsx(Tooltip, {
+        content: valueToRender,
+        position: "top",
+        children: /*#__PURE__*/jsx(Typography, {
+          "data-testid": "metadata-value-".concat(labelKey),
+          variant: "body2",
+          weight: "medium",
+          className: classnames("truncate overflow-hidden break-all whitespace-normal ".concat(extraClasses), {
+            "hover:border-input cursor-pointer rounded border border-transparent p-0.5 transition-colors motion-reduce:transition-none": isEditable,
+            "whitespace-nowrap": !allowMultiline
+          }),
+          onClick: function onClick() {
+            return isEditable && setIsEditing(true);
+          },
+          children: valueToRender
+        })
+      }), showCopyButton && /*#__PURE__*/jsx(CopyToClipboardButton, {
+        className: "flex-shrink-0",
+        value: valueToRender,
+        variant: "ghost"
+      })]
+    }) : /*#__PURE__*/jsx(EditField$1, {
+      error: error,
+      handleChange: handleChange,
+      handleMetadataCancel: handleMetadataCancel,
+      handleMetadataSubmit: handleMetadataSubmit,
+      kind: kind,
+      label: label,
+      name: name,
+      value: value
+    })]
+  });
+};
+
+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 DetailsBlock = function DetailsBlock(_ref) {
+  var _ref$allowMultiline = _ref.allowMultiline,
+    allowMultiline = _ref$allowMultiline === void 0 ? true : _ref$allowMultiline,
+    details = _ref.details,
+    _ref$handleCancel = _ref.handleCancel,
+    handleCancel = _ref$handleCancel === void 0 ? noop : _ref$handleCancel,
+    _ref$handleSubmit = _ref.handleSubmit,
+    handleSubmit = _ref$handleSubmit === void 0 ? noop : _ref$handleSubmit,
+    helpPopoverProps = _ref.helpPopoverProps,
+    iconSize = _ref.iconSize,
+    _ref$showIcons = _ref.showIcons,
+    showIcons = _ref$showIcons === void 0 ? false : _ref$showIcons,
+    _ref$title = _ref.title,
+    title = _ref$title === void 0 ? "" : _ref$title;
+  return /*#__PURE__*/jsxs("div", {
+    className: "mb-4",
+    "data-testid": "details-block-items-parent",
+    children: [title && /*#__PURE__*/jsxs("div", {
+      className: "mb-2 flex items-center gap-2",
+      children: [/*#__PURE__*/jsx(Typography, {
+        className: "text-foreground uppercase",
+        variant: "h5",
+        weight: "bold",
+        children: title
+      }), isPresent(helpPopoverProps) && /*#__PURE__*/jsx(HelpPopover, _objectSpread({}, helpPopoverProps))]
+    }), details.filter(function (detail) {
+      return detail.isEditable || isValuePresent(detail);
+    }).map(function (detail, index) {
+      return /*#__PURE__*/createElement(Item, {
+        allowMultiline: allowMultiline,
+        handleCancel: handleCancel,
+        handleSubmit: handleSubmit,
+        iconSize: iconSize,
+        showIcons: showIcons,
+        item: detail,
+        key: index
+      });
+    })]
+  });
+};
+var DetailsBlock$1 = /*#__PURE__*/memo(DetailsBlock);
+
+var SessionEnvironment = function SessionEnvironment(_ref) {
+  var _ref$allowMultiline = _ref.allowMultiline,
+    allowMultiline = _ref$allowMultiline === void 0 ? false : _ref$allowMultiline,
+    details = _ref.details,
+    _ref$handleCancel = _ref.handleCancel,
+    handleCancel = _ref$handleCancel === void 0 ? noop : _ref$handleCancel,
+    _ref$handleSubmit = _ref.handleSubmit,
+    handleSubmit = _ref$handleSubmit === void 0 ? noop : _ref$handleSubmit,
+    _ref$helpPopoverProps = _ref.helpPopoverProps,
+    helpPopoverProps = _ref$helpPopoverProps === void 0 ? {} : _ref$helpPopoverProps,
+    _ref$iconSize = _ref.iconSize,
+    iconSize = _ref$iconSize === void 0 ? 20 : _ref$iconSize,
+    _ref$isLoading = _ref.isLoading,
+    isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
+    _ref$moreDetails = _ref.moreDetails,
+    moreDetails = _ref$moreDetails === void 0 ? [] : _ref$moreDetails,
+    _ref$title = _ref.title,
+    title = _ref$title === void 0 ? "" : _ref$title;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    showViewMore = _useState2[0],
+    setShowViewMore = _useState2[1];
+  var customViewMoreItems = useMemo(function () {
+    return filterBy({
+      kind: "custom"
+    }, moreDetails);
+  }, [moreDetails]);
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  if (isLoading) {
+    return /*#__PURE__*/jsx("div", {
+      className: "flex h-full w-full items-center justify-center",
+      children: /*#__PURE__*/jsx(Spinner, {
+        "data-testid": "neeto-ui-spinner"
+      })
+    });
+  }
+  return /*#__PURE__*/jsxs("div", {
+    className: "w-full",
+    children: [/*#__PURE__*/jsx(DetailsBlock$1, {
+      allowMultiline: allowMultiline,
+      details: details,
+      handleCancel: handleCancel,
+      handleSubmit: handleSubmit,
+      helpPopoverProps: helpPopoverProps,
+      iconSize: iconSize,
+      title: title,
+      showIcons: true
+    }), showViewMore && /*#__PURE__*/jsxs(Fragment, {
+      children: [/*#__PURE__*/jsx("hr", {
+        className: "border-border my-4"
+      }), /*#__PURE__*/jsx(DetailsBlock$1, {
+        handleCancel: handleCancel,
+        handleSubmit: handleSubmit,
+        helpPopoverProps: helpPopoverProps,
+        iconSize: iconSize,
+        details: removeBy({
+          kind: "custom"
+        }, moreDetails)
+      }), isPresent(customViewMoreItems) && /*#__PURE__*/jsxs(Fragment, {
+        children: [/*#__PURE__*/jsx("hr", {
+          className: "border-border my-4"
+        }), pluck("value", customViewMoreItems)]
+      })]
+    }), /*#__PURE__*/jsx(Button, {
+      className: "mb-4",
+      "data-testid": "view-more-less-button",
+      icon: showViewMore ? ChevronUp : ChevronDown,
+      variant: "link",
+      label: showViewMore ? t("neetoMolecules.sessionEnvironment.viewLess") : t("neetoMolecules.sessionEnvironment.viewMore"),
+      onClick: function onClick() {
+        return setShowViewMore(not);
+      }
+    })]
+  });
+};
+var index = /*#__PURE__*/memo(SessionEnvironment);
+
+export { index as default };
+//# sourceMappingURL=SessionEnvironment.js.map