@payloadcms/ui 4.0.0-internal.1f9ae9a → 4.0.0-internal.293e026

package/dist/elements/EmailAndUsername/index.js

@@ -5,8 +5,8 @@ import { email, getFieldPermissions, username } from 'payload/shared';
 import React from 'react';
 import { EmailField } from '../../fields/Email/index.js';
 import { TextField } from '../../fields/Text/index.js';
-import './index.scss';
 import { FieldPathContext } from '../../forms/RenderFields/context.js';
+import './index.css';
 const baseClass = 'login-fields';
 export function EmailAndUsernameFields(props) {
   const {

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["email","getFieldPermissions","username","React","EmailField","TextField","FieldPathContext","baseClass","EmailAndUsernameFields","props","className","loginWithUsername","operation","operationFromProps","permissions","readOnly","t","getAuthFieldPermission","fieldName","permissionsResult","field","name","type","parentName","hasEmailFieldOverride","hasUsernameFieldOverride","emailPermissions","read","update","usernamePermissions","showEmailField","requireEmail","allowEmailLogin","showUsernameField","Boolean","_jsxs","filter","join","_jsx","value","admin","autoComplete","label","required","path","schemaPath","validate","requireUsername"],"sources":["../../../src/elements/EmailAndUsername/index.tsx"],"sourcesContent":["'use client'\n\nimport type { TFunction } from '@payloadcms/translations'\nimport type { LoginWithUsernameOptions, SanitizedFieldPermissions } from 'payload'\n\nimport { email, getFieldPermissions, username } from 'payload/shared'\nimport React from 'react'\n\nimport { EmailField } from '../../fields/Email/index.js'\nimport { TextField } from '../../fields/Text/index.js'\nimport './index.scss'\nimport { FieldPathContext } from '../../forms/RenderFields/context.js'\n\nconst baseClass = 'login-fields'\ntype RenderEmailAndUsernameFieldsProps = {\n  className?: string\n  loginWithUsername?: false | LoginWithUsernameOptions\n  operation?: 'create' | 'update'\n  permissions?:\n    | {\n        [fieldName: string]: SanitizedFieldPermissions\n      }\n    | true\n  readOnly: boolean\n  t: TFunction\n}\n\nexport function EmailAndUsernameFields(props: RenderEmailAndUsernameFieldsProps) {\n  const {\n    className,\n    loginWithUsername,\n    operation: operationFromProps,\n    permissions,\n    readOnly,\n    t,\n  } = props\n\n  function getAuthFieldPermission(fieldName: string, operation: 'read' | 'update') {\n    const permissionsResult = getFieldPermissions({\n      field: { name: fieldName, type: 'text' },\n      operation: operationFromProps === 'create' ? 'create' : operation,\n      parentName: '',\n      permissions,\n    })\n    return permissionsResult.operation\n  }\n\n  const hasEmailFieldOverride =\n    typeof permissions === 'object' && 'email' in permissions && permissions.email\n  const hasUsernameFieldOverride =\n    typeof permissions === 'object' && 'username' in permissions && permissions.username\n\n  const emailPermissions = hasEmailFieldOverride\n    ? {\n        read: getAuthFieldPermission('email', 'read'),\n        update: getAuthFieldPermission('email', 'update'),\n      }\n    : {\n        read: true,\n        update: true,\n      }\n\n  const usernamePermissions = hasUsernameFieldOverride\n    ? {\n        read: getAuthFieldPermission('username', 'read'),\n        update: getAuthFieldPermission('username', 'update'),\n      }\n    : {\n        read: true,\n        update: true,\n      }\n\n  const showEmailField =\n    (!loginWithUsername || loginWithUsername?.requireEmail || loginWithUsername?.allowEmailLogin) &&\n    emailPermissions.read\n\n  const showUsernameField = Boolean(loginWithUsername) && usernamePermissions.read\n\n  if (showEmailField || showUsernameField) {\n    return (\n      <div className={[baseClass, className && className].filter(Boolean).join(' ')}>\n        {showEmailField ? (\n          <FieldPathContext value=\"email\">\n            <EmailField\n              field={{\n                name: 'email',\n                admin: {\n                  autoComplete: 'off',\n                },\n                label: t('general:email'),\n                required:\n                  !loginWithUsername || (loginWithUsername && loginWithUsername.requireEmail),\n              }}\n              path=\"email\"\n              readOnly={readOnly || !emailPermissions.update}\n              schemaPath=\"email\"\n              validate={email}\n            />\n          </FieldPathContext>\n        ) : null}\n        {showUsernameField && (\n          <FieldPathContext value=\"username\">\n            <TextField\n              field={{\n                name: 'username',\n                admin: {\n                  autoComplete: 'off',\n                },\n                label: t('authentication:username'),\n                required: loginWithUsername && loginWithUsername.requireUsername,\n              }}\n              path=\"username\"\n              readOnly={readOnly || !usernamePermissions.update}\n              schemaPath=\"username\"\n              validate={username}\n            />\n          </FieldPathContext>\n        )}\n      </div>\n    )\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["email","getFieldPermissions","username","React","EmailField","TextField","FieldPathContext","baseClass","EmailAndUsernameFields","props","className","loginWithUsername","operation","operationFromProps","permissions","readOnly","t","getAuthFieldPermission","fieldName","permissionsResult","field","name","type","parentName","hasEmailFieldOverride","hasUsernameFieldOverride","emailPermissions","read","update","usernamePermissions","showEmailField","requireEmail","allowEmailLogin","showUsernameField","Boolean","_jsxs","filter","join","_jsx","value","admin","autoComplete","label","required","path","schemaPath","validate","requireUsername"],"sources":["../../../src/elements/EmailAndUsername/index.tsx"],"sourcesContent":["'use client'\n\nimport type { TFunction } from '@payloadcms/translations'\nimport type { LoginWithUsernameOptions, SanitizedFieldPermissions } from 'payload'\n\nimport { email, getFieldPermissions, username } from 'payload/shared'\nimport React from 'react'\n\nimport { EmailField } from '../../fields/Email/index.js'\nimport { TextField } from '../../fields/Text/index.js'\nimport { FieldPathContext } from '../../forms/RenderFields/context.js'\nimport './index.css'\n\nconst baseClass = 'login-fields'\ntype RenderEmailAndUsernameFieldsProps = {\n  className?: string\n  loginWithUsername?: false | LoginWithUsernameOptions\n  operation?: 'create' | 'update'\n  permissions?:\n    | {\n        [fieldName: string]: SanitizedFieldPermissions\n      }\n    | true\n  readOnly: boolean\n  t: TFunction\n}\n\nexport function EmailAndUsernameFields(props: RenderEmailAndUsernameFieldsProps) {\n  const {\n    className,\n    loginWithUsername,\n    operation: operationFromProps,\n    permissions,\n    readOnly,\n    t,\n  } = props\n\n  function getAuthFieldPermission(fieldName: string, operation: 'read' | 'update') {\n    const permissionsResult = getFieldPermissions({\n      field: { name: fieldName, type: 'text' },\n      operation: operationFromProps === 'create' ? 'create' : operation,\n      parentName: '',\n      permissions,\n    })\n    return permissionsResult.operation\n  }\n\n  const hasEmailFieldOverride =\n    typeof permissions === 'object' && 'email' in permissions && permissions.email\n  const hasUsernameFieldOverride =\n    typeof permissions === 'object' && 'username' in permissions && permissions.username\n\n  const emailPermissions = hasEmailFieldOverride\n    ? {\n        read: getAuthFieldPermission('email', 'read'),\n        update: getAuthFieldPermission('email', 'update'),\n      }\n    : {\n        read: true,\n        update: true,\n      }\n\n  const usernamePermissions = hasUsernameFieldOverride\n    ? {\n        read: getAuthFieldPermission('username', 'read'),\n        update: getAuthFieldPermission('username', 'update'),\n      }\n    : {\n        read: true,\n        update: true,\n      }\n\n  const showEmailField =\n    (!loginWithUsername || loginWithUsername?.requireEmail || loginWithUsername?.allowEmailLogin) &&\n    emailPermissions.read\n\n  const showUsernameField = Boolean(loginWithUsername) && usernamePermissions.read\n\n  if (showEmailField || showUsernameField) {\n    return (\n      <div className={[baseClass, className && className].filter(Boolean).join(' ')}>\n        {showEmailField ? (\n          <FieldPathContext value=\"email\">\n            <EmailField\n              field={{\n                name: 'email',\n                admin: {\n                  autoComplete: 'off',\n                },\n                label: t('general:email'),\n                required:\n                  !loginWithUsername || (loginWithUsername && loginWithUsername.requireEmail),\n              }}\n              path=\"email\"\n              readOnly={readOnly || !emailPermissions.update}\n              schemaPath=\"email\"\n              validate={email}\n            />\n          </FieldPathContext>\n        ) : null}\n        {showUsernameField && (\n          <FieldPathContext value=\"username\">\n            <TextField\n              field={{\n                name: 'username',\n                admin: {\n                  autoComplete: 'off',\n                },\n                label: t('authentication:username'),\n                required: loginWithUsername && loginWithUsername.requireUsername,\n              }}\n              path=\"username\"\n              readOnly={readOnly || !usernamePermissions.update}\n              schemaPath=\"username\"\n              validate={username}\n            />\n          </FieldPathContext>\n        )}\n      </div>\n    )\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/GroupByControl/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/GroupByControl/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAS,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAG5E,OAAO,KAAuC,MAAM,OAAO,CAAA;AAY3D,OAAO,aAAa,CAAA;AAEpB,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,CAAC,cAAc,EAAE,yBAAyB,CAAC,MAAM,CAAC,CAAA;IAC1D,QAAQ,CAAC,MAAM,EAAE,WAAW,EAAE,CAAA;CAC/B,CAAA;AAoBD,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAqPxD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/GroupByControl/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAS,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAG5E,OAAO,KAAuC,MAAM,OAAO,CAAA;AAY3D,OAAO,aAAa,CAAA;AAEpB,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,CAAC,cAAc,EAAE,yBAAyB,CAAC,MAAM,CAAC,CAAA;IAC1D,QAAQ,CAAC,MAAM,EAAE,WAAW,EAAE,CAAA;CAC/B,CAAA;AAoBD,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAyPxD,CAAA"}

package/dist/elements/GroupByControl/index.js

@@ -75,6 +75,9 @@ export const GroupByControl = ({
       });
     })();
   }, [groupByFieldName, listQuery]);
+  if (filteredFields.length === 0) {
+    return null;
+  }
   const directionValue = !groupByRaw || typeof groupByRaw !== 'string' ? 'asc' : groupByRaw.startsWith('-') ? 'desc' : 'asc';
   // Build the trigger button label
   const triggerLabel = isActive ? t('general:groupByLabel', {

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["isFieldDisabled","React","useCallback","useMemo","useRef","CheckIcon","ChevronIcon","TrashIcon","XIcon","useAuth","useListQuery","useTranslation","reduceFieldsToOptions","Button","Popup","PopupList","baseClass","supportedFieldTypes","GroupByControl","collectionSlug","fields","i18n","t","permissions","listQuery","closeRef","groupByRaw","query","groupBy","groupByFieldName","replace","fieldPermissions","collections","reducedFields","filteredFields","filter","field","fieldPath","includes","type","groupByField","find","isActive","Boolean","handleFieldSelect","value","refineListData","startsWith","page","handleClear","current","handleDirectionSelect","directionValue","triggerLabel","label","_jsx","className","horizontalAlign","portalClassName","render","close","_jsxs","buttonStyle","icon","onClick","round","size","closeFieldPopup","ButtonGroup","map","i","active","undefined","renderButton","onKeyDown","direction","verticalAlign","disabled","closeSortPopup","RadioGroup","RadioGroupItem","join","ariaProps","extraButtonProps","id","selected","theme"],"sources":["../../../src/elements/GroupByControl/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientField, Field, SanitizedCollectionConfig } from 'payload'\n\nimport { isFieldDisabled } from 'payload/shared'\nimport React, { useCallback, useMemo, useRef } from 'react'\n\nimport { CheckIcon } from '../../icons/Check/index.js'\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { TrashIcon } from '../../icons/Trash/index.js'\nimport { XIcon } from '../../icons/X/index.js'\nimport { useAuth } from '../../providers/Auth/index.js'\nimport { useListQuery } from '../../providers/ListQuery/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { reduceFieldsToOptions } from '../../utilities/reduceFieldsToOptions.js'\nimport { Button } from '../Button/index.js'\nimport { Popup, PopupList } from '../Popup/index.js'\nimport './index.css'\n\nexport type GroupByControlProps = {\n  readonly collectionSlug: SanitizedCollectionConfig['slug']\n  readonly fields: ClientField[]\n}\n\nconst baseClass = 'group-by-control'\n\n/**\n * Supported field types for group by functionality.\n */\nconst supportedFieldTypes: Field['type'][] = [\n  'text',\n  'textarea',\n  'number',\n  'select',\n  'relationship',\n  'date',\n  'checkbox',\n  'radio',\n  'email',\n  'upload',\n]\n\nexport const GroupByControl: React.FC<GroupByControlProps> = ({ collectionSlug, fields }) => {\n  const { i18n, t } = useTranslation()\n  const { permissions } = useAuth()\n  const listQuery = useListQuery()\n  const closeRef = useRef<(() => void) | null>(null)\n\n  const groupByRaw = listQuery.query?.groupBy\n  const groupByFieldName = groupByRaw?.replace(/^-/, '')\n\n  const fieldPermissions = permissions?.collections?.[collectionSlug]?.fields\n\n  const reducedFields = useMemo(\n    () =>\n      reduceFieldsToOptions({\n        fieldPermissions,\n        fields,\n        i18n,\n      }),\n    [fields, fieldPermissions, i18n],\n  )\n\n  const filteredFields = useMemo(\n    () =>\n      reducedFields.filter(\n        (field) =>\n          !isFieldDisabled(field.field, 'groupBy') &&\n          field.fieldPath !== 'id' &&\n          supportedFieldTypes.includes(field.field.type),\n      ),\n    [reducedFields],\n  )\n\n  const groupByField = reducedFields.find((field) => field.fieldPath === groupByFieldName)\n  const isActive = Boolean(groupByFieldName && groupByField)\n\n  const handleFieldSelect = useCallback(\n    (value: string) => {\n      void (async () => {\n        if (typeof listQuery.refineListData !== 'function') {\n          return\n        }\n        await listQuery.refineListData({\n          groupBy: listQuery.query?.groupBy?.startsWith('-') ? `-${value}` : value,\n          page: 1,\n        })\n      })()\n    },\n    [listQuery],\n  )\n\n  const handleClear = useCallback(() => {\n    void (async () => {\n      if (typeof listQuery.refineListData === 'function') {\n        await listQuery.refineListData({ groupBy: '' })\n      }\n      closeRef.current?.()\n    })()\n  }, [listQuery])\n\n  const handleDirectionSelect = useCallback(\n    (value: 'asc' | 'desc') => {\n      void (async () => {\n        if (!groupByFieldName || typeof listQuery.refineListData !== 'function') {\n          return\n        }\n        await listQuery.refineListData({\n          groupBy: value === 'asc' ? groupByFieldName : `-${groupByFieldName}`,\n          page: 1,\n        })\n      })()\n    },\n    [groupByFieldName, listQuery],\n  )\n\n  const directionValue =\n    !groupByRaw || typeof groupByRaw !== 'string'\n      ? 'asc'\n      : groupByRaw.startsWith('-')\n        ? 'desc'\n        : 'asc'\n\n  // Build the trigger button label\n  const triggerLabel = isActive\n    ? t('general:groupByLabel', { label: groupByField?.label || '' })\n    : t('general:groupByLabel', { label: '' })\n\n  return (\n    <Popup\n      className={baseClass}\n      horizontalAlign=\"right\"\n      portalClassName={`${baseClass}__popup`}\n      render={({ close }) => {\n        closeRef.current = close\n        return (\n          <div className={`${baseClass}__content`}>\n            <div className={`${baseClass}__header`}>\n              <span className={`${baseClass}__title`}>\n                {t('general:groupByLabel', { label: '' })}\n              </span>\n              <div className={`${baseClass}__header-actions`}>\n                {isActive && (\n                  <Button\n                    aria-label={t('general:clear')}\n                    buttonStyle=\"ghost\"\n                    icon={<TrashIcon />}\n                    onClick={handleClear}\n                    round\n                    size=\"medium\"\n                  />\n                )}\n                <Button\n                  aria-label={t('general:close')}\n                  buttonStyle=\"ghost\"\n                  icon={<XIcon size={24} />}\n                  onClick={close}\n                  round\n                  size=\"medium\"\n                />\n              </div>\n            </div>\n            <div className={`${baseClass}__body`}>\n              <div className={`${baseClass}__row`}>\n                <label className={`${baseClass}__label`}>{t('general:field')}</label>\n                <div className={`${baseClass}__input`} data-popup-prevent-close>\n                  <Popup\n                    className={`${baseClass}__select-popup`}\n                    horizontalAlign=\"right\"\n                    render={({ close: closeFieldPopup }) => (\n                      <PopupList.ButtonGroup>\n                        {filteredFields.map((field, i) => (\n                          <PopupList.Button\n                            active={field.fieldPath === groupByFieldName}\n                            icon={\n                              field.fieldPath === groupByFieldName ? (\n                                <CheckIcon size={16} />\n                              ) : undefined\n                            }\n                            key={i}\n                            onClick={() => {\n                              handleFieldSelect(field.fieldPath)\n                              closeFieldPopup()\n                            }}\n                          >\n                            {field.label}\n                          </PopupList.Button>\n                        ))}\n                      </PopupList.ButtonGroup>\n                    )}\n                    renderButton={({ active, onClick, onKeyDown }) => (\n                      <button\n                        className={`${baseClass}__select-trigger`}\n                        onClick={onClick}\n                        onKeyDown={onKeyDown}\n                        type=\"button\"\n                      >\n                        <span className={`${baseClass}__select-value`}>\n                          {groupByField?.label || t('general:selectValue')}\n                        </span>\n                        <ChevronIcon direction={active ? 'up' : 'down'} size={16} />\n                      </button>\n                    )}\n                    size=\"medium\"\n                    verticalAlign=\"bottom\"\n                  />\n                </div>\n              </div>\n              <div className={`${baseClass}__row`}>\n                <label className={`${baseClass}__label`}>{t('general:sort')}</label>\n                <div className={`${baseClass}__input`} data-popup-prevent-close>\n                  <Popup\n                    className={`${baseClass}__select-popup`}\n                    disabled={!groupByFieldName}\n                    horizontalAlign=\"right\"\n                    render={({ close: closeSortPopup }) => (\n                      <PopupList.RadioGroup>\n                        <PopupList.RadioGroupItem\n                          active={directionValue === 'desc'}\n                          onClick={() => {\n                            handleDirectionSelect('desc')\n                            closeSortPopup()\n                          }}\n                        >\n                          {t('general:descending')}\n                        </PopupList.RadioGroupItem>\n                        <PopupList.RadioGroupItem\n                          active={directionValue === 'asc'}\n                          onClick={() => {\n                            handleDirectionSelect('asc')\n                            closeSortPopup()\n                          }}\n                        >\n                          {t('general:ascending')}\n                        </PopupList.RadioGroupItem>\n                      </PopupList.RadioGroup>\n                    )}\n                    renderButton={({ active, onClick, onKeyDown }) => (\n                      <button\n                        className={[\n                          `${baseClass}__select-trigger`,\n                          !groupByFieldName && `${baseClass}__select-trigger--disabled`,\n                        ]\n                          .filter(Boolean)\n                          .join(' ')}\n                        disabled={!groupByFieldName}\n                        onClick={onClick}\n                        onKeyDown={onKeyDown}\n                        type=\"button\"\n                      >\n                        <span className={`${baseClass}__select-value`}>\n                          {directionValue === 'desc'\n                            ? t('general:descending')\n                            : t('general:ascending')}\n                        </span>\n                        <ChevronIcon direction={active ? 'up' : 'down'} size={16} />\n                      </button>\n                    )}\n                    size=\"small\"\n                    verticalAlign=\"bottom\"\n                  />\n                </div>\n              </div>\n            </div>\n          </div>\n        )\n      }}\n      renderButton={({ active, onClick, onKeyDown, ...ariaProps }) => (\n        <Button\n          buttonStyle=\"secondary\"\n          className={`${baseClass}__trigger`}\n          extraButtonProps={{ onKeyDown }}\n          icon={<ChevronIcon direction={active ? 'up' : 'down'} size={16} />}\n          id=\"toggle-group-by\"\n          onClick={onClick}\n          selected={active || isActive}\n          size=\"medium\"\n          {...ariaProps}\n        >\n          {triggerLabel}\n        </Button>\n      )}\n      size=\"large\"\n      theme=\"auto\"\n      verticalAlign=\"bottom\"\n    />\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["isFieldDisabled","React","useCallback","useMemo","useRef","CheckIcon","ChevronIcon","TrashIcon","XIcon","useAuth","useListQuery","useTranslation","reduceFieldsToOptions","Button","Popup","PopupList","baseClass","supportedFieldTypes","GroupByControl","collectionSlug","fields","i18n","t","permissions","listQuery","closeRef","groupByRaw","query","groupBy","groupByFieldName","replace","fieldPermissions","collections","reducedFields","filteredFields","filter","field","fieldPath","includes","type","groupByField","find","isActive","Boolean","handleFieldSelect","value","refineListData","startsWith","page","handleClear","current","handleDirectionSelect","length","directionValue","triggerLabel","label","_jsx","className","horizontalAlign","portalClassName","render","close","_jsxs","buttonStyle","icon","onClick","round","size","closeFieldPopup","ButtonGroup","map","i","active","undefined","renderButton","onKeyDown","direction","verticalAlign","disabled","closeSortPopup","RadioGroup","RadioGroupItem","join","ariaProps","extraButtonProps","id","selected","theme"],"sources":["../../../src/elements/GroupByControl/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientField, Field, SanitizedCollectionConfig } from 'payload'\n\nimport { isFieldDisabled } from 'payload/shared'\nimport React, { useCallback, useMemo, useRef } from 'react'\n\nimport { CheckIcon } from '../../icons/Check/index.js'\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { TrashIcon } from '../../icons/Trash/index.js'\nimport { XIcon } from '../../icons/X/index.js'\nimport { useAuth } from '../../providers/Auth/index.js'\nimport { useListQuery } from '../../providers/ListQuery/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { reduceFieldsToOptions } from '../../utilities/reduceFieldsToOptions.js'\nimport { Button } from '../Button/index.js'\nimport { Popup, PopupList } from '../Popup/index.js'\nimport './index.css'\n\nexport type GroupByControlProps = {\n  readonly collectionSlug: SanitizedCollectionConfig['slug']\n  readonly fields: ClientField[]\n}\n\nconst baseClass = 'group-by-control'\n\n/**\n * Supported field types for group by functionality.\n */\nconst supportedFieldTypes: Field['type'][] = [\n  'text',\n  'textarea',\n  'number',\n  'select',\n  'relationship',\n  'date',\n  'checkbox',\n  'radio',\n  'email',\n  'upload',\n]\n\nexport const GroupByControl: React.FC<GroupByControlProps> = ({ collectionSlug, fields }) => {\n  const { i18n, t } = useTranslation()\n  const { permissions } = useAuth()\n  const listQuery = useListQuery()\n  const closeRef = useRef<(() => void) | null>(null)\n\n  const groupByRaw = listQuery.query?.groupBy\n  const groupByFieldName = groupByRaw?.replace(/^-/, '')\n\n  const fieldPermissions = permissions?.collections?.[collectionSlug]?.fields\n\n  const reducedFields = useMemo(\n    () =>\n      reduceFieldsToOptions({\n        fieldPermissions,\n        fields,\n        i18n,\n      }),\n    [fields, fieldPermissions, i18n],\n  )\n\n  const filteredFields = useMemo(\n    () =>\n      reducedFields.filter(\n        (field) =>\n          !isFieldDisabled(field.field, 'groupBy') &&\n          field.fieldPath !== 'id' &&\n          supportedFieldTypes.includes(field.field.type),\n      ),\n    [reducedFields],\n  )\n\n  const groupByField = reducedFields.find((field) => field.fieldPath === groupByFieldName)\n  const isActive = Boolean(groupByFieldName && groupByField)\n\n  const handleFieldSelect = useCallback(\n    (value: string) => {\n      void (async () => {\n        if (typeof listQuery.refineListData !== 'function') {\n          return\n        }\n        await listQuery.refineListData({\n          groupBy: listQuery.query?.groupBy?.startsWith('-') ? `-${value}` : value,\n          page: 1,\n        })\n      })()\n    },\n    [listQuery],\n  )\n\n  const handleClear = useCallback(() => {\n    void (async () => {\n      if (typeof listQuery.refineListData === 'function') {\n        await listQuery.refineListData({ groupBy: '' })\n      }\n      closeRef.current?.()\n    })()\n  }, [listQuery])\n\n  const handleDirectionSelect = useCallback(\n    (value: 'asc' | 'desc') => {\n      void (async () => {\n        if (!groupByFieldName || typeof listQuery.refineListData !== 'function') {\n          return\n        }\n        await listQuery.refineListData({\n          groupBy: value === 'asc' ? groupByFieldName : `-${groupByFieldName}`,\n          page: 1,\n        })\n      })()\n    },\n    [groupByFieldName, listQuery],\n  )\n\n  if (filteredFields.length === 0) {\n    return null\n  }\n\n  const directionValue =\n    !groupByRaw || typeof groupByRaw !== 'string'\n      ? 'asc'\n      : groupByRaw.startsWith('-')\n        ? 'desc'\n        : 'asc'\n\n  // Build the trigger button label\n  const triggerLabel = isActive\n    ? t('general:groupByLabel', { label: groupByField?.label || '' })\n    : t('general:groupByLabel', { label: '' })\n\n  return (\n    <Popup\n      className={baseClass}\n      horizontalAlign=\"right\"\n      portalClassName={`${baseClass}__popup`}\n      render={({ close }) => {\n        closeRef.current = close\n        return (\n          <div className={`${baseClass}__content`}>\n            <div className={`${baseClass}__header`}>\n              <span className={`${baseClass}__title`}>\n                {t('general:groupByLabel', { label: '' })}\n              </span>\n              <div className={`${baseClass}__header-actions`}>\n                {isActive && (\n                  <Button\n                    aria-label={t('general:clear')}\n                    buttonStyle=\"ghost\"\n                    icon={<TrashIcon />}\n                    onClick={handleClear}\n                    round\n                    size=\"medium\"\n                  />\n                )}\n                <Button\n                  aria-label={t('general:close')}\n                  buttonStyle=\"ghost\"\n                  icon={<XIcon size={24} />}\n                  onClick={close}\n                  round\n                  size=\"medium\"\n                />\n              </div>\n            </div>\n            <div className={`${baseClass}__body`}>\n              <div className={`${baseClass}__row`}>\n                <label className={`${baseClass}__label`}>{t('general:field')}</label>\n                <div className={`${baseClass}__input`} data-popup-prevent-close>\n                  <Popup\n                    className={`${baseClass}__select-popup`}\n                    horizontalAlign=\"right\"\n                    render={({ close: closeFieldPopup }) => (\n                      <PopupList.ButtonGroup>\n                        {filteredFields.map((field, i) => (\n                          <PopupList.Button\n                            active={field.fieldPath === groupByFieldName}\n                            icon={\n                              field.fieldPath === groupByFieldName ? (\n                                <CheckIcon size={16} />\n                              ) : undefined\n                            }\n                            key={i}\n                            onClick={() => {\n                              handleFieldSelect(field.fieldPath)\n                              closeFieldPopup()\n                            }}\n                          >\n                            {field.label}\n                          </PopupList.Button>\n                        ))}\n                      </PopupList.ButtonGroup>\n                    )}\n                    renderButton={({ active, onClick, onKeyDown }) => (\n                      <button\n                        className={`${baseClass}__select-trigger`}\n                        onClick={onClick}\n                        onKeyDown={onKeyDown}\n                        type=\"button\"\n                      >\n                        <span className={`${baseClass}__select-value`}>\n                          {groupByField?.label || t('general:selectValue')}\n                        </span>\n                        <ChevronIcon direction={active ? 'up' : 'down'} size={16} />\n                      </button>\n                    )}\n                    size=\"medium\"\n                    verticalAlign=\"bottom\"\n                  />\n                </div>\n              </div>\n              <div className={`${baseClass}__row`}>\n                <label className={`${baseClass}__label`}>{t('general:sort')}</label>\n                <div className={`${baseClass}__input`} data-popup-prevent-close>\n                  <Popup\n                    className={`${baseClass}__select-popup`}\n                    disabled={!groupByFieldName}\n                    horizontalAlign=\"right\"\n                    render={({ close: closeSortPopup }) => (\n                      <PopupList.RadioGroup>\n                        <PopupList.RadioGroupItem\n                          active={directionValue === 'desc'}\n                          onClick={() => {\n                            handleDirectionSelect('desc')\n                            closeSortPopup()\n                          }}\n                        >\n                          {t('general:descending')}\n                        </PopupList.RadioGroupItem>\n                        <PopupList.RadioGroupItem\n                          active={directionValue === 'asc'}\n                          onClick={() => {\n                            handleDirectionSelect('asc')\n                            closeSortPopup()\n                          }}\n                        >\n                          {t('general:ascending')}\n                        </PopupList.RadioGroupItem>\n                      </PopupList.RadioGroup>\n                    )}\n                    renderButton={({ active, onClick, onKeyDown }) => (\n                      <button\n                        className={[\n                          `${baseClass}__select-trigger`,\n                          !groupByFieldName && `${baseClass}__select-trigger--disabled`,\n                        ]\n                          .filter(Boolean)\n                          .join(' ')}\n                        disabled={!groupByFieldName}\n                        onClick={onClick}\n                        onKeyDown={onKeyDown}\n                        type=\"button\"\n                      >\n                        <span className={`${baseClass}__select-value`}>\n                          {directionValue === 'desc'\n                            ? t('general:descending')\n                            : t('general:ascending')}\n                        </span>\n                        <ChevronIcon direction={active ? 'up' : 'down'} size={16} />\n                      </button>\n                    )}\n                    size=\"small\"\n                    verticalAlign=\"bottom\"\n                  />\n                </div>\n              </div>\n            </div>\n          </div>\n        )\n      }}\n      renderButton={({ active, onClick, onKeyDown, ...ariaProps }) => (\n        <Button\n          buttonStyle=\"secondary\"\n          className={`${baseClass}__trigger`}\n          extraButtonProps={{ onKeyDown }}\n          icon={<ChevronIcon direction={active ? 'up' : 'down'} size={16} />}\n          id=\"toggle-group-by\"\n          onClick={onClick}\n          selected={active || isActive}\n          size=\"medium\"\n          {...ariaProps}\n        >\n          {triggerLabel}\n        </Button>\n      )}\n      size=\"large\"\n      theme=\"auto\"\n      verticalAlign=\"bottom\"\n    />\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/LeaveWithoutSaving/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/LeaveWithoutSaving/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAsB,MAAM,OAAO,CAAA;AAE1C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAA;AAS7D,KAAK,uBAAuB,GAAG;IAC7B,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAA;IACtC,SAAS,CAAC,EAAE,CAAC,QAAQ,EAAE,IAAI,GAAG,MAAM,KAAK,IAAI,CAAA;CAC9C,CAAA;AAID,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA+ChE,CAAA;AAED,eAAO,MAAM,uBAAuB,GAAI,qCAIrC;IACD,SAAS,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,QAAQ,CAAA;IACnB,SAAS,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAA;CACtC,sBAcA,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/LeaveWithoutSaving/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAsB,MAAM,OAAO,CAAA;AAE1C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAA;AAS7D,KAAK,uBAAuB,GAAG;IAC7B,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAA;IACtC,SAAS,CAAC,EAAE,CAAC,QAAQ,EAAE,IAAI,GAAG,MAAM,KAAK,IAAI,CAAA;CAC9C,CAAA;AAID,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAgDhE,CAAA;AAED,eAAO,MAAM,uBAAuB,GAAI,qCAIrC;IACD,SAAS,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,QAAQ,CAAA;IACnB,SAAS,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAA;CACtC,sBAcA,CAAA"}

package/dist/elements/LeaveWithoutSaving/index.js

@@ -11,14 +11,15 @@ import { useModal } from '../Modal/index.js';
 import { usePreventLeave } from './usePreventLeave.js';
 const leaveWithoutSavingModalSlug = 'leave-without-saving';
 export const LeaveWithoutSaving = t0 => {
-  const $ = _c(17);
+  const $ = _c(21);
   const {
     disablePreventLeave: t1,
+    modalSlug: modalSlugProp,
     onConfirm,
     onPrevent
   } = t0;
   const disablePreventLeave = t1 === undefined ? false : t1;
-  const modalSlug = leaveWithoutSavingModalSlug;
+  const modalSlug = modalSlugProp ?? leaveWithoutSavingModalSlug;
   const {
     closeModal,
     openModal
@@ -33,62 +34,65 @@ export const LeaveWithoutSaving = t0 => {
   const [hasAccepted, setHasAccepted] = React.useState(false);
   const prevent = !disablePreventLeave && Boolean((modified || !isValid) && user);
   let t2;
-  if ($[0] !== onPrevent || $[1] !== openModal) {
+  if ($[0] !== modalSlug || $[1] !== onPrevent || $[2] !== openModal) {
     t2 = () => {
       const activeHref = document.activeElement?.href || null;
       if (onPrevent) {
         onPrevent(activeHref);
       }
-      openModal(leaveWithoutSavingModalSlug);
+      openModal(modalSlug);
     };
-    $[0] = onPrevent;
-    $[1] = openModal;
-    $[2] = t2;
+    $[0] = modalSlug;
+    $[1] = onPrevent;
+    $[2] = openModal;
+    $[3] = t2;
   } else {
-    t2 = $[2];
+    t2 = $[3];
   }
   const handlePrevent = t2;
   let t3;
-  if ($[3] !== closeModal) {
+  if ($[4] !== closeModal || $[5] !== modalSlug) {
     t3 = () => {
-      closeModal(leaveWithoutSavingModalSlug);
+      closeModal(modalSlug);
     };
-    $[3] = closeModal;
-    $[4] = t3;
+    $[4] = closeModal;
+    $[5] = modalSlug;
+    $[6] = t3;
   } else {
-    t3 = $[4];
+    t3 = $[6];
   }
   const handleAccept = t3;
   let t4;
-  if ($[5] !== handleAccept || $[6] !== handlePrevent || $[7] !== hasAccepted || $[8] !== prevent) {
+  if ($[7] !== handleAccept || $[8] !== handlePrevent || $[9] !== hasAccepted || $[10] !== prevent) {
     t4 = {
       hasAccepted,
       onAccept: handleAccept,
       onPrevent: handlePrevent,
       prevent
     };
-    $[5] = handleAccept;
-    $[6] = handlePrevent;
-    $[7] = hasAccepted;
-    $[8] = prevent;
-    $[9] = t4;
+    $[7] = handleAccept;
+    $[8] = handlePrevent;
+    $[9] = hasAccepted;
+    $[10] = prevent;
+    $[11] = t4;
   } else {
-    t4 = $[9];
+    t4 = $[11];
   }
   usePreventLeave(t4);
   let t5;
-  if ($[10] !== closeModal) {
+  if ($[12] !== closeModal || $[13] !== modalSlug) {
     t5 = () => {
-      closeModal(leaveWithoutSavingModalSlug);
+      closeModal(modalSlug);
     };
-    $[10] = closeModal;
-    $[11] = t5;
+    $[12] = closeModal;
+    $[13] = modalSlug;
+    $[14] = t5;
   } else {
-    t5 = $[11];
+    t5 = $[14];
   }
   const onCancel = t5;
   let t6;
-  if ($[12] !== onConfirm) {
+  if ($[15] !== onConfirm) {
     t6 = async () => {
       if (onConfirm) {
         ;
@@ -101,24 +105,25 @@ export const LeaveWithoutSaving = t0 => {
       }
       setHasAccepted(true);
     };
-    $[12] = onConfirm;
-    $[13] = t6;
+    $[15] = onConfirm;
+    $[16] = t6;
   } else {
-    t6 = $[13];
+    t6 = $[16];
   }
   const handleConfirm = t6;
   let t7;
-  if ($[14] !== handleConfirm || $[15] !== onCancel) {
+  if ($[17] !== handleConfirm || $[18] !== modalSlug || $[19] !== onCancel) {
     t7 = _jsx(LeaveWithoutSavingModal, {
-      modalSlug: leaveWithoutSavingModalSlug,
+      modalSlug,
       onCancel,
       onConfirm: handleConfirm
     });
-    $[14] = handleConfirm;
-    $[15] = onCancel;
-    $[16] = t7;
+    $[17] = handleConfirm;
+    $[18] = modalSlug;
+    $[19] = onCancel;
+    $[20] = t7;
   } else {
-    t7 = $[16];
+    t7 = $[20];
   }
   return t7;
 };

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useCallback","useForm","useFormModified","useAuth","useTranslation","ConfirmationModal","useModal","usePreventLeave","leaveWithoutSavingModalSlug","LeaveWithoutSaving","t0","$","disablePreventLeave","t1","onConfirm","onPrevent","undefined","modalSlug","closeModal","openModal","modified","isValid","user","hasAccepted","setHasAccepted","useState","prevent","Boolean","t2","activeHref","document","activeElement","href","handlePrevent","t3","handleAccept","t4","onAccept","t5","onCancel","t6","t7","err","console","error","handleConfirm","_jsx","LeaveWithoutSavingModal","t","body","cancelLabel","confirmLabel","heading"],"sources":["../../../src/elements/LeaveWithoutSaving/index.tsx"],"sourcesContent":["'use client'\nimport React, { useCallback } from 'react'\n\nimport type { OnCancel } from '../ConfirmationModal/index.js'\n\nimport { useForm, useFormModified } from '../../forms/Form/index.js'\nimport { useAuth } from '../../providers/Auth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { ConfirmationModal } from '../ConfirmationModal/index.js'\nimport { useModal } from '../Modal/index.js'\nimport { usePreventLeave } from './usePreventLeave.js'\n\ntype LeaveWithoutSavingProps = {\n  disablePreventLeave?: boolean\n  modalSlug?: string\n  onConfirm?: () => Promise<void> | void\n  onPrevent?: (nextHref: null | string) => void\n}\n\nconst leaveWithoutSavingModalSlug = 'leave-without-saving'\n\nexport const LeaveWithoutSaving: React.FC<LeaveWithoutSavingProps> = ({\n  disablePreventLeave = false,\n  onConfirm,\n  onPrevent,\n}) => {\n  const modalSlug = leaveWithoutSavingModalSlug\n  const { closeModal, openModal } = useModal()\n  const modified = useFormModified()\n  const { isValid } = useForm()\n  const { user } = useAuth()\n  const [hasAccepted, setHasAccepted] = React.useState(false)\n\n  const prevent = !disablePreventLeave && Boolean((modified || !isValid) && user)\n\n  const handlePrevent = useCallback(() => {\n    const activeHref = (document.activeElement as HTMLAnchorElement)?.href || null\n    if (onPrevent) {\n      onPrevent(activeHref)\n    }\n    openModal(modalSlug)\n  }, [openModal, onPrevent, modalSlug])\n\n  const handleAccept = useCallback(() => {\n    closeModal(modalSlug)\n  }, [closeModal, modalSlug])\n\n  usePreventLeave({ hasAccepted, onAccept: handleAccept, onPrevent: handlePrevent, prevent })\n\n  const onCancel: OnCancel = useCallback(() => {\n    closeModal(modalSlug)\n  }, [closeModal, modalSlug])\n\n  const handleConfirm = useCallback(async () => {\n    if (onConfirm) {\n      try {\n        await onConfirm()\n      } catch (err) {\n        // eslint-disable-next-line no-console\n        console.error('Error in LeaveWithoutSaving onConfirm:', err)\n      }\n    }\n    setHasAccepted(true)\n  }, [onConfirm])\n\n  return (\n    <LeaveWithoutSavingModal modalSlug={modalSlug} onCancel={onCancel} onConfirm={handleConfirm} />\n  )\n}\n\nexport const LeaveWithoutSavingModal = ({\n  modalSlug,\n  onCancel,\n  onConfirm,\n}: {\n  modalSlug: string\n  onCancel?: OnCancel\n  onConfirm: () => Promise<void> | void\n}) => {\n  const { t } = useTranslation()\n\n  return (\n    <ConfirmationModal\n      body={t('general:changesNotSaved')}\n      cancelLabel={t('general:stayOnThisPage')}\n      confirmLabel={t('general:leaveAnyway')}\n      heading={t('general:leaveWithoutSaving')}\n      modalSlug={modalSlug}\n      onCancel={onCancel}\n      onConfirm={onConfirm}\n    />\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,IAASC,WAAW,QAAQ;AAInC,SAASC,OAAO,EAAEC,eAAe,QAAQ;AACzC,SAASC,OAAO,QAAQ;AACxB,SAASC,cAAc,QAAQ;AAC/B,SAASC,iBAAiB,QAAQ;AAClC,SAASC,QAAQ,QAAQ;AACzB,SAASC,eAAe,QAAQ;AAShC,MAAMC,2BAAA,GAA8B;AAEpC,OAAO,MAAMC,kBAAA,GAAwDC,EAAA;EAAA,MAAAC,CAAA,GAAAb,EAAA;EAAC;IAAAc,mBAAA,EAAAC,EAAA;IAAAC,SAAA;IAAAC;EAAA,IAAAL,EAIrE;EAHC,MAAAE,mBAAA,GAAAC,EAA2B,KAAAG,SAAA,WAA3BH,EAA2B;EAI3B,MAAAI,SAAA,GAAAT,2BAAA;EACA;IAAAU,UAAA;IAAAC;EAAA,IAAkCb,QAAA;EAClC,MAAAc,QAAA,GAAiBlB,eAAA;EACjB;IAAAmB;EAAA,IAAoBpB,OAAA;EACpB;IAAAqB;EAAA,IAAiBnB,OAAA;EACjB,OAAAoB,WAAA,EAAAC,cAAA,IAAsCzB,KAAA,CAAA0B,QAAA,MAAe;EAErD,MAAAC,OAAA,GAAgB,CAACd,mBAAA,IAAuBe,OAAA,CAAQ,CAACP,QAAA,KAAaC,OAAM,KAAMC,IAAA;EAAA,IAAAM,EAAA;EAAA,IAAAjB,CAAA,QAAAI,SAAA,IAAAJ,CAAA,QAAAQ,SAAA;IAExCS,EAAA,GAAAA,CAAA;MAChC,MAAAC,UAAA,GAAmBC,QAAA,CAAAC,aAAA,EAAAC,IAAA,QAAuD;MAAA,IACtEjB,SAAA;QACFA,SAAA,CAAUc,UAAA;MAAA;MAEZV,SAAA,CAAAX,2BAAU;IAAA;IACZG,CAAA,MAAAI,SAAA;IAAAJ,CAAA,MAAAQ,SAAA;IAAAR,CAAA,MAAAiB,EAAA;EAAA;IAAAA,EAAA,GAAAjB,CAAA;EAAA;EANA,MAAAsB,aAAA,GAAsBL,EAMc;EAAA,IAAAM,EAAA;EAAA,IAAAvB,CAAA,QAAAO,UAAA;IAEHgB,EAAA,GAAAA,CAAA;MAC/BhB,UAAA,CAAAV,2BAAW;IAAA;IACbG,CAAA,MAAAO,UAAA;IAAAP,CAAA,MAAAuB,EAAA;EAAA;IAAAA,EAAA,GAAAvB,CAAA;EAAA;EAFA,MAAAwB,YAAA,GAAqBD,EAEK;EAAA,IAAAE,EAAA;EAAA,IAAAzB,CAAA,QAAAwB,YAAA,IAAAxB,CAAA,QAAAsB,aAAA,IAAAtB,CAAA,QAAAY,WAAA,IAAAZ,CAAA,QAAAe,OAAA;IAEVU,EAAA;MAAAb,WAAA;MAAAc,QAAA,EAAyBF,YAAA;MAAApB,SAAA,EAAyBkB,aAAA;MAAAP;IAAA;IAAuBf,CAAA,MAAAwB,YAAA;IAAAxB,CAAA,MAAAsB,aAAA;IAAAtB,CAAA,MAAAY,WAAA;IAAAZ,CAAA,MAAAe,OAAA;IAAAf,CAAA,MAAAyB,EAAA;EAAA;IAAAA,EAAA,GAAAzB,CAAA;EAAA;EAAzFJ,eAAA,CAAgB6B,EAAyE;EAAA,IAAAE,EAAA;EAAA,IAAA3B,CAAA,SAAAO,UAAA;IAElDoB,EAAA,GAAAA,CAAA;MACrCpB,UAAA,CAAAV,2BAAW;IAAA;IACbG,CAAA,OAAAO,UAAA;IAAAP,CAAA,OAAA2B,EAAA;EAAA;IAAAA,EAAA,GAAA3B,CAAA;EAAA;EAFA,MAAA4B,QAAA,GAA2BD,EAED;EAAA,IAAAE,EAAA;EAAA,IAAA7B,CAAA,SAAAG,SAAA;IAEQ0B,EAAA,SAAAA,CAAA;MAAA,IAC5B1B,SAAA;QAAA;QAAA;UAAA,MAEMA,SAAA;QAAA,SAAA2B,EAAA;UACCC,KAAA,CAAAA,GAAA,CAAAA,CAAA,CAAAA,EAAA;UAEPC,OAAA,CAAAC,KAAA,CAAc,0CAA0CF,GAAA;QAAA;MAAA;MAG5DlB,cAAA,KAAe;IAAA;IACjBb,CAAA,OAAAG,SAAA;IAAAH,CAAA,OAAA6B,EAAA;EAAA;IAAAA,EAAA,GAAA7B,CAAA;EAAA;EAVA,MAAAkC,aAAA,GAAsBL,EAUR;EAAA,IAAAC,EAAA;EAAA,IAAA9B,CAAA,SAAAkC,aAAA,IAAAlC,CAAA,SAAA4B,QAAA;IAGZE,EAAA,GAAAK,IAAA,CAAAC,uBAAA;MAAA9B,SAAA,EAAAT,2BAAA;MAAA+B,QAAA;MAAAzB,SAAA,EAA8E+B;IAAA,C;;;;;;;SAA9EJ,E;CAEJ;AAEA,OAAO,MAAMM,uBAAA,GAA0BrC,EAAA;EAAA,MAAAC,CAAA,GAAAb,EAAA;EAAC;IAAAmB,SAAA;IAAAsB,QAAA;IAAAzB;EAAA,IAAAJ,EAQvC;EACC;IAAAsC;EAAA,IAAc5C,cAAA;EAAA,IAAAS,EAAA;EAAA,IAAAF,CAAA,QAAAM,SAAA,IAAAN,CAAA,QAAA4B,QAAA,IAAA5B,CAAA,QAAAG,SAAA,IAAAH,CAAA,QAAAqC,CAAA;IAGZnC,EAAA,GAAAiC,IAAA,CAAAzC,iBAAA;MAAA4C,IAAA,EACQD,CAAA,CAAE;MAAAE,WAAA,EACKF,CAAA,CAAE;MAAAG,YAAA,EACDH,CAAA,CAAE;MAAAI,OAAA,EACPJ,CAAA,CAAE;MAAA/B,SAAA;MAAAsB,QAAA;MAAAzB;IAAA,C;;;;;;;;;SAJbD,E;CAUJ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","useCallback","useForm","useFormModified","useAuth","useTranslation","ConfirmationModal","useModal","usePreventLeave","leaveWithoutSavingModalSlug","LeaveWithoutSaving","t0","$","disablePreventLeave","t1","modalSlug","modalSlugProp","onConfirm","onPrevent","undefined","closeModal","openModal","modified","isValid","user","hasAccepted","setHasAccepted","useState","prevent","Boolean","t2","activeHref","document","activeElement","href","handlePrevent","t3","handleAccept","t4","onAccept","t5","onCancel","t6","t7","err","console","error","handleConfirm","_jsx","LeaveWithoutSavingModal","t","body","cancelLabel","confirmLabel","heading"],"sources":["../../../src/elements/LeaveWithoutSaving/index.tsx"],"sourcesContent":["'use client'\nimport React, { useCallback } from 'react'\n\nimport type { OnCancel } from '../ConfirmationModal/index.js'\n\nimport { useForm, useFormModified } from '../../forms/Form/index.js'\nimport { useAuth } from '../../providers/Auth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { ConfirmationModal } from '../ConfirmationModal/index.js'\nimport { useModal } from '../Modal/index.js'\nimport { usePreventLeave } from './usePreventLeave.js'\n\ntype LeaveWithoutSavingProps = {\n  disablePreventLeave?: boolean\n  modalSlug?: string\n  onConfirm?: () => Promise<void> | void\n  onPrevent?: (nextHref: null | string) => void\n}\n\nconst leaveWithoutSavingModalSlug = 'leave-without-saving'\n\nexport const LeaveWithoutSaving: React.FC<LeaveWithoutSavingProps> = ({\n  disablePreventLeave = false,\n  modalSlug: modalSlugProp,\n  onConfirm,\n  onPrevent,\n}) => {\n  const modalSlug = modalSlugProp ?? leaveWithoutSavingModalSlug\n  const { closeModal, openModal } = useModal()\n  const modified = useFormModified()\n  const { isValid } = useForm()\n  const { user } = useAuth()\n  const [hasAccepted, setHasAccepted] = React.useState(false)\n\n  const prevent = !disablePreventLeave && Boolean((modified || !isValid) && user)\n\n  const handlePrevent = useCallback(() => {\n    const activeHref = (document.activeElement as HTMLAnchorElement)?.href || null\n    if (onPrevent) {\n      onPrevent(activeHref)\n    }\n    openModal(modalSlug)\n  }, [openModal, onPrevent, modalSlug])\n\n  const handleAccept = useCallback(() => {\n    closeModal(modalSlug)\n  }, [closeModal, modalSlug])\n\n  usePreventLeave({ hasAccepted, onAccept: handleAccept, onPrevent: handlePrevent, prevent })\n\n  const onCancel: OnCancel = useCallback(() => {\n    closeModal(modalSlug)\n  }, [closeModal, modalSlug])\n\n  const handleConfirm = useCallback(async () => {\n    if (onConfirm) {\n      try {\n        await onConfirm()\n      } catch (err) {\n        // eslint-disable-next-line no-console\n        console.error('Error in LeaveWithoutSaving onConfirm:', err)\n      }\n    }\n    setHasAccepted(true)\n  }, [onConfirm])\n\n  return (\n    <LeaveWithoutSavingModal modalSlug={modalSlug} onCancel={onCancel} onConfirm={handleConfirm} />\n  )\n}\n\nexport const LeaveWithoutSavingModal = ({\n  modalSlug,\n  onCancel,\n  onConfirm,\n}: {\n  modalSlug: string\n  onCancel?: OnCancel\n  onConfirm: () => Promise<void> | void\n}) => {\n  const { t } = useTranslation()\n\n  return (\n    <ConfirmationModal\n      body={t('general:changesNotSaved')}\n      cancelLabel={t('general:stayOnThisPage')}\n      confirmLabel={t('general:leaveAnyway')}\n      heading={t('general:leaveWithoutSaving')}\n      modalSlug={modalSlug}\n      onCancel={onCancel}\n      onConfirm={onConfirm}\n    />\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/LeaveWithoutSaving/usePreventLeave.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePreventLeave.js","names":["c","_c","useCallback","useEffect","useRef","useRouter","useRouteTransition","on","obj","args","addEventListener","off","removeEventListener","useBeforeUnload","t0","message","$","enabled","undefined","t1","event","finalEnabled","preventDefault","returnValue","handler","t2","t3","window","usePreventLeave","hasAccepted","onAccept","onPrevent","prevent","startRouteTransition","router","cancelledURL","isAnchorOfCurrentUrl","currentUrl","newUrl","currentUrlObj","URL","newUrlObj","hostname","pathname","search","currentHash","hash","newHash","href","replace","err","console","log","findClosestAnchor","element","tagName","toLowerCase","parentElement","handleClick","target","anchor","location","isAnchor","isDownloadLink","download","isNewTab","metaKey","ctrlKey","isPageLeaving","confirm","current","stopPropagation","document","push"],"sources":["../../../src/elements/LeaveWithoutSaving/usePreventLeave.tsx"],"sourcesContent":["'use client'\nimport { useCallback, useEffect, useRef } from 'react'\n\n// Credit: @Taiki92777\n//    - Source: https://github.com/vercel/next.js/discussions/32231#discussioncomment-7284386\n// Credit: `react-use` maintainers\n//    -  Source: https://github.com/streamich/react-use/blob/ade8d3905f544305515d010737b4ae604cc51024/src/useBeforeUnload.ts#L2\nimport { useRouter } from '../../providers/RouterAdapter/index.js'\nimport { useRouteTransition } from '../../providers/RouteTransition/index.js'\n\nfunction on<T extends Document | EventTarget | HTMLElement | Window>(\n  obj: null | T,\n  ...args: [string, (() => void) | null, ...any] | Parameters<T['addEventListener']>\n): void {\n  if (obj && obj.addEventListener) {\n    obj.addEventListener(...(args as Parameters<HTMLElement['addEventListener']>))\n  }\n}\n\nfunction off<T extends Document | EventTarget | HTMLElement | Window>(\n  obj: null | T,\n  ...args: [string, (() => void) | null, ...any] | Parameters<T['removeEventListener']>\n): void {\n  if (obj && obj.removeEventListener) {\n    obj.removeEventListener(...(args as Parameters<HTMLElement['removeEventListener']>))\n  }\n}\n\nexport const useBeforeUnload = (enabled: (() => boolean) | boolean = true, message?: string) => {\n  const handler = useCallback(\n    (event: BeforeUnloadEvent) => {\n      const finalEnabled = typeof enabled === 'function' ? enabled() : true\n\n      if (!finalEnabled) {\n        return\n      }\n\n      event.preventDefault()\n\n      if (message) {\n        event.returnValue = message\n      }\n\n      return message\n    },\n    [enabled, message],\n  )\n\n  useEffect(() => {\n    if (!enabled) {\n      return\n    }\n\n    on(window, 'beforeunload', handler)\n\n    return () => off(window, 'beforeunload', handler)\n  }, [enabled, handler])\n}\n\nexport const usePreventLeave = ({\n  hasAccepted = false,\n  message = 'Are you sure you want to leave this page?',\n  onAccept,\n  onPrevent,\n  prevent = true,\n}: {\n  hasAccepted: boolean\n  // if no `onPrevent` is provided, the message will be displayed in a confirm dialog\n  message?: string\n  onAccept?: () => void\n  // to use a custom confirmation dialog, provide a function that returns a boolean\n  onPrevent?: () => void\n  prevent: boolean\n}) => {\n  // check when page is about to be reloaded\n  useBeforeUnload(prevent, message)\n  const { startRouteTransition } = useRouteTransition()\n\n  const router = useRouter()\n  const cancelledURL = useRef<string>('')\n\n  // check when page is about to be changed\n  useEffect(() => {\n    function isAnchorOfCurrentUrl(currentUrl: string, newUrl: string) {\n      try {\n        const currentUrlObj = new URL(currentUrl)\n        const newUrlObj = new URL(newUrl)\n        // Compare hostname, pathname, and search parameters\n        if (\n          currentUrlObj.hostname === newUrlObj.hostname &&\n          currentUrlObj.pathname === newUrlObj.pathname &&\n          currentUrlObj.search === newUrlObj.search\n        ) {\n          // Check if the new URL is just an anchor of the current URL page\n          const currentHash = currentUrlObj.hash\n          const newHash = newUrlObj.hash\n          return (\n            currentHash !== newHash &&\n            currentUrlObj.href.replace(currentHash, '') === newUrlObj.href.replace(newHash, '')\n          )\n        }\n      } catch (err) {\n        // eslint-disable-next-line no-console\n        console.log('Unexpected exception thrown in LeaveWithoutSaving:isAnchorOfCurrentUrl', err)\n      }\n      return false\n    }\n\n    function findClosestAnchor(element: HTMLElement | null): HTMLAnchorElement | null {\n      while (element && element.tagName.toLowerCase() !== 'a') {\n        element = element.parentElement\n      }\n      return element as HTMLAnchorElement\n    }\n\n    function handleClick(event: MouseEvent) {\n      try {\n        const target = event.target as HTMLElement\n        const anchor = findClosestAnchor(target)\n        if (anchor) {\n          const currentUrl = window.location.href\n          const newUrl = anchor.href\n          const isAnchor = isAnchorOfCurrentUrl(currentUrl, newUrl)\n          const isDownloadLink = anchor.download !== ''\n          const isNewTab = anchor.target === '_blank' || event.metaKey || event.ctrlKey\n\n          const isPageLeaving = !(newUrl === currentUrl || isAnchor || isDownloadLink || isNewTab)\n\n          if (isPageLeaving && prevent && (!onPrevent ? !window.confirm(message) : true)) {\n            // Keep a reference of the href\n            cancelledURL.current = newUrl\n\n            // Cancel the route change\n            event.preventDefault()\n            event.stopPropagation()\n\n            if (typeof onPrevent === 'function') {\n              onPrevent()\n            }\n          }\n        }\n      } catch (err) {\n        // eslint-disable-next-line no-console\n        console.log('Unexpected exception thrown in LeaveWithoutSaving:usePreventLeave', err)\n      }\n    }\n\n    if (prevent) {\n      // Add the global click event listener\n      document.addEventListener('click', handleClick, true)\n    }\n\n    // Clean up the global click event listener when the component is unmounted\n    return () => {\n      document.removeEventListener('click', handleClick, true)\n    }\n  }, [onPrevent, prevent, message])\n\n  useEffect(() => {\n    if (hasAccepted && cancelledURL.current) {\n      if (onAccept) {\n        onAccept()\n      }\n\n      startRouteTransition(() => router.push(cancelledURL.current))\n    }\n  }, [hasAccepted, onAccept, router, startRouteTransition])\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"usePreventLeave.js","names":["c","_c","useCallback","useEffect","useRef","useRouter","useRouteTransition","on","obj","args","addEventListener","off","removeEventListener","useBeforeUnload","t0","message","$","enabled","undefined","t1","event","finalEnabled","preventDefault","returnValue","handler","t2","t3","window","usePreventLeave","hasAccepted","onAccept","onPrevent","prevent","startRouteTransition","router","cancelledURL","isAnchorOfCurrentUrl","currentUrl","newUrl","currentUrlObj","URL","newUrlObj","hostname","pathname","search","currentHash","hash","newHash","href","replace","err","console","log","findClosestAnchor","element","tagName","toLowerCase","parentElement","handleClick","target","anchor","location","isAnchor","isDownloadLink","download","isNewTab","metaKey","ctrlKey","isPageLeaving","confirm","current","stopPropagation","document","push"],"sources":["../../../src/elements/LeaveWithoutSaving/usePreventLeave.tsx"],"sourcesContent":["'use client'\nimport { useCallback, useEffect, useRef } from 'react'\n\n// Credit: @Taiki92777\n//    - Source: https://github.com/vercel/next.js/discussions/32231#discussioncomment-7284386\n// Credit: `react-use` maintainers\n//    -  Source: https://github.com/streamich/react-use/blob/ade8d3905f544305515d010737b4ae604cc51024/src/useBeforeUnload.ts#L2\nimport { useRouter } from '../../providers/RouterAdapter/index.js'\nimport { useRouteTransition } from '../../providers/RouteTransition/index.js'\n\nfunction on<T extends Document | EventTarget | HTMLElement | Window>(\n  obj: null | T,\n  ...args: [string, (() => void) | null, ...any] | Parameters<T['addEventListener']>\n): void {\n  if (obj && obj.addEventListener) {\n    obj.addEventListener(...(args as Parameters<HTMLElement['addEventListener']>))\n  }\n}\n\nfunction off<T extends Document | EventTarget | HTMLElement | Window>(\n  obj: null | T,\n  ...args: [string, (() => void) | null, ...any] | Parameters<T['removeEventListener']>\n): void {\n  if (obj && obj.removeEventListener) {\n    obj.removeEventListener(...(args as Parameters<HTMLElement['removeEventListener']>))\n  }\n}\n\nexport const useBeforeUnload = (enabled: (() => boolean) | boolean = true, message?: string) => {\n  const handler = useCallback(\n    (event: BeforeUnloadEvent) => {\n      const finalEnabled = typeof enabled === 'function' ? enabled() : true\n\n      if (!finalEnabled) {\n        return\n      }\n\n      event.preventDefault()\n\n      if (message) {\n        event.returnValue = message\n      }\n\n      return message\n    },\n    [enabled, message],\n  )\n\n  useEffect(() => {\n    if (!enabled) {\n      return\n    }\n\n    on(window, 'beforeunload', handler)\n\n    return () => off(window, 'beforeunload', handler)\n  }, [enabled, handler])\n}\n\nexport const usePreventLeave = ({\n  hasAccepted = false,\n  message = 'Are you sure you want to leave this page?',\n  onAccept,\n  onPrevent,\n  prevent = true,\n}: {\n  hasAccepted: boolean\n  // if no `onPrevent` is provided, the message will be displayed in a confirm dialog\n  message?: string\n  onAccept?: () => void\n  // to use a custom confirmation dialog, provide a function that returns a boolean\n  onPrevent?: () => void\n  prevent: boolean\n}) => {\n  // check when page is about to be reloaded\n  useBeforeUnload(prevent, message)\n  const { startRouteTransition } = useRouteTransition()\n\n  const router = useRouter()\n  const cancelledURL = useRef<string>('')\n\n  // check when page is about to be changed\n  useEffect(() => {\n    function isAnchorOfCurrentUrl(currentUrl: string, newUrl: string) {\n      try {\n        const currentUrlObj = new URL(currentUrl)\n        const newUrlObj = new URL(newUrl)\n        // Compare hostname, pathname, and search parameters\n        if (\n          currentUrlObj.hostname === newUrlObj.hostname &&\n          currentUrlObj.pathname === newUrlObj.pathname &&\n          currentUrlObj.search === newUrlObj.search\n        ) {\n          // Check if the new URL is just an anchor of the current URL page\n          const currentHash = currentUrlObj.hash\n          const newHash = newUrlObj.hash\n          return (\n            currentHash !== newHash &&\n            currentUrlObj.href.replace(currentHash, '') === newUrlObj.href.replace(newHash, '')\n          )\n        }\n      } catch (err) {\n        // eslint-disable-next-line no-console\n        console.log('Unexpected exception thrown in LeaveWithoutSaving:isAnchorOfCurrentUrl', err)\n      }\n      return false\n    }\n\n    function findClosestAnchor(element: HTMLElement | null): HTMLAnchorElement | null {\n      while (element && element.tagName.toLowerCase() !== 'a') {\n        element = element.parentElement\n      }\n      return element as HTMLAnchorElement\n    }\n\n    function handleClick(event: MouseEvent) {\n      try {\n        const target = event.target as HTMLElement\n        const anchor = findClosestAnchor(target)\n        if (anchor) {\n          const currentUrl = window.location.href\n          const newUrl = anchor.href\n          const isAnchor = isAnchorOfCurrentUrl(currentUrl, newUrl)\n          const isDownloadLink = anchor.download !== ''\n          const isNewTab = anchor.target === '_blank' || event.metaKey || event.ctrlKey\n\n          const isPageLeaving = !(newUrl === currentUrl || isAnchor || isDownloadLink || isNewTab)\n\n          if (isPageLeaving && prevent && (!onPrevent ? !window.confirm(message) : true)) {\n            // Keep a reference of the href\n            cancelledURL.current = newUrl\n\n            // Cancel the route change\n            event.preventDefault()\n            event.stopPropagation()\n\n            if (typeof onPrevent === 'function') {\n              onPrevent()\n            }\n          }\n        }\n      } catch (err) {\n        // eslint-disable-next-line no-console\n        console.log('Unexpected exception thrown in LeaveWithoutSaving:usePreventLeave', err)\n      }\n    }\n\n    if (prevent) {\n      // Add the global click event listener\n      document.addEventListener('click', handleClick, true)\n    }\n\n    // Clean up the global click event listener when the component is unmounted\n    return () => {\n      document.removeEventListener('click', handleClick, true)\n    }\n  }, [onPrevent, prevent, message])\n\n  useEffect(() => {\n    if (hasAccepted && cancelledURL.current) {\n      if (onAccept) {\n        onAccept()\n      }\n\n      startRouteTransition(() => router.push(cancelledURL.current))\n    }\n  }, [hasAccepted, onAccept, router, startRouteTransition])\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/ListControls/index.css

@@ -6,16 +6,10 @@
     border-bottom: var(--stroke-width-small) solid var(--color-border);
 
     .pill-selector,
-    .where-builder,
     .sort-complex,
     .group-by-builder {
       margin-top: var(--spacer-2);
     }
-
-    .search-bar {
-      min-width: 180px;
-      width: 180px;
-    }
   }
 
   .list-controls__search-row {
@@ -67,7 +61,6 @@
       }
     }
 
-    .list-controls__toggle-where,
     .list-controls__toggle-sort,
     .list-controls__toggle-group-by {
       flex: 1;

package/dist/elements/ListControls/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/ListControls/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAgD,MAAM,OAAO,CAAA;AAEpE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AAcnD,OAAO,aAAa,CAAA;AAIpB;;;;GAIG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAsJpD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/ListControls/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAgD,MAAM,OAAO,CAAA;AAEpE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AAanD,OAAO,aAAa,CAAA;AAIpB;;;;GAIG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAwJpD,CAAA"}

package/dist/elements/ListControls/index.js

@@ -3,14 +3,12 @@
 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 { validateWhereQuery } from 'payload/shared';
 import React, { Fragment, useEffect, useRef, useState } from 'react';
 import { Popup, PopupList } from '../../elements/Popup/index.js';
 import { ChevronIcon } from '../../icons/Chevron/index.js';
 import { Dots } from '../../icons/Dots/index.js';
 import { useListQuery } from '../../providers/ListQuery/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
-import { AnimateHeight } from '../AnimateHeight/index.js';
 import { Button } from '../Button/index.js';
 import { ColumnsButton } from '../ColumnsButton/index.js';
 import { GroupByControl } from '../GroupByControl/index.js';
@@ -25,7 +23,7 @@ const baseClass = 'list-controls';
  * the collection's documents.
  */
 export const ListControls = props => {
-  const $ = _c(4);
+  const $ = _c(8);
   const {
     beforeActions,
     collectionConfig,
@@ -35,8 +33,10 @@ export const ListControls = props => {
     enableFilters: t1,
     enableSort: t2,
     hasCreatePermission,
+    isWhereOpen: isWhereOpenFromProps,
     listMenuItems,
     newDocumentURL,
+    onWhereToggle,
     queryPreset: activePreset,
     queryPresetPermissions,
     renderedFilters,
@@ -45,8 +45,10 @@ export const ListControls = props => {
   const enableColumns = t0 === undefined ? true : t0;
   const enableFilters = t1 === undefined ? true : t1;
   const enableSort = t2 === undefined ? false : t2;
+  const isControlled = typeof onWhereToggle === "function";
   const {
     handleSearchChange,
+    hasActiveFilters,
     query
   } = useListQuery();
   const {
@@ -62,8 +64,7 @@ export const ListControls = props => {
     label: ""
   }).split(" ")[0];
   const hasWhereParam = useRef(Boolean(query?.where));
-  const shouldInitializeWhereOpened = validateWhereQuery(query?.where);
-  const [visibleDrawer, setVisibleDrawer] = useState(shouldInitializeWhereOpened ? "where" : undefined);
+  const [visibleDrawer, setVisibleDrawer] = useState(hasActiveFilters ? "where" : undefined);
   let t4;
   if ($[0] !== query?.where) {
     t4 = () => {
@@ -90,6 +91,18 @@ export const ListControls = props => {
     t6 = $[3];
   }
   useEffect(t4, t6);
+  const isWhereOpen = isControlled ? Boolean(isWhereOpenFromProps) : visibleDrawer === "where";
+  let t7;
+  if ($[4] !== isControlled || $[5] !== onWhereToggle || $[6] !== visibleDrawer) {
+    t7 = isControlled ? onWhereToggle : () => setVisibleDrawer(visibleDrawer !== "where" ? "where" : undefined);
+    $[4] = isControlled;
+    $[5] = onWhereToggle;
+    $[6] = visibleDrawer;
+    $[7] = t7;
+  } else {
+    t7 = $[7];
+  }
+  const handleWhereToggle = t7;
   return _jsxs("div", {
     className: baseClass,
     children: [_jsxs("div", {
@@ -117,14 +130,15 @@ export const ListControls = props => {
             "aria-expanded": visibleDrawer === "where"
           },
           icon: _jsx(ChevronIcon, {
-            direction: visibleDrawer === "where" ? "up" : "down",
+            direction: isWhereOpen ? "up" : "down",
             size: 16
           }),
           id: "toggle-list-filters",
-          onClick: () => setVisibleDrawer(visibleDrawer !== "where" ? "where" : undefined),
+          onClick: handleWhereToggle,
+          selected: isWhereOpen || hasActiveFilters,
           size: "medium",
           children: t("general:filters")
-        }), collectionConfig.admin.groupBy && _jsx(GroupByControl, {
+        }), _jsx(GroupByControl, {
           collectionSlug: collectionConfig.slug,
           fields: collectionConfig.fields
         }), enableColumns && _jsx(ColumnsButton, {
@@ -165,14 +179,14 @@ export const ListControls = props => {
           })
         })]
       })]
-    }), _jsx(AnimateHeight, {
+    }), !isControlled && isWhereOpen && _jsx("div", {
       className: `${baseClass}__where`,
-      height: visibleDrawer === "where" ? "auto" : 0,
       id: `${baseClass}-where`,
       children: _jsx(WhereBuilder, {
         collectionPluralLabel: collectionConfig?.labels?.plural,
         collectionSlug: collectionConfig.slug,
         fields: collectionConfig?.fields,
+        onClose: () => setVisibleDrawer(undefined),
         renderedFilters,
         resolvedFilterOptions
       })