@payloadcms/ui 3.0.0-beta.90 → 3.0.0-beta.91

package/dist/elements/ListControls/index.js

@@ -1,6 +1,5 @@
 'use client';
 
-import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useWindowInfo } from '@faceless-ui/window-info';
 import { getTranslation } from '@payloadcms/translations';
@@ -32,15 +31,12 @@ const baseClass = 'list-controls';
  * the collection's documents.
  */
 export const ListControls = props => {
-  const $ = _c(34);
   const {
     collectionConfig,
-    enableColumns: t0,
-    enableSort: t1,
+    enableColumns = true,
+    enableSort = false,
     fields
   } = props;
-  const enableColumns = t0 === undefined ? true : t0;
-  const enableSort = t1 === undefined ? false : t1;
   const {
     handleSearchChange
   } = useListQuery();
@@ -59,230 +55,128 @@ export const ListControls = props => {
     t
   } = useTranslation();
   const {
-    breakpoints: t2
+    breakpoints: {
+      s: smallBreak
+    }
   } = useWindowInfo();
-  const {
-    s: smallBreak
-  } = t2;
-  const [search, setSearch] = useState(typeof searchParams?.search === "string" ? searchParams?.search : "");
-  let t3;
-  if ($[0] !== titleField || $[1] !== i18n) {
-    t3 = (titleField && getTranslation("label" in titleField && typeof titleField.label === "string" ? titleField.label : "name" in titleField ? titleField.name : null, i18n)) ?? "ID";
-    $[0] = titleField;
-    $[1] = i18n;
-    $[2] = t3;
-  } else {
-    t3 = $[2];
-  }
-  const searchLabel = t3;
-  let t4;
-  if ($[3] !== collectionConfig.admin.listSearchableFields || $[4] !== fields) {
-    t4 = getTextFieldsToBeSearched(collectionConfig.admin.listSearchableFields, fields);
-    $[3] = collectionConfig.admin.listSearchableFields;
-    $[4] = fields;
-    $[5] = t4;
-  } else {
-    t4 = $[5];
-  }
-  const listSearchableFields = t4;
-  const searchLabelTranslated = useRef(t("general:searchBy", {
+  const [search, setSearch] = useState(typeof searchParams?.search === 'string' ? searchParams?.search : '');
+  const searchLabel = (titleField && getTranslation('label' in titleField && typeof titleField.label === 'string' ? titleField.label : 'name' in titleField ? titleField.name : null, i18n)) ?? 'ID';
+  const listSearchableFields = getTextFieldsToBeSearched(collectionConfig.admin.listSearchableFields, fields);
+  const searchLabelTranslated = useRef(t('general:searchBy', {
     label: getTranslation(searchLabel, i18n)
   }));
   const hasWhereParam = useRef(Boolean(searchParams?.where));
   const shouldInitializeWhereOpened = validateWhereQuery(searchParams?.where);
-  const [visibleDrawer, setVisibleDrawer] = useState(shouldInitializeWhereOpened ? "where" : undefined);
-  let t5;
-  if ($[6] !== searchParams) {
-    t5 = () => {
-      if (hasWhereParam.current && !searchParams?.where) {
-        setVisibleDrawer(undefined);
-        hasWhereParam.current = false;
-      } else {
-        if (searchParams?.where) {
-          hasWhereParam.current = true;
-        }
-      }
-    };
-    $[6] = searchParams;
-    $[7] = t5;
-  } else {
-    t5 = $[7];
-  }
-  const t6 = searchParams?.where;
-  let t7;
-  if ($[8] !== t6) {
-    t7 = [setVisibleDrawer, t6];
-    $[8] = t6;
-    $[9] = t7;
-  } else {
-    t7 = $[9];
-  }
-  useEffect(t5, t7);
-  let t8;
-  if ($[10] !== t || $[11] !== listSearchableFields || $[12] !== i18n || $[13] !== searchLabel) {
-    t8 = [t, listSearchableFields, i18n, searchLabel];
-    $[10] = t;
-    $[11] = listSearchableFields;
-    $[12] = i18n;
-    $[13] = searchLabel;
-    $[14] = t8;
-  } else {
-    t8 = $[14];
-  }
+  const [visibleDrawer, setVisibleDrawer] = useState(shouldInitializeWhereOpened ? 'where' : undefined);
+  useEffect(() => {
+    if (hasWhereParam.current && !searchParams?.where) {
+      setVisibleDrawer(undefined);
+      hasWhereParam.current = false;
+    } else if (searchParams?.where) {
+      hasWhereParam.current = true;
+    }
+  }, [setVisibleDrawer, searchParams?.where]);
   useEffect(() => {
     if (listSearchableFields?.length > 0) {
       searchLabelTranslated.current = listSearchableFields.reduce((placeholderText, field, i) => {
-        const label = "label" in field && field.label ? field.label : "name" in field ? field.name : null;
+        const label = 'label' in field && field.label ? field.label : 'name' in field ? field.name : null;
         if (i === 0) {
-          return `${t("general:searchBy", {
+          return `${t('general:searchBy', {
             label: getTranslation(label, i18n)
           })}`;
         }
         if (i === listSearchableFields.length - 1) {
-          return `${placeholderText} ${t("general:or")} ${getTranslation(label, i18n)}`;
+          return `${placeholderText} ${t('general:or')} ${getTranslation(label, i18n)}`;
         }
         return `${placeholderText}, ${getTranslation(label, i18n)}`;
-      }, "");
+      }, '');
     } else {
-      searchLabelTranslated.current = t("general:searchBy", {
+      searchLabelTranslated.current = t('general:searchBy', {
         label: getTranslation(searchLabel, i18n)
       });
     }
-  }, t8);
-  let t9;
-  if ($[15] !== handleSearchChange) {
-    t9 = search_0 => void handleSearchChange(search_0);
-    $[15] = handleSearchChange;
-    $[16] = t9;
-  } else {
-    t9 = $[16];
-  }
-  let t10;
-  if ($[17] !== enableColumns || $[18] !== visibleDrawer || $[19] !== t) {
-    t10 = enableColumns && _jsx(Pill, {
-      "aria-controls": `${baseClass}-columns`,
-      "aria-expanded": visibleDrawer === "columns",
-      className: `${baseClass}__toggle-columns ${visibleDrawer === "columns" ? `${baseClass}__buttons-active` : ""}`,
-      icon: _jsx(ChevronIcon, {}),
-      onClick: () => setVisibleDrawer(visibleDrawer !== "columns" ? "columns" : undefined),
-      pillStyle: "light",
-      children: t("general:columns")
-    });
-    $[17] = enableColumns;
-    $[18] = visibleDrawer;
-    $[19] = t;
-    $[20] = t10;
-  } else {
-    t10 = $[20];
-  }
-  let t11;
-  if ($[21] !== visibleDrawer) {
-    t11 = () => setVisibleDrawer(visibleDrawer !== "where" ? "where" : undefined);
-    $[21] = visibleDrawer;
-    $[22] = t11;
-  } else {
-    t11 = $[22];
-  }
-  let t12;
-  if ($[23] !== enableSort || $[24] !== visibleDrawer || $[25] !== t) {
-    t12 = enableSort && _jsx(Pill, {
-      "aria-controls": `${baseClass}-sort`,
-      "aria-expanded": visibleDrawer === "sort",
-      className: `${baseClass}__toggle-sort`,
-      icon: _jsx(ChevronIcon, {}),
-      onClick: () => setVisibleDrawer(visibleDrawer !== "sort" ? "sort" : undefined),
-      pillStyle: "light",
-      children: t("general:sort")
-    });
-    $[23] = enableSort;
-    $[24] = visibleDrawer;
-    $[25] = t;
-    $[26] = t12;
-  } else {
-    t12 = $[26];
-  }
-  let t13;
-  if ($[27] !== enableColumns || $[28] !== visibleDrawer || $[29] !== collectionConfig) {
-    t13 = enableColumns && _jsx(AnimateHeight, {
-      className: `${baseClass}__columns`,
-      height: visibleDrawer === "columns" ? "auto" : 0,
-      id: `${baseClass}-columns`,
-      children: _jsx(ColumnSelector, {
-        collectionSlug: collectionConfig.slug
-      })
-    });
-    $[27] = enableColumns;
-    $[28] = visibleDrawer;
-    $[29] = collectionConfig;
-    $[30] = t13;
-  } else {
-    t13 = $[30];
-  }
-  let t14;
-  if ($[31] !== enableSort || $[32] !== visibleDrawer) {
-    t14 = enableSort && _jsx(AnimateHeight, {
-      className: `${baseClass}__sort`,
-      height: visibleDrawer === "sort" ? "auto" : 0,
-      id: `${baseClass}-sort`,
-      children: _jsx("p", {
-        children: "Sort Complex"
-      })
-    });
-    $[31] = enableSort;
-    $[32] = visibleDrawer;
-    $[33] = t14;
-  } else {
-    t14 = $[33];
-  }
-  return _jsxs("div", {
+  }, [t, listSearchableFields, i18n, searchLabel]);
+  return /*#__PURE__*/_jsxs("div", {
     className: baseClass,
-    children: [_jsxs("div", {
+    children: [/*#__PURE__*/_jsxs("div", {
       className: `${baseClass}__wrap`,
-      children: [_jsx(SearchIcon, {}), _jsx(SearchFilter, {
-        fieldName: "name" in titleField ? titleField?.name : null,
-        handleChange: t9,
+      children: [/*#__PURE__*/_jsx(SearchIcon, {}), /*#__PURE__*/_jsx(SearchFilter, {
+        fieldName: 'name' in titleField ? titleField?.name : null,
+        handleChange: search_0 => {
+          return void handleSearchChange(search_0);
+        },
         initialParams: searchParams,
         label: searchLabelTranslated.current,
         setValue: setSearch,
         value: search
-      }, collectionSlug), _jsx("div", {
+      }, collectionSlug), /*#__PURE__*/_jsx("div", {
         className: `${baseClass}__buttons`,
-        children: _jsxs("div", {
+        children: /*#__PURE__*/_jsxs("div", {
           className: `${baseClass}__buttons-wrap`,
-          children: [!smallBreak && _jsxs(React.Fragment, {
-            children: [beforeActions && beforeActions, !disableBulkEdit && _jsxs(Fragment, {
-              children: [_jsx(EditMany, {
+          children: [!smallBreak && /*#__PURE__*/_jsxs(React.Fragment, {
+            children: [beforeActions && beforeActions, !disableBulkEdit && /*#__PURE__*/_jsxs(Fragment, {
+              children: [/*#__PURE__*/_jsx(EditMany, {
                 collection: collectionConfig,
-                fields
-              }), _jsx(PublishMany, {
+                fields: fields
+              }), /*#__PURE__*/_jsx(PublishMany, {
                 collection: collectionConfig
-              }), _jsx(UnpublishMany, {
+              }), /*#__PURE__*/_jsx(UnpublishMany, {
                 collection: collectionConfig
               })]
-            }), !disableBulkDelete && _jsx(DeleteMany, {
+            }), !disableBulkDelete && /*#__PURE__*/_jsx(DeleteMany, {
               collection: collectionConfig
             })]
-          }), t10, _jsx(Pill, {
+          }), enableColumns && /*#__PURE__*/_jsx(Pill, {
+            "aria-controls": `${baseClass}-columns`,
+            "aria-expanded": visibleDrawer === 'columns',
+            className: `${baseClass}__toggle-columns ${visibleDrawer === 'columns' ? `${baseClass}__buttons-active` : ''}`,
+            icon: /*#__PURE__*/_jsx(ChevronIcon, {}),
+            onClick: () => setVisibleDrawer(visibleDrawer !== 'columns' ? 'columns' : undefined),
+            pillStyle: "light",
+            children: t('general:columns')
+          }), /*#__PURE__*/_jsx(Pill, {
             "aria-controls": `${baseClass}-where`,
-            "aria-expanded": visibleDrawer === "where",
-            className: `${baseClass}__toggle-where ${visibleDrawer === "where" ? `${baseClass}__buttons-active` : ""}`,
-            icon: _jsx(ChevronIcon, {}),
-            onClick: t11,
+            "aria-expanded": visibleDrawer === 'where',
+            className: `${baseClass}__toggle-where ${visibleDrawer === 'where' ? `${baseClass}__buttons-active` : ''}`,
+            icon: /*#__PURE__*/_jsx(ChevronIcon, {}),
+            onClick: () => setVisibleDrawer(visibleDrawer !== 'where' ? 'where' : undefined),
+            pillStyle: "light",
+            children: t('general:filters')
+          }), enableSort && /*#__PURE__*/_jsx(Pill, {
+            "aria-controls": `${baseClass}-sort`,
+            "aria-expanded": visibleDrawer === 'sort',
+            className: `${baseClass}__toggle-sort`,
+            icon: /*#__PURE__*/_jsx(ChevronIcon, {}),
+            onClick: () => setVisibleDrawer(visibleDrawer !== 'sort' ? 'sort' : undefined),
             pillStyle: "light",
-            children: t("general:filters")
-          }), t12]
+            children: t('general:sort')
+          })]
         })
       })]
-    }), t13, _jsx(AnimateHeight, {
+    }), enableColumns && /*#__PURE__*/_jsx(AnimateHeight, {
+      className: `${baseClass}__columns`,
+      height: visibleDrawer === 'columns' ? 'auto' : 0,
+      id: `${baseClass}-columns`,
+      children: /*#__PURE__*/_jsx(ColumnSelector, {
+        collectionSlug: collectionConfig.slug
+      })
+    }), /*#__PURE__*/_jsx(AnimateHeight, {
       className: `${baseClass}__where`,
-      height: visibleDrawer === "where" ? "auto" : 0,
+      height: visibleDrawer === 'where' ? 'auto' : 0,
       id: `${baseClass}-where`,
-      children: _jsx(WhereBuilder, {
+      children: /*#__PURE__*/_jsx(WhereBuilder, {
         collectionPluralLabel: collectionConfig?.labels?.plural,
         collectionSlug: collectionConfig.slug,
-        fields
+        fields: fields
       }, String(hasWhereParam.current && !searchParams?.where))
-    }), t14]
+    }), enableSort && /*#__PURE__*/_jsx(AnimateHeight, {
+      className: `${baseClass}__sort`,
+      height: visibleDrawer === 'sort' ? 'auto' : 0,
+      id: `${baseClass}-sort`,
+      children: /*#__PURE__*/_jsx("p", {
+        children: "Sort Complex"
+      })
+    })]
   });
 };
 //# sourceMappingURL=index.js.map

package/dist/elements/ListControls/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","useWindowInfo","getTranslation","React","Fragment","useEffect","useRef","useState","AnimateHeightImport","AnimateHeight","default","useUseTitleField","ChevronIcon","SearchIcon","useListInfo","useListQuery","useSearchParams","useTranslation","ColumnSelector","DeleteMany","EditMany","Pill","PublishMany","SearchFilter","UnpublishMany","WhereBuilder","validateWhereQuery","getTextFieldsToBeSearched","baseClass","ListControls","props","$","collectionConfig","enableColumns","t0","enableSort","t1","fields","undefined","handleSearchChange","beforeActions","collectionSlug","disableBulkDelete","disableBulkEdit","searchParams","titleField","i18n","t","breakpoints","t2","s","smallBreak","search","setSearch","t3","label","name","searchLabel","t4","admin","listSearchableFields","searchLabelTranslated","hasWhereParam","Boolean","where","shouldInitializeWhereOpened","visibleDrawer","setVisibleDrawer","t5","current","t6","t7","t8","length","reduce","placeholderText","field","i","t9","search_0","t10","_jsx","className","icon","onClick","pillStyle","children","t11","t12","t13","height","id","slug","t14","_jsxs","fieldName","handleChange","initialParams","setValue","value","collection","collectionPluralLabel","labels","plural","String"],"sources":["../../../src/elements/ListControls/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientCollectionConfig, ClientField, Where } from 'payload'\n\nimport { useWindowInfo } from '@faceless-ui/window-info'\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { Fragment, useEffect, useRef, useState } from 'react'\nimport AnimateHeightImport from 'react-animate-height'\n\nconst AnimateHeight = (AnimateHeightImport.default ||\n  AnimateHeightImport) as typeof AnimateHeightImport.default\n\nimport { useUseTitleField } from '../../hooks/useUseAsTitle.js'\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { SearchIcon } from '../../icons/Search/index.js'\nimport { useListInfo } from '../../providers/ListInfo/index.js'\nimport { useListQuery } from '../../providers/ListQuery/index.js'\nimport { useSearchParams } from '../../providers/SearchParams/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { ColumnSelector } from '../ColumnSelector/index.js'\nimport { DeleteMany } from '../DeleteMany/index.js'\nimport { EditMany } from '../EditMany/index.js'\nimport { Pill } from '../Pill/index.js'\nimport { PublishMany } from '../PublishMany/index.js'\nimport { SearchFilter } from '../SearchFilter/index.js'\nimport { UnpublishMany } from '../UnpublishMany/index.js'\nimport { WhereBuilder } from '../WhereBuilder/index.js'\nimport validateWhereQuery from '../WhereBuilder/validateWhereQuery.js'\nimport { getTextFieldsToBeSearched } from './getTextFieldsToBeSearched.js'\nimport './index.scss'\n\nconst baseClass = 'list-controls'\n\nexport type ListControlsProps = {\n  readonly collectionConfig: ClientCollectionConfig\n  readonly enableColumns?: boolean\n  readonly enableSort?: boolean\n  readonly fields: ClientField[]\n  readonly handleSearchChange?: (search: string) => void\n  readonly handleSortChange?: (sort: string) => void\n  readonly handleWhereChange?: (where: Where) => void\n}\n\n/**\n * The ListControls component is used to render the controls (search, filter, where)\n * for a collection's list view. You can find those directly above the table which lists\n * the collection's documents.\n */\nexport const ListControls: React.FC<ListControlsProps> = (props) => {\n  const { collectionConfig, enableColumns = true, enableSort = false, fields } = props\n\n  const { handleSearchChange } = useListQuery()\n  const { beforeActions, collectionSlug, disableBulkDelete, disableBulkEdit } = useListInfo()\n  const { searchParams } = useSearchParams()\n  const titleField = useUseTitleField(collectionConfig, fields)\n  const { i18n, t } = useTranslation()\n  const {\n    breakpoints: { s: smallBreak },\n  } = useWindowInfo()\n  const [search, setSearch] = useState(\n    typeof searchParams?.search === 'string' ? searchParams?.search : '',\n  )\n\n  const searchLabel =\n    (titleField &&\n      getTranslation(\n        'label' in titleField && typeof titleField.label === 'string'\n          ? titleField.label\n          : 'name' in titleField\n            ? titleField.name\n            : null,\n        i18n,\n      )) ??\n    'ID'\n\n  const listSearchableFields = getTextFieldsToBeSearched(\n    collectionConfig.admin.listSearchableFields,\n    fields,\n  )\n\n  const searchLabelTranslated = useRef(\n    t('general:searchBy', { label: getTranslation(searchLabel, i18n) }),\n  )\n\n  const hasWhereParam = useRef(Boolean(searchParams?.where))\n\n  const shouldInitializeWhereOpened = validateWhereQuery(searchParams?.where)\n  const [visibleDrawer, setVisibleDrawer] = useState<'columns' | 'sort' | 'where'>(\n    shouldInitializeWhereOpened ? 'where' : undefined,\n  )\n\n  useEffect(() => {\n    if (hasWhereParam.current && !searchParams?.where) {\n      setVisibleDrawer(undefined)\n      hasWhereParam.current = false\n    } else if (searchParams?.where) {\n      hasWhereParam.current = true\n    }\n  }, [setVisibleDrawer, searchParams?.where])\n\n  useEffect(() => {\n    if (listSearchableFields?.length > 0) {\n      searchLabelTranslated.current = listSearchableFields.reduce(\n        (placeholderText: string, field, i: number) => {\n          const label =\n            'label' in field && field.label ? field.label : 'name' in field ? field.name : null\n\n          if (i === 0) {\n            return `${t('general:searchBy', {\n              label: getTranslation(label, i18n),\n            })}`\n          }\n\n          if (i === listSearchableFields.length - 1) {\n            return `${placeholderText} ${t('general:or')} ${getTranslation(label, i18n)}`\n          }\n\n          return `${placeholderText}, ${getTranslation(label, i18n)}`\n        },\n        '',\n      )\n    } else {\n      searchLabelTranslated.current = t('general:searchBy', {\n        label: getTranslation(searchLabel, i18n),\n      })\n    }\n  }, [t, listSearchableFields, i18n, searchLabel])\n\n  return (\n    <div className={baseClass}>\n      <div className={`${baseClass}__wrap`}>\n        <SearchIcon />\n        <SearchFilter\n          fieldName={'name' in titleField ? titleField?.name : null}\n          handleChange={(search) => {\n            return void handleSearchChange(search)\n          }}\n          initialParams={searchParams}\n          key={collectionSlug}\n          label={searchLabelTranslated.current}\n          setValue={setSearch}\n          value={search}\n        />\n        <div className={`${baseClass}__buttons`}>\n          <div className={`${baseClass}__buttons-wrap`}>\n            {!smallBreak && (\n              <React.Fragment>\n                {beforeActions && beforeActions}\n                {!disableBulkEdit && (\n                  <Fragment>\n                    <EditMany collection={collectionConfig} fields={fields} />\n                    <PublishMany collection={collectionConfig} />\n                    <UnpublishMany collection={collectionConfig} />\n                  </Fragment>\n                )}\n                {!disableBulkDelete && <DeleteMany collection={collectionConfig} />}\n              </React.Fragment>\n            )}\n            {enableColumns && (\n              <Pill\n                aria-controls={`${baseClass}-columns`}\n                aria-expanded={visibleDrawer === 'columns'}\n                className={`${baseClass}__toggle-columns ${\n                  visibleDrawer === 'columns' ? `${baseClass}__buttons-active` : ''\n                }`}\n                icon={<ChevronIcon />}\n                onClick={() =>\n                  setVisibleDrawer(visibleDrawer !== 'columns' ? 'columns' : undefined)\n                }\n                pillStyle=\"light\"\n              >\n                {t('general:columns')}\n              </Pill>\n            )}\n            <Pill\n              aria-controls={`${baseClass}-where`}\n              aria-expanded={visibleDrawer === 'where'}\n              className={`${baseClass}__toggle-where ${\n                visibleDrawer === 'where' ? `${baseClass}__buttons-active` : ''\n              }`}\n              icon={<ChevronIcon />}\n              onClick={() => setVisibleDrawer(visibleDrawer !== 'where' ? 'where' : undefined)}\n              pillStyle=\"light\"\n            >\n              {t('general:filters')}\n            </Pill>\n            {enableSort && (\n              <Pill\n                aria-controls={`${baseClass}-sort`}\n                aria-expanded={visibleDrawer === 'sort'}\n                className={`${baseClass}__toggle-sort`}\n                icon={<ChevronIcon />}\n                onClick={() => setVisibleDrawer(visibleDrawer !== 'sort' ? 'sort' : undefined)}\n                pillStyle=\"light\"\n              >\n                {t('general:sort')}\n              </Pill>\n            )}\n          </div>\n        </div>\n      </div>\n      {enableColumns && (\n        <AnimateHeight\n          className={`${baseClass}__columns`}\n          height={visibleDrawer === 'columns' ? 'auto' : 0}\n          id={`${baseClass}-columns`}\n        >\n          <ColumnSelector collectionSlug={collectionConfig.slug} />\n        </AnimateHeight>\n      )}\n      <AnimateHeight\n        className={`${baseClass}__where`}\n        height={visibleDrawer === 'where' ? 'auto' : 0}\n        id={`${baseClass}-where`}\n      >\n        <WhereBuilder\n          collectionPluralLabel={collectionConfig?.labels?.plural}\n          collectionSlug={collectionConfig.slug}\n          fields={fields}\n          key={String(hasWhereParam.current && !searchParams?.where)}\n        />\n      </AnimateHeight>\n      {enableSort && (\n        <AnimateHeight\n          className={`${baseClass}__sort`}\n          height={visibleDrawer === 'sort' ? 'auto' : 0}\n          id={`${baseClass}-sort`}\n        >\n          <p>Sort Complex</p>\n          {/* <SortComplex\n            collection={collection}\n            handleChange={handleSortChange}\n            modifySearchQuery={modifySearchQuery}\n          /> */}\n        </AnimateHeight>\n      )}\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["useWindowInfo","getTranslation","React","Fragment","useEffect","useRef","useState","AnimateHeightImport","AnimateHeight","default","useUseTitleField","ChevronIcon","SearchIcon","useListInfo","useListQuery","useSearchParams","useTranslation","ColumnSelector","DeleteMany","EditMany","Pill","PublishMany","SearchFilter","UnpublishMany","WhereBuilder","validateWhereQuery","getTextFieldsToBeSearched","baseClass","ListControls","props","collectionConfig","enableColumns","enableSort","fields","handleSearchChange","beforeActions","collectionSlug","disableBulkDelete","disableBulkEdit","searchParams","titleField","i18n","t","breakpoints","s","smallBreak","search","setSearch","searchLabel","label","name","listSearchableFields","admin","searchLabelTranslated","hasWhereParam","Boolean","where","shouldInitializeWhereOpened","visibleDrawer","setVisibleDrawer","undefined","current","length","reduce","placeholderText","field","i","_jsxs","className","_jsx","fieldName","handleChange","initialParams","setValue","value","collection","icon","onClick","pillStyle","height","id","slug","collectionPluralLabel","labels","plural","String"],"sources":["../../../src/elements/ListControls/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientCollectionConfig, ClientField, Where } from 'payload'\n\nimport { useWindowInfo } from '@faceless-ui/window-info'\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { Fragment, useEffect, useRef, useState } from 'react'\nimport AnimateHeightImport from 'react-animate-height'\n\nconst AnimateHeight = (AnimateHeightImport.default ||\n  AnimateHeightImport) as typeof AnimateHeightImport.default\n\nimport { useUseTitleField } from '../../hooks/useUseAsTitle.js'\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { SearchIcon } from '../../icons/Search/index.js'\nimport { useListInfo } from '../../providers/ListInfo/index.js'\nimport { useListQuery } from '../../providers/ListQuery/index.js'\nimport { useSearchParams } from '../../providers/SearchParams/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { ColumnSelector } from '../ColumnSelector/index.js'\nimport { DeleteMany } from '../DeleteMany/index.js'\nimport { EditMany } from '../EditMany/index.js'\nimport { Pill } from '../Pill/index.js'\nimport { PublishMany } from '../PublishMany/index.js'\nimport { SearchFilter } from '../SearchFilter/index.js'\nimport { UnpublishMany } from '../UnpublishMany/index.js'\nimport { WhereBuilder } from '../WhereBuilder/index.js'\nimport validateWhereQuery from '../WhereBuilder/validateWhereQuery.js'\nimport { getTextFieldsToBeSearched } from './getTextFieldsToBeSearched.js'\nimport './index.scss'\n\nconst baseClass = 'list-controls'\n\nexport type ListControlsProps = {\n  readonly collectionConfig: ClientCollectionConfig\n  readonly enableColumns?: boolean\n  readonly enableSort?: boolean\n  readonly fields: ClientField[]\n  readonly handleSearchChange?: (search: string) => void\n  readonly handleSortChange?: (sort: string) => void\n  readonly handleWhereChange?: (where: Where) => void\n}\n\n/**\n * The ListControls component is used to render the controls (search, filter, where)\n * for a collection's list view. You can find those directly above the table which lists\n * the collection's documents.\n */\nexport const ListControls: React.FC<ListControlsProps> = (props) => {\n  const { collectionConfig, enableColumns = true, enableSort = false, fields } = props\n\n  const { handleSearchChange } = useListQuery()\n  const { beforeActions, collectionSlug, disableBulkDelete, disableBulkEdit } = useListInfo()\n  const { searchParams } = useSearchParams()\n  const titleField = useUseTitleField(collectionConfig, fields)\n  const { i18n, t } = useTranslation()\n  const {\n    breakpoints: { s: smallBreak },\n  } = useWindowInfo()\n  const [search, setSearch] = useState(\n    typeof searchParams?.search === 'string' ? searchParams?.search : '',\n  )\n\n  const searchLabel =\n    (titleField &&\n      getTranslation(\n        'label' in titleField && typeof titleField.label === 'string'\n          ? titleField.label\n          : 'name' in titleField\n            ? titleField.name\n            : null,\n        i18n,\n      )) ??\n    'ID'\n\n  const listSearchableFields = getTextFieldsToBeSearched(\n    collectionConfig.admin.listSearchableFields,\n    fields,\n  )\n\n  const searchLabelTranslated = useRef(\n    t('general:searchBy', { label: getTranslation(searchLabel, i18n) }),\n  )\n\n  const hasWhereParam = useRef(Boolean(searchParams?.where))\n\n  const shouldInitializeWhereOpened = validateWhereQuery(searchParams?.where)\n  const [visibleDrawer, setVisibleDrawer] = useState<'columns' | 'sort' | 'where'>(\n    shouldInitializeWhereOpened ? 'where' : undefined,\n  )\n\n  useEffect(() => {\n    if (hasWhereParam.current && !searchParams?.where) {\n      setVisibleDrawer(undefined)\n      hasWhereParam.current = false\n    } else if (searchParams?.where) {\n      hasWhereParam.current = true\n    }\n  }, [setVisibleDrawer, searchParams?.where])\n\n  useEffect(() => {\n    if (listSearchableFields?.length > 0) {\n      searchLabelTranslated.current = listSearchableFields.reduce(\n        (placeholderText: string, field, i: number) => {\n          const label =\n            'label' in field && field.label ? field.label : 'name' in field ? field.name : null\n\n          if (i === 0) {\n            return `${t('general:searchBy', {\n              label: getTranslation(label, i18n),\n            })}`\n          }\n\n          if (i === listSearchableFields.length - 1) {\n            return `${placeholderText} ${t('general:or')} ${getTranslation(label, i18n)}`\n          }\n\n          return `${placeholderText}, ${getTranslation(label, i18n)}`\n        },\n        '',\n      )\n    } else {\n      searchLabelTranslated.current = t('general:searchBy', {\n        label: getTranslation(searchLabel, i18n),\n      })\n    }\n  }, [t, listSearchableFields, i18n, searchLabel])\n\n  return (\n    <div className={baseClass}>\n      <div className={`${baseClass}__wrap`}>\n        <SearchIcon />\n        <SearchFilter\n          fieldName={'name' in titleField ? titleField?.name : null}\n          handleChange={(search) => {\n            return void handleSearchChange(search)\n          }}\n          initialParams={searchParams}\n          key={collectionSlug}\n          label={searchLabelTranslated.current}\n          setValue={setSearch}\n          value={search}\n        />\n        <div className={`${baseClass}__buttons`}>\n          <div className={`${baseClass}__buttons-wrap`}>\n            {!smallBreak && (\n              <React.Fragment>\n                {beforeActions && beforeActions}\n                {!disableBulkEdit && (\n                  <Fragment>\n                    <EditMany collection={collectionConfig} fields={fields} />\n                    <PublishMany collection={collectionConfig} />\n                    <UnpublishMany collection={collectionConfig} />\n                  </Fragment>\n                )}\n                {!disableBulkDelete && <DeleteMany collection={collectionConfig} />}\n              </React.Fragment>\n            )}\n            {enableColumns && (\n              <Pill\n                aria-controls={`${baseClass}-columns`}\n                aria-expanded={visibleDrawer === 'columns'}\n                className={`${baseClass}__toggle-columns ${\n                  visibleDrawer === 'columns' ? `${baseClass}__buttons-active` : ''\n                }`}\n                icon={<ChevronIcon />}\n                onClick={() =>\n                  setVisibleDrawer(visibleDrawer !== 'columns' ? 'columns' : undefined)\n                }\n                pillStyle=\"light\"\n              >\n                {t('general:columns')}\n              </Pill>\n            )}\n            <Pill\n              aria-controls={`${baseClass}-where`}\n              aria-expanded={visibleDrawer === 'where'}\n              className={`${baseClass}__toggle-where ${\n                visibleDrawer === 'where' ? `${baseClass}__buttons-active` : ''\n              }`}\n              icon={<ChevronIcon />}\n              onClick={() => setVisibleDrawer(visibleDrawer !== 'where' ? 'where' : undefined)}\n              pillStyle=\"light\"\n            >\n              {t('general:filters')}\n            </Pill>\n            {enableSort && (\n              <Pill\n                aria-controls={`${baseClass}-sort`}\n                aria-expanded={visibleDrawer === 'sort'}\n                className={`${baseClass}__toggle-sort`}\n                icon={<ChevronIcon />}\n                onClick={() => setVisibleDrawer(visibleDrawer !== 'sort' ? 'sort' : undefined)}\n                pillStyle=\"light\"\n              >\n                {t('general:sort')}\n              </Pill>\n            )}\n          </div>\n        </div>\n      </div>\n      {enableColumns && (\n        <AnimateHeight\n          className={`${baseClass}__columns`}\n          height={visibleDrawer === 'columns' ? 'auto' : 0}\n          id={`${baseClass}-columns`}\n        >\n          <ColumnSelector collectionSlug={collectionConfig.slug} />\n        </AnimateHeight>\n      )}\n      <AnimateHeight\n        className={`${baseClass}__where`}\n        height={visibleDrawer === 'where' ? 'auto' : 0}\n        id={`${baseClass}-where`}\n      >\n        <WhereBuilder\n          collectionPluralLabel={collectionConfig?.labels?.plural}\n          collectionSlug={collectionConfig.slug}\n          fields={fields}\n          key={String(hasWhereParam.current && !searchParams?.where)}\n        />\n      </AnimateHeight>\n      {enableSort && (\n        <AnimateHeight\n          className={`${baseClass}__sort`}\n          height={visibleDrawer === 'sort' ? 'auto' : 0}\n          id={`${baseClass}-sort`}\n        >\n          <p>Sort Complex</p>\n          {/* <SortComplex\n            collection={collection}\n            handleChange={handleSortChange}\n            modifySearchQuery={modifySearchQuery}\n          /> */}\n        </AnimateHeight>\n      )}\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/Nav/context.js

@@ -1,6 +1,5 @@
 'use client';
 
-import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useWindowInfo } from '@faceless-ui/window-info';
 import { clearAllBodyScrollLocks, disableBodyScroll, enableBodyScroll } from 'body-scroll-lock';
@@ -25,58 +24,42 @@ const getNavPreference = async getPreference => {
     return true;
   }
 };
-export const NavProvider = t0 => {
-  const $ = _c(13);
+export const NavProvider = ({
+  children,
+  initialIsOpen
+}) => {
   const {
-    children,
-    initialIsOpen
-  } = t0;
-  const {
-    breakpoints: t1
+    breakpoints: {
+      l: largeBreak,
+      m: midBreak,
+      s: smallBreak
+    }
   } = useWindowInfo();
-  const {
-    l: largeBreak,
-    m: midBreak,
-    s: smallBreak
-  } = t1;
   const {
     getPreference
   } = usePreferences();
   const navRef = useRef(null);
+  // initialize the nav to be closed
+  // this is because getting the preference is async
+  // so instead of closing it after the preference is loaded
+  // we will open it after the preference is loaded
   const [navOpen, setNavOpen] = React.useState(initialIsOpen);
   const [shouldAnimate, setShouldAnimate] = React.useState(false);
   const [hydrated, setHydrated] = React.useState(false);
-  let t2;
-  let t3;
-  if ($[0] !== largeBreak || $[1] !== getPreference) {
-    t2 = () => {
-      if (largeBreak === false) {
-        const setNavFromPreferences = async () => {
-          const preferredState = await getNavPreference(getPreference);
-          setNavOpen(preferredState);
-        };
-        setNavFromPreferences();
-      }
-    };
-    t3 = [largeBreak, getPreference, setNavOpen];
-    $[0] = largeBreak;
-    $[1] = getPreference;
-    $[2] = t2;
-    $[3] = t3;
-  } else {
-    t2 = $[2];
-    t3 = $[3];
-  }
-  useEffect(t2, t3);
-  let t4;
-  if ($[4] !== navOpen || $[5] !== midBreak) {
-    t4 = [navOpen, midBreak];
-    $[4] = navOpen;
-    $[5] = midBreak;
-    $[6] = t4;
-  } else {
-    t4 = $[6];
-  }
+  // on load check the user's preference and set "initial" state
+  useEffect(() => {
+    if (largeBreak === false) {
+      const setNavFromPreferences = async () => {
+        const preferredState = await getNavPreference(getPreference);
+        setNavOpen(preferredState);
+      };
+      void setNavFromPreferences();
+    }
+  }, [largeBreak, getPreference, setNavOpen]);
+  // TODO: on smaller screens where the nav is a modal
+  // close the nav when the user navigates away
+  // on open and close, lock the body scroll
+  // do not do this on desktop, the sidebar is not a modal
   useEffect(() => {
     if (navRef.current) {
       if (navOpen && midBreak) {
@@ -85,39 +68,26 @@ export const NavProvider = t0 => {
         enableBodyScroll(navRef.current);
       }
     }
-  }, t4);
-  let t5;
-  let t6;
-  if ($[7] !== largeBreak || $[8] !== midBreak || $[9] !== smallBreak) {
-    t5 = () => {
-      if (largeBreak === true || midBreak === true || smallBreak === true) {
-        setNavOpen(false);
-      }
-      setHydrated(true);
-      setTimeout(() => {
-        setShouldAnimate(true);
-      }, 100);
+  }, [navOpen, midBreak]);
+  // on smaller screens where the nav is a modal
+  // close the nav when the user resizes down to mobile
+  // the sidebar is a modal on mobile
+  useEffect(() => {
+    if (largeBreak === true || midBreak === true || smallBreak === true) {
+      setNavOpen(false);
+    }
+    setHydrated(true);
+    setTimeout(() => {
+      setShouldAnimate(true);
+    }, 100);
+  }, [largeBreak, midBreak, smallBreak]);
+  // when the component unmounts, clear all body scroll locks
+  useEffect(() => {
+    return () => {
+      clearAllBodyScrollLocks();
     };
-    t6 = [largeBreak, midBreak, smallBreak];
-    $[7] = largeBreak;
-    $[8] = midBreak;
-    $[9] = smallBreak;
-    $[10] = t5;
-    $[11] = t6;
-  } else {
-    t5 = $[10];
-    t6 = $[11];
-  }
-  useEffect(t5, t6);
-  let t7;
-  if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
-    t7 = [];
-    $[12] = t7;
-  } else {
-    t7 = $[12];
-  }
-  useEffect(_temp2, t7);
-  return _jsx(NavContext.Provider, {
+  }, []);
+  return /*#__PURE__*/_jsx(NavContext.Provider, {
     value: {
       hydrated,
       navOpen,
@@ -125,13 +95,7 @@ export const NavProvider = t0 => {
       setNavOpen,
       shouldAnimate
     },
-    children
+    children: children
   });
 };
-function _temp() {
-  clearAllBodyScrollLocks();
-}
-function _temp2() {
-  return _temp;
-}
 //# sourceMappingURL=context.js.map

package/dist/elements/Nav/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":["c","_c","useWindowInfo","clearAllBodyScrollLocks","disableBodyScroll","enableBodyScroll","React","useEffect","useRef","usePreferences","NavContext","createContext","hydrated","navOpen","navRef","setNavOpen","shouldAnimate","useNav","useContext","getNavPreference","getPreference","navPrefs","preferredState","open","NavProvider","t0","$","children","initialIsOpen","breakpoints","t1","l","largeBreak","m","midBreak","s","smallBreak","useState","setShouldAnimate","setHydrated","t2","t3","setNavFromPreferences","t4","current","t5","t6","setTimeout","t7","Symbol","for","_temp2","_jsx","Provider","value","_temp"],"sources":["../../../src/elements/Nav/context.tsx"],"sourcesContent":["'use client'\nimport { useWindowInfo } from '@faceless-ui/window-info'\nimport { clearAllBodyScrollLocks, disableBodyScroll, enableBodyScroll } from 'body-scroll-lock'\nimport React, { useEffect, useRef } from 'react'\n\nimport { usePreferences } from '../../providers/Preferences/index.js'\n\ntype NavContextType = {\n  hydrated: boolean\n  navOpen: boolean\n  navRef: React.RefObject<HTMLDivElement | null>\n  setNavOpen: (value: boolean) => void\n  shouldAnimate: boolean\n}\n\nexport const NavContext = React.createContext<NavContextType>({\n  hydrated: false,\n  navOpen: true,\n  navRef: null,\n  setNavOpen: () => {},\n  shouldAnimate: false,\n})\n\nexport const useNav = () => React.useContext(NavContext)\n\nconst getNavPreference = async (getPreference): Promise<boolean> => {\n  const navPrefs = await getPreference('nav')\n  const preferredState = navPrefs?.open\n  if (typeof preferredState === 'boolean') {\n    return preferredState\n  } else {\n    return true\n  }\n}\n\nexport const NavProvider: React.FC<{\n  children: React.ReactNode\n  initialIsOpen?: boolean\n}> = ({ children, initialIsOpen }) => {\n  const {\n    breakpoints: { l: largeBreak, m: midBreak, s: smallBreak },\n  } = useWindowInfo()\n\n  const { getPreference } = usePreferences()\n  const navRef = useRef(null)\n\n  // initialize the nav to be closed\n  // this is because getting the preference is async\n  // so instead of closing it after the preference is loaded\n  // we will open it after the preference is loaded\n  const [navOpen, setNavOpen] = React.useState(initialIsOpen)\n\n  const [shouldAnimate, setShouldAnimate] = React.useState(false)\n  const [hydrated, setHydrated] = React.useState(false)\n\n  // on load check the user's preference and set \"initial\" state\n  useEffect(() => {\n    if (largeBreak === false) {\n      const setNavFromPreferences = async () => {\n        const preferredState = await getNavPreference(getPreference)\n        setNavOpen(preferredState)\n      }\n\n      void setNavFromPreferences()\n    }\n  }, [largeBreak, getPreference, setNavOpen])\n\n  // TODO: on smaller screens where the nav is a modal\n  // close the nav when the user navigates away\n\n  // on open and close, lock the body scroll\n  // do not do this on desktop, the sidebar is not a modal\n  useEffect(() => {\n    if (navRef.current) {\n      if (navOpen && midBreak) {\n        disableBodyScroll(navRef.current)\n      } else {\n        enableBodyScroll(navRef.current)\n      }\n    }\n  }, [navOpen, midBreak])\n\n  // on smaller screens where the nav is a modal\n  // close the nav when the user resizes down to mobile\n  // the sidebar is a modal on mobile\n  useEffect(() => {\n    if (largeBreak === true || midBreak === true || smallBreak === true) {\n      setNavOpen(false)\n    }\n    setHydrated(true)\n\n    setTimeout(() => {\n      setShouldAnimate(true)\n    }, 100)\n  }, [largeBreak, midBreak, smallBreak])\n\n  // when the component unmounts, clear all body scroll locks\n  useEffect(() => {\n    return () => {\n      clearAllBodyScrollLocks()\n    }\n  }, [])\n\n  return (\n    <NavContext.Provider value={{ hydrated, navOpen, navRef, setNavOpen, shouldAnimate }}>\n      {children}\n    </NavContext.Provider>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,SAASC,aAAa,QAAQ;AAC9B,SAASC,uBAAuB,EAAEC,iBAAiB,EAAEC,gBAAgB,QAAQ;AAC7E,OAAOC,KAAA,IAASC,SAAS,EAAEC,MAAM,QAAQ;AAEzC,SAASC,cAAc,QAAQ;AAU/B,OAAO,MAAMC,UAAA,gBAAaJ,KAAA,CAAMK,aAAa,CAAiB;EAC5DC,QAAA,EAAU;EACVC,OAAA,EAAS;EACTC,MAAA,EAAQ;EACRC,UAAA,EAAYA,CAAA,MAAO;EACnBC,aAAA,EAAe;AACjB;AAEA,OAAO,MAAMC,MAAA,GAASA,CAAA;EAAA,OAAMX,KAAA,CAAAY,UAAA,CAAAR,UAAiB;AAAA;AAE7C,MAAMS,gBAAA,GAAmB,MAAOC,aAAA;EAC9B,MAAMC,QAAA,GAAW,MAAMD,aAAA,CAAc;EACrC,MAAME,cAAA,GAAiBD,QAAA,EAAUE,IAAA;EACjC,IAAI,OAAOD,cAAA,KAAmB,WAAW;IACvC,OAAOA,cAAA;EACT,OAAO;IACL,OAAO;EACT;AACF;AAEA,OAAO,MAAME,WAAA,GAGRC,EAAA;EAAA,MAAAC,CAAA,GAAAzB,EAAA;EAAC;IAAA0B,QAAA;IAAAC;EAAA,IAAAH,EAA2B;EAC/B;IAAAI,WAAA,EAAAC;EAAA,IAEI5B,aAAA;EADW;IAAA6B,CAAA,EAAAC,UAAA;IAAAC,CAAA,EAAAC,QAAA;IAAAC,CAAA,EAAAC;EAAA,IAAAN,EAA6C;EAG5D;IAAAV;EAAA,IAA0BX,cAAA;EAC1B,MAAAK,MAAA,GAAeN,MAAA,KAAO;EAMtB,OAAAK,OAAA,EAAAE,UAAA,IAA8BT,KAAA,CAAA+B,QAAA,CAAeT,aAAA;EAE7C,OAAAZ,aAAA,EAAAsB,gBAAA,IAA0ChC,KAAA,CAAA+B,QAAA,MAAe;EACzD,OAAAzB,QAAA,EAAA2B,WAAA,IAAgCjC,KAAA,CAAA+B,QAAA,MAAe;EAAA,IAAAG,EAAA;EAAA,IAAAC,EAAA;EAAA,IAAAf,CAAA,QAAAM,UAAA,IAAAN,CAAA,QAAAN,aAAA;IAGrCoB,EAAA,GAAAA,CAAA;MAAA,IACJR,UAAA,UAAe;QACjB,MAAAU,qBAAA,SAAAA,CAAA;UACE,MAAApB,cAAA,SAA6BH,gBAAA,CAAiBC,aAAA;UAC9CL,UAAA,CAAWO,cAAA;QAAA;QAGRoB,qBAAA;MAAA;IAAA;IAEND,EAAA,IAACT,UAAA,EAAYZ,aAAA,EAAeL,UAAA;IAAWW,CAAA,MAAAM,UAAA;IAAAN,CAAA,MAAAN,aAAA;IAAAM,CAAA,MAAAc,EAAA;IAAAd,CAAA,MAAAe,EAAA;EAAA;IAAAD,EAAA,GAAAd,CAAA;IAAAe,EAAA,GAAAf,CAAA;EAAA;EAT1CnB,SAAA,CAAUiC,EASV,EAAGC,EAAuC;EAAA,IAAAE,EAAA;EAAA,IAAAjB,CAAA,QAAAb,OAAA,IAAAa,CAAA,QAAAQ,QAAA;IAevCS,EAAA,IAAC9B,OAAA,EAASqB,QAAA;IAASR,CAAA,MAAAb,OAAA;IAAAa,CAAA,MAAAQ,QAAA;IAAAR,CAAA,MAAAiB,EAAA;EAAA;IAAAA,EAAA,GAAAjB,CAAA;EAAA;EARtBnB,SAAA;IAAA,IACMO,MAAA,CAAA8B,OAAA;MAAA,IACE/B,OAAA,IAAWqB,QAAA;QACb9B,iBAAA,CAAkBU,MAAA,CAAA8B,OAAc;MAAA;QAEhCvC,gBAAA,CAAiBS,MAAA,CAAA8B,OAAc;MAAA;IAAA;EAAA,GAGlCD,EAAmB;EAAA,IAAAE,EAAA;EAAA,IAAAC,EAAA;EAAA,IAAApB,CAAA,QAAAM,UAAA,IAAAN,CAAA,QAAAQ,QAAA,IAAAR,CAAA,QAAAU,UAAA;IAKZS,EAAA,GAAAA,CAAA;MAAA,IACJb,UAAA,SAAe,IAAQE,QAAA,SAAa,IAAQE,UAAA,SAAe;QAC7DrB,UAAA,MAAW;MAAA;MAEbwB,WAAA,KAAY;MAEZQ,UAAA;QACET,gBAAA,KAAiB;MAAA,MAChB;IAAA;IACFQ,EAAA,IAACd,UAAA,EAAYE,QAAA,EAAUE,UAAA;IAAWV,CAAA,MAAAM,UAAA;IAAAN,CAAA,MAAAQ,QAAA;IAAAR,CAAA,MAAAU,UAAA;IAAAV,CAAA,OAAAmB,EAAA;IAAAnB,CAAA,OAAAoB,EAAA;EAAA;IAAAD,EAAA,GAAAnB,CAAA;IAAAoB,EAAA,GAAApB,CAAA;EAAA;EATrCnB,SAAA,CAAUsC,EASV,EAAGC,EAAkC;EAAA,IAAAE,EAAA;EAAA,IAAAtB,CAAA,SAAAuB,MAAA,CAAAC,GAAA;IAOlCF,EAAA;IAAEtB,CAAA,OAAAsB,EAAA;EAAA;IAAAA,EAAA,GAAAtB,CAAA;EAAA;EAJLnB,SAAA,CAAA4C,MAAA,EAIGH,EAAE;EAAA,OAGHI,IAAA,CAAA1C,UAAA,CAAA2C,QAAA;IAAAC,KAAA;MAAA1C,QAAA;MAAAC,OAAA;MAAAC,MAAA;MAAAC,UAAA;MAAAC;IAAA;IAAAW;EAAA,C;CAIJ;AAtEK,SAAA4B,MAAA;EA6DCpD,uBAAA;AAAA;AA7DD,SAAAgD,OAAA;EAAA,OAAAI,KAAA;AAAA","ignoreList":[]}
+{"version":3,"file":"context.js","names":["useWindowInfo","clearAllBodyScrollLocks","disableBodyScroll","enableBodyScroll","React","useEffect","useRef","usePreferences","NavContext","createContext","hydrated","navOpen","navRef","setNavOpen","shouldAnimate","useNav","useContext","getNavPreference","getPreference","navPrefs","preferredState","open","NavProvider","children","initialIsOpen","breakpoints","l","largeBreak","m","midBreak","s","smallBreak","useState","setShouldAnimate","setHydrated","setNavFromPreferences","current","setTimeout","_jsx","Provider","value"],"sources":["../../../src/elements/Nav/context.tsx"],"sourcesContent":["'use client'\nimport { useWindowInfo } from '@faceless-ui/window-info'\nimport { clearAllBodyScrollLocks, disableBodyScroll, enableBodyScroll } from 'body-scroll-lock'\nimport React, { useEffect, useRef } from 'react'\n\nimport { usePreferences } from '../../providers/Preferences/index.js'\n\ntype NavContextType = {\n  hydrated: boolean\n  navOpen: boolean\n  navRef: React.RefObject<HTMLDivElement | null>\n  setNavOpen: (value: boolean) => void\n  shouldAnimate: boolean\n}\n\nexport const NavContext = React.createContext<NavContextType>({\n  hydrated: false,\n  navOpen: true,\n  navRef: null,\n  setNavOpen: () => {},\n  shouldAnimate: false,\n})\n\nexport const useNav = () => React.useContext(NavContext)\n\nconst getNavPreference = async (getPreference): Promise<boolean> => {\n  const navPrefs = await getPreference('nav')\n  const preferredState = navPrefs?.open\n  if (typeof preferredState === 'boolean') {\n    return preferredState\n  } else {\n    return true\n  }\n}\n\nexport const NavProvider: React.FC<{\n  children: React.ReactNode\n  initialIsOpen?: boolean\n}> = ({ children, initialIsOpen }) => {\n  const {\n    breakpoints: { l: largeBreak, m: midBreak, s: smallBreak },\n  } = useWindowInfo()\n\n  const { getPreference } = usePreferences()\n  const navRef = useRef(null)\n\n  // initialize the nav to be closed\n  // this is because getting the preference is async\n  // so instead of closing it after the preference is loaded\n  // we will open it after the preference is loaded\n  const [navOpen, setNavOpen] = React.useState(initialIsOpen)\n\n  const [shouldAnimate, setShouldAnimate] = React.useState(false)\n  const [hydrated, setHydrated] = React.useState(false)\n\n  // on load check the user's preference and set \"initial\" state\n  useEffect(() => {\n    if (largeBreak === false) {\n      const setNavFromPreferences = async () => {\n        const preferredState = await getNavPreference(getPreference)\n        setNavOpen(preferredState)\n      }\n\n      void setNavFromPreferences()\n    }\n  }, [largeBreak, getPreference, setNavOpen])\n\n  // TODO: on smaller screens where the nav is a modal\n  // close the nav when the user navigates away\n\n  // on open and close, lock the body scroll\n  // do not do this on desktop, the sidebar is not a modal\n  useEffect(() => {\n    if (navRef.current) {\n      if (navOpen && midBreak) {\n        disableBodyScroll(navRef.current)\n      } else {\n        enableBodyScroll(navRef.current)\n      }\n    }\n  }, [navOpen, midBreak])\n\n  // on smaller screens where the nav is a modal\n  // close the nav when the user resizes down to mobile\n  // the sidebar is a modal on mobile\n  useEffect(() => {\n    if (largeBreak === true || midBreak === true || smallBreak === true) {\n      setNavOpen(false)\n    }\n    setHydrated(true)\n\n    setTimeout(() => {\n      setShouldAnimate(true)\n    }, 100)\n  }, [largeBreak, midBreak, smallBreak])\n\n  // when the component unmounts, clear all body scroll locks\n  useEffect(() => {\n    return () => {\n      clearAllBodyScrollLocks()\n    }\n  }, [])\n\n  return (\n    <NavContext.Provider value={{ hydrated, navOpen, navRef, setNavOpen, shouldAnimate }}>\n      {children}\n    </NavContext.Provider>\n  )\n}\n"],"mappings":"AAAA;;;AACA,SAASA,aAAa,QAAQ;AAC9B,SAASC,uBAAuB,EAAEC,iBAAiB,EAAEC,gBAAgB,QAAQ;AAC7E,OAAOC,KAAA,IAASC,SAAS,EAAEC,MAAM,QAAQ;AAEzC,SAASC,cAAc,QAAQ;AAU/B,OAAO,MAAMC,UAAA,gBAAaJ,KAAA,CAAMK,aAAa,CAAiB;EAC5DC,QAAA,EAAU;EACVC,OAAA,EAAS;EACTC,MAAA,EAAQ;EACRC,UAAA,EAAYA,CAAA,MAAO;EACnBC,aAAA,EAAe;AACjB;AAEA,OAAO,MAAMC,MAAA,GAASA,CAAA;EAAA,OAAMX,KAAA,CAAAY,UAAA,CAAAR,UAAiB;AAAA;AAE7C,MAAMS,gBAAA,GAAmB,MAAOC,aAAA;EAC9B,MAAMC,QAAA,GAAW,MAAMD,aAAA,CAAc;EACrC,MAAME,cAAA,GAAiBD,QAAA,EAAUE,IAAA;EACjC,IAAI,OAAOD,cAAA,KAAmB,WAAW;IACvC,OAAOA,cAAA;EACT,OAAO;IACL,OAAO;EACT;AACF;AAEA,OAAO,MAAME,WAAA,GAGRA,CAAC;EAAEC,QAAQ;EAAEC;AAAa,CAAE;EAC/B,MAAM;IACJC,WAAA,EAAa;MAAEC,CAAA,EAAGC,UAAU;MAAEC,CAAA,EAAGC,QAAQ;MAAEC,CAAA,EAAGC;IAAU;EAAE,CAC3D,GAAG/B,aAAA;EAEJ,MAAM;IAAEkB;EAAa,CAAE,GAAGX,cAAA;EAC1B,MAAMK,MAAA,GAASN,MAAA,CAAO;EAEtB;EACA;EACA;EACA;EACA,MAAM,CAACK,OAAA,EAASE,UAAA,CAAW,GAAGT,KAAA,CAAM4B,QAAQ,CAACR,aAAA;EAE7C,MAAM,CAACV,aAAA,EAAemB,gBAAA,CAAiB,GAAG7B,KAAA,CAAM4B,QAAQ,CAAC;EACzD,MAAM,CAACtB,QAAA,EAAUwB,WAAA,CAAY,GAAG9B,KAAA,CAAM4B,QAAQ,CAAC;EAE/C;EACA3B,SAAA,CAAU;IACR,IAAIsB,UAAA,KAAe,OAAO;MACxB,MAAMQ,qBAAA,GAAwB,MAAAA,CAAA;QAC5B,MAAMf,cAAA,GAAiB,MAAMH,gBAAA,CAAiBC,aAAA;QAC9CL,UAAA,CAAWO,cAAA;MACb;MAEA,KAAKe,qBAAA;IACP;EACF,GAAG,CAACR,UAAA,EAAYT,aAAA,EAAeL,UAAA,CAAW;EAE1C;EACA;EAEA;EACA;EACAR,SAAA,CAAU;IACR,IAAIO,MAAA,CAAOwB,OAAO,EAAE;MAClB,IAAIzB,OAAA,IAAWkB,QAAA,EAAU;QACvB3B,iBAAA,CAAkBU,MAAA,CAAOwB,OAAO;MAClC,OAAO;QACLjC,gBAAA,CAAiBS,MAAA,CAAOwB,OAAO;MACjC;IACF;EACF,GAAG,CAACzB,OAAA,EAASkB,QAAA,CAAS;EAEtB;EACA;EACA;EACAxB,SAAA,CAAU;IACR,IAAIsB,UAAA,KAAe,QAAQE,QAAA,KAAa,QAAQE,UAAA,KAAe,MAAM;MACnElB,UAAA,CAAW;IACb;IACAqB,WAAA,CAAY;IAEZG,UAAA,CAAW;MACTJ,gBAAA,CAAiB;IACnB,GAAG;EACL,GAAG,CAACN,UAAA,EAAYE,QAAA,EAAUE,UAAA,CAAW;EAErC;EACA1B,SAAA,CAAU;IACR,OAAO;MACLJ,uBAAA;IACF;EACF,GAAG,EAAE;EAEL,oBACEqC,IAAA,CAAC9B,UAAA,CAAW+B,QAAQ;IAACC,KAAA,EAAO;MAAE9B,QAAA;MAAUC,OAAA;MAASC,MAAA;MAAQC,UAAA;MAAYC;IAAc;cAChFS;;AAGP","ignoreList":[]}