@payloadcms/ui 3.0.0-beta.37 → 3.0.0-beta.38

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.
Files changed (176) hide show
  1. package/dist/elements/DocumentFields/index.d.ts.map +1 -1
  2. package/dist/elements/DocumentFields/index.js +2 -0
  3. package/dist/elements/DocumentFields/index.js.map +1 -1
  4. package/dist/elements/DocumentHeader/Tabs/Tab/index.scss +3 -1
  5. package/dist/elements/DocumentHeader/Tabs/tabs/VersionsPill/index.d.ts.map +1 -1
  6. package/dist/elements/DocumentHeader/Tabs/tabs/VersionsPill/index.js +14 -8
  7. package/dist/elements/DocumentHeader/Tabs/tabs/VersionsPill/index.js.map +1 -1
  8. package/dist/elements/ReactSelect/Input/index.d.ts +5 -0
  9. package/dist/elements/ReactSelect/Input/index.d.ts.map +1 -0
  10. package/dist/elements/ReactSelect/Input/index.js +17 -0
  11. package/dist/elements/ReactSelect/Input/index.js.map +1 -0
  12. package/dist/elements/ReactSelect/MultiValue/index.d.ts.map +1 -1
  13. package/dist/elements/ReactSelect/MultiValue/index.js +7 -5
  14. package/dist/elements/ReactSelect/MultiValue/index.js.map +1 -1
  15. package/dist/elements/ReactSelect/index.d.ts.map +1 -1
  16. package/dist/elements/ReactSelect/index.js +17 -1
  17. package/dist/elements/ReactSelect/index.js.map +1 -1
  18. package/dist/elements/RenderTitle/index.d.ts.map +1 -1
  19. package/dist/elements/RenderTitle/index.js +12 -7
  20. package/dist/elements/RenderTitle/index.js.map +1 -1
  21. package/dist/elements/Table/DefaultCell/fields/Relationship/index.js +1 -1
  22. package/dist/elements/Table/DefaultCell/fields/Relationship/index.js.map +1 -1
  23. package/dist/elements/WhereBuilder/Condition/Relationship/index.d.ts.map +1 -1
  24. package/dist/elements/WhereBuilder/Condition/Relationship/index.js +104 -72
  25. package/dist/elements/WhereBuilder/Condition/Relationship/index.js.map +1 -1
  26. package/dist/elements/WhereBuilder/Condition/index.js +3 -3
  27. package/dist/elements/WhereBuilder/Condition/index.js.map +1 -1
  28. package/dist/elements/WhereBuilder/index.d.ts.map +1 -1
  29. package/dist/elements/WhereBuilder/index.js +49 -49
  30. package/dist/elements/WhereBuilder/index.js.map +1 -1
  31. package/dist/fields/Array/index.d.ts.map +1 -1
  32. package/dist/fields/Array/index.js +6 -6
  33. package/dist/fields/Array/index.js.map +1 -1
  34. package/dist/fields/Blocks/index.d.ts.map +1 -1
  35. package/dist/fields/Blocks/index.js +6 -6
  36. package/dist/fields/Blocks/index.js.map +1 -1
  37. package/dist/fields/Checkbox/index.d.ts.map +1 -1
  38. package/dist/fields/Checkbox/index.js +6 -6
  39. package/dist/fields/Checkbox/index.js.map +1 -1
  40. package/dist/fields/Code/index.d.ts.map +1 -1
  41. package/dist/fields/Code/index.js +5 -5
  42. package/dist/fields/Code/index.js.map +1 -1
  43. package/dist/fields/Collapsible/index.d.ts.map +1 -1
  44. package/dist/fields/Collapsible/index.js +5 -2
  45. package/dist/fields/Collapsible/index.js.map +1 -1
  46. package/dist/fields/DateTime/index.js +5 -5
  47. package/dist/fields/DateTime/index.js.map +1 -1
  48. package/dist/fields/Email/index.d.ts.map +1 -1
  49. package/dist/fields/Email/index.js +4 -4
  50. package/dist/fields/Email/index.js.map +1 -1
  51. package/dist/fields/Group/index.d.ts.map +1 -1
  52. package/dist/fields/Group/index.js +5 -3
  53. package/dist/fields/Group/index.js.map +1 -1
  54. package/dist/fields/JSON/index.d.ts.map +1 -1
  55. package/dist/fields/JSON/index.js +7 -7
  56. package/dist/fields/JSON/index.js.map +1 -1
  57. package/dist/fields/Number/index.d.ts.map +1 -1
  58. package/dist/fields/Number/index.js +7 -7
  59. package/dist/fields/Number/index.js.map +1 -1
  60. package/dist/fields/Password/index.d.ts.map +1 -1
  61. package/dist/fields/Password/index.js +6 -4
  62. package/dist/fields/Password/index.js.map +1 -1
  63. package/dist/fields/RadioGroup/index.d.ts.map +1 -1
  64. package/dist/fields/RadioGroup/index.js +5 -5
  65. package/dist/fields/RadioGroup/index.js.map +1 -1
  66. package/dist/fields/Relationship/findOptionsByValue.js +1 -1
  67. package/dist/fields/Relationship/findOptionsByValue.js.map +1 -1
  68. package/dist/fields/Relationship/index.d.ts.map +1 -1
  69. package/dist/fields/Relationship/index.js +2 -4
  70. package/dist/fields/Relationship/index.js.map +1 -1
  71. package/dist/fields/Select/index.d.ts.map +1 -1
  72. package/dist/fields/Select/index.js +5 -5
  73. package/dist/fields/Select/index.js.map +1 -1
  74. package/dist/fields/Tabs/index.d.ts.map +1 -1
  75. package/dist/fields/Tabs/index.js.map +1 -1
  76. package/dist/fields/Text/index.d.ts.map +1 -1
  77. package/dist/fields/Text/index.js +5 -5
  78. package/dist/fields/Text/index.js.map +1 -1
  79. package/dist/fields/Textarea/index.d.ts.map +1 -1
  80. package/dist/fields/Textarea/index.js +3 -3
  81. package/dist/fields/Textarea/index.js.map +1 -1
  82. package/dist/fields/Upload/index.d.ts.map +1 -1
  83. package/dist/fields/Upload/index.js +3 -3
  84. package/dist/fields/Upload/index.js.map +1 -1
  85. package/dist/forms/FieldPropsProvider/index.d.ts +1 -0
  86. package/dist/forms/FieldPropsProvider/index.d.ts.map +1 -1
  87. package/dist/forms/FieldPropsProvider/index.js.map +1 -1
  88. package/dist/forms/Form/context.d.ts +3 -1
  89. package/dist/forms/Form/context.d.ts.map +1 -1
  90. package/dist/forms/Form/context.js +3 -1
  91. package/dist/forms/Form/context.js.map +1 -1
  92. package/dist/forms/Form/getSiblingData.d.ts.map +1 -1
  93. package/dist/forms/Form/getSiblingData.js +1 -0
  94. package/dist/forms/Form/getSiblingData.js.map +1 -1
  95. package/dist/forms/Form/index.d.ts.map +1 -1
  96. package/dist/forms/Form/index.js +28 -11
  97. package/dist/forms/Form/index.js.map +1 -1
  98. package/dist/forms/Form/initContextState.d.ts.map +1 -1
  99. package/dist/forms/Form/initContextState.js +1 -0
  100. package/dist/forms/Form/initContextState.js.map +1 -1
  101. package/dist/forms/Form/types.d.ts +2 -0
  102. package/dist/forms/Form/types.d.ts.map +1 -1
  103. package/dist/forms/Form/types.js.map +1 -1
  104. package/dist/forms/RenderFields/index.d.ts.map +1 -1
  105. package/dist/forms/RenderFields/index.js +6 -2
  106. package/dist/forms/RenderFields/index.js.map +1 -1
  107. package/dist/forms/RenderFields/types.d.ts +8 -1
  108. package/dist/forms/RenderFields/types.d.ts.map +1 -1
  109. package/dist/forms/RenderFields/types.js.map +1 -1
  110. package/dist/forms/Submit/index.d.ts.map +1 -1
  111. package/dist/forms/Submit/index.js +3 -2
  112. package/dist/forms/Submit/index.js.map +1 -1
  113. package/dist/forms/buildStateFromSchema/calculateDefaultValues/index.d.ts +5 -3
  114. package/dist/forms/buildStateFromSchema/calculateDefaultValues/index.d.ts.map +1 -1
  115. package/dist/forms/buildStateFromSchema/calculateDefaultValues/index.js +4 -3
  116. package/dist/forms/buildStateFromSchema/calculateDefaultValues/index.js.map +1 -1
  117. package/dist/forms/buildStateFromSchema/calculateDefaultValues/iterateFields.d.ts +5 -3
  118. package/dist/forms/buildStateFromSchema/calculateDefaultValues/iterateFields.d.ts.map +1 -1
  119. package/dist/forms/buildStateFromSchema/calculateDefaultValues/iterateFields.js +4 -3
  120. package/dist/forms/buildStateFromSchema/calculateDefaultValues/iterateFields.js.map +1 -1
  121. package/dist/forms/buildStateFromSchema/calculateDefaultValues/promise.d.ts +5 -3
  122. package/dist/forms/buildStateFromSchema/calculateDefaultValues/promise.d.ts.map +1 -1
  123. package/dist/forms/buildStateFromSchema/calculateDefaultValues/promise.js +21 -15
  124. package/dist/forms/buildStateFromSchema/calculateDefaultValues/promise.js.map +1 -1
  125. package/dist/forms/buildStateFromSchema/index.d.ts.map +1 -1
  126. package/dist/forms/buildStateFromSchema/index.js +3 -2
  127. package/dist/forms/buildStateFromSchema/index.js.map +1 -1
  128. package/dist/forms/useField/index.d.ts.map +1 -1
  129. package/dist/forms/useField/index.js +5 -2
  130. package/dist/forms/useField/index.js.map +1 -1
  131. package/dist/forms/useField/types.d.ts +1 -0
  132. package/dist/forms/useField/types.d.ts.map +1 -1
  133. package/dist/forms/useField/types.js.map +1 -1
  134. package/dist/icons/Plus/index.d.ts.map +1 -1
  135. package/dist/icons/Plus/index.js +1 -0
  136. package/dist/icons/Plus/index.js.map +1 -1
  137. package/dist/icons/Plus/index.scss +0 -3
  138. package/dist/providers/ComponentMap/buildComponentMap/fields.d.ts.map +1 -1
  139. package/dist/providers/ComponentMap/buildComponentMap/fields.js +1 -0
  140. package/dist/providers/ComponentMap/buildComponentMap/fields.js.map +1 -1
  141. package/dist/providers/DocumentInfo/index.d.ts.map +1 -1
  142. package/dist/providers/DocumentInfo/index.js +67 -53
  143. package/dist/providers/DocumentInfo/index.js.map +1 -1
  144. package/dist/providers/DocumentInfo/types.d.ts +4 -0
  145. package/dist/providers/DocumentInfo/types.d.ts.map +1 -1
  146. package/dist/providers/DocumentInfo/types.js.map +1 -1
  147. package/dist/providers/Root/index.d.ts +1 -2
  148. package/dist/providers/Root/index.d.ts.map +1 -1
  149. package/dist/providers/Root/index.js.map +1 -1
  150. package/dist/providers/Translation/index.d.ts +1 -5
  151. package/dist/providers/Translation/index.d.ts.map +1 -1
  152. package/dist/providers/Translation/index.js.map +1 -1
  153. package/dist/utilities/buildFieldSchemaMap/index.d.ts +8 -0
  154. package/dist/utilities/buildFieldSchemaMap/index.d.ts.map +1 -0
  155. package/dist/utilities/buildFieldSchemaMap/index.js +29 -0
  156. package/dist/utilities/buildFieldSchemaMap/index.js.map +1 -0
  157. package/dist/utilities/buildFieldSchemaMap/traverseFields.d.ts +14 -0
  158. package/dist/utilities/buildFieldSchemaMap/traverseFields.d.ts.map +1 -0
  159. package/dist/utilities/buildFieldSchemaMap/traverseFields.js +75 -0
  160. package/dist/utilities/buildFieldSchemaMap/traverseFields.js.map +1 -0
  161. package/dist/utilities/buildFieldSchemaMap/types.d.ts +3 -0
  162. package/dist/utilities/buildFieldSchemaMap/types.d.ts.map +1 -0
  163. package/dist/utilities/buildFieldSchemaMap/types.js +3 -0
  164. package/dist/utilities/buildFieldSchemaMap/types.js.map +1 -0
  165. package/dist/utilities/buildFormState.d.ts +7 -0
  166. package/dist/utilities/buildFormState.d.ts.map +1 -0
  167. package/dist/utilities/buildFormState.js +162 -0
  168. package/dist/utilities/buildFormState.js.map +1 -0
  169. package/dist/utilities/getFormState.d.ts +1 -0
  170. package/dist/utilities/getFormState.d.ts.map +1 -1
  171. package/dist/utilities/getFormState.js +5 -2
  172. package/dist/utilities/getFormState.js.map +1 -1
  173. package/dist/utilities/reduceFieldsToValues.d.ts.map +1 -1
  174. package/dist/utilities/reduceFieldsToValues.js +1 -0
  175. package/dist/utilities/reduceFieldsToValues.js.map +1 -1
  176. package/package.json +5 -5
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentFields/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAA;AAErE,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,yDAAyD,CAAA;AAIvF,OAAO,cAAc,CAAA;AAIrB,KAAK,IAAI,GAAG;IACV,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B,WAAW,CAAC,EAAE,WAAW,CAAA;IACzB,cAAc,EAAE,mBAAmB,CAAA;IACnC,QAAQ,EAAE,QAAQ,CAAA;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,QAAQ,EAAE,OAAO,CAAA;IACjB,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAkEzC,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentFields/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAA;AAErE,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,yDAAyD,CAAA;AAIvF,OAAO,cAAc,CAAA;AAIrB,KAAK,IAAI,GAAG;IACV,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B,WAAW,CAAC,EAAE,WAAW,CAAA;IACzB,cAAc,EAAE,mBAAmB,CAAA;IACnC,QAAQ,EAAE,QAAQ,CAAA;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,QAAQ,EAAE,OAAO,CAAA;IACjB,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAoEzC,CAAA"}
@@ -31,6 +31,7 @@ export const DocumentFields = ({ AfterFields, BeforeFields, description, docPerm
31
31
  /*#__PURE__*/ _jsx(RenderFields, {
32
32
  className: `${baseClass}__fields`,
33
33
  fieldMap: mainFields,
34
+ forceRender: 10,
34
35
  path: "",
35
36
  permissions: docPermissions?.fields,
36
37
  readOnly: readOnly,
@@ -48,6 +49,7 @@ export const DocumentFields = ({ AfterFields, BeforeFields, description, docPerm
48
49
  className: `${baseClass}__sidebar-fields`,
49
50
  children: /*#__PURE__*/ _jsx(RenderFields, {
50
51
  fieldMap: sidebarFields,
52
+ forceRender: 10,
51
53
  path: "",
52
54
  permissions: docPermissions?.fields,
53
55
  readOnly: readOnly,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/elements/DocumentFields/index.tsx"],"sourcesContent":["'use client'\nimport type { Description, DocumentPermissions } from 'payload/types'\n\nimport React from 'react'\n\nimport type { FieldMap } from '../../providers/ComponentMap/buildComponentMap/types.js'\n\nimport { RenderFields } from '../../forms/RenderFields/index.js'\nimport { Gutter } from '../Gutter/index.js'\nimport './index.scss'\n\nconst baseClass = 'document-fields'\n\ntype Args = {\n AfterFields?: React.ReactNode\n BeforeFields?: React.ReactNode\n description?: Description\n docPermissions: DocumentPermissions\n fieldMap: FieldMap\n forceSidebarWrap?: boolean\n readOnly: boolean\n schemaPath: string\n}\n\nexport const DocumentFields: React.FC<Args> = ({\n AfterFields,\n BeforeFields,\n description,\n docPermissions,\n fieldMap,\n forceSidebarWrap,\n readOnly,\n schemaPath,\n}) => {\n const mainFields = fieldMap.filter(({ isSidebar }) => !isSidebar)\n\n const sidebarFields = fieldMap.filter(({ isSidebar }) => isSidebar)\n\n const hasSidebarFields = sidebarFields && sidebarFields.length > 0\n\n return (\n <React.Fragment>\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 <header className={`${baseClass}__header`}>\n {description && (\n <div className={`${baseClass}__sub-header`}>\n {/* <ViewDescription description={description} /> */}\n </div>\n )}\n </header>\n {BeforeFields}\n <RenderFields\n className={`${baseClass}__fields`}\n fieldMap={mainFields}\n path=\"\"\n permissions={docPermissions?.fields}\n readOnly={readOnly}\n schemaPath={schemaPath}\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 fieldMap={sidebarFields}\n path=\"\"\n permissions={docPermissions?.fields}\n readOnly={readOnly}\n schemaPath={schemaPath}\n />\n </div>\n </div>\n </div>\n )}\n </div>\n </React.Fragment>\n )\n}\n"],"names":["React","RenderFields","Gutter","baseClass","DocumentFields","AfterFields","BeforeFields","description","docPermissions","fieldMap","forceSidebarWrap","readOnly","schemaPath","mainFields","filter","isSidebar","sidebarFields","hasSidebarFields","length","Fragment","div","className","Boolean","join","header","path","permissions","fields"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,OAAOA,WAAW,QAAO;AAIzB,SAASC,YAAY,QAAQ,oCAAmC;AAChE,SAASC,MAAM,QAAQ,qBAAoB;AAG3C,MAAMC,YAAY;AAalB,OAAO,MAAMC,iBAAiC,CAAC,EAC7CC,WAAW,EACXC,YAAY,EACZC,WAAW,EACXC,cAAc,EACdC,QAAQ,EACRC,gBAAgB,EAChBC,QAAQ,EACRC,UAAU,EACX;IACC,MAAMC,aAAaJ,SAASK,MAAM,CAAC,CAAC,EAAEC,SAAS,EAAE,GAAK,CAACA;IAEvD,MAAMC,gBAAgBP,SAASK,MAAM,CAAC,CAAC,EAAEC,SAAS,EAAE,GAAKA;IAEzD,MAAME,mBAAmBD,iBAAiBA,cAAcE,MAAM,GAAG;IAEjE,qBACE,KAAClB,MAAMmB,QAAQ;kBACb,cAAA,MAACC;YACCC,WAAW;gBACTlB;gBACAc,mBAAmB,CAAC,EAAEd,UAAU,aAAa,CAAC,GAAG,CAAC,EAAEA,UAAU,YAAY,CAAC;gBAC3EO,oBAAoB,CAAC,EAAEP,UAAU,oBAAoB,CAAC;aACvD,CACEW,MAAM,CAACQ,SACPC,IAAI,CAAC;;8BAER,KAACH;oBAAIC,WAAW,CAAC,EAAElB,UAAU,MAAM,CAAC;8BAClC,cAAA,MAACD;wBAAOmB,WAAW,CAAC,EAAElB,UAAU,MAAM,CAAC;;0CACrC,KAACqB;gCAAOH,WAAW,CAAC,EAAElB,UAAU,QAAQ,CAAC;0CACtCI,6BACC,KAACa;oCAAIC,WAAW,CAAC,EAAElB,UAAU,YAAY,CAAC;;;4BAK7CG;0CACD,KAACL;gCACCoB,WAAW,CAAC,EAAElB,UAAU,QAAQ,CAAC;gCACjCM,UAAUI;gCACVY,MAAK;gCACLC,aAAalB,gBAAgBmB;gCAC7BhB,UAAUA;gCACVC,YAAYA;;4BAEbP;;;;gBAGJY,kCACC,KAACG;oBAAIC,WAAW,CAAC,EAAElB,UAAU,cAAc,CAAC;8BAC1C,cAAA,KAACiB;wBAAIC,WAAW,CAAC,EAAElB,UAAU,SAAS,CAAC;kCACrC,cAAA,KAACiB;4BAAIC,WAAW,CAAC,EAAElB,UAAU,gBAAgB,CAAC;sCAC5C,cAAA,KAACF;gCACCQ,UAAUO;gCACVS,MAAK;gCACLC,aAAalB,gBAAgBmB;gCAC7BhB,UAAUA;gCACVC,YAAYA;;;;;;;;AAS9B,EAAC"}
1
+ {"version":3,"sources":["../../../src/elements/DocumentFields/index.tsx"],"sourcesContent":["'use client'\nimport type { Description, DocumentPermissions } from 'payload/types'\n\nimport React from 'react'\n\nimport type { FieldMap } from '../../providers/ComponentMap/buildComponentMap/types.js'\n\nimport { RenderFields } from '../../forms/RenderFields/index.js'\nimport { Gutter } from '../Gutter/index.js'\nimport './index.scss'\n\nconst baseClass = 'document-fields'\n\ntype Args = {\n AfterFields?: React.ReactNode\n BeforeFields?: React.ReactNode\n description?: Description\n docPermissions: DocumentPermissions\n fieldMap: FieldMap\n forceSidebarWrap?: boolean\n readOnly: boolean\n schemaPath: string\n}\n\nexport const DocumentFields: React.FC<Args> = ({\n AfterFields,\n BeforeFields,\n description,\n docPermissions,\n fieldMap,\n forceSidebarWrap,\n readOnly,\n schemaPath,\n}) => {\n const mainFields = fieldMap.filter(({ isSidebar }) => !isSidebar)\n\n const sidebarFields = fieldMap.filter(({ isSidebar }) => isSidebar)\n\n const hasSidebarFields = sidebarFields && sidebarFields.length > 0\n\n return (\n <React.Fragment>\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 <header className={`${baseClass}__header`}>\n {description && (\n <div className={`${baseClass}__sub-header`}>\n {/* <ViewDescription description={description} /> */}\n </div>\n )}\n </header>\n {BeforeFields}\n <RenderFields\n className={`${baseClass}__fields`}\n fieldMap={mainFields}\n forceRender={10}\n path=\"\"\n permissions={docPermissions?.fields}\n readOnly={readOnly}\n schemaPath={schemaPath}\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 fieldMap={sidebarFields}\n forceRender={10}\n path=\"\"\n permissions={docPermissions?.fields}\n readOnly={readOnly}\n schemaPath={schemaPath}\n />\n </div>\n </div>\n </div>\n )}\n </div>\n </React.Fragment>\n )\n}\n"],"names":["React","RenderFields","Gutter","baseClass","DocumentFields","AfterFields","BeforeFields","description","docPermissions","fieldMap","forceSidebarWrap","readOnly","schemaPath","mainFields","filter","isSidebar","sidebarFields","hasSidebarFields","length","Fragment","div","className","Boolean","join","header","forceRender","path","permissions","fields"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,OAAOA,WAAW,QAAO;AAIzB,SAASC,YAAY,QAAQ,oCAAmC;AAChE,SAASC,MAAM,QAAQ,qBAAoB;AAG3C,MAAMC,YAAY;AAalB,OAAO,MAAMC,iBAAiC,CAAC,EAC7CC,WAAW,EACXC,YAAY,EACZC,WAAW,EACXC,cAAc,EACdC,QAAQ,EACRC,gBAAgB,EAChBC,QAAQ,EACRC,UAAU,EACX;IACC,MAAMC,aAAaJ,SAASK,MAAM,CAAC,CAAC,EAAEC,SAAS,EAAE,GAAK,CAACA;IAEvD,MAAMC,gBAAgBP,SAASK,MAAM,CAAC,CAAC,EAAEC,SAAS,EAAE,GAAKA;IAEzD,MAAME,mBAAmBD,iBAAiBA,cAAcE,MAAM,GAAG;IAEjE,qBACE,KAAClB,MAAMmB,QAAQ;kBACb,cAAA,MAACC;YACCC,WAAW;gBACTlB;gBACAc,mBAAmB,CAAC,EAAEd,UAAU,aAAa,CAAC,GAAG,CAAC,EAAEA,UAAU,YAAY,CAAC;gBAC3EO,oBAAoB,CAAC,EAAEP,UAAU,oBAAoB,CAAC;aACvD,CACEW,MAAM,CAACQ,SACPC,IAAI,CAAC;;8BAER,KAACH;oBAAIC,WAAW,CAAC,EAAElB,UAAU,MAAM,CAAC;8BAClC,cAAA,MAACD;wBAAOmB,WAAW,CAAC,EAAElB,UAAU,MAAM,CAAC;;0CACrC,KAACqB;gCAAOH,WAAW,CAAC,EAAElB,UAAU,QAAQ,CAAC;0CACtCI,6BACC,KAACa;oCAAIC,WAAW,CAAC,EAAElB,UAAU,YAAY,CAAC;;;4BAK7CG;0CACD,KAACL;gCACCoB,WAAW,CAAC,EAAElB,UAAU,QAAQ,CAAC;gCACjCM,UAAUI;gCACVY,aAAa;gCACbC,MAAK;gCACLC,aAAanB,gBAAgBoB;gCAC7BjB,UAAUA;gCACVC,YAAYA;;4BAEbP;;;;gBAGJY,kCACC,KAACG;oBAAIC,WAAW,CAAC,EAAElB,UAAU,cAAc,CAAC;8BAC1C,cAAA,KAACiB;wBAAIC,WAAW,CAAC,EAAElB,UAAU,SAAS,CAAC;kCACrC,cAAA,KAACiB;4BAAIC,WAAW,CAAC,EAAElB,UAAU,gBAAgB,CAAC;sCAC5C,cAAA,KAACF;gCACCQ,UAAUO;gCACVS,aAAa;gCACbC,MAAK;gCACLC,aAAanB,gBAAgBoB;gCAC7BjB,UAAUA;gCACVC,YAAYA;;;;;;;;AAS9B,EAAC"}
@@ -82,7 +82,9 @@
82
82
  }
83
83
 
84
84
  &__count {
85
- padding: 0px 7px;
85
+ min-width: 22px;
86
+ text-align: center;
87
+ padding: 2px 7px;
86
88
  background-color: var(--theme-elevation-100);
87
89
  border-radius: 1px;
88
90
  }
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/elements/DocumentHeader/Tabs/tabs/VersionsPill/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAQhC,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/elements/DocumentHeader/Tabs/tabs/VersionsPill/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAKvC,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAiBhC,CAAA"}
@@ -1,17 +1,23 @@
1
1
  'use client';
2
2
  import { jsx as _jsx } from "react/jsx-runtime";
3
- import React from 'react';
3
+ import React, { Fragment } from 'react';
4
4
  import { useDocumentInfo } from '../../../../../providers/DocumentInfo/index.js';
5
5
  import { baseClass } from '../../Tab/index.js';
6
6
  export const VersionsPill = ()=>{
7
7
  const { versions } = useDocumentInfo();
8
- if (versions?.totalDocs > 0) {
9
- return /*#__PURE__*/ _jsx("span", {
10
- className: `${baseClass}__count`,
11
- children: versions?.totalDocs?.toString()
12
- });
13
- }
14
- return null;
8
+ // To prevent CLS (versions are currently loaded client-side), render non-breaking space if there are no versions
9
+ // The pill is already conditionally rendered to begin with based on whether the document is version-enabled
10
+ // documents that are version enabled _always_ have at least one version
11
+ const hasVersions = versions?.totalDocs > 0;
12
+ return /*#__PURE__*/ _jsx("span", {
13
+ className: [
14
+ `${baseClass}__count`,
15
+ hasVersions ? `${baseClass}__count--has-count` : ''
16
+ ].filter(Boolean).join(' '),
17
+ children: hasVersions ? versions.totalDocs.toString() : /*#__PURE__*/ _jsx(Fragment, {
18
+ children: " "
19
+ })
20
+ });
15
21
  };
16
22
 
17
23
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../src/elements/DocumentHeader/Tabs/tabs/VersionsPill/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { useDocumentInfo } from '../../../../../providers/DocumentInfo/index.js'\nimport { baseClass } from '../../Tab/index.js'\n\nexport const VersionsPill: React.FC = () => {\n const { versions } = useDocumentInfo()\n\n if (versions?.totalDocs > 0) {\n return <span className={`${baseClass}__count`}>{versions?.totalDocs?.toString()}</span>\n }\n\n return null\n}\n"],"names":["React","useDocumentInfo","baseClass","VersionsPill","versions","totalDocs","span","className","toString"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAEzB,SAASC,eAAe,QAAQ,iDAAgD;AAChF,SAASC,SAAS,QAAQ,qBAAoB;AAE9C,OAAO,MAAMC,eAAyB;IACpC,MAAM,EAAEC,QAAQ,EAAE,GAAGH;IAErB,IAAIG,UAAUC,YAAY,GAAG;QAC3B,qBAAO,KAACC;YAAKC,WAAW,CAAC,EAAEL,UAAU,OAAO,CAAC;sBAAGE,UAAUC,WAAWG;;IACvE;IAEA,OAAO;AACT,EAAC"}
1
+ {"version":3,"sources":["../../../../../../src/elements/DocumentHeader/Tabs/tabs/VersionsPill/index.tsx"],"sourcesContent":["'use client'\nimport React, { Fragment } from 'react'\n\nimport { useDocumentInfo } from '../../../../../providers/DocumentInfo/index.js'\nimport { baseClass } from '../../Tab/index.js'\n\nexport const VersionsPill: React.FC = () => {\n const { versions } = useDocumentInfo()\n\n // To prevent CLS (versions are currently loaded client-side), render non-breaking space if there are no versions\n // The pill is already conditionally rendered to begin with based on whether the document is version-enabled\n // documents that are version enabled _always_ have at least one version\n const hasVersions = versions?.totalDocs > 0\n\n return (\n <span\n className={[`${baseClass}__count`, hasVersions ? `${baseClass}__count--has-count` : '']\n .filter(Boolean)\n .join(' ')}\n >\n {hasVersions ? versions.totalDocs.toString() : <Fragment>&nbsp;</Fragment>}\n </span>\n )\n}\n"],"names":["React","Fragment","useDocumentInfo","baseClass","VersionsPill","versions","hasVersions","totalDocs","span","className","filter","Boolean","join","toString"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,SAASC,QAAQ,QAAQ,QAAO;AAEvC,SAASC,eAAe,QAAQ,iDAAgD;AAChF,SAASC,SAAS,QAAQ,qBAAoB;AAE9C,OAAO,MAAMC,eAAyB;IACpC,MAAM,EAAEC,QAAQ,EAAE,GAAGH;IAErB,iHAAiH;IACjH,4GAA4G;IAC5G,wEAAwE;IACxE,MAAMI,cAAcD,UAAUE,YAAY;IAE1C,qBACE,KAACC;QACCC,WAAW;YAAC,CAAC,EAAEN,UAAU,OAAO,CAAC;YAAEG,cAAc,CAAC,EAAEH,UAAU,kBAAkB,CAAC,GAAG;SAAG,CACpFO,MAAM,CAACC,SACPC,IAAI,CAAC;kBAEPN,cAAcD,SAASE,SAAS,CAACM,QAAQ,mBAAK,KAACZ;sBAAS;;;AAG/D,EAAC"}
@@ -0,0 +1,5 @@
1
+ import type { ControlProps } from 'react-select';
2
+ import React from 'react';
3
+ import type { Option } from '../types.js';
4
+ export declare const Input: React.FC<ControlProps<Option, any>>;
5
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/ReactSelect/Input/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,cAAc,CAAA;AAEhD,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AAEzC,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAAC,MAAM,EAAE,GAAG,CAAC,CAcrD,CAAA"}
@@ -0,0 +1,17 @@
1
+ 'use client';
2
+ import { jsx as _jsx } from "react/jsx-runtime";
3
+ import React from 'react';
4
+ import { components as SelectComponents } from 'react-select';
5
+ export const Input = (props)=>{
6
+ return /*#__PURE__*/ _jsx(React.Fragment, {
7
+ children: /*#__PURE__*/ _jsx(SelectComponents.Input, {
8
+ ...props,
9
+ /**
10
+ * Adding `aria-activedescendant` fixes hydration error
11
+ * source: https://github.com/JedWatson/react-select/issues/5459#issuecomment-1878037196
12
+ */ "aria-activedescendant": undefined
13
+ })
14
+ });
15
+ };
16
+
17
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../../src/elements/ReactSelect/Input/index.tsx"],"sourcesContent":["'use client'\nimport type { ControlProps } from 'react-select'\n\nimport React from 'react'\nimport { components as SelectComponents } from 'react-select'\n\nimport type { Option } from '../types.js'\n\nexport const Input: React.FC<ControlProps<Option, any>> = (props) => {\n return (\n <React.Fragment>\n {/* @ts-expect-error // TODO Fix this - Broke with React 19 types */}\n <SelectComponents.Input\n {...props}\n /**\n * Adding `aria-activedescendant` fixes hydration error\n * source: https://github.com/JedWatson/react-select/issues/5459#issuecomment-1878037196\n */\n aria-activedescendant={undefined}\n />\n </React.Fragment>\n )\n}\n"],"names":["React","components","SelectComponents","Input","props","Fragment","aria-activedescendant","undefined"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,OAAOA,WAAW,QAAO;AACzB,SAASC,cAAcC,gBAAgB,QAAQ,eAAc;AAI7D,OAAO,MAAMC,QAA6C,CAACC;IACzD,qBACE,KAACJ,MAAMK,QAAQ;kBAEb,cAAA,KAACH,iBAAiBC,KAAK;YACpB,GAAGC,KAAK;YACT;;;SAGC,GACDE,yBAAuBC;;;AAI/B,EAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/ReactSelect/MultiValue/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAEnD,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AAGzC,OAAO,cAAc,CAAA;AAIrB,wBAAgB,6BAA6B,CAAC,UAAU,KAAA,EAAE,aAAa,KAAA,OAEtE;AACD,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAAC,MAAM,CAAC,CAiDxD,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/ReactSelect/MultiValue/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAEnD,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AAGzC,OAAO,cAAc,CAAA;AAIrB,wBAAgB,6BAA6B,CAAC,UAAU,KAAA,EAAE,aAAa,KAAA,OAEtE;AACD,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAAC,MAAM,CAAC,CAuDxD,CAAA"}
@@ -17,7 +17,7 @@ export const MultiValue = (props)=>{
17
17
  const classes = [
18
18
  baseClass,
19
19
  className,
20
- !isDisabled && 'draggable',
20
+ !isDisabled && isSortable && 'draggable',
21
21
  isDragging && `${baseClass}--is-dragging`
22
22
  ].filter(Boolean).join(' ');
23
23
  return /*#__PURE__*/ _jsx(React.Fragment, {
@@ -25,9 +25,11 @@ export const MultiValue = (props)=>{
25
25
  ...props,
26
26
  className: classes,
27
27
  innerProps: {
28
+ ...isSortable ? {
29
+ ...attributes,
30
+ ...listeners
31
+ } : {},
28
32
  ...innerProps,
29
- ...attributes,
30
- ...listeners,
31
33
  onMouseDown: (e)=>{
32
34
  if (!disableMouseDown) {
33
35
  // we need to prevent the dropdown from opening when clicking on the drag handle, but not when a modal is open (i.e. the 'Relationship' field component)
@@ -35,10 +37,10 @@ export const MultiValue = (props)=>{
35
37
  }
36
38
  },
37
39
  ref: setNodeRef,
38
- style: {
40
+ style: isSortable ? {
39
41
  transform,
40
42
  ...attributes?.style
41
- }
43
+ } : {}
42
44
  }
43
45
  })
44
46
  });
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/elements/ReactSelect/MultiValue/index.tsx"],"sourcesContent":["'use client'\nimport type { MultiValueProps } from 'react-select'\n\nimport React from 'react'\nimport { components as SelectComponents } from 'react-select'\n\nimport type { Option } from '../types.js'\n\nimport { useDraggableSortable } from '../../DraggableSortable/useDraggableSortable/index.js'\nimport './index.scss'\n\nconst baseClass = 'multi-value'\n\nexport function generateMultiValueDraggableID(optionData, valueFunction) {\n return typeof valueFunction === 'function' ? valueFunction(optionData) : optionData.value\n}\nexport const MultiValue: React.FC<MultiValueProps<Option>> = (props) => {\n const {\n className,\n data,\n innerProps,\n isDisabled,\n // @ts-expect-error // TODO Fix this - moduleResolution 16 breaks our declare module\n selectProps: { customProps: { disableMouseDown } = {}, getOptionValue, isSortable } = {},\n } = props\n\n const { attributes, isDragging, listeners, setNodeRef, transform } = useDraggableSortable({\n id: generateMultiValueDraggableID(data, getOptionValue),\n disabled: !isSortable,\n })\n\n const classes = [\n baseClass,\n className,\n !isDisabled && 'draggable',\n isDragging && `${baseClass}--is-dragging`,\n ]\n .filter(Boolean)\n .join(' ')\n\n return (\n <React.Fragment>\n {/* @ts-expect-error // TODO Fix this - Broke with React 19 types */}\n <SelectComponents.MultiValue\n {...props}\n className={classes}\n innerProps={{\n ...innerProps,\n ...attributes,\n ...listeners,\n onMouseDown: (e) => {\n if (!disableMouseDown) {\n // we need to prevent the dropdown from opening when clicking on the drag handle, but not when a modal is open (i.e. the 'Relationship' field component)\n e.stopPropagation()\n }\n },\n ref: setNodeRef,\n style: {\n transform,\n ...attributes?.style,\n },\n }}\n />\n </React.Fragment>\n )\n}\n"],"names":["React","components","SelectComponents","useDraggableSortable","baseClass","generateMultiValueDraggableID","optionData","valueFunction","value","MultiValue","props","className","data","innerProps","isDisabled","selectProps","customProps","disableMouseDown","getOptionValue","isSortable","attributes","isDragging","listeners","setNodeRef","transform","id","disabled","classes","filter","Boolean","join","Fragment","onMouseDown","e","stopPropagation","ref","style"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,OAAOA,WAAW,QAAO;AACzB,SAASC,cAAcC,gBAAgB,QAAQ,eAAc;AAI7D,SAASC,oBAAoB,QAAQ,wDAAuD;AAG5F,MAAMC,YAAY;AAElB,OAAO,SAASC,8BAA8BC,UAAU,EAAEC,aAAa;IACrE,OAAO,OAAOA,kBAAkB,aAAaA,cAAcD,cAAcA,WAAWE,KAAK;AAC3F;AACA,OAAO,MAAMC,aAAgD,CAACC;IAC5D,MAAM,EACJC,SAAS,EACTC,IAAI,EACJC,UAAU,EACVC,UAAU,EACV,oFAAoF;IACpFC,aAAa,EAAEC,aAAa,EAAEC,gBAAgB,EAAE,GAAG,CAAC,CAAC,EAAEC,cAAc,EAAEC,UAAU,EAAE,GAAG,CAAC,CAAC,EACzF,GAAGT;IAEJ,MAAM,EAAEU,UAAU,EAAEC,UAAU,EAAEC,SAAS,EAAEC,UAAU,EAAEC,SAAS,EAAE,GAAGrB,qBAAqB;QACxFsB,IAAIpB,8BAA8BO,MAAMM;QACxCQ,UAAU,CAACP;IACb;IAEA,MAAMQ,UAAU;QACdvB;QACAO;QACA,CAACG,cAAc;QACfO,cAAc,CAAC,EAAEjB,UAAU,aAAa,CAAC;KAC1C,CACEwB,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,qBACE,KAAC9B,MAAM+B,QAAQ;kBAEb,cAAA,KAAC7B,iBAAiBO,UAAU;YACzB,GAAGC,KAAK;YACTC,WAAWgB;YACXd,YAAY;gBACV,GAAGA,UAAU;gBACb,GAAGO,UAAU;gBACb,GAAGE,SAAS;gBACZU,aAAa,CAACC;oBACZ,IAAI,CAAChB,kBAAkB;wBACrB,wJAAwJ;wBACxJgB,EAAEC,eAAe;oBACnB;gBACF;gBACAC,KAAKZ;gBACLa,OAAO;oBACLZ;oBACA,GAAGJ,YAAYgB,KAAK;gBACtB;YACF;;;AAIR,EAAC"}
1
+ {"version":3,"sources":["../../../../src/elements/ReactSelect/MultiValue/index.tsx"],"sourcesContent":["'use client'\nimport type { MultiValueProps } from 'react-select'\n\nimport React from 'react'\nimport { components as SelectComponents } from 'react-select'\n\nimport type { Option } from '../types.js'\n\nimport { useDraggableSortable } from '../../DraggableSortable/useDraggableSortable/index.js'\nimport './index.scss'\n\nconst baseClass = 'multi-value'\n\nexport function generateMultiValueDraggableID(optionData, valueFunction) {\n return typeof valueFunction === 'function' ? valueFunction(optionData) : optionData.value\n}\nexport const MultiValue: React.FC<MultiValueProps<Option>> = (props) => {\n const {\n className,\n data,\n innerProps,\n isDisabled,\n // @ts-expect-error // TODO Fix this - moduleResolution 16 breaks our declare module\n selectProps: { customProps: { disableMouseDown } = {}, getOptionValue, isSortable } = {},\n } = props\n\n const { attributes, isDragging, listeners, setNodeRef, transform } = useDraggableSortable({\n id: generateMultiValueDraggableID(data, getOptionValue),\n disabled: !isSortable,\n })\n\n const classes = [\n baseClass,\n className,\n !isDisabled && isSortable && 'draggable',\n isDragging && `${baseClass}--is-dragging`,\n ]\n .filter(Boolean)\n .join(' ')\n\n return (\n <React.Fragment>\n {/* @ts-expect-error // TODO Fix this - Broke with React 19 types */}\n <SelectComponents.MultiValue\n {...props}\n className={classes}\n innerProps={{\n ...(isSortable\n ? {\n ...attributes,\n ...listeners,\n }\n : {}),\n ...innerProps,\n onMouseDown: (e) => {\n if (!disableMouseDown) {\n // we need to prevent the dropdown from opening when clicking on the drag handle, but not when a modal is open (i.e. the 'Relationship' field component)\n e.stopPropagation()\n }\n },\n ref: setNodeRef,\n style: isSortable\n ? {\n transform,\n ...attributes?.style,\n }\n : {},\n }}\n />\n </React.Fragment>\n )\n}\n"],"names":["React","components","SelectComponents","useDraggableSortable","baseClass","generateMultiValueDraggableID","optionData","valueFunction","value","MultiValue","props","className","data","innerProps","isDisabled","selectProps","customProps","disableMouseDown","getOptionValue","isSortable","attributes","isDragging","listeners","setNodeRef","transform","id","disabled","classes","filter","Boolean","join","Fragment","onMouseDown","e","stopPropagation","ref","style"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,OAAOA,WAAW,QAAO;AACzB,SAASC,cAAcC,gBAAgB,QAAQ,eAAc;AAI7D,SAASC,oBAAoB,QAAQ,wDAAuD;AAG5F,MAAMC,YAAY;AAElB,OAAO,SAASC,8BAA8BC,UAAU,EAAEC,aAAa;IACrE,OAAO,OAAOA,kBAAkB,aAAaA,cAAcD,cAAcA,WAAWE,KAAK;AAC3F;AACA,OAAO,MAAMC,aAAgD,CAACC;IAC5D,MAAM,EACJC,SAAS,EACTC,IAAI,EACJC,UAAU,EACVC,UAAU,EACV,oFAAoF;IACpFC,aAAa,EAAEC,aAAa,EAAEC,gBAAgB,EAAE,GAAG,CAAC,CAAC,EAAEC,cAAc,EAAEC,UAAU,EAAE,GAAG,CAAC,CAAC,EACzF,GAAGT;IAEJ,MAAM,EAAEU,UAAU,EAAEC,UAAU,EAAEC,SAAS,EAAEC,UAAU,EAAEC,SAAS,EAAE,GAAGrB,qBAAqB;QACxFsB,IAAIpB,8BAA8BO,MAAMM;QACxCQ,UAAU,CAACP;IACb;IAEA,MAAMQ,UAAU;QACdvB;QACAO;QACA,CAACG,cAAcK,cAAc;QAC7BE,cAAc,CAAC,EAAEjB,UAAU,aAAa,CAAC;KAC1C,CACEwB,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,qBACE,KAAC9B,MAAM+B,QAAQ;kBAEb,cAAA,KAAC7B,iBAAiBO,UAAU;YACzB,GAAGC,KAAK;YACTC,WAAWgB;YACXd,YAAY;gBACV,GAAIM,aACA;oBACE,GAAGC,UAAU;oBACb,GAAGE,SAAS;gBACd,IACA,CAAC,CAAC;gBACN,GAAGT,UAAU;gBACbmB,aAAa,CAACC;oBACZ,IAAI,CAAChB,kBAAkB;wBACrB,wJAAwJ;wBACxJgB,EAAEC,eAAe;oBACnB;gBACF;gBACAC,KAAKZ;gBACLa,OAAOjB,aACH;oBACEK;oBACA,GAAGJ,YAAYgB,KAAK;gBACtB,IACA,CAAC;YACP;;;AAIR,EAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/ReactSelect/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAE,KAAK,IAAI,uBAAuB,EAAE,MAAM,YAAY,CAAA;AAClE,YAAY,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AAYxC,OAAO,cAAc,CAAA;AAiLrB,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAQzD,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/ReactSelect/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAA2B,MAAM,OAAO,CAAA;AAK/C,OAAO,KAAK,EAAE,KAAK,IAAI,uBAAuB,EAAE,MAAM,YAAY,CAAA;AAClE,YAAY,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AAcxC,OAAO,cAAc,CAAA;AA+LrB,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAQzD,CAAA"}
@@ -2,14 +2,16 @@
2
2
  import { jsx as _jsx } from "react/jsx-runtime";
3
3
  import { arrayMove } from '@dnd-kit/sortable';
4
4
  import { getTranslation } from '@payloadcms/translations';
5
- import React from 'react';
5
+ import React, { useEffect, useId } from 'react';
6
6
  import Select from 'react-select';
7
7
  import CreatableSelect from 'react-select/creatable';
8
8
  import { useTranslation } from '../../providers/Translation/index.js';
9
9
  import { DraggableSortable } from '../DraggableSortable/index.js';
10
+ import { ShimmerEffect } from '../ShimmerEffect/index.js';
10
11
  import { ClearIndicator } from './ClearIndicator/index.js';
11
12
  import { Control } from './Control/index.js';
12
13
  import { DropdownIndicator } from './DropdownIndicator/index.js';
14
+ import { Input } from './Input/index.js';
13
15
  import { MultiValue, generateMultiValueDraggableID } from './MultiValue/index.js';
14
16
  import { MultiValueLabel } from './MultiValueLabel/index.js';
15
17
  import { MultiValueRemove } from './MultiValueRemove/index.js';
@@ -23,6 +25,11 @@ const SelectAdapter = (props)=>{
23
25
  const { i18n, t } = useTranslation();
24
26
  const [inputValue, setInputValue] = React.useState('') // for creatable select
25
27
  ;
28
+ const uuid = useId();
29
+ const [hasMounted, setHasMounted] = React.useState(false);
30
+ useEffect(()=>{
31
+ setHasMounted(true);
32
+ }, []);
26
33
  const { className, components, customProps, disabled = false, filterOption = undefined, getOptionValue, isClearable = true, isCreatable, isLoading, isSearchable = true, noOptionsMessage = ()=>t('general:noOptions'), numberOnly = false, onChange, onMenuClose, onMenuOpen, options, placeholder = t('general:selectValue'), showError, value } = props;
27
34
  const loadingMessage = ()=>t('general:loading') + '...';
28
35
  const classes = [
@@ -30,6 +37,11 @@ const SelectAdapter = (props)=>{
30
37
  'react-select',
31
38
  showError && 'react-select--error'
32
39
  ].filter(Boolean).join(' ');
40
+ if (!hasMounted) {
41
+ return /*#__PURE__*/ _jsx(ShimmerEffect, {
42
+ height: "calc(var(--base) * 2 + 2px)"
43
+ });
44
+ }
33
45
  if (!isCreatable) {
34
46
  return /*#__PURE__*/ _jsx(Select, {
35
47
  captureMenuScroll: true,
@@ -43,6 +55,7 @@ const SelectAdapter = (props)=>{
43
55
  ClearIndicator,
44
56
  Control,
45
57
  DropdownIndicator,
58
+ Input,
46
59
  MultiValue,
47
60
  MultiValueLabel,
48
61
  MultiValueRemove,
@@ -52,6 +65,7 @@ const SelectAdapter = (props)=>{
52
65
  },
53
66
  filterOption: filterOption,
54
67
  getOptionValue: getOptionValue,
68
+ instanceId: uuid,
55
69
  isClearable: isClearable,
56
70
  isDisabled: disabled,
57
71
  isSearchable: isSearchable,
@@ -114,6 +128,7 @@ const SelectAdapter = (props)=>{
114
128
  ClearIndicator,
115
129
  Control,
116
130
  DropdownIndicator,
131
+ Input,
117
132
  MultiValue,
118
133
  MultiValueLabel,
119
134
  MultiValueRemove,
@@ -123,6 +138,7 @@ const SelectAdapter = (props)=>{
123
138
  },
124
139
  filterOption: filterOption,
125
140
  inputValue: inputValue,
141
+ instanceId: uuid,
126
142
  isClearable: isClearable,
127
143
  isDisabled: disabled,
128
144
  isSearchable: isSearchable,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/elements/ReactSelect/index.tsx"],"sourcesContent":["'use client'\nimport type { KeyboardEventHandler } from 'react'\n\nimport { arrayMove } from '@dnd-kit/sortable'\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\nimport Select from 'react-select'\nimport CreatableSelect from 'react-select/creatable'\n\nimport type { Option } from './types.js'\nimport type { Props as ReactSelectAdapterProps } from './types.js'\nexport type { Option } from './types.js'\n\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { DraggableSortable } from '../DraggableSortable/index.js'\nimport { ClearIndicator } from './ClearIndicator/index.js'\nimport { Control } from './Control/index.js'\nimport { DropdownIndicator } from './DropdownIndicator/index.js'\nimport { MultiValue, generateMultiValueDraggableID } from './MultiValue/index.js'\nimport { MultiValueLabel } from './MultiValueLabel/index.js'\nimport { MultiValueRemove } from './MultiValueRemove/index.js'\nimport { SingleValue } from './SingleValue/index.js'\nimport { ValueContainer } from './ValueContainer/index.js'\nimport './index.scss'\n\nconst createOption = (label: string) => ({\n label,\n value: label,\n})\n\nconst SelectAdapter: React.FC<ReactSelectAdapterProps> = (props) => {\n const { i18n, t } = useTranslation()\n const [inputValue, setInputValue] = React.useState('') // for creatable select\n\n const {\n className,\n components,\n customProps,\n disabled = false,\n filterOption = undefined,\n getOptionValue,\n isClearable = true,\n isCreatable,\n isLoading,\n isSearchable = true,\n noOptionsMessage = () => t('general:noOptions'),\n numberOnly = false,\n onChange,\n onMenuClose,\n onMenuOpen,\n options,\n placeholder = t('general:selectValue'),\n showError,\n value,\n } = props\n\n const loadingMessage = () => t('general:loading') + '...'\n\n const classes = [className, 'react-select', showError && 'react-select--error']\n .filter(Boolean)\n .join(' ')\n\n if (!isCreatable) {\n return (\n <Select\n captureMenuScroll\n customProps={customProps}\n isLoading={isLoading}\n placeholder={getTranslation(placeholder, i18n)}\n {...props}\n className={classes}\n classNamePrefix=\"rs\"\n components={{\n ClearIndicator,\n Control,\n DropdownIndicator,\n MultiValue,\n MultiValueLabel,\n MultiValueRemove,\n SingleValue,\n ValueContainer,\n ...components,\n }}\n filterOption={filterOption}\n getOptionValue={getOptionValue}\n isClearable={isClearable}\n isDisabled={disabled}\n isSearchable={isSearchable}\n loadingMessage={loadingMessage}\n menuPlacement=\"auto\"\n noOptionsMessage={noOptionsMessage}\n onChange={onChange}\n onMenuClose={onMenuClose}\n onMenuOpen={onMenuOpen}\n options={options}\n value={value}\n />\n )\n }\n const handleKeyDown: KeyboardEventHandler = (event) => {\n // eslint-disable-next-line no-restricted-globals\n if (numberOnly === true) {\n const acceptableKeys = [\n 'Tab',\n 'Escape',\n 'Backspace',\n 'Enter',\n 'ArrowRight',\n 'ArrowLeft',\n 'ArrowUp',\n 'ArrowDown',\n ]\n const isNumber = !/\\D/.test(event.key)\n const isActionKey = acceptableKeys.includes(event.key)\n if (!isNumber && !isActionKey) {\n event.preventDefault()\n return\n }\n }\n if (!value || !inputValue || inputValue.trim() === '') return\n if (filterOption && !filterOption(null, inputValue)) {\n return\n }\n switch (event.key) {\n case 'Enter':\n case 'Tab':\n onChange([...(value as Option[]), createOption(inputValue)])\n setInputValue('')\n event.preventDefault()\n break\n default:\n break\n }\n }\n\n return (\n <CreatableSelect\n captureMenuScroll\n isLoading={isLoading}\n placeholder={getTranslation(placeholder, i18n)}\n {...props}\n className={classes}\n classNamePrefix=\"rs\"\n components={{\n ClearIndicator,\n Control,\n DropdownIndicator,\n MultiValue,\n MultiValueLabel,\n MultiValueRemove,\n SingleValue,\n ValueContainer,\n ...components,\n }}\n filterOption={filterOption}\n inputValue={inputValue}\n isClearable={isClearable}\n isDisabled={disabled}\n isSearchable={isSearchable}\n loadingMessage={loadingMessage}\n menuPlacement=\"auto\"\n noOptionsMessage={noOptionsMessage}\n onChange={onChange}\n onInputChange={(newValue) => setInputValue(newValue)}\n onKeyDown={handleKeyDown}\n onMenuClose={onMenuClose}\n onMenuOpen={onMenuOpen}\n options={options}\n value={value}\n />\n )\n}\n\nconst SortableSelect: React.FC<ReactSelectAdapterProps> = (props) => {\n const { getOptionValue, onChange, value } = props\n\n let draggableIDs: string[] = []\n if (value) {\n draggableIDs = (Array.isArray(value) ? value : [value]).map((optionValue) => {\n return generateMultiValueDraggableID(optionValue, getOptionValue)\n })\n }\n\n return (\n <DraggableSortable\n className=\"react-select-container\"\n ids={draggableIDs}\n onDragEnd={({ moveFromIndex, moveToIndex }) => {\n let sorted = value\n if (value && Array.isArray(value)) {\n sorted = arrayMove(value, moveFromIndex, moveToIndex)\n }\n onChange(sorted)\n }}\n >\n <SelectAdapter {...props} />\n </DraggableSortable>\n )\n}\n\nexport const ReactSelect: React.FC<ReactSelectAdapterProps> = (props) => {\n const { isMulti, isSortable } = props\n\n if (isMulti && isSortable) {\n return <SortableSelect {...props} />\n }\n\n return <SelectAdapter {...props} />\n}\n"],"names":["arrayMove","getTranslation","React","Select","CreatableSelect","useTranslation","DraggableSortable","ClearIndicator","Control","DropdownIndicator","MultiValue","generateMultiValueDraggableID","MultiValueLabel","MultiValueRemove","SingleValue","ValueContainer","createOption","label","value","SelectAdapter","props","i18n","t","inputValue","setInputValue","useState","className","components","customProps","disabled","filterOption","undefined","getOptionValue","isClearable","isCreatable","isLoading","isSearchable","noOptionsMessage","numberOnly","onChange","onMenuClose","onMenuOpen","options","placeholder","showError","loadingMessage","classes","filter","Boolean","join","captureMenuScroll","classNamePrefix","isDisabled","menuPlacement","handleKeyDown","event","acceptableKeys","isNumber","test","key","isActionKey","includes","preventDefault","trim","onInputChange","newValue","onKeyDown","SortableSelect","draggableIDs","Array","isArray","map","optionValue","ids","onDragEnd","moveFromIndex","moveToIndex","sorted","ReactSelect","isMulti","isSortable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
1
+ {"version":3,"sources":["../../../src/elements/ReactSelect/index.tsx"],"sourcesContent":["'use client'\nimport type { KeyboardEventHandler } from 'react'\n\nimport { arrayMove } from '@dnd-kit/sortable'\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useEffect, useId } from 'react'\nimport Select from 'react-select'\nimport CreatableSelect from 'react-select/creatable'\n\nimport type { Option } from './types.js'\nimport type { Props as ReactSelectAdapterProps } from './types.js'\nexport type { Option } from './types.js'\n\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { DraggableSortable } from '../DraggableSortable/index.js'\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\nimport { ClearIndicator } from './ClearIndicator/index.js'\nimport { Control } from './Control/index.js'\nimport { DropdownIndicator } from './DropdownIndicator/index.js'\nimport { Input } from './Input/index.js'\nimport { MultiValue, generateMultiValueDraggableID } from './MultiValue/index.js'\nimport { MultiValueLabel } from './MultiValueLabel/index.js'\nimport { MultiValueRemove } from './MultiValueRemove/index.js'\nimport { SingleValue } from './SingleValue/index.js'\nimport { ValueContainer } from './ValueContainer/index.js'\nimport './index.scss'\n\nconst createOption = (label: string) => ({\n label,\n value: label,\n})\n\nconst SelectAdapter: React.FC<ReactSelectAdapterProps> = (props) => {\n const { i18n, t } = useTranslation()\n const [inputValue, setInputValue] = React.useState('') // for creatable select\n const uuid = useId()\n const [hasMounted, setHasMounted] = React.useState(false)\n\n useEffect(() => {\n setHasMounted(true)\n }, [])\n\n const {\n className,\n components,\n customProps,\n disabled = false,\n filterOption = undefined,\n getOptionValue,\n isClearable = true,\n isCreatable,\n isLoading,\n isSearchable = true,\n noOptionsMessage = () => t('general:noOptions'),\n numberOnly = false,\n onChange,\n onMenuClose,\n onMenuOpen,\n options,\n placeholder = t('general:selectValue'),\n showError,\n value,\n } = props\n\n const loadingMessage = () => t('general:loading') + '...'\n\n const classes = [className, 'react-select', showError && 'react-select--error']\n .filter(Boolean)\n .join(' ')\n\n if (!hasMounted) {\n return <ShimmerEffect height=\"calc(var(--base) * 2 + 2px)\" />\n }\n\n if (!isCreatable) {\n return (\n <Select\n captureMenuScroll\n customProps={customProps}\n isLoading={isLoading}\n placeholder={getTranslation(placeholder, i18n)}\n {...props}\n className={classes}\n classNamePrefix=\"rs\"\n components={{\n ClearIndicator,\n Control,\n DropdownIndicator,\n Input,\n MultiValue,\n MultiValueLabel,\n MultiValueRemove,\n SingleValue,\n ValueContainer,\n ...components,\n }}\n filterOption={filterOption}\n getOptionValue={getOptionValue}\n instanceId={uuid}\n isClearable={isClearable}\n isDisabled={disabled}\n isSearchable={isSearchable}\n loadingMessage={loadingMessage}\n menuPlacement=\"auto\"\n noOptionsMessage={noOptionsMessage}\n onChange={onChange}\n onMenuClose={onMenuClose}\n onMenuOpen={onMenuOpen}\n options={options}\n value={value}\n />\n )\n }\n const handleKeyDown: KeyboardEventHandler = (event) => {\n // eslint-disable-next-line no-restricted-globals\n if (numberOnly === true) {\n const acceptableKeys = [\n 'Tab',\n 'Escape',\n 'Backspace',\n 'Enter',\n 'ArrowRight',\n 'ArrowLeft',\n 'ArrowUp',\n 'ArrowDown',\n ]\n const isNumber = !/\\D/.test(event.key)\n const isActionKey = acceptableKeys.includes(event.key)\n if (!isNumber && !isActionKey) {\n event.preventDefault()\n return\n }\n }\n if (!value || !inputValue || inputValue.trim() === '') return\n if (filterOption && !filterOption(null, inputValue)) {\n return\n }\n switch (event.key) {\n case 'Enter':\n case 'Tab':\n onChange([...(value as Option[]), createOption(inputValue)])\n setInputValue('')\n event.preventDefault()\n break\n default:\n break\n }\n }\n\n return (\n <CreatableSelect\n captureMenuScroll\n isLoading={isLoading}\n placeholder={getTranslation(placeholder, i18n)}\n {...props}\n className={classes}\n classNamePrefix=\"rs\"\n components={{\n ClearIndicator,\n Control,\n DropdownIndicator,\n Input,\n MultiValue,\n MultiValueLabel,\n MultiValueRemove,\n SingleValue,\n ValueContainer,\n ...components,\n }}\n filterOption={filterOption}\n inputValue={inputValue}\n instanceId={uuid}\n isClearable={isClearable}\n isDisabled={disabled}\n isSearchable={isSearchable}\n loadingMessage={loadingMessage}\n menuPlacement=\"auto\"\n noOptionsMessage={noOptionsMessage}\n onChange={onChange}\n onInputChange={(newValue) => setInputValue(newValue)}\n onKeyDown={handleKeyDown}\n onMenuClose={onMenuClose}\n onMenuOpen={onMenuOpen}\n options={options}\n value={value}\n />\n )\n}\n\nconst SortableSelect: React.FC<ReactSelectAdapterProps> = (props) => {\n const { getOptionValue, onChange, value } = props\n\n let draggableIDs: string[] = []\n if (value) {\n draggableIDs = (Array.isArray(value) ? value : [value]).map((optionValue) => {\n return generateMultiValueDraggableID(optionValue, getOptionValue)\n })\n }\n\n return (\n <DraggableSortable\n className=\"react-select-container\"\n ids={draggableIDs}\n onDragEnd={({ moveFromIndex, moveToIndex }) => {\n let sorted = value\n if (value && Array.isArray(value)) {\n sorted = arrayMove(value, moveFromIndex, moveToIndex)\n }\n onChange(sorted)\n }}\n >\n <SelectAdapter {...props} />\n </DraggableSortable>\n )\n}\n\nexport const ReactSelect: React.FC<ReactSelectAdapterProps> = (props) => {\n const { isMulti, isSortable } = props\n\n if (isMulti && isSortable) {\n return <SortableSelect {...props} />\n }\n\n return <SelectAdapter {...props} />\n}\n"],"names":["arrayMove","getTranslation","React","useEffect","useId","Select","CreatableSelect","useTranslation","DraggableSortable","ShimmerEffect","ClearIndicator","Control","DropdownIndicator","Input","MultiValue","generateMultiValueDraggableID","MultiValueLabel","MultiValueRemove","SingleValue","ValueContainer","createOption","label","value","SelectAdapter","props","i18n","t","inputValue","setInputValue","useState","uuid","hasMounted","setHasMounted","className","components","customProps","disabled","filterOption","undefined","getOptionValue","isClearable","isCreatable","isLoading","isSearchable","noOptionsMessage","numberOnly","onChange","onMenuClose","onMenuOpen","options","placeholder","showError","loadingMessage","classes","filter","Boolean","join","height","captureMenuScroll","classNamePrefix","instanceId","isDisabled","menuPlacement","handleKeyDown","event","acceptableKeys","isNumber","test","key","isActionKey","includes","preventDefault","trim","onInputChange","newValue","onKeyDown","SortableSelect","draggableIDs","Array","isArray","map","optionValue","ids","onDragEnd","moveFromIndex","moveToIndex","sorted","ReactSelect","isMulti","isSortable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,SAASA,SAAS,QAAQ,oBAAmB;AAC7C,SAASC,cAAc,QAAQ,2BAA0B;AACzD,OAAOC,SAASC,SAAS,EAAEC,KAAK,QAAQ,QAAO;AAC/C,OAAOC,YAAY,eAAc;AACjC,OAAOC,qBAAqB,yBAAwB;AAMpD,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,iBAAiB,QAAQ,gCAA+B;AACjE,SAASC,aAAa,QAAQ,4BAA2B;AACzD,SAASC,cAAc,QAAQ,4BAA2B;AAC1D,SAASC,OAAO,QAAQ,qBAAoB;AAC5C,SAASC,iBAAiB,QAAQ,+BAA8B;AAChE,SAASC,KAAK,QAAQ,mBAAkB;AACxC,SAASC,UAAU,EAAEC,6BAA6B,QAAQ,wBAAuB;AACjF,SAASC,eAAe,QAAQ,6BAA4B;AAC5D,SAASC,gBAAgB,QAAQ,8BAA6B;AAC9D,SAASC,WAAW,QAAQ,yBAAwB;AACpD,SAASC,cAAc,QAAQ,4BAA2B;AAG1D,MAAMC,eAAe,CAACC,QAAmB,CAAA;QACvCA;QACAC,OAAOD;IACT,CAAA;AAEA,MAAME,gBAAmD,CAACC;IACxD,MAAM,EAAEC,IAAI,EAAEC,CAAC,EAAE,GAAGnB;IACpB,MAAM,CAACoB,YAAYC,cAAc,GAAG1B,MAAM2B,QAAQ,CAAC,IAAI,uBAAuB;;IAC9E,MAAMC,OAAO1B;IACb,MAAM,CAAC2B,YAAYC,cAAc,GAAG9B,MAAM2B,QAAQ,CAAC;IAEnD1B,UAAU;QACR6B,cAAc;IAChB,GAAG,EAAE;IAEL,MAAM,EACJC,SAAS,EACTC,UAAU,EACVC,WAAW,EACXC,WAAW,KAAK,EAChBC,eAAeC,SAAS,EACxBC,cAAc,EACdC,cAAc,IAAI,EAClBC,WAAW,EACXC,SAAS,EACTC,eAAe,IAAI,EACnBC,mBAAmB,IAAMlB,EAAE,oBAAoB,EAC/CmB,aAAa,KAAK,EAClBC,QAAQ,EACRC,WAAW,EACXC,UAAU,EACVC,OAAO,EACPC,cAAcxB,EAAE,sBAAsB,EACtCyB,SAAS,EACT7B,KAAK,EACN,GAAGE;IAEJ,MAAM4B,iBAAiB,IAAM1B,EAAE,qBAAqB;IAEpD,MAAM2B,UAAU;QAACpB;QAAW;QAAgBkB,aAAa;KAAsB,CAC5EG,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,IAAI,CAACzB,YAAY;QACf,qBAAO,KAACtB;YAAcgD,QAAO;;IAC/B;IAEA,IAAI,CAAChB,aAAa;QAChB,qBACE,KAACpC;YACCqD,iBAAiB;YACjBvB,aAAaA;YACbO,WAAWA;YACXQ,aAAajD,eAAeiD,aAAazB;YACxC,GAAGD,KAAK;YACTS,WAAWoB;YACXM,iBAAgB;YAChBzB,YAAY;gBACVxB;gBACAC;gBACAC;gBACAC;gBACAC;gBACAE;gBACAC;gBACAC;gBACAC;gBACA,GAAGe,UAAU;YACf;YACAG,cAAcA;YACdE,gBAAgBA;YAChBqB,YAAY9B;YACZU,aAAaA;YACbqB,YAAYzB;YACZO,cAAcA;YACdS,gBAAgBA;YAChBU,eAAc;YACdlB,kBAAkBA;YAClBE,UAAUA;YACVC,aAAaA;YACbC,YAAYA;YACZC,SAASA;YACT3B,OAAOA;;IAGb;IACA,MAAMyC,gBAAsC,CAACC;QAC3C,iDAAiD;QACjD,IAAInB,eAAe,MAAM;YACvB,MAAMoB,iBAAiB;gBACrB;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;gBACA;aACD;YACD,MAAMC,WAAW,CAAC,KAAKC,IAAI,CAACH,MAAMI,GAAG;YACrC,MAAMC,cAAcJ,eAAeK,QAAQ,CAACN,MAAMI,GAAG;YACrD,IAAI,CAACF,YAAY,CAACG,aAAa;gBAC7BL,MAAMO,cAAc;gBACpB;YACF;QACF;QACA,IAAI,CAACjD,SAAS,CAACK,cAAcA,WAAW6C,IAAI,OAAO,IAAI;QACvD,IAAInC,gBAAgB,CAACA,aAAa,MAAMV,aAAa;YACnD;QACF;QACA,OAAQqC,MAAMI,GAAG;YACf,KAAK;YACL,KAAK;gBACHtB,SAAS;uBAAKxB;oBAAoBF,aAAaO;iBAAY;gBAC3DC,cAAc;gBACdoC,MAAMO,cAAc;gBACpB;YACF;gBACE;QACJ;IACF;IAEA,qBACE,KAACjE;QACCoD,iBAAiB;QACjBhB,WAAWA;QACXQ,aAAajD,eAAeiD,aAAazB;QACxC,GAAGD,KAAK;QACTS,WAAWoB;QACXM,iBAAgB;QAChBzB,YAAY;YACVxB;YACAC;YACAC;YACAC;YACAC;YACAE;YACAC;YACAC;YACAC;YACA,GAAGe,UAAU;QACf;QACAG,cAAcA;QACdV,YAAYA;QACZiC,YAAY9B;QACZU,aAAaA;QACbqB,YAAYzB;QACZO,cAAcA;QACdS,gBAAgBA;QAChBU,eAAc;QACdlB,kBAAkBA;QAClBE,UAAUA;QACV2B,eAAe,CAACC,WAAa9C,cAAc8C;QAC3CC,WAAWZ;QACXhB,aAAaA;QACbC,YAAYA;QACZC,SAASA;QACT3B,OAAOA;;AAGb;AAEA,MAAMsD,iBAAoD,CAACpD;IACzD,MAAM,EAAEe,cAAc,EAAEO,QAAQ,EAAExB,KAAK,EAAE,GAAGE;IAE5C,IAAIqD,eAAyB,EAAE;IAC/B,IAAIvD,OAAO;QACTuD,eAAe,AAACC,CAAAA,MAAMC,OAAO,CAACzD,SAASA,QAAQ;YAACA;SAAM,AAAD,EAAG0D,GAAG,CAAC,CAACC;YAC3D,OAAOlE,8BAA8BkE,aAAa1C;QACpD;IACF;IAEA,qBACE,KAAC/B;QACCyB,WAAU;QACViD,KAAKL;QACLM,WAAW,CAAC,EAAEC,aAAa,EAAEC,WAAW,EAAE;YACxC,IAAIC,SAAShE;YACb,IAAIA,SAASwD,MAAMC,OAAO,CAACzD,QAAQ;gBACjCgE,SAAStF,UAAUsB,OAAO8D,eAAeC;YAC3C;YACAvC,SAASwC;QACX;kBAEA,cAAA,KAAC/D;YAAe,GAAGC,KAAK;;;AAG9B;AAEA,OAAO,MAAM+D,cAAiD,CAAC/D;IAC7D,MAAM,EAAEgE,OAAO,EAAEC,UAAU,EAAE,GAAGjE;IAEhC,IAAIgE,WAAWC,YAAY;QACzB,qBAAO,KAACb;YAAgB,GAAGpD,KAAK;;IAClC;IAEA,qBAAO,KAACD;QAAe,GAAGC,KAAK;;AACjC,EAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/RenderTitle/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,gBAAgB,GAAG;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAuBlD,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/RenderTitle/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAIvC,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,gBAAgB,GAAG;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA8BlD,CAAA"}
@@ -1,16 +1,19 @@
1
1
  'use client';
2
2
  import { jsx as _jsx } from "react/jsx-runtime";
3
- import React from 'react';
3
+ import React, { Fragment } from 'react';
4
4
  import { useDocumentInfo } from '../../providers/DocumentInfo/index.js';
5
5
  import { IDLabel } from '../IDLabel/index.js';
6
6
  const baseClass = 'render-title';
7
7
  export const RenderTitle = (props)=>{
8
8
  const { className, element = 'h1', fallback, title: titleFromProps } = props;
9
- const documentInfo = useDocumentInfo();
10
- const { id, title: titleFromContext } = documentInfo;
9
+ const { id, isInitializing, title: titleFromContext } = useDocumentInfo();
11
10
  const title = titleFromProps || titleFromContext || fallback;
12
11
  const idAsTitle = title === id;
13
12
  const Tag = element;
13
+ // Render and invisible character to prevent layout shift when the title populates from context
14
+ const EmptySpace = /*#__PURE__*/ _jsx(Fragment, {
15
+ children: " "
16
+ });
14
17
  return /*#__PURE__*/ _jsx(Tag, {
15
18
  className: [
16
19
  className,
@@ -18,10 +21,12 @@ export const RenderTitle = (props)=>{
18
21
  idAsTitle && `${baseClass}--has-id`
19
22
  ].filter(Boolean).join(' '),
20
23
  title: title,
21
- children: idAsTitle ? /*#__PURE__*/ _jsx(IDLabel, {
22
- className: `${baseClass}__id`,
23
- id: id
24
- }) : title || null
24
+ children: isInitializing ? EmptySpace : /*#__PURE__*/ _jsx(Fragment, {
25
+ children: idAsTitle ? /*#__PURE__*/ _jsx(IDLabel, {
26
+ className: `${baseClass}__id`,
27
+ id: id
28
+ }) : title || EmptySpace
29
+ })
25
30
  });
26
31
  };
27
32
 
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/elements/RenderTitle/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { IDLabel } from '../IDLabel/index.js'\nimport './index.scss'\n\nconst baseClass = 'render-title'\n\nexport type RenderTitleProps = {\n className?: string\n element?: React.ElementType\n fallback?: string\n fallbackToID?: boolean\n title?: string\n}\n\nexport const RenderTitle: React.FC<RenderTitleProps> = (props) => {\n const { className, element = 'h1', fallback, title: titleFromProps } = props\n\n const documentInfo = useDocumentInfo()\n\n const { id, title: titleFromContext } = documentInfo\n\n const title = titleFromProps || titleFromContext || fallback\n\n const idAsTitle = title === id\n\n const Tag = element\n\n return (\n <Tag\n className={[className, baseClass, idAsTitle && `${baseClass}--has-id`]\n .filter(Boolean)\n .join(' ')}\n title={title}\n >\n {idAsTitle ? <IDLabel className={`${baseClass}__id`} id={id} /> : title || null}\n </Tag>\n )\n}\n"],"names":["React","useDocumentInfo","IDLabel","baseClass","RenderTitle","props","className","element","fallback","title","titleFromProps","documentInfo","id","titleFromContext","idAsTitle","Tag","filter","Boolean","join"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAEzB,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,OAAO,QAAQ,sBAAqB;AAG7C,MAAMC,YAAY;AAUlB,OAAO,MAAMC,cAA0C,CAACC;IACtD,MAAM,EAAEC,SAAS,EAAEC,UAAU,IAAI,EAAEC,QAAQ,EAAEC,OAAOC,cAAc,EAAE,GAAGL;IAEvE,MAAMM,eAAeV;IAErB,MAAM,EAAEW,EAAE,EAAEH,OAAOI,gBAAgB,EAAE,GAAGF;IAExC,MAAMF,QAAQC,kBAAkBG,oBAAoBL;IAEpD,MAAMM,YAAYL,UAAUG;IAE5B,MAAMG,MAAMR;IAEZ,qBACE,KAACQ;QACCT,WAAW;YAACA;YAAWH;YAAWW,aAAa,CAAC,EAAEX,UAAU,QAAQ,CAAC;SAAC,CACnEa,MAAM,CAACC,SACPC,IAAI,CAAC;QACRT,OAAOA;kBAENK,0BAAY,KAACZ;YAAQI,WAAW,CAAC,EAAEH,UAAU,IAAI,CAAC;YAAES,IAAIA;aAASH,SAAS;;AAGjF,EAAC"}
1
+ {"version":3,"sources":["../../../src/elements/RenderTitle/index.tsx"],"sourcesContent":["'use client'\nimport React, { Fragment } from 'react'\n\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { IDLabel } from '../IDLabel/index.js'\nimport './index.scss'\n\nconst baseClass = 'render-title'\n\nexport type RenderTitleProps = {\n className?: string\n element?: React.ElementType\n fallback?: string\n fallbackToID?: boolean\n title?: string\n}\n\nexport const RenderTitle: React.FC<RenderTitleProps> = (props) => {\n const { className, element = 'h1', fallback, title: titleFromProps } = props\n\n const { id, isInitializing, title: titleFromContext } = useDocumentInfo()\n\n const title = titleFromProps || titleFromContext || fallback\n\n const idAsTitle = title === id\n\n const Tag = element\n\n // Render and invisible character to prevent layout shift when the title populates from context\n const EmptySpace = <Fragment>&nbsp;</Fragment>\n\n return (\n <Tag\n className={[className, baseClass, idAsTitle && `${baseClass}--has-id`]\n .filter(Boolean)\n .join(' ')}\n title={title}\n >\n {isInitializing ? (\n EmptySpace\n ) : (\n <Fragment>\n {idAsTitle ? <IDLabel className={`${baseClass}__id`} id={id} /> : title || EmptySpace}\n </Fragment>\n )}\n </Tag>\n )\n}\n"],"names":["React","Fragment","useDocumentInfo","IDLabel","baseClass","RenderTitle","props","className","element","fallback","title","titleFromProps","id","isInitializing","titleFromContext","idAsTitle","Tag","EmptySpace","filter","Boolean","join"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,SAASC,QAAQ,QAAQ,QAAO;AAEvC,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,OAAO,QAAQ,sBAAqB;AAG7C,MAAMC,YAAY;AAUlB,OAAO,MAAMC,cAA0C,CAACC;IACtD,MAAM,EAAEC,SAAS,EAAEC,UAAU,IAAI,EAAEC,QAAQ,EAAEC,OAAOC,cAAc,EAAE,GAAGL;IAEvE,MAAM,EAAEM,EAAE,EAAEC,cAAc,EAAEH,OAAOI,gBAAgB,EAAE,GAAGZ;IAExD,MAAMQ,QAAQC,kBAAkBG,oBAAoBL;IAEpD,MAAMM,YAAYL,UAAUE;IAE5B,MAAMI,MAAMR;IAEZ,+FAA+F;IAC/F,MAAMS,2BAAa,KAAChB;kBAAS;;IAE7B,qBACE,KAACe;QACCT,WAAW;YAACA;YAAWH;YAAWW,aAAa,CAAC,EAAEX,UAAU,QAAQ,CAAC;SAAC,CACnEc,MAAM,CAACC,SACPC,IAAI,CAAC;QACRV,OAAOA;kBAENG,iBACCI,2BAEA,KAAChB;sBACEc,0BAAY,KAACZ;gBAAQI,WAAW,CAAC,EAAEH,UAAU,IAAI,CAAC;gBAAEQ,IAAIA;iBAASF,SAASO;;;AAKrF,EAAC"}
@@ -20,7 +20,7 @@ export const RelationshipCell = ({ cellData, label, relationTo })=>{
20
20
  const { i18n, t } = useTranslation();
21
21
  const isAboveViewport = canUseDOM ? entry?.boundingClientRect?.top < window.innerHeight : false;
22
22
  useEffect(()=>{
23
- if (cellData && isAboveViewport && !hasRequested) {
23
+ if ((cellData || typeof cellData === 'number') && isAboveViewport && !hasRequested) {
24
24
  const formattedValues = [];
25
25
  const arrayCellData = Array.isArray(cellData) ? cellData : [
26
26
  cellData
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../../src/elements/Table/DefaultCell/fields/Relationship/index.tsx"],"sourcesContent":["'use client'\nimport type { CellComponentProps, DefaultCellComponentProps } from 'payload/types'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useEffect, useState } from 'react'\n\nimport { useIntersect } from '../../../../../hooks/useIntersect.js'\nimport { useConfig } from '../../../../../providers/Config/index.js'\nimport { useTranslation } from '../../../../../providers/Translation/index.js'\nimport { canUseDOM } from '../../../../../utilities/canUseDOM.js'\nimport { formatDocTitle } from '../../../../../utilities/formatDocTitle.js'\nimport { useListRelationships } from '../../../RelationshipProvider/index.js'\nimport './index.scss'\n\ntype Value = { relationTo: string; value: number | string }\nconst baseClass = 'relationship-cell'\nconst totalToShow = 3\n\nexport interface RelationshipCellProps extends DefaultCellComponentProps<any> {\n label: CellComponentProps['label']\n relationTo: CellComponentProps['relationTo']\n}\n\nexport const RelationshipCell: React.FC<RelationshipCellProps> = ({\n cellData,\n label,\n relationTo,\n}) => {\n const config = useConfig()\n const { collections, routes } = config\n const [intersectionRef, entry] = useIntersect()\n const [values, setValues] = useState<Value[]>([])\n const { documents, getRelationships } = useListRelationships()\n const [hasRequested, setHasRequested] = useState(false)\n const { i18n, t } = useTranslation()\n\n const isAboveViewport = canUseDOM ? entry?.boundingClientRect?.top < window.innerHeight : false\n\n useEffect(() => {\n if (cellData && isAboveViewport && !hasRequested) {\n const formattedValues: Value[] = []\n const arrayCellData = Array.isArray(cellData) ? cellData : [cellData]\n arrayCellData\n .slice(0, arrayCellData.length < totalToShow ? arrayCellData.length : totalToShow)\n .forEach((cell) => {\n if (typeof cell === 'object' && 'relationTo' in cell && 'value' in cell) {\n formattedValues.push(cell)\n }\n if (\n (typeof cell === 'number' || typeof cell === 'string') &&\n typeof relationTo === 'string'\n ) {\n formattedValues.push({\n relationTo,\n value: cell,\n })\n }\n })\n getRelationships(formattedValues)\n setHasRequested(true)\n setValues(formattedValues)\n }\n }, [\n cellData,\n relationTo,\n collections,\n isAboveViewport,\n routes.api,\n hasRequested,\n getRelationships,\n ])\n\n useEffect(() => {\n if (hasRequested) {\n setHasRequested(false)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [cellData])\n\n return (\n <div className={baseClass} ref={intersectionRef}>\n {values.map(({ relationTo, value }, i) => {\n const document = documents[relationTo][value]\n const relatedCollection = collections.find(({ slug }) => slug === relationTo)\n\n const label = formatDocTitle({\n collectionConfig: relatedCollection,\n data: document || null,\n dateFormat: config.admin.dateFormat,\n fallback: `${t('general:untitled')} - ID: ${value}`,\n i18n,\n })\n\n return (\n <React.Fragment key={i}>\n {document === false && `${t('general:untitled')} - ID: ${value}`}\n {document === null && `${t('general:loading')}...`}\n {document ? label : null}\n {values.length > i + 1 && ', '}\n </React.Fragment>\n )\n })}\n {Array.isArray(cellData) &&\n cellData.length > totalToShow &&\n t('fields:itemsAndMore', { count: cellData.length - totalToShow, items: '' })}\n {values.length === 0 && t('general:noLabel', { label: getTranslation(label || '', i18n) })}\n </div>\n )\n}\n"],"names":["getTranslation","React","useEffect","useState","useIntersect","useConfig","useTranslation","canUseDOM","formatDocTitle","useListRelationships","baseClass","totalToShow","RelationshipCell","cellData","label","relationTo","config","collections","routes","intersectionRef","entry","values","setValues","documents","getRelationships","hasRequested","setHasRequested","i18n","t","isAboveViewport","boundingClientRect","top","window","innerHeight","formattedValues","arrayCellData","Array","isArray","slice","length","forEach","cell","push","value","api","div","className","ref","map","i","document","relatedCollection","find","slug","collectionConfig","data","dateFormat","admin","fallback","Fragment","count","items"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
1
+ {"version":3,"sources":["../../../../../../src/elements/Table/DefaultCell/fields/Relationship/index.tsx"],"sourcesContent":["'use client'\nimport type { CellComponentProps, DefaultCellComponentProps } from 'payload/types'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useEffect, useState } from 'react'\n\nimport { useIntersect } from '../../../../../hooks/useIntersect.js'\nimport { useConfig } from '../../../../../providers/Config/index.js'\nimport { useTranslation } from '../../../../../providers/Translation/index.js'\nimport { canUseDOM } from '../../../../../utilities/canUseDOM.js'\nimport { formatDocTitle } from '../../../../../utilities/formatDocTitle.js'\nimport { useListRelationships } from '../../../RelationshipProvider/index.js'\nimport './index.scss'\n\ntype Value = { relationTo: string; value: number | string }\nconst baseClass = 'relationship-cell'\nconst totalToShow = 3\n\nexport interface RelationshipCellProps extends DefaultCellComponentProps<any> {\n label: CellComponentProps['label']\n relationTo: CellComponentProps['relationTo']\n}\n\nexport const RelationshipCell: React.FC<RelationshipCellProps> = ({\n cellData,\n label,\n relationTo,\n}) => {\n const config = useConfig()\n const { collections, routes } = config\n const [intersectionRef, entry] = useIntersect()\n const [values, setValues] = useState<Value[]>([])\n const { documents, getRelationships } = useListRelationships()\n const [hasRequested, setHasRequested] = useState(false)\n const { i18n, t } = useTranslation()\n\n const isAboveViewport = canUseDOM ? entry?.boundingClientRect?.top < window.innerHeight : false\n\n useEffect(() => {\n if ((cellData || typeof cellData === 'number') && isAboveViewport && !hasRequested) {\n const formattedValues: Value[] = []\n const arrayCellData = Array.isArray(cellData) ? cellData : [cellData]\n arrayCellData\n .slice(0, arrayCellData.length < totalToShow ? arrayCellData.length : totalToShow)\n .forEach((cell) => {\n if (typeof cell === 'object' && 'relationTo' in cell && 'value' in cell) {\n formattedValues.push(cell)\n }\n if (\n (typeof cell === 'number' || typeof cell === 'string') &&\n typeof relationTo === 'string'\n ) {\n formattedValues.push({\n relationTo,\n value: cell,\n })\n }\n })\n getRelationships(formattedValues)\n setHasRequested(true)\n setValues(formattedValues)\n }\n }, [\n cellData,\n relationTo,\n collections,\n isAboveViewport,\n routes.api,\n hasRequested,\n getRelationships,\n ])\n\n useEffect(() => {\n if (hasRequested) {\n setHasRequested(false)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [cellData])\n\n return (\n <div className={baseClass} ref={intersectionRef}>\n {values.map(({ relationTo, value }, i) => {\n const document = documents[relationTo][value]\n const relatedCollection = collections.find(({ slug }) => slug === relationTo)\n\n const label = formatDocTitle({\n collectionConfig: relatedCollection,\n data: document || null,\n dateFormat: config.admin.dateFormat,\n fallback: `${t('general:untitled')} - ID: ${value}`,\n i18n,\n })\n\n return (\n <React.Fragment key={i}>\n {document === false && `${t('general:untitled')} - ID: ${value}`}\n {document === null && `${t('general:loading')}...`}\n {document ? label : null}\n {values.length > i + 1 && ', '}\n </React.Fragment>\n )\n })}\n {Array.isArray(cellData) &&\n cellData.length > totalToShow &&\n t('fields:itemsAndMore', { count: cellData.length - totalToShow, items: '' })}\n {values.length === 0 && t('general:noLabel', { label: getTranslation(label || '', i18n) })}\n </div>\n )\n}\n"],"names":["getTranslation","React","useEffect","useState","useIntersect","useConfig","useTranslation","canUseDOM","formatDocTitle","useListRelationships","baseClass","totalToShow","RelationshipCell","cellData","label","relationTo","config","collections","routes","intersectionRef","entry","values","setValues","documents","getRelationships","hasRequested","setHasRequested","i18n","t","isAboveViewport","boundingClientRect","top","window","innerHeight","formattedValues","arrayCellData","Array","isArray","slice","length","forEach","cell","push","value","api","div","className","ref","map","i","document","relatedCollection","find","slug","collectionConfig","data","dateFormat","admin","fallback","Fragment","count","items"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/elements/WhereBuilder/Condition/Relationship/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAuD,MAAM,OAAO,CAAA;AAG3E,OAAO,KAAK,EAAc,KAAK,EAAqB,MAAM,YAAY,CAAA;AAMtE,OAAO,cAAc,CAAA;AAOrB,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAoS7C,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/elements/WhereBuilder/Condition/Relationship/index.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAuD,MAAM,OAAO,CAAA;AAG3E,OAAO,KAAK,EAAE,KAAK,EAAqB,MAAM,YAAY,CAAA;AAM1D,OAAO,cAAc,CAAA;AAOrB,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAwU7C,CAAA"}