@payloadcms/ui 3.58.0-internal.df9fce5 → 3.58.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,6 @@
1
1
  import './index.scss';
2
2
  export declare const DocumentDrawerHeader: React.FC<{
3
+ AfterHeader?: React.ReactNode;
3
4
  drawerSlug: string;
4
5
  showDocumentID?: boolean;
5
6
  }>;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/DocumentDrawer/DrawerHeader/index.tsx"],"names":[],"mappings":"AAWA,OAAO,cAAc,CAAA;AAErB,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC;IAC1C,UAAU,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB,CAsBA,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/DocumentDrawer/DrawerHeader/index.tsx"],"names":[],"mappings":"AAWA,OAAO,cAAc,CAAA;AAErB,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC;IAC1C,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,UAAU,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB,CAyBA,CAAA"}
@@ -13,8 +13,9 @@ import { IDLabel } from '../../IDLabel/index.js';
13
13
  import { documentDrawerBaseClass } from '../index.js';
14
14
  import './index.scss';
15
15
  export const DocumentDrawerHeader = t0 => {
16
- const $ = _c(8);
16
+ const $ = _c(9);
17
17
  const {
18
+ AfterHeader,
18
19
  drawerSlug,
19
20
  showDocumentID: t1
20
21
  } = t0;
@@ -26,15 +27,15 @@ export const DocumentDrawerHeader = t0 => {
26
27
  t
27
28
  } = useTranslation();
28
29
  let t2;
29
- if ($[0] !== closeModal || $[1] !== drawerSlug || $[2] !== showDocumentID || $[3] !== t) {
30
+ if ($[0] !== AfterHeader || $[1] !== closeModal || $[2] !== drawerSlug || $[3] !== showDocumentID || $[4] !== t) {
30
31
  let t3;
31
- if ($[5] !== closeModal || $[6] !== drawerSlug) {
32
+ if ($[6] !== closeModal || $[7] !== drawerSlug) {
32
33
  t3 = () => closeModal(drawerSlug);
33
- $[5] = closeModal;
34
- $[6] = drawerSlug;
35
- $[7] = t3;
34
+ $[6] = closeModal;
35
+ $[7] = drawerSlug;
36
+ $[8] = t3;
36
37
  } else {
37
- t3 = $[7];
38
+ t3 = $[8];
38
39
  }
39
40
  t2 = _jsxs(Gutter, {
40
41
  className: `${documentDrawerBaseClass}__header`,
@@ -52,15 +53,19 @@ export const DocumentDrawerHeader = t0 => {
52
53
  type: "button",
53
54
  children: _jsx(XIcon, {})
54
55
  })]
55
- }), showDocumentID && _jsx(DocumentID, {})]
56
+ }), showDocumentID && _jsx(DocumentID, {}), AfterHeader ? _jsx("div", {
57
+ className: `${documentDrawerBaseClass}__after-header`,
58
+ children: AfterHeader
59
+ }) : null]
56
60
  });
57
- $[0] = closeModal;
58
- $[1] = drawerSlug;
59
- $[2] = showDocumentID;
60
- $[3] = t;
61
- $[4] = t2;
61
+ $[0] = AfterHeader;
62
+ $[1] = closeModal;
63
+ $[2] = drawerSlug;
64
+ $[3] = showDocumentID;
65
+ $[4] = t;
66
+ $[5] = t2;
62
67
  } else {
63
- t2 = $[4];
68
+ t2 = $[5];
64
69
  }
65
70
  return t2;
66
71
  };
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["c","_c","Gutter","useModal","RenderTitle","XIcon","useDocumentInfo","useDocumentTitle","useTranslation","IDLabel","documentDrawerBaseClass","DocumentDrawerHeader","t0","$","drawerSlug","showDocumentID","t1","undefined","closeModal","t","t2","t3","_jsxs","className","children","_jsx","element","onClick","type","DocumentID","id","title","toString"],"sources":["../../../../src/elements/DocumentDrawer/DrawerHeader/index.tsx"],"sourcesContent":["'use client'\n\nimport { Gutter } from '../../../elements/Gutter/index.js'\nimport { useModal } from '../../../elements/Modal/index.js'\nimport { RenderTitle } from '../../../elements/RenderTitle/index.js'\nimport { XIcon } from '../../../icons/X/index.js'\nimport { useDocumentInfo } from '../../../providers/DocumentInfo/index.js'\nimport { useDocumentTitle } from '../../../providers/DocumentTitle/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { IDLabel } from '../../IDLabel/index.js'\nimport { documentDrawerBaseClass } from '../index.js'\nimport './index.scss'\n\nexport const DocumentDrawerHeader: React.FC<{\n drawerSlug: string\n showDocumentID?: boolean\n}> = ({ drawerSlug, showDocumentID = true }) => {\n const { closeModal } = useModal()\n const { t } = useTranslation()\n\n return (\n <Gutter className={`${documentDrawerBaseClass}__header`}>\n <div className={`${documentDrawerBaseClass}__header-content`}>\n <h2 className={`${documentDrawerBaseClass}__header-text`}>\n {<RenderTitle element=\"span\" />}\n </h2>\n <button\n aria-label={t('general:close')}\n className={`${documentDrawerBaseClass}__header-close`}\n onClick={() => closeModal(drawerSlug)}\n type=\"button\"\n >\n <XIcon />\n </button>\n </div>\n {showDocumentID && <DocumentID />}\n </Gutter>\n )\n}\n\nconst DocumentID: React.FC = () => {\n const { id } = useDocumentInfo()\n const { title } = useDocumentTitle()\n return id && id !== title ? <IDLabel id={id.toString()} /> : null\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAEA,SAASC,MAAM,QAAQ;AACvB,SAASC,QAAQ,QAAQ;AACzB,SAASC,WAAW,QAAQ;AAC5B,SAASC,KAAK,QAAQ;AACtB,SAASC,eAAe,QAAQ;AAChC,SAASC,gBAAgB,QAAQ;AACjC,SAASC,cAAc,QAAQ;AAC/B,SAASC,OAAO,QAAQ;AACxB,SAASC,uBAAuB,QAAQ;AACxC,OAAO;AAEP,OAAO,MAAMC,oBAAA,GAGRC,EAAA;EAAA,MAAAC,CAAA,GAAAZ,EAAA;EAAC;IAAAa,UAAA;IAAAC,cAAA,EAAAC;EAAA,IAAAJ,EAAqC;EAAvB,MAAAG,cAAA,GAAAC,EAAqB,KAAAC,SAAA,UAArBD,EAAqB;EACvC;IAAAE;EAAA,IAAuBf,QAAA;EACvB;IAAAgB;EAAA,IAAcX,cAAA;EAAA,IAAAY,EAAA;EAAA,IAAAP,CAAA,QAAAK,UAAA,IAAAL,CAAA,QAAAC,UAAA,IAAAD,CAAA,QAAAE,cAAA,IAAAF,CAAA,QAAAM,CAAA;IAAA,IAAAE,EAAA;IAAA,IAAAR,CAAA,QAAAK,UAAA,IAAAL,CAAA,QAAAC,UAAA;MAWGO,EAAA,GAAAA,CAAA,KAAMH,UAAA,CAAWJ,UAAA;MAAAD,CAAA,MAAAK,UAAA;MAAAL,CAAA,MAAAC,UAAA;MAAAD,CAAA,MAAAQ,EAAA;IAAA;MAAAA,EAAA,GAAAR,CAAA;IAAA;IARhCO,EAAA,GAAAE,KAAA,CAAApB,MAAA;MAAAqB,SAAA,EAAmB,GAAAb,uBAAA,UAAoC;MAAAc,QAAA,GACrDF,KAAA,CAAC;QAAAC,SAAA,EAAe,GAAAb,uBAAA,kBAA4C;QAAAc,QAAA,GAC1DC,IAAA,CAAC;UAAAF,SAAA,EAAc,GAAAb,uBAAA,eAAyC;UAAAc,QAAA,EACrDC,IAAA,CAAArB,WAAA;YAAAsB,OAAA,EAAqB;UAAA,C;YAExBD,IAAA,CAAC;UAAA,cACaN,CAAA,CAAE;UAAAI,SAAA,EACH,GAAAb,uBAAA,gBAA0C;UAAAiB,OAAA,EAC5CN,EAAiB;UAAAO,IAAA,EACrB;UAAAJ,QAAA,EAELC,IAAA,CAAApB,KAAA,IAAC;QAAA,C;UAGJU,cAAA,IAAkBU,IAAA,CAAAI,UAAA,IAAC;IAAA,C;;;;;;;;;SAdtBT,E;CAiBJ;AAEA,MAAMS,UAAA,GAAuBA,CAAA;EAAA,MAAAhB,CAAA,GAAAZ,EAAA;EAC3B;IAAA6B;EAAA,IAAexB,eAAA;EACf;IAAAyB;EAAA,IAAkBxB,gBAAA;EAAA,IAAAK,EAAA;EAAA,IAAAC,CAAA,QAAAiB,EAAA,IAAAjB,CAAA,QAAAkB,KAAA;IACXnB,EAAA,GAAAkB,EAAA,IAAMA,EAAA,KAAOC,KAAA,GAAQN,IAAA,CAAAhB,OAAA;MAAAqB,EAAA,EAAaA,EAAA,CAAAE,QAAA,CAAW;IAAA,C,QAAS;IAAAnB,CAAA,MAAAiB,EAAA;IAAAjB,CAAA,MAAAkB,KAAA;IAAAlB,CAAA,MAAAD,EAAA;EAAA;IAAAA,EAAA,GAAAC,CAAA;EAAA;EAAA,OAAtDD,EAAsD;AAAA,CAC/D","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["c","_c","Gutter","useModal","RenderTitle","XIcon","useDocumentInfo","useDocumentTitle","useTranslation","IDLabel","documentDrawerBaseClass","DocumentDrawerHeader","t0","$","AfterHeader","drawerSlug","showDocumentID","t1","undefined","closeModal","t","t2","t3","_jsxs","className","children","_jsx","element","onClick","type","DocumentID","id","title","toString"],"sources":["../../../../src/elements/DocumentDrawer/DrawerHeader/index.tsx"],"sourcesContent":["'use client'\n\nimport { Gutter } from '../../../elements/Gutter/index.js'\nimport { useModal } from '../../../elements/Modal/index.js'\nimport { RenderTitle } from '../../../elements/RenderTitle/index.js'\nimport { XIcon } from '../../../icons/X/index.js'\nimport { useDocumentInfo } from '../../../providers/DocumentInfo/index.js'\nimport { useDocumentTitle } from '../../../providers/DocumentTitle/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { IDLabel } from '../../IDLabel/index.js'\nimport { documentDrawerBaseClass } from '../index.js'\nimport './index.scss'\n\nexport const DocumentDrawerHeader: React.FC<{\n AfterHeader?: React.ReactNode\n drawerSlug: string\n showDocumentID?: boolean\n}> = ({ AfterHeader, drawerSlug, showDocumentID = true }) => {\n const { closeModal } = useModal()\n const { t } = useTranslation()\n\n return (\n <Gutter className={`${documentDrawerBaseClass}__header`}>\n <div className={`${documentDrawerBaseClass}__header-content`}>\n <h2 className={`${documentDrawerBaseClass}__header-text`}>\n {<RenderTitle element=\"span\" />}\n </h2>\n <button\n aria-label={t('general:close')}\n className={`${documentDrawerBaseClass}__header-close`}\n onClick={() => closeModal(drawerSlug)}\n type=\"button\"\n >\n <XIcon />\n </button>\n </div>\n {showDocumentID && <DocumentID />}\n {AfterHeader ? (\n <div className={`${documentDrawerBaseClass}__after-header`}>{AfterHeader}</div>\n ) : null}\n </Gutter>\n )\n}\n\nconst DocumentID: React.FC = () => {\n const { id } = useDocumentInfo()\n const { title } = useDocumentTitle()\n return id && id !== title ? <IDLabel id={id.toString()} /> : null\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAEA,SAASC,MAAM,QAAQ;AACvB,SAASC,QAAQ,QAAQ;AACzB,SAASC,WAAW,QAAQ;AAC5B,SAASC,KAAK,QAAQ;AACtB,SAASC,eAAe,QAAQ;AAChC,SAASC,gBAAgB,QAAQ;AACjC,SAASC,cAAc,QAAQ;AAC/B,SAASC,OAAO,QAAQ;AACxB,SAASC,uBAAuB,QAAQ;AACxC,OAAO;AAEP,OAAO,MAAMC,oBAAA,GAIRC,EAAA;EAAA,MAAAC,CAAA,GAAAZ,EAAA;EAAC;IAAAa,WAAA;IAAAC,UAAA;IAAAC,cAAA,EAAAC;EAAA,IAAAL,EAAkD;EAAvB,MAAAI,cAAA,GAAAC,EAAqB,KAAAC,SAAA,UAArBD,EAAqB;EACpD;IAAAE;EAAA,IAAuBhB,QAAA;EACvB;IAAAiB;EAAA,IAAcZ,cAAA;EAAA,IAAAa,EAAA;EAAA,IAAAR,CAAA,QAAAC,WAAA,IAAAD,CAAA,QAAAM,UAAA,IAAAN,CAAA,QAAAE,UAAA,IAAAF,CAAA,QAAAG,cAAA,IAAAH,CAAA,QAAAO,CAAA;IAAA,IAAAE,EAAA;IAAA,IAAAT,CAAA,QAAAM,UAAA,IAAAN,CAAA,QAAAE,UAAA;MAWGO,EAAA,GAAAA,CAAA,KAAMH,UAAA,CAAWJ,UAAA;MAAAF,CAAA,MAAAM,UAAA;MAAAN,CAAA,MAAAE,UAAA;MAAAF,CAAA,MAAAS,EAAA;IAAA;MAAAA,EAAA,GAAAT,CAAA;IAAA;IARhCQ,EAAA,GAAAE,KAAA,CAAArB,MAAA;MAAAsB,SAAA,EAAmB,GAAAd,uBAAA,UAAoC;MAAAe,QAAA,GACrDF,KAAA,CAAC;QAAAC,SAAA,EAAe,GAAAd,uBAAA,kBAA4C;QAAAe,QAAA,GAC1DC,IAAA,CAAC;UAAAF,SAAA,EAAc,GAAAd,uBAAA,eAAyC;UAAAe,QAAA,EACrDC,IAAA,CAAAtB,WAAA;YAAAuB,OAAA,EAAqB;UAAA,C;YAExBD,IAAA,CAAC;UAAA,cACaN,CAAA,CAAE;UAAAI,SAAA,EACH,GAAAd,uBAAA,gBAA0C;UAAAkB,OAAA,EAC5CN,EAAiB;UAAAO,IAAA,EACrB;UAAAJ,QAAA,EAELC,IAAA,CAAArB,KAAA,IAAC;QAAA,C;UAGJW,cAAA,IAAkBU,IAAA,CAAAI,UAAA,IAAC,GACnBhB,WAAA,GACCY,IAAA,CAAC;QAAAF,SAAA,EAAe,GAAAd,uBAAA,gBAA0C;QAAAe,QAAA,EAAGX;MAAA,C,QAC3D;IAAA,C;;;;;;;;;;SAjBNO,E;CAoBJ;AAEA,MAAMS,UAAA,GAAuBA,CAAA;EAAA,MAAAjB,CAAA,GAAAZ,EAAA;EAC3B;IAAA8B;EAAA,IAAezB,eAAA;EACf;IAAA0B;EAAA,IAAkBzB,gBAAA;EAAA,IAAAK,EAAA;EAAA,IAAAC,CAAA,QAAAkB,EAAA,IAAAlB,CAAA,QAAAmB,KAAA;IACXpB,EAAA,GAAAmB,EAAA,IAAMA,EAAA,KAAOC,KAAA,GAAQN,IAAA,CAAAjB,OAAA;MAAAsB,EAAA,EAAaA,EAAA,CAAAE,QAAA,CAAW;IAAA,C,QAAS;IAAApB,CAAA,MAAAkB,EAAA;IAAAlB,CAAA,MAAAmB,KAAA;IAAAnB,CAAA,MAAAD,EAAA;EAAA;IAAAA,EAAA,GAAAC,CAAA;EAAA;EAAA,OAAtDD,EAAsD;AAAA,CAC/D","ignoreList":[]}
@@ -8,7 +8,6 @@
8
8
  display: flex;
9
9
  flex-direction: column;
10
10
  gap: calc(var(--base) * 0.5);
11
- align-items: flex-start;
12
11
  border-bottom: 1px solid var(--theme-elevation-100);
13
12
  padding-bottom: var(--base);
14
13
  }
@@ -63,6 +62,10 @@
63
62
  }
64
63
  }
65
64
 
65
+ &__after-header {
66
+ padding-top: calc(var(--base) / 4);
67
+ }
68
+
66
69
  &__divider {
67
70
  height: 1px;
68
71
  background: var(--theme-elevation-100);
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentFields/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,4BAA4B,EAAE,MAAM,SAAS,CAAA;AAGxE,OAAO,KAAkB,MAAM,OAAO,CAAA;AAKtC,OAAO,cAAc,CAAA;AAIrB,KAAK,IAAI,GAAG;IACV,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtC,QAAQ,CAAC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvC,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtC,QAAQ,CAAC,cAAc,EAAE,4BAA4B,CAAA;IACrD,QAAQ,CAAC,MAAM,EAAE,WAAW,EAAE,CAAA;IAC9B,QAAQ,CAAC,gBAAgB,CAAC,EAAE,OAAO,CAAA;IACnC,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAA;IAC5B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAC3B,QAAQ,CAAC,kBAAkB,EAAE,MAAM,EAAE,CAAA;CACtC,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAmFzC,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentFields/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,4BAA4B,EAAE,MAAM,SAAS,CAAA;AAGxE,OAAO,KAAkB,MAAM,OAAO,CAAA;AAKtC,OAAO,cAAc,CAAA;AAIrB,KAAK,IAAI,GAAG;IACV,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtC,QAAQ,CAAC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvC,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtC,QAAQ,CAAC,cAAc,EAAE,4BAA4B,CAAA;IACrD,QAAQ,CAAC,MAAM,EAAE,WAAW,EAAE,CAAA;IAC9B,QAAQ,CAAC,gBAAgB,CAAC,EAAE,OAAO,CAAA;IACnC,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAA;IAC5B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAC3B,QAAQ,CAAC,kBAAkB,EAAE,MAAM,EAAE,CAAA;CACtC,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CA6EzC,CAAA"}
@@ -11,7 +11,6 @@ const baseClass = 'document-fields';
11
11
  export const DocumentFields = ({
12
12
  AfterFields,
13
13
  BeforeFields,
14
- Description,
15
14
  docPermissions,
16
15
  fields,
17
16
  forceSidebarWrap,
@@ -46,13 +45,7 @@ export const DocumentFields = ({
46
45
  className: `${baseClass}__main`,
47
46
  children: /*#__PURE__*/_jsxs(Gutter, {
48
47
  className: `${baseClass}__edit`,
49
- children: [isTrashed && /*#__PURE__*/_jsx(TrashBanner, {}), Description ? /*#__PURE__*/_jsx("header", {
50
- className: `${baseClass}__header`,
51
- children: /*#__PURE__*/_jsx("div", {
52
- className: `${baseClass}__sub-header`,
53
- children: Description
54
- })
55
- }) : null, BeforeFields, /*#__PURE__*/_jsx(RenderFields, {
48
+ children: [isTrashed && /*#__PURE__*/_jsx(TrashBanner, {}), BeforeFields, /*#__PURE__*/_jsx(RenderFields, {
56
49
  className: `${baseClass}__fields`,
57
50
  fields: mainFields,
58
51
  forceRender: true,
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["fieldIsSidebar","React","useMemo","RenderFields","Gutter","TrashBanner","baseClass","DocumentFields","AfterFields","BeforeFields","Description","docPermissions","fields","forceSidebarWrap","isTrashed","readOnly","schemaPathSegments","hasSidebarFields","mainFields","sidebarFields","reduce","acc","field","push","_jsxs","className","filter","Boolean","join","_jsx","forceRender","parentIndexPath","parentPath","parentSchemaPath","permissions"],"sources":["../../../src/elements/DocumentFields/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientField, SanitizedDocumentPermissions } from 'payload'\n\nimport { fieldIsSidebar } from 'payload/shared'\nimport React, { useMemo } from 'react'\n\nimport { RenderFields } from '../../forms/RenderFields/index.js'\nimport { Gutter } from '../Gutter/index.js'\nimport { TrashBanner } from '../TrashBanner/index.js'\nimport './index.scss'\n\nconst baseClass = 'document-fields'\n\ntype Args = {\n readonly AfterFields?: React.ReactNode\n readonly BeforeFields?: React.ReactNode\n readonly Description?: React.ReactNode\n readonly docPermissions: SanitizedDocumentPermissions\n readonly fields: ClientField[]\n readonly forceSidebarWrap?: boolean\n readonly isTrashed?: boolean\n readonly readOnly?: boolean\n readonly schemaPathSegments: string[]\n}\n\nexport const DocumentFields: React.FC<Args> = ({\n AfterFields,\n BeforeFields,\n Description,\n docPermissions,\n fields,\n forceSidebarWrap,\n isTrashed = false,\n readOnly,\n schemaPathSegments,\n}) => {\n const { hasSidebarFields, mainFields, sidebarFields } = useMemo(() => {\n return fields.reduce(\n (acc, field) => {\n if (fieldIsSidebar(field)) {\n acc.sidebarFields.push(field)\n acc.mainFields.push(null)\n acc.hasSidebarFields = true\n } else {\n acc.mainFields.push(field)\n acc.sidebarFields.push(null)\n }\n return acc\n },\n {\n hasSidebarFields: false,\n mainFields: [] as ClientField[],\n sidebarFields: [] as ClientField[],\n },\n )\n }, [fields])\n\n return (\n <div\n className={[\n baseClass,\n hasSidebarFields ? `${baseClass}--has-sidebar` : `${baseClass}--no-sidebar`,\n forceSidebarWrap && `${baseClass}--force-sidebar-wrap`,\n ]\n .filter(Boolean)\n .join(' ')}\n >\n <div className={`${baseClass}__main`}>\n <Gutter className={`${baseClass}__edit`}>\n {isTrashed && <TrashBanner />}\n {Description ? (\n <header className={`${baseClass}__header`}>\n <div className={`${baseClass}__sub-header`}>{Description}</div>\n </header>\n ) : null}\n {BeforeFields}\n <RenderFields\n className={`${baseClass}__fields`}\n fields={mainFields}\n forceRender\n parentIndexPath=\"\"\n parentPath=\"\"\n parentSchemaPath={schemaPathSegments.join('.')}\n permissions={docPermissions?.fields}\n readOnly={readOnly}\n />\n {AfterFields}\n </Gutter>\n </div>\n {hasSidebarFields ? (\n <div className={`${baseClass}__sidebar-wrap`}>\n <div className={`${baseClass}__sidebar`}>\n <div className={`${baseClass}__sidebar-fields`}>\n <RenderFields\n fields={sidebarFields}\n forceRender\n parentIndexPath=\"\"\n parentPath=\"\"\n parentSchemaPath={schemaPathSegments.join('.')}\n permissions={docPermissions?.fields}\n readOnly={readOnly}\n />\n </div>\n </div>\n </div>\n ) : null}\n </div>\n )\n}\n"],"mappings":"AAAA;;;AAGA,SAASA,cAAc,QAAQ;AAC/B,OAAOC,KAAA,IAASC,OAAO,QAAQ;AAE/B,SAASC,YAAY,QAAQ;AAC7B,SAASC,MAAM,QAAQ;AACvB,SAASC,WAAW,QAAQ;AAC5B,OAAO;AAEP,MAAMC,SAAA,GAAY;AAclB,OAAO,MAAMC,cAAA,GAAiCA,CAAC;EAC7CC,WAAW;EACXC,YAAY;EACZC,WAAW;EACXC,cAAc;EACdC,MAAM;EACNC,gBAAgB;EAChBC,SAAA,GAAY,KAAK;EACjBC,QAAQ;EACRC;AAAkB,CACnB;EACC,MAAM;IAAEC,gBAAgB;IAAEC,UAAU;IAAEC;EAAa,CAAE,GAAGjB,OAAA,CAAQ;IAC9D,OAAOU,MAAA,CAAOQ,MAAM,CAClB,CAACC,GAAA,EAAKC,KAAA;MACJ,IAAItB,cAAA,CAAesB,KAAA,GAAQ;QACzBD,GAAA,CAAIF,aAAa,CAACI,IAAI,CAACD,KAAA;QACvBD,GAAA,CAAIH,UAAU,CAACK,IAAI,CAAC;QACpBF,GAAA,CAAIJ,gBAAgB,GAAG;MACzB,OAAO;QACLI,GAAA,CAAIH,UAAU,CAACK,IAAI,CAACD,KAAA;QACpBD,GAAA,CAAIF,aAAa,CAACI,IAAI,CAAC;MACzB;MACA,OAAOF,GAAA;IACT,GACA;MACEJ,gBAAA,EAAkB;MAClBC,UAAA,EAAY,EAAE;MACdC,aAAA,EAAe;IACjB;EAEJ,GAAG,CAACP,MAAA,CAAO;EAEX,oBACEY,KAAA,CAAC;IACCC,SAAA,EAAW,CACTnB,SAAA,EACAW,gBAAA,GAAmB,GAAGX,SAAA,eAAwB,GAAG,GAAGA,SAAA,cAAuB,EAC3EO,gBAAA,IAAoB,GAAGP,SAAA,sBAA+B,CACvD,CACEoB,MAAM,CAACC,OAAA,EACPC,IAAI,CAAC;4BAERC,IAAA,CAAC;MAAIJ,SAAA,EAAW,GAAGnB,SAAA,QAAiB;gBAClC,aAAAkB,KAAA,CAACpB,MAAA;QAAOqB,SAAA,EAAW,GAAGnB,SAAA,QAAiB;mBACpCQ,SAAA,iBAAae,IAAA,CAACxB,WAAA,OACdK,WAAA,gBACCmB,IAAA,CAAC;UAAOJ,SAAA,EAAW,GAAGnB,SAAA,UAAmB;oBACvC,aAAAuB,IAAA,CAAC;YAAIJ,SAAA,EAAW,GAAGnB,SAAA,cAAuB;sBAAGI;;aAE7C,MACHD,YAAA,E,aACDoB,IAAA,CAAC1B,YAAA;UACCsB,SAAA,EAAW,GAAGnB,SAAA,UAAmB;UACjCM,MAAA,EAAQM,UAAA;UACRY,WAAW;UACXC,eAAA,EAAgB;UAChBC,UAAA,EAAW;UACXC,gBAAA,EAAkBjB,kBAAA,CAAmBY,IAAI,CAAC;UAC1CM,WAAA,EAAavB,cAAA,EAAgBC,MAAA;UAC7BG,QAAA,EAAUA;YAEXP,WAAA;;QAGJS,gBAAA,gBACCY,IAAA,CAAC;MAAIJ,SAAA,EAAW,GAAGnB,SAAA,gBAAyB;gBAC1C,aAAAuB,IAAA,CAAC;QAAIJ,SAAA,EAAW,GAAGnB,SAAA,WAAoB;kBACrC,aAAAuB,IAAA,CAAC;UAAIJ,SAAA,EAAW,GAAGnB,SAAA,kBAA2B;oBAC5C,aAAAuB,IAAA,CAAC1B,YAAA;YACCS,MAAA,EAAQO,aAAA;YACRW,WAAW;YACXC,eAAA,EAAgB;YAChBC,UAAA,EAAW;YACXC,gBAAA,EAAkBjB,kBAAA,CAAmBY,IAAI,CAAC;YAC1CM,WAAA,EAAavB,cAAA,EAAgBC,MAAA;YAC7BG,QAAA,EAAUA;;;;SAKhB;;AAGV","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["fieldIsSidebar","React","useMemo","RenderFields","Gutter","TrashBanner","baseClass","DocumentFields","AfterFields","BeforeFields","docPermissions","fields","forceSidebarWrap","isTrashed","readOnly","schemaPathSegments","hasSidebarFields","mainFields","sidebarFields","reduce","acc","field","push","_jsxs","className","filter","Boolean","join","_jsx","forceRender","parentIndexPath","parentPath","parentSchemaPath","permissions"],"sources":["../../../src/elements/DocumentFields/index.tsx"],"sourcesContent":["'use client'\nimport type { ClientField, SanitizedDocumentPermissions } from 'payload'\n\nimport { fieldIsSidebar } from 'payload/shared'\nimport React, { useMemo } from 'react'\n\nimport { RenderFields } from '../../forms/RenderFields/index.js'\nimport { Gutter } from '../Gutter/index.js'\nimport { TrashBanner } from '../TrashBanner/index.js'\nimport './index.scss'\n\nconst baseClass = 'document-fields'\n\ntype Args = {\n readonly AfterFields?: React.ReactNode\n readonly BeforeFields?: React.ReactNode\n readonly Description?: React.ReactNode\n readonly docPermissions: SanitizedDocumentPermissions\n readonly fields: ClientField[]\n readonly forceSidebarWrap?: boolean\n readonly isTrashed?: boolean\n readonly readOnly?: boolean\n readonly schemaPathSegments: string[]\n}\n\nexport const DocumentFields: React.FC<Args> = ({\n AfterFields,\n BeforeFields,\n docPermissions,\n fields,\n forceSidebarWrap,\n isTrashed = false,\n readOnly,\n schemaPathSegments,\n}) => {\n const { hasSidebarFields, mainFields, sidebarFields } = useMemo(() => {\n return fields.reduce(\n (acc, field) => {\n if (fieldIsSidebar(field)) {\n acc.sidebarFields.push(field)\n acc.mainFields.push(null)\n acc.hasSidebarFields = true\n } else {\n acc.mainFields.push(field)\n acc.sidebarFields.push(null)\n }\n return acc\n },\n {\n hasSidebarFields: false,\n mainFields: [] as ClientField[],\n sidebarFields: [] as ClientField[],\n },\n )\n }, [fields])\n\n return (\n <div\n className={[\n baseClass,\n hasSidebarFields ? `${baseClass}--has-sidebar` : `${baseClass}--no-sidebar`,\n forceSidebarWrap && `${baseClass}--force-sidebar-wrap`,\n ]\n .filter(Boolean)\n .join(' ')}\n >\n <div className={`${baseClass}__main`}>\n <Gutter className={`${baseClass}__edit`}>\n {isTrashed && <TrashBanner />}\n {BeforeFields}\n <RenderFields\n className={`${baseClass}__fields`}\n fields={mainFields}\n forceRender\n parentIndexPath=\"\"\n parentPath=\"\"\n parentSchemaPath={schemaPathSegments.join('.')}\n permissions={docPermissions?.fields}\n readOnly={readOnly}\n />\n {AfterFields}\n </Gutter>\n </div>\n {hasSidebarFields ? (\n <div className={`${baseClass}__sidebar-wrap`}>\n <div className={`${baseClass}__sidebar`}>\n <div className={`${baseClass}__sidebar-fields`}>\n <RenderFields\n fields={sidebarFields}\n forceRender\n parentIndexPath=\"\"\n parentPath=\"\"\n parentSchemaPath={schemaPathSegments.join('.')}\n permissions={docPermissions?.fields}\n readOnly={readOnly}\n />\n </div>\n </div>\n </div>\n ) : null}\n </div>\n )\n}\n"],"mappings":"AAAA;;;AAGA,SAASA,cAAc,QAAQ;AAC/B,OAAOC,KAAA,IAASC,OAAO,QAAQ;AAE/B,SAASC,YAAY,QAAQ;AAC7B,SAASC,MAAM,QAAQ;AACvB,SAASC,WAAW,QAAQ;AAC5B,OAAO;AAEP,MAAMC,SAAA,GAAY;AAclB,OAAO,MAAMC,cAAA,GAAiCA,CAAC;EAC7CC,WAAW;EACXC,YAAY;EACZC,cAAc;EACdC,MAAM;EACNC,gBAAgB;EAChBC,SAAA,GAAY,KAAK;EACjBC,QAAQ;EACRC;AAAkB,CACnB;EACC,MAAM;IAAEC,gBAAgB;IAAEC,UAAU;IAAEC;EAAa,CAAE,GAAGhB,OAAA,CAAQ;IAC9D,OAAOS,MAAA,CAAOQ,MAAM,CAClB,CAACC,GAAA,EAAKC,KAAA;MACJ,IAAIrB,cAAA,CAAeqB,KAAA,GAAQ;QACzBD,GAAA,CAAIF,aAAa,CAACI,IAAI,CAACD,KAAA;QACvBD,GAAA,CAAIH,UAAU,CAACK,IAAI,CAAC;QACpBF,GAAA,CAAIJ,gBAAgB,GAAG;MACzB,OAAO;QACLI,GAAA,CAAIH,UAAU,CAACK,IAAI,CAACD,KAAA;QACpBD,GAAA,CAAIF,aAAa,CAACI,IAAI,CAAC;MACzB;MACA,OAAOF,GAAA;IACT,GACA;MACEJ,gBAAA,EAAkB;MAClBC,UAAA,EAAY,EAAE;MACdC,aAAA,EAAe;IACjB;EAEJ,GAAG,CAACP,MAAA,CAAO;EAEX,oBACEY,KAAA,CAAC;IACCC,SAAA,EAAW,CACTlB,SAAA,EACAU,gBAAA,GAAmB,GAAGV,SAAA,eAAwB,GAAG,GAAGA,SAAA,cAAuB,EAC3EM,gBAAA,IAAoB,GAAGN,SAAA,sBAA+B,CACvD,CACEmB,MAAM,CAACC,OAAA,EACPC,IAAI,CAAC;4BAERC,IAAA,CAAC;MAAIJ,SAAA,EAAW,GAAGlB,SAAA,QAAiB;gBAClC,aAAAiB,KAAA,CAACnB,MAAA;QAAOoB,SAAA,EAAW,GAAGlB,SAAA,QAAiB;mBACpCO,SAAA,iBAAae,IAAA,CAACvB,WAAA,OACdI,YAAA,E,aACDmB,IAAA,CAACzB,YAAA;UACCqB,SAAA,EAAW,GAAGlB,SAAA,UAAmB;UACjCK,MAAA,EAAQM,UAAA;UACRY,WAAW;UACXC,eAAA,EAAgB;UAChBC,UAAA,EAAW;UACXC,gBAAA,EAAkBjB,kBAAA,CAAmBY,IAAI,CAAC;UAC1CM,WAAA,EAAavB,cAAA,EAAgBC,MAAA;UAC7BG,QAAA,EAAUA;YAEXN,WAAA;;QAGJQ,gBAAA,gBACCY,IAAA,CAAC;MAAIJ,SAAA,EAAW,GAAGlB,SAAA,gBAAyB;gBAC1C,aAAAsB,IAAA,CAAC;QAAIJ,SAAA,EAAW,GAAGlB,SAAA,WAAoB;kBACrC,aAAAsB,IAAA,CAAC;UAAIJ,SAAA,EAAW,GAAGlB,SAAA,kBAA2B;oBAC5C,aAAAsB,IAAA,CAACzB,YAAA;YACCQ,MAAA,EAAQO,aAAA;YACRW,WAAW;YACXC,eAAA,EAAgB;YAChBC,UAAA,EAAW;YACXC,gBAAA,EAAkBjB,kBAAA,CAAmBY,IAAI,CAAC;YAC1CM,WAAA,EAAavB,cAAA,EAAgBC,MAAA;YAC7BG,QAAA,EAAUA;;;;SAKhB;;AAGV","ignoreList":[]}
@@ -10,5 +10,6 @@
10
10
  padding: base(0.2) base(0.4);
11
11
  border-radius: $style-radius-m;
12
12
  display: inline-flex;
13
+ width: fit-content;
13
14
  }
14
15
  }
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/elements/QueryPresets/fields/WhereField/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,wBAAwB,EAAS,MAAM,SAAS,CAAA;AAY9D,OAAO,cAAc,CAAA;AA2ErB,eAAO,MAAM,sBAAsB,EAAE,wBAwBpC,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/elements/QueryPresets/fields/WhereField/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,wBAAwB,EAAS,MAAM,SAAS,CAAA;AAY9D,OAAO,cAAc,CAAA;AAgFrB,eAAO,MAAM,sBAAsB,EAAE,wBAwBpC,CAAA"}
@@ -22,17 +22,19 @@ const transformWhereToNaturalLanguage = (where, collectionLabel) => {
22
22
  return 'No where query';
23
23
  }
24
24
  const operator = Object.keys(condition[key])[0];
25
- let value = condition[key][operator];
26
- // TODO: this is not right, but works for now at least.
27
- // Ideally we look up iterate _fields_ so we know the type of the field
28
- // Currently, we're only iterating over the `where` field's value, so we don't know the type
29
- if (typeof value === 'object') {
30
- try {
31
- value = new Date(value).toLocaleDateString();
32
- } catch (_err) {
33
- value = 'Unknown error has occurred';
25
+ const operatorValue = condition[key][operator];
26
+ // Format value - ideally would use field schema for proper typing
27
+ const formatValue = val => {
28
+ if (typeof val === 'object' && val != null) {
29
+ try {
30
+ return new Date(val).toLocaleDateString();
31
+ } catch {
32
+ return 'Unknown error has occurred';
33
+ }
34
34
  }
35
- }
35
+ return val?.toString() ?? '';
36
+ };
37
+ const value = Array.isArray(operatorValue) ? operatorValue.map(formatValue).join(', ') : formatValue(operatorValue);
36
38
  return /*#__PURE__*/_jsxs(Pill, {
37
39
  pillStyle: "always-white",
38
40
  size: "small",
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["getTranslation","toWords","React","FieldLabel","useField","useConfig","useListQuery","useTranslation","Pill","transformWhereToNaturalLanguage","where","collectionLabel","renderCondition","condition","key","Object","keys","operator","value","Date","toLocaleDateString","_err","_jsxs","pillStyle","size","_jsx","renderWhere","or","length","className","map","orCondition","orIndex","Fragment","and","andCondition","andIndex","QueryPresetsWhereField","t0","field","t1","label","required","path","collectionSlug","getEntityConfig","collectionConfig","i18n","children","as","labels","plural"],"sources":["../../../../../src/elements/QueryPresets/fields/WhereField/index.tsx"],"sourcesContent":["'use client'\nimport type { JSONFieldClientComponent, Where } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { toWords } from 'payload/shared'\nimport React from 'react'\n\nimport { FieldLabel } from '../../../../fields/FieldLabel/index.js'\nimport { useField } from '../../../../forms/useField/index.js'\nimport { useConfig } from '../../../../providers/Config/index.js'\nimport { useListQuery } from '../../../../providers/ListQuery/index.js'\nimport { useTranslation } from '../../../../providers/Translation/index.js'\nimport { Pill } from '../../../Pill/index.js'\nimport './index.scss'\n\n/** @todo: improve this */\nconst transformWhereToNaturalLanguage = (\n where: Where,\n collectionLabel: string,\n): React.ReactNode => {\n if (!where) {\n return null\n }\n\n const renderCondition = (condition: any): React.ReactNode => {\n const key = Object.keys(condition)[0]\n\n if (!condition[key]) {\n return 'No where query'\n }\n\n const operator = Object.keys(condition[key])[0]\n let value = condition[key][operator]\n\n // TODO: this is not right, but works for now at least.\n // Ideally we look up iterate _fields_ so we know the type of the field\n // Currently, we're only iterating over the `where` field's value, so we don't know the type\n if (typeof value === 'object') {\n try {\n value = new Date(value).toLocaleDateString()\n } catch (_err) {\n value = 'Unknown error has occurred'\n }\n }\n\n return (\n <Pill pillStyle=\"always-white\" size=\"small\">\n <b>{toWords(key)}</b> {operator} <b>{toWords(value)}</b>\n </Pill>\n )\n }\n\n const renderWhere = (where: Where, collectionLabel: string): React.ReactNode => {\n if (where.or && where.or.length > 0) {\n return (\n <div className=\"or-condition\">\n {where.or.map((orCondition, orIndex) => (\n <React.Fragment key={orIndex}>\n {orCondition.and && orCondition.and.length > 0 ? (\n <div className=\"and-condition\">\n {orIndex === 0 && (\n <span className=\"label\">{`Filter ${collectionLabel} where `}</span>\n )}\n {orIndex > 0 && <span className=\"label\"> or </span>}\n {orCondition.and.map((andCondition, andIndex) => (\n <React.Fragment key={andIndex}>\n {renderCondition(andCondition)}\n {andIndex < orCondition.and.length - 1 && (\n <span className=\"label\"> and </span>\n )}\n </React.Fragment>\n ))}\n </div>\n ) : (\n renderCondition(orCondition)\n )}\n </React.Fragment>\n ))}\n </div>\n )\n }\n\n return renderCondition(where)\n }\n\n return renderWhere(where, collectionLabel)\n}\n\nexport const QueryPresetsWhereField: JSONFieldClientComponent = ({\n field: { label, required },\n}) => {\n const { path, value } = useField()\n const { collectionSlug } = useListQuery()\n const { getEntityConfig } = useConfig()\n\n const collectionConfig = getEntityConfig({ collectionSlug })\n\n const { i18n } = useTranslation()\n\n return (\n <div className=\"field-type query-preset-where-field\">\n <FieldLabel as=\"h3\" label={label} path={path} required={required} />\n <div className=\"value-wrapper\">\n {value\n ? transformWhereToNaturalLanguage(\n value as Where,\n getTranslation(collectionConfig?.labels?.plural, i18n),\n )\n : 'No where query'}\n </div>\n </div>\n )\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["getTranslation","toWords","React","FieldLabel","useField","useConfig","useListQuery","useTranslation","Pill","transformWhereToNaturalLanguage","where","collectionLabel","renderCondition","condition","key","Object","keys","operator","operatorValue","formatValue","val","Date","toLocaleDateString","toString","value","Array","isArray","map","join","_jsxs","pillStyle","size","_jsx","renderWhere","or","length","className","orCondition","orIndex","Fragment","and","andCondition","andIndex","QueryPresetsWhereField","t0","field","t1","label","required","path","collectionSlug","getEntityConfig","collectionConfig","i18n","children","as","labels","plural"],"sources":["../../../../../src/elements/QueryPresets/fields/WhereField/index.tsx"],"sourcesContent":["'use client'\nimport type { JSONFieldClientComponent, Where } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { toWords } from 'payload/shared'\nimport React from 'react'\n\nimport { FieldLabel } from '../../../../fields/FieldLabel/index.js'\nimport { useField } from '../../../../forms/useField/index.js'\nimport { useConfig } from '../../../../providers/Config/index.js'\nimport { useListQuery } from '../../../../providers/ListQuery/index.js'\nimport { useTranslation } from '../../../../providers/Translation/index.js'\nimport { Pill } from '../../../Pill/index.js'\nimport './index.scss'\n\n/** @todo: improve this */\nconst transformWhereToNaturalLanguage = (\n where: Where,\n collectionLabel: string,\n): React.ReactNode => {\n if (!where) {\n return null\n }\n\n const renderCondition = (condition: any): React.ReactNode => {\n const key = Object.keys(condition)[0]\n\n if (!condition[key]) {\n return 'No where query'\n }\n\n const operator = Object.keys(condition[key])[0]\n const operatorValue = condition[key][operator]\n\n // Format value - ideally would use field schema for proper typing\n const formatValue = (val: any): string => {\n if (typeof val === 'object' && val != null) {\n try {\n return new Date(val).toLocaleDateString()\n } catch {\n return 'Unknown error has occurred'\n }\n }\n return val?.toString() ?? ''\n }\n\n const value = Array.isArray(operatorValue)\n ? operatorValue.map(formatValue).join(', ')\n : formatValue(operatorValue)\n\n return (\n <Pill pillStyle=\"always-white\" size=\"small\">\n <b>{toWords(key)}</b> {operator} <b>{toWords(value)}</b>\n </Pill>\n )\n }\n\n const renderWhere = (where: Where, collectionLabel: string): React.ReactNode => {\n if (where.or && where.or.length > 0) {\n return (\n <div className=\"or-condition\">\n {where.or.map((orCondition, orIndex) => (\n <React.Fragment key={orIndex}>\n {orCondition.and && orCondition.and.length > 0 ? (\n <div className=\"and-condition\">\n {orIndex === 0 && (\n <span className=\"label\">{`Filter ${collectionLabel} where `}</span>\n )}\n {orIndex > 0 && <span className=\"label\"> or </span>}\n {orCondition.and.map((andCondition, andIndex) => (\n <React.Fragment key={andIndex}>\n {renderCondition(andCondition)}\n {andIndex < orCondition.and.length - 1 && (\n <span className=\"label\"> and </span>\n )}\n </React.Fragment>\n ))}\n </div>\n ) : (\n renderCondition(orCondition)\n )}\n </React.Fragment>\n ))}\n </div>\n )\n }\n\n return renderCondition(where)\n }\n\n return renderWhere(where, collectionLabel)\n}\n\nexport const QueryPresetsWhereField: JSONFieldClientComponent = ({\n field: { label, required },\n}) => {\n const { path, value } = useField()\n const { collectionSlug } = useListQuery()\n const { getEntityConfig } = useConfig()\n\n const collectionConfig = getEntityConfig({ collectionSlug })\n\n const { i18n } = useTranslation()\n\n return (\n <div className=\"field-type query-preset-where-field\">\n <FieldLabel as=\"h3\" label={label} path={path} required={required} />\n <div className=\"value-wrapper\">\n {value\n ? transformWhereToNaturalLanguage(\n value as Where,\n getTranslation(collectionConfig?.labels?.plural, i18n),\n )\n : 'No where query'}\n </div>\n </div>\n )\n}\n"],"mappings":"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","ignoreList":[]}