@bigbinary/neeto-molecules 4.1.67 → 4.1.69

package/dist/cjs/v2/HelpPopover.js

@@ -12,7 +12,7 @@ require('react');
 
 var SIZE = {
   "default": 16,
-  large: 20
+  large: 18
 };
 
 var _excluded = ["label"];
@@ -40,7 +40,9 @@ var HelpPopover = function HelpPopover(_ref) {
     alignOffset: alignOffset,
     position: position,
     sideOffset: sideOffset,
+    className: "!max-w-[calc(100vw-2rem)]",
     closeDelay: 150,
+    collisionPadding: 12,
     openDelay: 0,
     trigger: /*#__PURE__*/jsxRuntime.jsx("button", {
       "data-testid": "help-popover-button",
@@ -73,14 +75,18 @@ var HelpPopover = function HelpPopover(_ref) {
       }) : description, helpLinkProps && function () {
         var linkLabel = helpLinkProps.label,
           restLinkProps = _objectWithoutProperties(helpLinkProps, _excluded);
-        return /*#__PURE__*/jsxRuntime.jsx("a", _objectSpread(_objectSpread({
-          className: "text-primary mt-3 text-sm hover:underline",
-          "data-testid": "help-popover-link-button",
-          rel: "noreferrer",
-          target: "_blank"
-        }, restLinkProps), {}, {
-          children: linkLabel !== null && linkLabel !== void 0 ? linkLabel : t("neetoMolecules.common.viewHelpArticle")
-        }));
+        return /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Button, {
+          asChild: true,
+          className: "mt-3 self-start",
+          variant: "link",
+          children: /*#__PURE__*/jsxRuntime.jsx("a", _objectSpread(_objectSpread({
+            "data-testid": "help-popover-link-button",
+            rel: "noreferrer",
+            target: "_blank"
+          }, restLinkProps), {}, {
+            children: linkLabel !== null && linkLabel !== void 0 ? linkLabel : t("neetoMolecules.common.viewHelpArticle")
+          }))
+        });
       }()]
     })
   });

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

@@ -1 +1 @@
-{"version":3,"file":"HelpPopover.js","sources":["../../../src/v2/components/HelpPopover/constants.js","../../../src/v2/components/HelpPopover/index.jsx"],"sourcesContent":["export const SIZE = { default: 16, large: 20 };\n","import { Popover, Typography } from \"@bigbinary/neeto-atoms\";\nimport classNames from \"classnames\";\nimport { CircleHelp } from \"lucide-react\";\nimport PropTypes from \"prop-types\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { SIZE } from \"./constants\";\n\nconst HelpPopover = ({\n  title,\n  size = \"large\",\n  description,\n  helpLinkProps,\n  className,\n  iconColor = \"currentColor\",\n  icon: IconComponent = CircleHelp,\n  side,\n  sideOffset,\n  align,\n  alignOffset,\n}) => {\n  const { t } = useTranslation();\n\n  const position = align && align !== \"center\" ? `${side}-${align}` : side;\n\n  return (\n    <Popover\n      {...{ alignOffset, position, sideOffset }}\n      closeDelay={150}\n      openDelay={0}\n      trigger={\n        <button\n          data-testid=\"help-popover-button\"\n          type=\"button\"\n          className={classNames(\n            \"inline-flex cursor-pointer items-center justify-center rounded-full border-none bg-transparent p-0\",\n            className\n          )}\n        >\n          <IconComponent color={iconColor} size={SIZE[size]} />\n        </button>\n      }\n    >\n      <div className=\"flex flex-col\" onClick={event => event.stopPropagation()}>\n        {title && (\n          <Typography asChild variant=\"body2\" weight=\"semibold\">\n            <h3 className=\"mb-2\" data-testid=\"help-popover-title\">\n              {title}\n            </h3>\n          </Typography>\n        )}\n        {typeof description === \"string\" ? (\n          <Typography\n            color=\"muted\"\n            data-testid=\"help-popover-description\"\n            variant=\"body2\"\n          >\n            {description}\n          </Typography>\n        ) : (\n          description\n        )}\n        {helpLinkProps &&\n          (() => {\n            const { label: linkLabel, ...restLinkProps } = helpLinkProps;\n\n            return (\n              <a\n                className=\"text-primary mt-3 text-sm hover:underline\"\n                data-testid=\"help-popover-link-button\"\n                rel=\"noreferrer\"\n                target=\"_blank\"\n                {...restLinkProps}\n              >\n                {linkLabel ?? t(\"neetoMolecules.common.viewHelpArticle\")}\n              </a>\n            );\n          })()}\n      </div>\n    </Popover>\n  );\n};\n\nHelpPopover.propTypes = {\n  title: PropTypes.string,\n  size: PropTypes.oneOf([\"default\", \"large\"]),\n  description: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n  helpLinkProps: PropTypes.object,\n  className: PropTypes.string,\n  iconColor: PropTypes.string,\n  icon: PropTypes.node,\n  side: PropTypes.oneOf([\"top\", \"right\", \"bottom\", \"left\"]),\n  sideOffset: PropTypes.number,\n  align: PropTypes.oneOf([\"start\", \"center\", \"end\"]),\n  alignOffset: PropTypes.number,\n};\n\nexport default HelpPopover;\n"],"names":["SIZE","large","HelpPopover","_ref","title","_ref$size","size","description","helpLinkProps","className","_ref$iconColor","iconColor","_ref$icon","icon","IconComponent","CircleHelp","side","sideOffset","align","alignOffset","_useTranslation","useTranslation","t","position","concat","_jsx","Popover","closeDelay","openDelay","trigger","type","classNames","children","color","_jsxs","onClick","event","stopPropagation","Typography","asChild","variant","weight","linkLabel","label","restLinkProps","_objectWithoutProperties","_excluded","_objectSpread","rel","target"],"mappings":"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"}
+{"version":3,"file":"HelpPopover.js","sources":["../../../src/v2/components/HelpPopover/constants.js","../../../src/v2/components/HelpPopover/index.jsx"],"sourcesContent":["export const SIZE = { default: 16, large: 18 };\n","import { Button, Popover, Typography } from \"@bigbinary/neeto-atoms\";\nimport classNames from \"classnames\";\nimport { CircleHelp } from \"lucide-react\";\nimport PropTypes from \"prop-types\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { SIZE } from \"./constants\";\n\nconst HelpPopover = ({\n  title,\n  size = \"large\",\n  description,\n  helpLinkProps,\n  className,\n  iconColor = \"currentColor\",\n  icon: IconComponent = CircleHelp,\n  side,\n  sideOffset,\n  align,\n  alignOffset,\n}) => {\n  const { t } = useTranslation();\n\n  const position = align && align !== \"center\" ? `${side}-${align}` : side;\n\n  return (\n    <Popover\n      {...{ alignOffset, position, sideOffset }}\n      className=\"!max-w-[calc(100vw-2rem)]\"\n      closeDelay={150}\n      collisionPadding={12}\n      openDelay={0}\n      trigger={\n        <button\n          data-testid=\"help-popover-button\"\n          type=\"button\"\n          className={classNames(\n            \"inline-flex cursor-pointer items-center justify-center rounded-full border-none bg-transparent p-0\",\n            className\n          )}\n        >\n          <IconComponent color={iconColor} size={SIZE[size]} />\n        </button>\n      }\n    >\n      <div className=\"flex flex-col\" onClick={event => event.stopPropagation()}>\n        {title && (\n          <Typography asChild variant=\"body2\" weight=\"semibold\">\n            <h3 className=\"mb-2\" data-testid=\"help-popover-title\">\n              {title}\n            </h3>\n          </Typography>\n        )}\n        {typeof description === \"string\" ? (\n          <Typography\n            color=\"muted\"\n            data-testid=\"help-popover-description\"\n            variant=\"body2\"\n          >\n            {description}\n          </Typography>\n        ) : (\n          description\n        )}\n        {helpLinkProps &&\n          (() => {\n            const { label: linkLabel, ...restLinkProps } = helpLinkProps;\n\n            return (\n              <Button asChild className=\"mt-3 self-start\" variant=\"link\">\n                <a\n                  data-testid=\"help-popover-link-button\"\n                  rel=\"noreferrer\"\n                  target=\"_blank\"\n                  {...restLinkProps}\n                >\n                  {linkLabel ?? t(\"neetoMolecules.common.viewHelpArticle\")}\n                </a>\n              </Button>\n            );\n          })()}\n      </div>\n    </Popover>\n  );\n};\n\nHelpPopover.propTypes = {\n  title: PropTypes.string,\n  size: PropTypes.oneOf([\"default\", \"large\"]),\n  description: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n  helpLinkProps: PropTypes.object,\n  className: PropTypes.string,\n  iconColor: PropTypes.string,\n  icon: PropTypes.node,\n  side: PropTypes.oneOf([\"top\", \"right\", \"bottom\", \"left\"]),\n  sideOffset: PropTypes.number,\n  align: PropTypes.oneOf([\"start\", \"center\", \"end\"]),\n  alignOffset: PropTypes.number,\n};\n\nexport default HelpPopover;\n"],"names":["SIZE","large","HelpPopover","_ref","title","_ref$size","size","description","helpLinkProps","className","_ref$iconColor","iconColor","_ref$icon","icon","IconComponent","CircleHelp","side","sideOffset","align","alignOffset","_useTranslation","useTranslation","t","position","concat","_jsx","Popover","closeDelay","collisionPadding","openDelay","trigger","type","classNames","children","color","_jsxs","onClick","event","stopPropagation","Typography","asChild","variant","weight","linkLabel","label","restLinkProps","_objectWithoutProperties","_excluded","Button","_objectSpread","rel","target"],"mappings":"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"}

package/dist/cjs/v2/Search.js

@@ -103,26 +103,16 @@ var Search = function Search(_ref) {
   React.useEffect(function () {
     return handleDebouncedSearchTermChange.cancel;
   }, []);
-  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+  return /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Input, _objectSpread({
     className: className,
-    children: [label && /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Label, {
-      className: "mb-1",
-      htmlFor: inputId,
-      children: label
-    }), /*#__PURE__*/jsxRuntime.jsxs("div", {
-      className: "relative",
-      children: [/*#__PURE__*/jsxRuntime.jsx(search.Search, {
-        className: "text-muted-foreground pointer-events-none absolute top-1/2 left-3 size-4 -translate-y-1/2"
-      }), /*#__PURE__*/jsxRuntime.jsx(neetoAtoms.Input, _objectSpread({
-        className: "pl-9 [&::-webkit-search-cancel-button:hover]:cursor-pointer [&::-webkit-search-decoration:hover]:cursor-pointer",
-        id: inputId,
-        placeholder: t("neetoMolecules.common.actions.search"),
-        type: "search",
-        value: internalValue,
-        onChange: handleOnChange
-      }, inputProps))]
-    })]
-  });
+    label: label,
+    id: inputId,
+    placeholder: t("neetoMolecules.common.actions.search"),
+    prefix: /*#__PURE__*/jsxRuntime.jsx(search.Search, {}),
+    type: "search",
+    value: internalValue,
+    onChange: handleOnChange
+  }, inputProps));
 };
 
 module.exports = Search;

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

@@ -1 +1 @@
-{"version":3,"file":"Search.js","sources":["../../../src/v2/components/Search/utils.js","../../../src/v2/components/Search/index.jsx"],"sourcesContent":["import { getQueryParams } from \"neetocommons/utils\";\n\nexport const getInitialSearchValue = ({\n  initialValue = \"\",\n  enableUrlSync,\n  searchParamName,\n}) => {\n  if (enableUrlSync) {\n    const queryParams = getQueryParams({ toCamelCase: false });\n\n    return queryParams[searchParamName] ?? \"\";\n  }\n\n  return initialValue;\n};\n","import { useEffect, useId, useRef, useState } from \"react\";\n\nimport { Input, Label } from \"@bigbinary/neeto-atoms\";\nimport { Search as SearchIcon } from \"lucide-react\";\nimport useFuncDebounce from \"neetocommons/react-utils/useFuncDebounce\";\nimport useQueryParams from \"neetocommons/react-utils/useQueryParams\";\nimport useUpdateEffect from \"neetocommons/react-utils/useUpdateEffect\";\nimport { buildUrl } from \"neetocommons/utils/general\";\nimport PropTypes from \"prop-types\";\nimport { mergeLeft, omit } from \"ramda\";\nimport { useTranslation } from \"react-i18next\";\nimport { useHistory } from \"react-router-dom\";\n\nimport { getInitialSearchValue } from \"./utils\";\n\nconst Search = ({\n  value,\n  debounceTime = 300,\n  onSearch,\n  onChange,\n  enableUrlSync = false,\n  searchParamName = \"search_term\",\n  className,\n  label,\n  ...inputProps\n}) => {\n  const { t } = useTranslation();\n  const queryParams = useQueryParams({ toCamelCase: false });\n  const history = useHistory();\n  const inputId = useId();\n\n  const [internalValue, setInternalValue] = useState(\n    getInitialSearchValue({\n      initialValue: value,\n      enableUrlSync,\n      searchParamName,\n    })\n  );\n  const trimmedValue = value?.trim();\n\n  useUpdateEffect(() => {\n    if (!enableUrlSync) return;\n\n    const searchParamValue = queryParams?.[searchParamName] ?? \"\";\n    setInternalValue(searchParamValue);\n  }, [queryParams?.[searchParamName]]);\n\n  const handleSearchQueryParams = trimmedValue => {\n    if (!trimmedValue && !queryParams?.[searchParamName]) return;\n\n    if (trimmedValue === queryParams?.[searchParamName]) return;\n\n    const pathname = history.location.pathname;\n\n    if (trimmedValue) {\n      history.push(\n        buildUrl(\n          pathname,\n          mergeLeft({ [searchParamName]: trimmedValue }, queryParams)\n        )\n      );\n    } else {\n      history.push(buildUrl(pathname, omit([searchParamName], queryParams)));\n    }\n  };\n\n  const handleDebouncedSearchTermChange = useFuncDebounce(trimmedValue => {\n    if (onSearch) onSearch(trimmedValue);\n    else if (enableUrlSync) handleSearchQueryParams(trimmedValue);\n  }, debounceTime);\n\n  useUpdateEffect(() => {\n    handleDebouncedSearchTermChange(trimmedValue);\n  }, [trimmedValue]);\n\n  const prevValueRef = useRef(value);\n  if (value !== undefined && value !== prevValueRef.current) {\n    setInternalValue(value);\n    prevValueRef.current = value;\n  }\n\n  const handleOnChange = e => {\n    const trimmedValue = e.target.value?.trim();\n    onChange?.(e);\n    setInternalValue(e.target.value);\n\n    if (internalValue?.trim() !== trimmedValue) {\n      handleDebouncedSearchTermChange(trimmedValue);\n    }\n  };\n\n  useEffect(() => handleDebouncedSearchTermChange.cancel, []);\n\n  return (\n    <div {...{ className }}>\n      {label && (\n        <Label className=\"mb-1\" htmlFor={inputId}>\n          {label}\n        </Label>\n      )}\n      <div className=\"relative\">\n        <SearchIcon className=\"text-muted-foreground pointer-events-none absolute top-1/2 left-3 size-4 -translate-y-1/2\" />\n        <Input\n          className=\"pl-9 [&::-webkit-search-cancel-button:hover]:cursor-pointer [&::-webkit-search-decoration:hover]:cursor-pointer\"\n          id={inputId}\n          placeholder={t(\"neetoMolecules.common.actions.search\")}\n          type=\"search\"\n          value={internalValue}\n          onChange={handleOnChange}\n          {...inputProps}\n        />\n      </div>\n    </div>\n  );\n};\n\nSearch.propTypes = {\n  value: PropTypes.string,\n  debounceTime: PropTypes.number,\n  onChange: PropTypes.func,\n  onSearch: PropTypes.func,\n  enableUrlSync: PropTypes.bool,\n  searchParamName: PropTypes.string,\n  inputProps: PropTypes.object,\n};\n\nexport default Search;\n"],"names":["getInitialSearchValue","_ref","_ref$initialValue","initialValue","enableUrlSync","searchParamName","_queryParams$searchPa","queryParams","getQueryParams","toCamelCase","Search","value","_ref$debounceTime","debounceTime","onSearch","onChange","_ref$enableUrlSync","_ref$searchParamName","className","label","inputProps","_objectWithoutProperties","_excluded","_useTranslation","useTranslation","t","useQueryParams","history","useHistory","inputId","useId","_useState","useState","_useState2","_slicedToArray","internalValue","setInternalValue","trimmedValue","trim","useUpdateEffect","searchParamValue","handleSearchQueryParams","pathname","location","push","buildUrl","mergeLeft","_defineProperty","omit","handleDebouncedSearchTermChange","useFuncDebounce","prevValueRef","useRef","undefined","current","handleOnChange","e","_e$target$value","target","useEffect","cancel","_jsxs","children","_jsx","Label","htmlFor","SearchIcon","Input","_objectSpread","id","placeholder","type"],"mappings":"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"}
+{"version":3,"file":"Search.js","sources":["../../../src/v2/components/Search/utils.js","../../../src/v2/components/Search/index.jsx"],"sourcesContent":["import { getQueryParams } from \"neetocommons/utils\";\n\nexport const getInitialSearchValue = ({\n  initialValue = \"\",\n  enableUrlSync,\n  searchParamName,\n}) => {\n  if (enableUrlSync) {\n    const queryParams = getQueryParams({ toCamelCase: false });\n\n    return queryParams[searchParamName] ?? \"\";\n  }\n\n  return initialValue;\n};\n","import { useEffect, useId, useRef, useState } from \"react\";\n\nimport { Input } from \"@bigbinary/neeto-atoms\";\nimport { Search as SearchIcon } from \"lucide-react\";\nimport useFuncDebounce from \"neetocommons/react-utils/useFuncDebounce\";\nimport useQueryParams from \"neetocommons/react-utils/useQueryParams\";\nimport useUpdateEffect from \"neetocommons/react-utils/useUpdateEffect\";\nimport { buildUrl } from \"neetocommons/utils/general\";\nimport PropTypes from \"prop-types\";\nimport { mergeLeft, omit } from \"ramda\";\nimport { useTranslation } from \"react-i18next\";\nimport { useHistory } from \"react-router-dom\";\n\nimport { getInitialSearchValue } from \"./utils\";\n\nconst Search = ({\n  value,\n  debounceTime = 300,\n  onSearch,\n  onChange,\n  enableUrlSync = false,\n  searchParamName = \"search_term\",\n  className,\n  label,\n  ...inputProps\n}) => {\n  const { t } = useTranslation();\n  const queryParams = useQueryParams({ toCamelCase: false });\n  const history = useHistory();\n  const inputId = useId();\n\n  const [internalValue, setInternalValue] = useState(\n    getInitialSearchValue({\n      initialValue: value,\n      enableUrlSync,\n      searchParamName,\n    })\n  );\n  const trimmedValue = value?.trim();\n\n  useUpdateEffect(() => {\n    if (!enableUrlSync) return;\n\n    const searchParamValue = queryParams?.[searchParamName] ?? \"\";\n    setInternalValue(searchParamValue);\n  }, [queryParams?.[searchParamName]]);\n\n  const handleSearchQueryParams = trimmedValue => {\n    if (!trimmedValue && !queryParams?.[searchParamName]) return;\n\n    if (trimmedValue === queryParams?.[searchParamName]) return;\n\n    const pathname = history.location.pathname;\n\n    if (trimmedValue) {\n      history.push(\n        buildUrl(\n          pathname,\n          mergeLeft({ [searchParamName]: trimmedValue }, queryParams)\n        )\n      );\n    } else {\n      history.push(buildUrl(pathname, omit([searchParamName], queryParams)));\n    }\n  };\n\n  const handleDebouncedSearchTermChange = useFuncDebounce(trimmedValue => {\n    if (onSearch) onSearch(trimmedValue);\n    else if (enableUrlSync) handleSearchQueryParams(trimmedValue);\n  }, debounceTime);\n\n  useUpdateEffect(() => {\n    handleDebouncedSearchTermChange(trimmedValue);\n  }, [trimmedValue]);\n\n  const prevValueRef = useRef(value);\n  if (value !== undefined && value !== prevValueRef.current) {\n    setInternalValue(value);\n    prevValueRef.current = value;\n  }\n\n  const handleOnChange = e => {\n    const trimmedValue = e.target.value?.trim();\n    onChange?.(e);\n    setInternalValue(e.target.value);\n\n    if (internalValue?.trim() !== trimmedValue) {\n      handleDebouncedSearchTermChange(trimmedValue);\n    }\n  };\n\n  useEffect(() => handleDebouncedSearchTermChange.cancel, []);\n\n  return (\n    <Input\n      {...{ className, label }}\n      id={inputId}\n      placeholder={t(\"neetoMolecules.common.actions.search\")}\n      prefix={<SearchIcon />}\n      type=\"search\"\n      value={internalValue}\n      onChange={handleOnChange}\n      {...inputProps}\n    />\n  );\n};\n\nSearch.propTypes = {\n  value: PropTypes.string,\n  debounceTime: PropTypes.number,\n  onChange: PropTypes.func,\n  onSearch: PropTypes.func,\n  enableUrlSync: PropTypes.bool,\n  searchParamName: PropTypes.string,\n  inputProps: PropTypes.object,\n};\n\nexport default Search;\n"],"names":["getInitialSearchValue","_ref","_ref$initialValue","initialValue","enableUrlSync","searchParamName","_queryParams$searchPa","queryParams","getQueryParams","toCamelCase","Search","value","_ref$debounceTime","debounceTime","onSearch","onChange","_ref$enableUrlSync","_ref$searchParamName","className","label","inputProps","_objectWithoutProperties","_excluded","_useTranslation","useTranslation","t","useQueryParams","history","useHistory","inputId","useId","_useState","useState","_useState2","_slicedToArray","internalValue","setInternalValue","trimmedValue","trim","useUpdateEffect","searchParamValue","handleSearchQueryParams","pathname","location","push","buildUrl","mergeLeft","_defineProperty","omit","handleDebouncedSearchTermChange","useFuncDebounce","prevValueRef","useRef","undefined","current","handleOnChange","e","_e$target$value","target","useEffect","cancel","_jsx","Input","_objectSpread","id","placeholder","prefix","SearchIcon","type"],"mappings":";;;;;;;;;;;;;;;;;;;AAEO,IAAMA,qBAAqB,GAAG,SAAxBA,qBAAqBA,CAAAC,IAAA,EAI5B;AAAA,EAAA,IAAAC,iBAAA,GAAAD,IAAA,CAHJE,YAAY;AAAZA,IAAAA,YAAY,GAAAD,iBAAA,KAAA,MAAA,GAAG,EAAE,GAAAA,iBAAA;IACjBE,aAAa,GAAAH,IAAA,CAAbG,aAAa;IACbC,eAAe,GAAAJ,IAAA,CAAfI,eAAe;AAEf,EAAA,IAAID,aAAa,EAAE;AAAA,IAAA,IAAAE,qBAAA;IACjB,IAAMC,WAAW,GAAGC,oBAAc,CAAC;AAAEC,MAAAA,WAAW,EAAE;AAAM,KAAC,CAAC;IAE1D,OAAA,CAAAH,qBAAA,GAAOC,WAAW,CAACF,eAAe,CAAC,MAAA,IAAA,IAAAC,qBAAA,KAAA,MAAA,GAAAA,qBAAA,GAAI,EAAE;AAC3C,EAAA;AAEA,EAAA,OAAOH,YAAY;AACrB,CAAC;;;;;ACCD,IAAMO,MAAM,GAAG,SAATA,MAAMA,CAAAT,IAAA,EAUN;AAAA,EAAA,IATJU,KAAK,GAAAV,IAAA,CAALU,KAAK;IAAAC,iBAAA,GAAAX,IAAA,CACLY,YAAY;AAAZA,IAAAA,YAAY,GAAAD,iBAAA,KAAA,MAAA,GAAG,GAAG,GAAAA,iBAAA;IAClBE,QAAQ,GAAAb,IAAA,CAARa,QAAQ;IACRC,QAAQ,GAAAd,IAAA,CAARc,QAAQ;IAAAC,kBAAA,GAAAf,IAAA,CACRG,aAAa;AAAbA,IAAAA,aAAa,GAAAY,kBAAA,KAAA,MAAA,GAAG,KAAK,GAAAA,kBAAA;IAAAC,oBAAA,GAAAhB,IAAA,CACrBI,eAAe;AAAfA,IAAAA,eAAe,GAAAY,oBAAA,KAAA,MAAA,GAAG,aAAa,GAAAA,oBAAA;IAC/BC,SAAS,GAAAjB,IAAA,CAATiB,SAAS;IACTC,KAAK,GAAAlB,IAAA,CAALkB,KAAK;AACFC,IAAAA,UAAU,GAAAC,wBAAA,CAAApB,IAAA,EAAAqB,SAAA,CAAA;AAEb,EAAA,IAAAC,eAAA,GAAcC,2BAAc,EAAE;IAAtBC,CAAC,GAAAF,eAAA,CAADE,CAAC;EACT,IAAMlB,WAAW,GAAGmB,cAAc,CAAC;AAAEjB,IAAAA,WAAW,EAAE;AAAM,GAAC,CAAC;AAC1D,EAAA,IAAMkB,OAAO,GAAGC,yBAAU,EAAE;AAC5B,EAAA,IAAMC,OAAO,GAAGC,WAAK,EAAE;AAEvB,EAAA,IAAAC,SAAA,GAA0CC,cAAQ,CAChDhC,qBAAqB,CAAC;AACpBG,MAAAA,YAAY,EAAEQ,KAAK;AACnBP,MAAAA,aAAa,EAAbA,aAAa;AACbC,MAAAA,eAAe,EAAfA;AACF,KAAC,CACH,CAAC;IAAA4B,UAAA,GAAAC,cAAA,CAAAH,SAAA,EAAA,CAAA,CAAA;AANMI,IAAAA,aAAa,GAAAF,UAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,gBAAgB,GAAAH,UAAA,CAAA,CAAA,CAAA;EAOtC,IAAMI,YAAY,GAAG1B,KAAK,KAAA,IAAA,IAALA,KAAK,uBAALA,KAAK,CAAE2B,IAAI,EAAE;AAElCC,EAAAA,eAAe,CAAC,YAAM;AAAA,IAAA,IAAAjC,qBAAA;IACpB,IAAI,CAACF,aAAa,EAAE;AAEpB,IAAA,IAAMoC,gBAAgB,GAAA,CAAAlC,qBAAA,GAAGC,WAAW,aAAXA,WAAW,KAAA,MAAA,GAAA,MAAA,GAAXA,WAAW,CAAGF,eAAe,CAAC,MAAA,IAAA,IAAAC,qBAAA,KAAA,MAAA,GAAAA,qBAAA,GAAI,EAAE;IAC7D8B,gBAAgB,CAACI,gBAAgB,CAAC;EACpC,CAAC,EAAE,CAACjC,WAAW,KAAA,IAAA,IAAXA,WAAW,KAAA,MAAA,GAAA,MAAA,GAAXA,WAAW,CAAGF,eAAe,CAAC,CAAC,CAAC;AAEpC,EAAA,IAAMoC,uBAAuB,GAAG,SAA1BA,uBAAuBA,CAAGJ,YAAY,EAAI;AAC9C,IAAA,IAAI,CAACA,YAAY,IAAI,EAAC9B,WAAW,KAAA,IAAA,IAAXA,WAAW,KAAA,MAAA,IAAXA,WAAW,CAAGF,eAAe,CAAC,CAAA,EAAE;IAEtD,IAAIgC,YAAY,MAAK9B,WAAW,KAAA,IAAA,IAAXA,WAAW,uBAAXA,WAAW,CAAGF,eAAe,CAAC,CAAA,EAAE;AAErD,IAAA,IAAMqC,QAAQ,GAAGf,OAAO,CAACgB,QAAQ,CAACD,QAAQ;AAE1C,IAAA,IAAIL,YAAY,EAAE;AAChBV,MAAAA,OAAO,CAACiB,IAAI,CACVC,gBAAQ,CACNH,QAAQ,EACRI,eAAS,CAAAC,eAAA,CAAA,EAAA,EAAI1C,eAAe,EAAGgC,YAAY,GAAI9B,WAAW,CAC5D,CACF,CAAC;AACH,IAAA,CAAC,MAAM;AACLoB,MAAAA,OAAO,CAACiB,IAAI,CAACC,gBAAQ,CAACH,QAAQ,EAAEM,UAAI,CAAC,CAAC3C,eAAe,CAAC,EAAEE,WAAW,CAAC,CAAC,CAAC;AACxE,IAAA;EACF,CAAC;AAED,EAAA,IAAM0C,+BAA+B,GAAGC,eAAe,CAAC,UAAAb,YAAY,EAAI;AACtE,IAAA,IAAIvB,QAAQ,EAAEA,QAAQ,CAACuB,YAAY,CAAC,CAAC,KAChC,IAAIjC,aAAa,EAAEqC,uBAAuB,CAACJ,YAAY,CAAC;EAC/D,CAAC,EAAExB,YAAY,CAAC;AAEhB0B,EAAAA,eAAe,CAAC,YAAM;IACpBU,+BAA+B,CAACZ,YAAY,CAAC;AAC/C,EAAA,CAAC,EAAE,CAACA,YAAY,CAAC,CAAC;AAElB,EAAA,IAAMc,YAAY,GAAGC,YAAM,CAACzC,KAAK,CAAC;EAClC,IAAIA,KAAK,KAAK0C,SAAS,IAAI1C,KAAK,KAAKwC,YAAY,CAACG,OAAO,EAAE;IACzDlB,gBAAgB,CAACzB,KAAK,CAAC;IACvBwC,YAAY,CAACG,OAAO,GAAG3C,KAAK;AAC9B,EAAA;AAEA,EAAA,IAAM4C,cAAc,GAAG,SAAjBA,cAAcA,CAAGC,CAAC,EAAI;AAAA,IAAA,IAAAC,eAAA;AAC1B,IAAA,IAAMpB,YAAY,GAAA,CAAAoB,eAAA,GAAGD,CAAC,CAACE,MAAM,CAAC/C,KAAK,MAAA,IAAA,IAAA8C,eAAA,KAAA,MAAA,GAAA,MAAA,GAAdA,eAAA,CAAgBnB,IAAI,EAAE;AAC3CvB,IAAAA,QAAQ,aAARA,QAAQ,KAAA,MAAA,IAARA,QAAQ,CAAGyC,CAAC,CAAC;AACbpB,IAAAA,gBAAgB,CAACoB,CAAC,CAACE,MAAM,CAAC/C,KAAK,CAAC;AAEhC,IAAA,IAAI,CAAAwB,aAAa,KAAA,IAAA,IAAbA,aAAa,KAAA,MAAA,GAAA,MAAA,GAAbA,aAAa,CAAEG,IAAI,EAAE,MAAKD,YAAY,EAAE;MAC1CY,+BAA+B,CAACZ,YAAY,CAAC;AAC/C,IAAA;EACF,CAAC;AAEDsB,EAAAA,eAAS,CAAC,YAAA;IAAA,OAAMV,+BAA+B,CAACW,MAAM;AAAA,EAAA,CAAA,EAAE,EAAE,CAAC;AAE3D,EAAA,oBACEC,cAAA,CAACC,gBAAK,EAAAC,aAAA,CAAA;AACE7C,IAAAA,SAAS,EAATA,SAAS;AAAEC,IAAAA,KAAK,EAALA,KAAK;AACtB6C,IAAAA,EAAE,EAAEnC,OAAQ;AACZoC,IAAAA,WAAW,EAAExC,CAAC,CAAC,sCAAsC,CAAE;AACvDyC,IAAAA,MAAM,eAAEL,cAAA,CAACM,aAAU,IAAE,CAAE;AACvBC,IAAAA,IAAI,EAAC,QAAQ;AACbzD,IAAAA,KAAK,EAAEwB,aAAc;AACrBpB,IAAAA,QAAQ,EAAEwC;GAAe,EACrBnC,UAAU,CACf,CAAC;AAEN;;;;"}

package/dist/cjs/v2/Sidebar.js

@@ -9,7 +9,7 @@ var ramda = require('ramda');
 var reactI18next = require('react-i18next');
 var reactRouterDom = require('react-router-dom');
 var useKeyboardShortcutsPaneState = require('../useKeyboardShortcutsPaneState-BG_xVteC.js');
-var ConfigureView = require('../ConfigureView-DuStircF.js');
+var ConfigureView = require('../ConfigureView-DtQRvPmE.js');
 var classnames = require('classnames');
 var initializers = require('@bigbinary/neeto-commons-frontend/initializers');
 var Neeto = require('@bigbinary/neeto-icons/typeface-logos/Neeto');
@@ -22,10 +22,10 @@ var neetoAtoms = require('@bigbinary/neeto-atoms');
 var plus = require('../plus-MoDFAiKt.js');
 var ellipsis = require('../ellipsis-BcfLTtl5.js');
 var chevronRight = require('../chevron-right-DpleLIQp.js');
+var injectCss = require('../inject-css-B6qYtOJe.js');
 require('zustand/shallow');
 require('@bigbinary/neeto-commons-frontend/react-utils/withImmutableActions');
 require('zustand');
-require('@bigbinary/neeto-commons-frontend/react-utils');
 require('@bigbinary/neeto-commons-frontend/utils/general');
 require('@bigbinary/neeto-commons-frontend/react-utils/useRegisterNavigationCheckpoint');
 require('@bigbinary/neeto-filters-frontend/v2');
@@ -66,7 +66,7 @@ var Header$1 = function Header(_ref) {
     "data-testid": "sidebar-info",
     children: /*#__PURE__*/jsxRuntime.jsx(reactRouterDom.Link, {
       to: ConfigureView.DEFAULT_HOME_PATH,
-      className: classnames("block w-full", {
+      className: classnames("mt-2 block w-full py-2", {
         "cursor-pointer": isOnboarded,
         "pointer-events-none": !isOnboarded
       }),
@@ -403,6 +403,9 @@ var NavLinks = function NavLinks(_ref) {
   });
 };
 
+var css = "[data-slot=sidebar][data-mobile=true]:has(.nm-sidebar-shadcn-header){max-width:min(var(--sidebar-width),85vw)!important;width:var(--sidebar-width)!important}";
+injectCss.n(css,{});
+
 var Sidebar = function Sidebar(_ref) {
   var navLinks = _ref.navLinks,
     _ref$moreNavLinks = _ref.moreNavLinks,
@@ -414,26 +417,65 @@ var Sidebar = function Sidebar(_ref) {
     showWorkspaceName = _ref$showWorkspaceNam === void 0 ? false : _ref$showWorkspaceNam,
     _ref$isExpandable = _ref.isExpandable,
     isExpandable = _ref$isExpandable === void 0 ? true : _ref$isExpandable;
+  var _useLocalStorage = useLocalStorage(ConfigureView.getSidebarStateLocalStorageKey(), false),
+    _useLocalStorage2 = _slicedToArray(_useLocalStorage, 2),
+    isSidebarCollapsed = _useLocalStorage2[0],
+    setIsSidebarCollapsed = _useLocalStorage2[1];
+  var _useLocalStorage3 = useLocalStorage(ConfigureView.SIDEBAR_WIDTH_KEY, ConfigureView.DEFAULT_SIDEBAR_WIDTH),
+    _useLocalStorage4 = _slicedToArray(_useLocalStorage3, 2),
+    sidebarWidthRaw = _useLocalStorage4[0],
+    setSidebarWidth = _useLocalStorage4[1];
+  var sidebarWidth = typeof sidebarWidthRaw === "string" ? parseInt(sidebarWidthRaw, 10) || ConfigureView.DEFAULT_SIDEBAR_WIDTH : sidebarWidthRaw || ConfigureView.DEFAULT_SIDEBAR_WIDTH;
+  return /*#__PURE__*/jsxRuntime.jsx(primitives.SidebarProvider, {
+    className: "!w-auto",
+    open: !isSidebarCollapsed,
+    style: {
+      "--sidebar-width": "".concat(sidebarWidth / 16, "rem")
+    },
+    onOpenChange: function onOpenChange(open) {
+      return setIsSidebarCollapsed(!open);
+    },
+    children: /*#__PURE__*/jsxRuntime.jsx(SidebarBody, {
+      customLogo: customLogo,
+      isCountsLoading: isCountsLoading,
+      isExpandable: isExpandable,
+      isSidebarCollapsed: isSidebarCollapsed,
+      moreNavLinks: moreNavLinks,
+      navLinks: navLinks,
+      setIsSidebarCollapsed: setIsSidebarCollapsed,
+      setSidebarWidth: setSidebarWidth,
+      showWorkspaceName: showWorkspaceName,
+      sidebarWidth: sidebarWidth
+    })
+  });
+};
+var SidebarBody = function SidebarBody(_ref2) {
+  var navLinks = _ref2.navLinks,
+    moreNavLinks = _ref2.moreNavLinks,
+    customLogo = _ref2.customLogo,
+    isCountsLoading = _ref2.isCountsLoading,
+    showWorkspaceName = _ref2.showWorkspaceName,
+    isExpandable = _ref2.isExpandable,
+    isSidebarCollapsed = _ref2.isSidebarCollapsed,
+    setIsSidebarCollapsed = _ref2.setIsSidebarCollapsed,
+    sidebarWidth = _ref2.sidebarWidth,
+    setSidebarWidth = _ref2.setSidebarWidth;
+  var _useSidebar = primitives.useSidebar(),
+    isMobile = _useSidebar.isMobile,
+    setOpenMobile = _useSidebar.setOpenMobile,
+    openMobile = _useSidebar.openMobile;
   var _useKeyboardShortcuts = useKeyboardShortcutsPaneState.useKeyboardShortcutsPaneState(),
     _useKeyboardShortcuts2 = _slicedToArray(_useKeyboardShortcuts, 1),
     isKeyboardShortcutsPaneOpen = _useKeyboardShortcuts2[0];
-  var _useLocalStorage = useLocalStorage(ConfigureView.SELECTED_NAV_LINK_ROUTE_STORAGE_KEY, null),
-    _useLocalStorage2 = _slicedToArray(_useLocalStorage, 2),
-    selectedNavLinkRoute = _useLocalStorage2[0],
-    setSelectedNavLinkRoute = _useLocalStorage2[1];
-  var _useLocalStorage3 = useLocalStorage(ConfigureView.getSidebarStateLocalStorageKey(), false),
-    _useLocalStorage4 = _slicedToArray(_useLocalStorage3, 2),
-    isSidebarCollapsed = _useLocalStorage4[0],
-    setIsSidebarCollapsed = _useLocalStorage4[1];
-  var _useLocalStorage5 = useLocalStorage(ConfigureView.SIDEBAR_WIDTH_KEY, ConfigureView.DEFAULT_SIDEBAR_WIDTH),
+  var _useLocalStorage5 = useLocalStorage(ConfigureView.SELECTED_NAV_LINK_ROUTE_STORAGE_KEY, null),
     _useLocalStorage6 = _slicedToArray(_useLocalStorage5, 2),
-    sidebarWidthRaw = _useLocalStorage6[0],
-    setSidebarWidth = _useLocalStorage6[1];
-  var sidebarWidth = typeof sidebarWidthRaw === "string" ? parseInt(sidebarWidthRaw, 10) || ConfigureView.DEFAULT_SIDEBAR_WIDTH : sidebarWidthRaw || ConfigureView.DEFAULT_SIDEBAR_WIDTH;
+    selectedNavLinkRoute = _useLocalStorage6[0],
+    setSelectedNavLinkRoute = _useLocalStorage6[1];
   var isDraggingRef = React.useRef(false);
   var hasDraggedRef = React.useRef(false);
   var startXRef = React.useRef(null);
   var startWidthRef = React.useRef(null);
+  var isInitialMountRef = React.useRef(true);
   var location = reactRouterDom.useLocation();
   var history = reactRouterDom.useHistory();
   var _useTranslation = reactI18next.useTranslation(),
@@ -441,18 +483,22 @@ var Sidebar = function Sidebar(_ref) {
   var isRTL = document.documentElement.dir === "rtl";
   var sidebarSide = isRTL ? "right" : "left";
   React.useEffect(function () {
-    if (isKeyboardShortcutsPaneOpen) {
-      setIsSidebarCollapsed(true);
-    } else if (window.innerWidth > 768) {
-      setIsSidebarCollapsed(false);
+    if (isInitialMountRef.current) {
+      isInitialMountRef.current = false;
+      return;
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps -- setIsSidebarCollapsed may not be stable across renders
-  }, [isKeyboardShortcutsPaneOpen]);
+    if (isMobile) {
+      if (isKeyboardShortcutsPaneOpen) setOpenMobile(false);
+      return;
+    }
+    if (isKeyboardShortcutsPaneOpen) setIsSidebarCollapsed(true);else setIsSidebarCollapsed(false);
+    // eslint-disable-next-line react-hooks/exhaustive-deps -- setIsSidebarCollapsed / setOpenMobile may not be stable across renders
+  }, [isKeyboardShortcutsPaneOpen, isMobile]);
   React.useEffect(function () {
     if (!neetoCist.isPresent(navLinks)) return;
-    var currentLink = ramda.findLast(function (_ref2) {
-      var to = _ref2.to,
-        isActive = _ref2.isActive;
+    var currentLink = ramda.findLast(function (_ref3) {
+      var to = _ref3.to,
+        isActive = _ref3.isActive;
       var url = new URL(to, window.location.href);
       return ramda.is(Function, isActive) ? isActive() : location.pathname.includes(url.pathname);
     })(navLinks);
@@ -461,12 +507,8 @@ var Sidebar = function Sidebar(_ref) {
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps -- mount-only: sets initial selected route from current URL
   }, []);
-
-  // Drag-to-resize via SidebarRail: intercept mousedown to start drag,
-  // update --sidebar-width directly on DOM for instant feedback,
-  // persist to localStorage on mouseup.
   var handleRailMouseDown = React.useCallback(function (e) {
-    if (!isExpandable) return;
+    if (!isExpandable || isMobile) return;
     isDraggingRef.current = true;
     hasDraggedRef.current = false;
     startXRef.current = e.clientX;
@@ -476,9 +518,7 @@ var Sidebar = function Sidebar(_ref) {
     document.body.style.cursor = "col-resize";
     document.body.style.userSelect = "none";
     e.preventDefault();
-  }, [sidebarWidth, isExpandable]);
-
-  // Prevent SidebarRail's built-in toggle when user dragged to resize
+  }, [sidebarWidth, isExpandable, isMobile]);
   var handleRailClick = React.useCallback(function (e) {
     if (!hasDraggedRef.current) return;
     e.preventDefault();
@@ -486,12 +526,11 @@ var Sidebar = function Sidebar(_ref) {
     hasDraggedRef.current = false;
   }, []);
   React.useEffect(function () {
-    if (!isExpandable) return undefined;
+    if (!isExpandable || isMobile) return undefined;
     var onMouseMove = function onMouseMove(e) {
       if (!isDraggingRef.current) return;
       hasDraggedRef.current = true;
       var dx = e.clientX - startXRef.current;
-      // In RTL, dragging right shrinks, dragging left expands
       var rtl = document.documentElement.dir === "rtl";
       var newWidth = startWidthRef.current + (rtl ? -dx : dx);
       newWidth = Math.max(ConfigureView.MIN_SIDEBAR_WIDTH, Math.min(newWidth, ConfigureView.MAX_SIDEBAR_WIDTH));
@@ -519,10 +558,10 @@ var Sidebar = function Sidebar(_ref) {
       document.removeEventListener("mousemove", onMouseMove);
       document.removeEventListener("mouseup", onMouseUp);
     };
-  }, [isExpandable, setSidebarWidth]);
+  }, [isExpandable, isMobile, setSidebarWidth]);
   React.useEffect(function () {
-    document.documentElement.style.setProperty("--nv-sidebar-width", "".concat(sidebarWidth / 16, "rem"));
-  }, [sidebarWidth]);
+    document.documentElement.style.setProperty("--nv-sidebar-width", isMobile ? "0rem" : "".concat(sidebarWidth / 16, "rem"));
+  }, [sidebarWidth, isMobile]);
   var handleGoBack = function handleGoBack(event) {
     event.preventDefault();
     setSelectedNavLinkRoute(null);
@@ -542,27 +581,20 @@ var Sidebar = function Sidebar(_ref) {
     });
   }, [location.pathname, navLinks]);
   var isSelectedNavLinkVisible = selectedNavLinkRoute && (activeLink === null || activeLink === void 0 ? void 0 : activeLink.to) === selectedNavLinkRoute && neetoCist.isNotEmpty(navLinks);
-  return /*#__PURE__*/jsxRuntime.jsxs(primitives.SidebarProvider, {
-    className: "!w-auto",
-    open: !isSidebarCollapsed,
-    style: {
-      "--sidebar-width": "".concat(sidebarWidth / 16, "rem")
-    },
-    onOpenChange: function onOpenChange(open) {
-      return setIsSidebarCollapsed(!open);
-    },
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/*#__PURE__*/jsxRuntime.jsxs(primitives.Sidebar, {
       collapsible: "offcanvas",
       side: sidebarSide,
       children: [/*#__PURE__*/jsxRuntime.jsxs(primitives.SidebarHeader, {
-        className: "relative p-0",
+        className: "nm-sidebar-shadcn-header relative p-0",
         children: [/*#__PURE__*/jsxRuntime.jsx(Header, {
           customLogo: customLogo,
           clearSettingsNav: function clearSettingsNav() {
             return setSelectedNavLinkRoute(null);
           }
         }), /*#__PURE__*/jsxRuntime.jsx(primitives.SidebarTrigger, {
-          className: "absolute end-2 top-3"
+          className: "absolute end-2 top-3",
+          title: t("neetoMolecules.sidebar.hideMenu")
         }), showWorkspaceName && /*#__PURE__*/jsxRuntime.jsxs("div", {
           className: "border-sidebar-border border-b px-4 py-2",
           children: [/*#__PURE__*/jsxRuntime.jsx("h5", {
@@ -583,12 +615,13 @@ var Sidebar = function Sidebar(_ref) {
           navLinks: navLinks,
           setSelectedNavLinkRoute: setSelectedNavLinkRoute
         })
-      }), isExpandable && /*#__PURE__*/jsxRuntime.jsx(primitives.SidebarRail, {
+      }), !isMobile && isExpandable && !isSidebarCollapsed && /*#__PURE__*/jsxRuntime.jsx(primitives.SidebarRail, {
         onClickCapture: handleRailClick,
         onMouseDown: handleRailMouseDown
       })]
-    }), isSidebarCollapsed && /*#__PURE__*/jsxRuntime.jsx(primitives.SidebarTrigger, {
-      className: "fixed start-2 top-3 z-50"
+    }), (isMobile && !openMobile || !isMobile && isSidebarCollapsed) && /*#__PURE__*/jsxRuntime.jsx(primitives.SidebarTrigger, {
+      className: "bg-background hover:bg-accent fixed start-2 top-2 z-50 size-9 rounded-full border shadow-sm",
+      title: t("neetoMolecules.sidebar.showMenu")
     })]
   });
 };