@bigbinary/neeto-molecules 1.12.2 → 1.13.0

package/dist/AdaptiveInput.js

@@ -0,0 +1,84 @@
+import { _ as _defineProperty } from './defineProperty-549061a7.js';
+import { _ as _extends } from './extends-093996c9.js';
+import { _ as _objectWithoutProperties } from './objectWithoutProperties-a0edb288.js';
+import React__default, { forwardRef } from 'react';
+import classnames from 'classnames';
+import { Textarea } from '@bigbinary/neetoui';
+import { n } from './inject-css-c86de496.js';
+import { _ as _slicedToArray } from './slicedToArray-b4278ecd.js';
+import { useField } from 'formik';
+
+var css = ".neeto-molecules-adaptive-input textarea{resize:none}.neeto-molecules-adaptive-input .neeto-ui-input.neeto-ui-input--small{--neeto-ui-textarea-padding-x:8px;--neeto-ui-textarea-padding-y:4px}.neeto-molecules-adaptive-input .neeto-ui-input.neeto-ui-input--medium{--neeto-ui-textarea-padding-x:8px;--neeto-ui-textarea-padding-y:5px}.neeto-molecules-adaptive-input .neeto-ui-input.neeto-ui-input--large{--neeto-ui-textarea-padding-x:12px;--neeto-ui-textarea-padding-y:8px}.neeto-molecules-adaptive-input__suffix{bottom:0;position:absolute;right:0}";
+n(css,{});
+
+var _excluded$1 = ["label", "className", "size", "required", "disabled", "suffix"];
+
+// eslint-disable-next-line @bigbinary/neeto/no-dangling-constants
+var SIZES = {
+  small: "small",
+  medium: "medium",
+  large: "large"
+};
+var AdaptiveInput = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var _ref$label = _ref.label,
+    label = _ref$label === void 0 ? "" : _ref$label,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? "" : _ref$className,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? SIZES.medium : _ref$size,
+    _ref$required = _ref.required,
+    required = _ref$required === void 0 ? false : _ref$required,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    _ref$suffix = _ref.suffix,
+    suffix = _ref$suffix === void 0 ? null : _ref$suffix,
+    otherProps = _objectWithoutProperties(_ref, _excluded$1);
+  var handleFocus = function handleFocus(element) {
+    var end = element.value.length;
+    element.setSelectionRange(end, end);
+  };
+  var handleKeyDown = function handleKeyDown(event) {
+    var _otherProps$onSubmit;
+    if (event.key !== "Enter") return;
+    event.preventDefault();
+    (_otherProps$onSubmit = otherProps.onSubmit) === null || _otherProps$onSubmit === void 0 ? void 0 : _otherProps$onSubmit.call(otherProps);
+  };
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: "relative w-full"
+  }, /*#__PURE__*/React__default.createElement(Textarea, _extends(_defineProperty(_defineProperty(_defineProperty({
+    disabled: disabled,
+    label: label,
+    ref: ref,
+    required: required,
+    size: size,
+    "data-cy": "neeto-molecules-adaptive-input",
+    "data-testid": "neeto-molecules-adaptive-input",
+    rows: 1
+  }, "size", "small"), "className", classnames("neeto-molecules-adaptive-input", {
+    "neeto-ui-input--disabled": !!disabled
+  }, className)), "onKeyDown", handleKeyDown), otherProps, {
+    onFocus: function onFocus(_ref2) {
+      var target = _ref2.target;
+      return handleFocus(target);
+    }
+  })), suffix && /*#__PURE__*/React__default.createElement("div", {
+    className: "neeto-molecules-adaptive-input__suffix"
+  }, suffix));
+});
+AdaptiveInput.displayName = "AdaptiveInput";
+
+var _excluded = ["name"];
+var FormikAdaptiveInput = function FormikAdaptiveInput(_ref) {
+  var name = _ref.name,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var _useField = useField(name),
+    _useField2 = _slicedToArray(_useField, 2),
+    field = _useField2[0],
+    meta = _useField2[1];
+  return /*#__PURE__*/React__default.createElement(AdaptiveInput, _extends({}, field, {
+    error: meta.touched ? meta.error : ""
+  }, props));
+};
+
+export { AdaptiveInput, FormikAdaptiveInput };
+//# sourceMappingURL=AdaptiveInput.js.map

package/dist/AdaptiveInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdaptiveInput.js","sources":["../src/components/AdaptiveInput/AdaptiveInput.jsx","../src/components/AdaptiveInput/FormikAdaptiveInput.jsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\n\nimport classnames from \"classnames\";\nimport { Textarea } from \"neetoui\";\nimport PropTypes from \"prop-types\";\n\nimport \"./adaptiveInput.scss\";\n\n// eslint-disable-next-line @bigbinary/neeto/no-dangling-constants\nconst SIZES = { small: \"small\", medium: \"medium\", large: \"large\" };\n\nconst AdaptiveInput = forwardRef(\n  (\n    {\n      label = \"\",\n      className = \"\",\n      size = SIZES.medium,\n      required = false,\n      disabled = false,\n      suffix = null,\n      ...otherProps\n    },\n    ref\n  ) => {\n    const handleFocus = element => {\n      const end = element.value.length;\n      element.setSelectionRange(end, end);\n    };\n\n    const handleKeyDown = event => {\n      if (event.key !== \"Enter\") return;\n\n      event.preventDefault();\n      otherProps.onSubmit?.();\n    };\n\n    return (\n      <div className=\"relative w-full\">\n        <Textarea\n          {...{ disabled, label, ref, required, size }}\n          data-cy=\"neeto-molecules-adaptive-input\"\n          data-testid=\"neeto-molecules-adaptive-input\"\n          rows={1}\n          size=\"small\"\n          className={classnames(\n            \"neeto-molecules-adaptive-input\",\n            { \"neeto-ui-input--disabled\": !!disabled },\n            className\n          )}\n          onKeyDown={handleKeyDown}\n          {...otherProps}\n          onFocus={({ target }) => handleFocus(target)}\n        />\n        {suffix && (\n          <div className=\"neeto-molecules-adaptive-input__suffix\">{suffix}</div>\n        )}\n      </div>\n    );\n  }\n);\n\nAdaptiveInput.displayName = \"AdaptiveInput\";\n\nAdaptiveInput.propTypes = {\n  /**\n   * To provide additional classes to the component.\n   */\n  className: PropTypes.string,\n  /**\n   * To specify the text to be displayed above the input.\n   */\n  label: PropTypes.string,\n  /**\n   * To specify the size of the input field\n   */\n  size: PropTypes.oneOf(Object.values(SIZES)),\n  /**\n   * To specify whether the input field is required or not.\n   */\n  required: PropTypes.bool,\n  /**\n   * To specify whether the input field is disabled or not.\n   */\n  disabled: PropTypes.bool,\n  /**\n   * To specify the content to be added at the end of the input field.\n   */\n  suffix: PropTypes.node,\n};\n\nexport default AdaptiveInput;\n","import React from \"react\";\n\nimport { useField } from \"formik\";\n\nimport AdaptiveInput from \"./AdaptiveInput\";\n\nconst FormikAdaptiveInput = ({ name, ...props }) => {\n  const [field, meta] = useField(name);\n\n  return (\n    <AdaptiveInput\n      {...field}\n      error={meta.touched ? meta.error : \"\"}\n      {...props}\n    />\n  );\n};\n\nexport default FormikAdaptiveInput;\n"],"names":["SIZES","small","medium","large","AdaptiveInput","forwardRef","_ref","ref","_ref$label","label","_ref$className","className","_ref$size","size","_ref$required","required","_ref$disabled","disabled","_ref$suffix","suffix","otherProps","_objectWithoutProperties","_excluded","handleFocus","element","end","value","length","setSelectionRange","handleKeyDown","event","_otherProps$onSubmit","key","preventDefault","onSubmit","call","React","createElement","Textarea","_extends","_defineProperty","rows","classnames","onFocus","_ref2","target","displayName","FormikAdaptiveInput","name","props","_useField","useField","_useField2","_slicedToArray","field","meta","error","touched"],"mappings":"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"}

package/dist/NeetoWidget.js

@@ -93,7 +93,6 @@ var WIDGET_KB_HELP_URL = {
   chat: "".concat(CHAT_WIDGET_KB_BASE_URL, "/categories/installation"),
   replay: "".concat(REPLAY_WIDGET_KB_BASE_URL, "/categories/widget-installation-usage")
 };
-var USE_NEETO_WIDGET_NPM_PAGE_URL = "https://www.npmjs.com/package/@bigbinary/react-use-neeto-widget";
 
 var ChatWidgetBody = function ChatWidgetBody(_ref) {
   var widgets = _ref.widgets;
@@ -505,15 +504,7 @@ var SelectionSwitches = function SelectionSwitches(_ref) {
     selectedWidgets: selectedWidgets,
     updateSelectedWidgets: updateSelectedWidgets,
     widget: primaryWidget
-  }), /*#__PURE__*/React__default.createElement("div", {
-    className: "flex items-center space-x-1"
-  }, /*#__PURE__*/React__default.createElement(Label, null, "neeto", capitalize(primaryWidget)), /*#__PURE__*/React__default.createElement("a", {
-    href: WIDGET_KB_HELP_URL[primaryApp],
-    rel: "noreferrer",
-    target: "_blank"
-  }, /*#__PURE__*/React__default.createElement(Info, {
-    size: 16
-  })))), /*#__PURE__*/React__default.createElement("div", {
+  }), /*#__PURE__*/React__default.createElement(Label, null, "neeto", capitalize(primaryWidget))), /*#__PURE__*/React__default.createElement("div", {
     className: "flex flex-wrap items-center gap-6 sm:justify-end"
   }, WIDGET_TYPES_VALUES.map(function (widget, index) {
     return primaryApp !== widget && /*#__PURE__*/React__default.createElement("div", {
@@ -755,14 +746,9 @@ var EmbedCode = function EmbedCode(_ref) {
         style: "body2",
         weight: "semibold"
       }),
-      fontNormal: /*#__PURE__*/React__default.createElement(Typography, {
-        component: "span",
-        style: "body2",
-        weight: "normal"
-      }),
-      a: /*#__PURE__*/React__default.createElement("a", {
+      Link: /*#__PURE__*/React__default.createElement("a", {
         className: "neeto-ui-text-primary-800",
-        href: USE_NEETO_WIDGET_NPM_PAGE_URL,
+        href: WIDGET_KB_HELP_URL[primaryApp],
         rel: "noreferrer",
         target: "_blank"
       })
@@ -777,45 +763,49 @@ var EmbedCode = function EmbedCode(_ref) {
       selectedFramework: selectedFramework,
       setSelectedFramework: setSelectedFramework
     },
+    title: t("neetoMolecules.widget.title.userIdentity"),
     codeString: getSampleUserIdentity(enabledWidgets, selectedFramework.value),
     sendViaEmail: function sendViaEmail() {
       return handleSendViaEmail(EMAIL_TYPES.userIdentity);
-    },
-    title: /*#__PURE__*/React__default.createElement("div", {
-      className: "flex items-center justify-start"
-    }, /*#__PURE__*/React__default.createElement("div", null, t("neetoMolecules.widget.title.userIdentity")), /*#__PURE__*/React__default.createElement("a", {
-      className: "ml-1",
-      rel: "noreferrer",
-      target: "_blank",
-      href: enabledWidgets.chat ? NEETO_CHAT_USER_IDENTITY_URL : NEETO_REPLAY_CONFIGURE_URL
-    }, /*#__PURE__*/React__default.createElement(Info, {
-      size: 16
-    })))
-  })), /*#__PURE__*/React__default.createElement("div", {
-    className: "w-full"
-  }, t("neetoMolecules.widget.installation.instructions.userIdentity"))) : null, shouldShowSessionContext ? /*#__PURE__*/React__default.createElement("div", {
+    }
+  })), /*#__PURE__*/React__default.createElement(Trans, {
+    i18nKey: "neetoMolecules.widget.installation.instructions.userIdentity",
+    components: {
+      p: /*#__PURE__*/React__default.createElement(Typography, {
+        style: "body2"
+      }),
+      Link: /*#__PURE__*/React__default.createElement("a", {
+        className: "neeto-ui-text-primary-800",
+        rel: "noreferrer",
+        target: "_blank",
+        href: enabledWidgets.chat ? NEETO_CHAT_USER_IDENTITY_URL : NEETO_REPLAY_CONFIGURE_URL
+      })
+    }
+  })) : null, shouldShowSessionContext ? /*#__PURE__*/React__default.createElement("div", {
     className: "w-full flex-grow flex-col items-center justify-start"
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "mx-auto mb-2 w-full"
   }, /*#__PURE__*/React__default.createElement(CodeBlock, {
     className: "neeto-ui-bg-primary-100 neeto-ui-rounded-lg",
     codeString: SAMPLE_CONTEXT_CODE_STRING,
+    title: t("neetoMolecules.widget.title.sessionContext"),
     sendViaEmail: function sendViaEmail() {
       return handleSendViaEmail(EMAIL_TYPES.sessionContext);
-    },
-    title: /*#__PURE__*/React__default.createElement("div", {
-      className: "flex items-center justify-start"
-    }, /*#__PURE__*/React__default.createElement("div", null, t("neetoMolecules.widget.title.sessionContext")), /*#__PURE__*/React__default.createElement("a", {
-      className: "ml-1",
-      href: NEETO_REPLAY_CONFIGURE_URL,
-      rel: "noreferrer",
-      target: "_blank"
-    }, /*#__PURE__*/React__default.createElement(Info, {
-      size: 16
-    })))
-  })), /*#__PURE__*/React__default.createElement("div", {
-    className: "w-full"
-  }, t("neetoMolecules.widget.installation.instructions.sessionContext"))) : null), /*#__PURE__*/React__default.createElement(CodeSnippet, _extends({
+    }
+  })), /*#__PURE__*/React__default.createElement(Trans, {
+    i18nKey: "neetoMolecules.widget.installation.instructions.sessionContext",
+    components: {
+      p: /*#__PURE__*/React__default.createElement(Typography, {
+        style: "body2"
+      }),
+      Link: /*#__PURE__*/React__default.createElement("a", {
+        className: "neeto-ui-text-primary-800",
+        href: NEETO_REPLAY_CONFIGURE_URL,
+        rel: "noreferrer",
+        target: "_blank"
+      })
+    }
+  })) : null), /*#__PURE__*/React__default.createElement(CodeSnippet, _extends({
     isPaneOpen: !!emailType && isNotEmpty(selectedWidgets),
     onClose: function onClose() {
       return setEmailType(EMAIL_TYPES["null"]);