@payloadcms/ui 3.56.0-canary.1 → 3.56.0-internal.72f4fd2

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 (157) hide show
  1. package/dist/elements/BulkUpload/EditForm/index.js +18 -4
  2. package/dist/elements/BulkUpload/EditForm/index.js.map +1 -1
  3. package/dist/elements/ClipboardAction/index.js +74 -173
  4. package/dist/elements/ClipboardAction/index.js.map +1 -1
  5. package/dist/elements/CodeEditor/CodeEditor.js +67 -155
  6. package/dist/elements/CodeEditor/CodeEditor.js.map +1 -1
  7. package/dist/elements/Collapsible/index.js +7 -15
  8. package/dist/elements/Collapsible/index.js.map +1 -1
  9. package/dist/elements/ConfirmationModal/index.js +8 -44
  10. package/dist/elements/ConfirmationModal/index.js.map +1 -1
  11. package/dist/elements/CopyLocaleData/index.js +89 -97
  12. package/dist/elements/CopyLocaleData/index.js.map +1 -1
  13. package/dist/elements/CopyToClipboard/index.js +2 -22
  14. package/dist/elements/CopyToClipboard/index.js.map +1 -1
  15. package/dist/elements/DefaultListViewTabs/index.js +32 -47
  16. package/dist/elements/DefaultListViewTabs/index.js.map +1 -1
  17. package/dist/elements/DeleteMany/index.js +47 -83
  18. package/dist/elements/DeleteMany/index.js.map +1 -1
  19. package/dist/elements/DocumentControls/index.js +27 -55
  20. package/dist/elements/DocumentControls/index.js.map +1 -1
  21. package/dist/elements/DocumentDrawer/DrawerHeader/index.js +2 -10
  22. package/dist/elements/DocumentDrawer/DrawerHeader/index.js.map +1 -1
  23. package/dist/elements/DocumentDrawer/index.js +47 -99
  24. package/dist/elements/DocumentDrawer/index.js.map +1 -1
  25. package/dist/elements/Drawer/index.js +23 -57
  26. package/dist/elements/Drawer/index.js.map +1 -1
  27. package/dist/elements/DrawerActionHeader/index.js +3 -21
  28. package/dist/elements/DrawerActionHeader/index.js.map +1 -1
  29. package/dist/elements/FolderView/Drawers/MoveToFolder/index.js +149 -225
  30. package/dist/elements/FolderView/Drawers/MoveToFolder/index.js.map +1 -1
  31. package/dist/elements/FolderView/FolderFileCard/index.js +19 -27
  32. package/dist/elements/FolderView/FolderFileCard/index.js.map +1 -1
  33. package/dist/elements/FolderView/MoveDocToFolder/index.js +12 -23
  34. package/dist/elements/FolderView/MoveDocToFolder/index.js.map +1 -1
  35. package/dist/elements/FullscreenModal/index.js +10 -20
  36. package/dist/elements/FullscreenModal/index.js.map +1 -1
  37. package/dist/elements/ListDrawer/index.js +18 -24
  38. package/dist/elements/ListDrawer/index.js.map +1 -1
  39. package/dist/elements/ListHeader/TitleActions/ListCreateNewDocInFolderButton.js +19 -32
  40. package/dist/elements/ListHeader/TitleActions/ListCreateNewDocInFolderButton.js.map +1 -1
  41. package/dist/elements/ListSelection/index.js +11 -27
  42. package/dist/elements/ListSelection/index.js.map +1 -1
  43. package/dist/elements/LivePreview/Window/index.js +65 -144
  44. package/dist/elements/LivePreview/Window/index.js.map +1 -1
  45. package/dist/elements/Loading/index.js +2 -11
  46. package/dist/elements/Loading/index.js.map +1 -1
  47. package/dist/elements/LoadingOverlay/index.js +46 -102
  48. package/dist/elements/LoadingOverlay/index.js.map +1 -1
  49. package/dist/elements/Localizer/LocalizerLabel/index.js +23 -36
  50. package/dist/elements/Localizer/LocalizerLabel/index.js.map +1 -1
  51. package/dist/elements/QueryPresets/QueryPresetToggler/index.js +41 -139
  52. package/dist/elements/QueryPresets/QueryPresetToggler/index.js.map +1 -1
  53. package/dist/elements/RenderIfInViewport/index.d.ts +2 -2
  54. package/dist/elements/RenderIfInViewport/index.d.ts.map +1 -1
  55. package/dist/elements/RenderIfInViewport/index.js.map +1 -1
  56. package/dist/elements/SelectRow/index.js +39 -40
  57. package/dist/elements/SelectRow/index.js.map +1 -1
  58. package/dist/elements/ShimmerEffect/index.js +20 -12
  59. package/dist/elements/ShimmerEffect/index.js.map +1 -1
  60. package/dist/elements/SortColumn/index.js +21 -30
  61. package/dist/elements/SortColumn/index.js.map +1 -1
  62. package/dist/elements/Table/DefaultCell/fields/Date/index.js +9 -37
  63. package/dist/elements/Table/DefaultCell/fields/Date/index.js.map +1 -1
  64. package/dist/elements/Table/DefaultCell/fields/Relationship/index.js +35 -37
  65. package/dist/elements/Table/DefaultCell/fields/Relationship/index.js.map +1 -1
  66. package/dist/elements/Table/DefaultCell/fields/Select/index.js +12 -27
  67. package/dist/elements/Table/DefaultCell/fields/Select/index.js.map +1 -1
  68. package/dist/elements/Thumbnail/index.js +35 -75
  69. package/dist/elements/Thumbnail/index.js.map +1 -1
  70. package/dist/elements/ThumbnailCard/index.js +17 -26
  71. package/dist/elements/ThumbnailCard/index.js.map +1 -1
  72. package/dist/elements/Tooltip/index.js +51 -127
  73. package/dist/elements/Tooltip/index.js.map +1 -1
  74. package/dist/elements/Upload/index.js +2 -10
  75. package/dist/elements/Upload/index.js.map +1 -1
  76. package/dist/elements/WhereBuilder/Condition/Select/index.js +31 -44
  77. package/dist/elements/WhereBuilder/Condition/Select/index.js.map +1 -1
  78. package/dist/elements/WhereBuilder/Condition/index.d.ts +1 -1
  79. package/dist/elements/WhereBuilder/Condition/index.js +2 -2
  80. package/dist/elements/WhereBuilder/Condition/index.js.map +1 -1
  81. package/dist/elements/WhereBuilder/index.js +6 -6
  82. package/dist/elements/WhereBuilder/index.js.map +1 -1
  83. package/dist/exports/client/{CodeEditor-URFJPG6I.js → CodeEditor-RHQXPDK5.js} +2 -2
  84. package/dist/exports/client/{DatePicker-NMDEHPWL.js → DatePicker-F432AIH3.js} +2 -2
  85. package/dist/exports/client/{chunk-7RGKTZG2.js → chunk-AZDI6MW4.js} +1 -1
  86. package/dist/exports/client/{chunk-7RGKTZG2.js.map → chunk-AZDI6MW4.js.map} +1 -1
  87. package/dist/exports/client/{chunk-KPQQ5IUL.js → chunk-FKP64OEZ.js} +5 -5
  88. package/dist/exports/client/{chunk-KPQQ5IUL.js.map → chunk-FKP64OEZ.js.map} +3 -3
  89. package/dist/exports/client/index.d.ts +4 -2
  90. package/dist/exports/client/index.d.ts.map +1 -1
  91. package/dist/exports/client/index.js +12 -12
  92. package/dist/exports/client/index.js.map +4 -4
  93. package/dist/exports/rsc/index.d.ts +1 -0
  94. package/dist/exports/rsc/index.d.ts.map +1 -1
  95. package/dist/exports/rsc/index.js +1 -0
  96. package/dist/exports/rsc/index.js.map +1 -1
  97. package/dist/fields/Array/ArrayRow.d.ts +2 -3
  98. package/dist/fields/Array/ArrayRow.d.ts.map +1 -1
  99. package/dist/fields/Array/ArrayRow.js +13 -23
  100. package/dist/fields/Array/ArrayRow.js.map +1 -1
  101. package/dist/fields/Array/index.js +273 -477
  102. package/dist/fields/Array/index.js.map +1 -1
  103. package/dist/fields/Checkbox/Input.js +2 -19
  104. package/dist/fields/Checkbox/Input.js.map +1 -1
  105. package/dist/fields/FieldError/index.js +30 -29
  106. package/dist/fields/FieldError/index.js.map +1 -1
  107. package/dist/fields/FieldLabel/index.js +12 -64
  108. package/dist/fields/FieldLabel/index.js.map +1 -1
  109. package/dist/fields/Relationship/select-components/MultiValueLabel/index.js +45 -103
  110. package/dist/fields/Relationship/select-components/MultiValueLabel/index.js.map +1 -1
  111. package/dist/fields/Relationship/select-components/SingleValue/index.js +29 -44
  112. package/dist/fields/Relationship/select-components/SingleValue/index.js.map +1 -1
  113. package/dist/fields/Row/index.d.ts +1 -3
  114. package/dist/fields/Row/index.d.ts.map +1 -1
  115. package/dist/fields/Select/Input.js +18 -31
  116. package/dist/fields/Select/Input.js.map +1 -1
  117. package/dist/fields/Tabs/Tab/index.js +2 -11
  118. package/dist/fields/Tabs/Tab/index.js.map +1 -1
  119. package/dist/fields/Tabs/index.d.ts +2 -1
  120. package/dist/fields/Tabs/index.d.ts.map +1 -1
  121. package/dist/fields/Tabs/index.js +185 -225
  122. package/dist/fields/Tabs/index.js.map +1 -1
  123. package/dist/fields/Upload/RelationshipContent/index.js +79 -127
  124. package/dist/fields/Upload/RelationshipContent/index.js.map +1 -1
  125. package/dist/forms/RenderFields/RenderField.js +245 -237
  126. package/dist/forms/RenderFields/RenderField.js.map +1 -1
  127. package/dist/forms/RenderFields/types.d.ts +2 -10
  128. package/dist/forms/RenderFields/types.d.ts.map +1 -1
  129. package/dist/forms/RenderFields/types.js.map +1 -1
  130. package/dist/forms/fieldSchemasToFormState/serverFunctions/renderFieldServerFn.d.ts +35 -0
  131. package/dist/forms/fieldSchemasToFormState/serverFunctions/renderFieldServerFn.d.ts.map +1 -0
  132. package/dist/forms/fieldSchemasToFormState/serverFunctions/renderFieldServerFn.js +83 -0
  133. package/dist/forms/fieldSchemasToFormState/serverFunctions/renderFieldServerFn.js.map +1 -0
  134. package/dist/forms/useField/index.d.ts +5 -0
  135. package/dist/forms/useField/index.d.ts.map +1 -1
  136. package/dist/forms/useField/index.js +74 -45
  137. package/dist/forms/useField/index.js.map +1 -1
  138. package/dist/hooks/useIntersect.js +35 -53
  139. package/dist/hooks/useIntersect.js.map +1 -1
  140. package/dist/hooks/usePayloadAPI.js +36 -44
  141. package/dist/hooks/usePayloadAPI.js.map +1 -1
  142. package/dist/providers/ServerFunctions/index.d.ts +4 -1
  143. package/dist/providers/ServerFunctions/index.d.ts.map +1 -1
  144. package/dist/providers/ServerFunctions/index.js +13 -0
  145. package/dist/providers/ServerFunctions/index.js.map +1 -1
  146. package/dist/utilities/reduceFieldsToOptions.d.ts +2 -2
  147. package/dist/utilities/reduceFieldsToOptions.js +2 -2
  148. package/dist/utilities/reduceFieldsToOptions.js.map +1 -1
  149. package/dist/views/BrowseByFolder/index.js +37 -55
  150. package/dist/views/BrowseByFolder/index.js.map +1 -1
  151. package/dist/views/CollectionFolder/index.js +13 -40
  152. package/dist/views/CollectionFolder/index.js.map +1 -1
  153. package/dist/views/Edit/Auth/index.js +93 -105
  154. package/dist/views/Edit/Auth/index.js.map +1 -1
  155. package/package.json +7 -7
  156. /package/dist/exports/client/{CodeEditor-URFJPG6I.js.map → CodeEditor-RHQXPDK5.js.map} +0 -0
  157. /package/dist/exports/client/{DatePicker-NMDEHPWL.js.map → DatePicker-F432AIH3.js.map} +0 -0
@@ -8,7 +8,7 @@ import { Button } from '../Button/index.js';
8
8
  import './index.scss';
9
9
  const baseClass = 'list-selection';
10
10
  export function ListSelection_v4(t0) {
11
- const $ = _c(9);
11
+ const $ = _c(5);
12
12
  const {
13
13
  count,
14
14
  ListActions,
@@ -19,44 +19,28 @@ export function ListSelection_v4(t0) {
19
19
  } = useTranslation();
20
20
  let t1;
21
21
  if ($[0] !== ListActions || $[1] !== SelectionActions || $[2] !== count || $[3] !== t) {
22
- let t2;
23
- if ($[5] !== ListActions) {
24
- t2 = ListActions && ListActions.length > 0 && _jsxs(React.Fragment, {
22
+ t1 = _jsxs("div", {
23
+ className: baseClass,
24
+ children: [_jsx("span", {
25
+ children: t("general:selectedCount", {
26
+ count,
27
+ label: ""
28
+ })
29
+ }), ListActions && ListActions.length > 0 && _jsxs(React.Fragment, {
25
30
  children: [_jsx("span", {
26
31
  children: "\u2014"
27
32
  }), _jsx("div", {
28
33
  className: `${baseClass}__actions`,
29
34
  children: ListActions
30
35
  })]
31
- });
32
- $[5] = ListActions;
33
- $[6] = t2;
34
- } else {
35
- t2 = $[6];
36
- }
37
- let t3;
38
- if ($[7] !== SelectionActions) {
39
- t3 = SelectionActions && SelectionActions.length > 0 && _jsxs(React.Fragment, {
36
+ }), SelectionActions && SelectionActions.length > 0 && _jsxs(React.Fragment, {
40
37
  children: [_jsx("span", {
41
38
  children: "\u2014"
42
39
  }), _jsx("div", {
43
40
  className: `${baseClass}__actions`,
44
41
  children: SelectionActions
45
42
  })]
46
- });
47
- $[7] = SelectionActions;
48
- $[8] = t3;
49
- } else {
50
- t3 = $[8];
51
- }
52
- t1 = _jsxs("div", {
53
- className: baseClass,
54
- children: [_jsx("span", {
55
- children: t("general:selectedCount", {
56
- count,
57
- label: ""
58
- })
59
- }), t2, t3]
43
+ })]
60
44
  });
61
45
  $[0] = ListActions;
62
46
  $[1] = SelectionActions;
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["c","_c","React","useTranslation","Button","baseClass","ListSelection_v4","t0","$","count","ListActions","SelectionActions","t","t1","t2","length","_jsxs","Fragment","children","_jsx","className","t3","label","ListSelectionButton","props","buttonStyle","filter","Boolean","join"],"sources":["../../../src/elements/ListSelection/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport type { Props as ButtonProps } from '../Button/types.js'\n\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Button } from '../Button/index.js'\nimport './index.scss'\n\nconst baseClass = 'list-selection'\n\ntype ListSelection_v4Props = {\n /**\n * The count of selected items\n */\n readonly count: number\n /**\n * Actions that apply to the list as a whole\n *\n * @example select all, clear selection\n */\n readonly ListActions?: React.ReactNode[]\n /**\n * Actions that apply to the selected items\n *\n * @example edit, delete, publish, unpublish\n */\n readonly SelectionActions?: React.ReactNode[]\n}\nexport function ListSelection_v4({ count, ListActions, SelectionActions }: ListSelection_v4Props) {\n const { t } = useTranslation()\n\n return (\n <div className={baseClass}>\n <span>{t('general:selectedCount', { count, label: '' })}</span>\n {ListActions && ListActions.length > 0 && (\n <React.Fragment>\n <span>&mdash;</span>\n <div className={`${baseClass}__actions`}>{ListActions}</div>\n </React.Fragment>\n )}\n {SelectionActions && SelectionActions.length > 0 && (\n <React.Fragment>\n <span>&mdash;</span>\n <div className={`${baseClass}__actions`}>{SelectionActions}</div>\n </React.Fragment>\n )}\n </div>\n )\n}\n\ntype ListSelectionButtonProps = {} & ButtonProps\nexport function ListSelectionButton({ children, className, ...props }: ListSelectionButtonProps) {\n return (\n <Button\n {...props}\n buttonStyle=\"none\"\n className={[`${baseClass}__button`, className].filter(Boolean).join(' ')}\n >\n {children}\n </Button>\n )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,MAAW;AAIlB,SAASC,cAAc,QAAQ;AAC/B,SAASC,MAAM,QAAQ;AACvB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAoBlB,OAAO,SAAAC,iBAAAC,EAAA;EAAA,MAAAC,CAAA,GAAAP,EAAA;EAA0B;IAAAQ,KAAA;IAAAC,WAAA;IAAAC;EAAA,IAAAJ,EAA+D;EAC9F;IAAAK;EAAA,IAAcT,cAAA;EAAA,IAAAU,EAAA;EAAA,IAAAL,CAAA,QAAAE,WAAA,IAAAF,CAAA,QAAAG,gBAAA,IAAAH,CAAA,QAAAC,KAAA,IAAAD,CAAA,QAAAI,CAAA;IAAA,IAAAE,EAAA;IAAA,IAAAN,CAAA,QAAAE,WAAA;MAKTI,EAAA,GAAAJ,WAAA,IAAeA,WAAA,CAAAK,MAAA,IAAqB,IACnCC,KAAA,CAAAd,KAAA,CAAAe,QAAA;QAAAC,QAAA,GACEC,IAAA,CAAC;UAAAD,QAAA,EAAK;QAAA,C,GACNC,IAAA,CAAC;UAAAC,SAAA,EAAe,GAAAf,SAAA,WAAuB;UAAAa,QAAA,EAAGR;QAAA,C;;;;;;;;;MAG7CW,EAAA,GAAAV,gBAAA,IAAoBA,gBAAA,CAAAI,MAAA,IAA0B,IAC7CC,KAAA,CAAAd,KAAA,CAAAe,QAAA;QAAAC,QAAA,GACEC,IAAA,CAAC;UAAAD,QAAA,EAAK;QAAA,C,GACNC,IAAA,CAAC;UAAAC,SAAA,EAAe,GAAAf,SAAA,WAAuB;UAAAa,QAAA,EAAGP;QAAA,C;;;;;;;IAXhDE,EAAA,GAAAG,KAAA,CAAC;MAAAI,SAAA,EAAAf,SAAA;MAAAa,QAAA,GACCC,IAAA,CAAC;QAAAD,QAAA,EAAMN,CAAA,CAAE;UAAAH,KAAA;UAAAa,KAAA,EAAyC;QAAA,CAAG;MAAA,C,GACpDR,E,EAMAO,E;;;;;;;;;;SARHR,E;;AAmBJ,OAAO,SAASU,oBAAoB;EAAEL,QAAQ;EAAEE,SAAS;EAAE,GAAGI;AAAA,CAAiC;EAC7F,oBACEL,IAAA,CAACf,MAAA;IACE,GAAGoB,KAAK;IACTC,WAAA,EAAY;IACZL,SAAA,EAAW,CAAC,GAAGf,SAAA,UAAmB,EAAEe,SAAA,CAAU,CAACM,MAAM,CAACC,OAAA,EAASC,IAAI,CAAC;cAEnEV;;AAGP","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["c","_c","React","useTranslation","Button","baseClass","ListSelection_v4","t0","$","count","ListActions","SelectionActions","t","t1","_jsxs","className","children","_jsx","label","length","Fragment","ListSelectionButton","props","buttonStyle","filter","Boolean","join"],"sources":["../../../src/elements/ListSelection/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport type { Props as ButtonProps } from '../Button/types.js'\n\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Button } from '../Button/index.js'\nimport './index.scss'\n\nconst baseClass = 'list-selection'\n\ntype ListSelection_v4Props = {\n /**\n * The count of selected items\n */\n readonly count: number\n /**\n * Actions that apply to the list as a whole\n *\n * @example select all, clear selection\n */\n readonly ListActions?: React.ReactNode[]\n /**\n * Actions that apply to the selected items\n *\n * @example edit, delete, publish, unpublish\n */\n readonly SelectionActions?: React.ReactNode[]\n}\nexport function ListSelection_v4({ count, ListActions, SelectionActions }: ListSelection_v4Props) {\n const { t } = useTranslation()\n\n return (\n <div className={baseClass}>\n <span>{t('general:selectedCount', { count, label: '' })}</span>\n {ListActions && ListActions.length > 0 && (\n <React.Fragment>\n <span>&mdash;</span>\n <div className={`${baseClass}__actions`}>{ListActions}</div>\n </React.Fragment>\n )}\n {SelectionActions && SelectionActions.length > 0 && (\n <React.Fragment>\n <span>&mdash;</span>\n <div className={`${baseClass}__actions`}>{SelectionActions}</div>\n </React.Fragment>\n )}\n </div>\n )\n}\n\ntype ListSelectionButtonProps = {} & ButtonProps\nexport function ListSelectionButton({ children, className, ...props }: ListSelectionButtonProps) {\n return (\n <Button\n {...props}\n buttonStyle=\"none\"\n className={[`${baseClass}__button`, className].filter(Boolean).join(' ')}\n >\n {children}\n </Button>\n )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,MAAW;AAIlB,SAASC,cAAc,QAAQ;AAC/B,SAASC,MAAM,QAAQ;AACvB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAoBlB,OAAO,SAAAC,iBAAAC,EAAA;EAAA,MAAAC,CAAA,GAAAP,EAAA;EAA0B;IAAAQ,KAAA;IAAAC,WAAA;IAAAC;EAAA,IAAAJ,EAA+D;EAC9F;IAAAK;EAAA,IAAcT,cAAA;EAAA,IAAAU,EAAA;EAAA,IAAAL,CAAA,QAAAE,WAAA,IAAAF,CAAA,QAAAG,gBAAA,IAAAH,CAAA,QAAAC,KAAA,IAAAD,CAAA,QAAAI,CAAA;IAGZC,EAAA,GAAAC,KAAA,CAAC;MAAAC,SAAA,EAAAV,SAAA;MAAAW,QAAA,GACCC,IAAA,CAAC;QAAAD,QAAA,EAAMJ,CAAA,CAAE;UAAAH,KAAA;UAAAS,KAAA,EAAyC;QAAA,CAAG;MAAA,C,GACpDR,WAAA,IAAeA,WAAA,CAAAS,MAAA,IAAqB,IACnCL,KAAA,CAAAZ,KAAA,CAAAkB,QAAA;QAAAJ,QAAA,GACEC,IAAA,CAAC;UAAAD,QAAA,EAAK;QAAA,C,GACNC,IAAA,CAAC;UAAAF,SAAA,EAAe,GAAAV,SAAA,WAAuB;UAAAW,QAAA,EAAGN;QAAA,C;UAG7CC,gBAAA,IAAoBA,gBAAA,CAAAQ,MAAA,IAA0B,IAC7CL,KAAA,CAAAZ,KAAA,CAAAkB,QAAA;QAAAJ,QAAA,GACEC,IAAA,CAAC;UAAAD,QAAA,EAAK;QAAA,C,GACNC,IAAA,CAAC;UAAAF,SAAA,EAAe,GAAAV,SAAA,WAAuB;UAAAW,QAAA,EAAGL;QAAA,C;;;;;;;;;;;SAXhDE,E;;AAmBJ,OAAO,SAASQ,oBAAoB;EAAEL,QAAQ;EAAED,SAAS;EAAE,GAAGO;AAAA,CAAiC;EAC7F,oBACEL,IAAA,CAACb,MAAA;IACE,GAAGkB,KAAK;IACTC,WAAA,EAAY;IACZR,SAAA,EAAW,CAAC,GAAGV,SAAA,UAAmB,EAAEU,SAAA,CAAU,CAACS,MAAM,CAACC,OAAA,EAASC,IAAI,CAAC;cAEnEV;;AAGP","ignoreList":[]}
@@ -1,6 +1,5 @@
1
1
  'use client';
2
2
 
3
- import { c as _c } from "react/compiler-runtime";
4
3
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
5
4
  import { reduceFieldsToValues } from 'payload/shared';
6
5
  import React, { useEffect } from 'react';
@@ -16,7 +15,6 @@ import { IFrame } from '../IFrame/index.js';
16
15
  import { LivePreviewToolbar } from '../Toolbar/index.js';
17
16
  const baseClass = 'live-preview-window';
18
17
  export const LivePreviewWindow = props => {
19
- const $ = _c(50);
20
18
  const {
21
19
  appIsReady,
22
20
  breakpoint,
@@ -38,155 +36,78 @@ export const LivePreviewWindow = props => {
38
36
  collectionSlug,
39
37
  globalSlug
40
38
  } = useDocumentInfo();
41
- let t0;
42
- if ($[0] !== appIsReady || $[1] !== collectionSlug || $[2] !== formState || $[3] !== globalSlug || $[4] !== id || $[5] !== iframeRef || $[6] !== isLivePreviewing || $[7] !== locale || $[8] !== mostRecentUpdate || $[9] !== popupRef || $[10] !== previewWindowType || $[11] !== url) {
43
- t0 = () => {
44
- if (!isLivePreviewing) {
45
- return;
46
- }
47
- if (formState && window && "postMessage" in window && appIsReady) {
48
- const values = reduceFieldsToValues(formState, true);
49
- if (!values.id) {
50
- values.id = id;
51
- }
52
- const message = {
53
- type: "payload-live-preview",
54
- collectionSlug,
55
- data: values,
56
- externallyUpdatedRelationship: mostRecentUpdate,
57
- globalSlug,
58
- locale: locale.code
59
- };
60
- if (previewWindowType === "popup" && popupRef.current) {
61
- popupRef.current.postMessage(message, url);
62
- }
63
- if (previewWindowType === "iframe" && iframeRef.current) {
64
- iframeRef.current.contentWindow?.postMessage(message, url);
65
- }
66
- }
67
- };
68
- $[0] = appIsReady;
69
- $[1] = collectionSlug;
70
- $[2] = formState;
71
- $[3] = globalSlug;
72
- $[4] = id;
73
- $[5] = iframeRef;
74
- $[6] = isLivePreviewing;
75
- $[7] = locale;
76
- $[8] = mostRecentUpdate;
77
- $[9] = popupRef;
78
- $[10] = previewWindowType;
79
- $[11] = url;
80
- $[12] = t0;
81
- } else {
82
- t0 = $[12];
83
- }
84
- let t1;
85
- if ($[13] !== appIsReady || $[14] !== collectionSlug || $[15] !== formState || $[16] !== globalSlug || $[17] !== id || $[18] !== iframeHasLoaded || $[19] !== iframeRef || $[20] !== isLivePreviewing || $[21] !== locale || $[22] !== mostRecentUpdate || $[23] !== popupRef || $[24] !== previewWindowType || $[25] !== setIframeHasLoaded || $[26] !== url) {
86
- t1 = [formState, url, collectionSlug, globalSlug, iframeHasLoaded, id, previewWindowType, popupRef, appIsReady, iframeRef, setIframeHasLoaded, mostRecentUpdate, locale, isLivePreviewing];
87
- $[13] = appIsReady;
88
- $[14] = collectionSlug;
89
- $[15] = formState;
90
- $[16] = globalSlug;
91
- $[17] = id;
92
- $[18] = iframeHasLoaded;
93
- $[19] = iframeRef;
94
- $[20] = isLivePreviewing;
95
- $[21] = locale;
96
- $[22] = mostRecentUpdate;
97
- $[23] = popupRef;
98
- $[24] = previewWindowType;
99
- $[25] = setIframeHasLoaded;
100
- $[26] = url;
101
- $[27] = t1;
102
- } else {
103
- t1 = $[27];
104
- }
105
- useEffect(t0, t1);
106
- let t2;
107
- if ($[28] !== iframeRef || $[29] !== isLivePreviewing || $[30] !== popupRef || $[31] !== previewWindowType || $[32] !== url) {
108
- t2 = () => {
109
- if (!isLivePreviewing) {
110
- return;
39
+ // For client-side apps, send data through `window.postMessage`
40
+ // The preview could either be an iframe embedded on the page
41
+ // Or it could be a separate popup window
42
+ // We need to transmit data to both accordingly
43
+ useEffect(() => {
44
+ if (!isLivePreviewing) {
45
+ return;
46
+ }
47
+ // For performance, do no reduce fields to values until after the iframe or popup has loaded
48
+ if (formState && window && 'postMessage' in window && appIsReady) {
49
+ const values = reduceFieldsToValues(formState, true);
50
+ if (!values.id) {
51
+ values.id = id;
111
52
  }
112
- const message_0 = {
113
- type: "payload-document-event"
53
+ const message = {
54
+ type: 'payload-live-preview',
55
+ collectionSlug,
56
+ data: values,
57
+ externallyUpdatedRelationship: mostRecentUpdate,
58
+ globalSlug,
59
+ locale: locale.code
114
60
  };
115
- if (previewWindowType === "popup" && popupRef.current) {
116
- popupRef.current.postMessage(message_0, url);
61
+ // Post message to external popup window
62
+ if (previewWindowType === 'popup' && popupRef.current) {
63
+ popupRef.current.postMessage(message, url);
117
64
  }
118
- if (previewWindowType === "iframe" && iframeRef.current) {
119
- iframeRef.current.contentWindow?.postMessage(message_0, url);
65
+ // Post message to embedded iframe
66
+ if (previewWindowType === 'iframe' && iframeRef.current) {
67
+ iframeRef.current.contentWindow?.postMessage(message, url);
120
68
  }
69
+ }
70
+ }, [formState, url, collectionSlug, globalSlug, iframeHasLoaded, id, previewWindowType, popupRef, appIsReady, iframeRef, setIframeHasLoaded, mostRecentUpdate, locale, isLivePreviewing]);
71
+ // To support SSR, we transmit a `window.postMessage` event without a payload
72
+ // This is because the event will ultimately trigger a server-side roundtrip
73
+ // i.e., save, save draft, autosave, etc. will fire `router.refresh()`
74
+ useEffect(() => {
75
+ if (!isLivePreviewing) {
76
+ return;
77
+ }
78
+ const message_0 = {
79
+ type: 'payload-document-event'
121
80
  };
122
- $[28] = iframeRef;
123
- $[29] = isLivePreviewing;
124
- $[30] = popupRef;
125
- $[31] = previewWindowType;
126
- $[32] = url;
127
- $[33] = t2;
128
- } else {
129
- t2 = $[33];
130
- }
131
- let t3;
132
- if ($[34] !== iframeRef || $[35] !== isLivePreviewing || $[36] !== mostRecentUpdate || $[37] !== popupRef || $[38] !== previewWindowType || $[39] !== url) {
133
- t3 = [mostRecentUpdate, iframeRef, popupRef, previewWindowType, url, isLivePreviewing];
134
- $[34] = iframeRef;
135
- $[35] = isLivePreviewing;
136
- $[36] = mostRecentUpdate;
137
- $[37] = popupRef;
138
- $[38] = previewWindowType;
139
- $[39] = url;
140
- $[40] = t3;
141
- } else {
142
- t3 = $[40];
143
- }
144
- useEffect(t2, t3);
145
- if (previewWindowType === "iframe") {
146
- const t4 = isLivePreviewing && `${baseClass}--is-live-previewing`;
147
- const t5 = breakpoint && breakpoint !== "responsive" && `${baseClass}--has-breakpoint`;
148
- let t6;
149
- if ($[41] !== t4 || $[42] !== t5) {
150
- t6 = [baseClass, t4, t5].filter(Boolean);
151
- $[41] = t4;
152
- $[42] = t5;
153
- $[43] = t6;
154
- } else {
155
- t6 = $[43];
81
+ // Post message to external popup window
82
+ if (previewWindowType === 'popup' && popupRef.current) {
83
+ popupRef.current.postMessage(message_0, url);
156
84
  }
157
- const t7 = t6.join(" ");
158
- let t8;
159
- if ($[44] !== iframeRef || $[45] !== props || $[46] !== setIframeHasLoaded || $[47] !== t7 || $[48] !== url) {
160
- t8 = _jsx("div", {
161
- className: t7,
162
- children: _jsxs("div", {
163
- className: `${baseClass}__wrapper`,
164
- children: [_jsx(LivePreviewToolbar, {
165
- ...props
166
- }), _jsx("div", {
167
- className: `${baseClass}__main`,
168
- children: _jsx(DeviceContainer, {
169
- children: url ? _jsx(IFrame, {
170
- ref: iframeRef,
171
- setIframeHasLoaded,
172
- url
173
- }) : _jsx(ShimmerEffect, {
174
- height: "100%"
175
- })
176
- })
177
- })]
178
- })
179
- });
180
- $[44] = iframeRef;
181
- $[45] = props;
182
- $[46] = setIframeHasLoaded;
183
- $[47] = t7;
184
- $[48] = url;
185
- $[49] = t8;
186
- } else {
187
- t8 = $[49];
85
+ // Post message to embedded iframe
86
+ if (previewWindowType === 'iframe' && iframeRef.current) {
87
+ iframeRef.current.contentWindow?.postMessage(message_0, url);
188
88
  }
189
- return t8;
89
+ }, [mostRecentUpdate, iframeRef, popupRef, previewWindowType, url, isLivePreviewing]);
90
+ if (previewWindowType === 'iframe') {
91
+ return /*#__PURE__*/_jsx("div", {
92
+ className: [baseClass, isLivePreviewing && `${baseClass}--is-live-previewing`, breakpoint && breakpoint !== 'responsive' && `${baseClass}--has-breakpoint`].filter(Boolean).join(' '),
93
+ children: /*#__PURE__*/_jsxs("div", {
94
+ className: `${baseClass}__wrapper`,
95
+ children: [/*#__PURE__*/_jsx(LivePreviewToolbar, {
96
+ ...props
97
+ }), /*#__PURE__*/_jsx("div", {
98
+ className: `${baseClass}__main`,
99
+ children: /*#__PURE__*/_jsx(DeviceContainer, {
100
+ children: url ? /*#__PURE__*/_jsx(IFrame, {
101
+ ref: iframeRef,
102
+ setIframeHasLoaded: setIframeHasLoaded,
103
+ url: url
104
+ }) : /*#__PURE__*/_jsx(ShimmerEffect, {
105
+ height: "100%"
106
+ })
107
+ })
108
+ })]
109
+ })
110
+ });
190
111
  }
191
112
  };
192
113
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["c","_c","reduceFieldsToValues","React","useEffect","useAllFormFields","useDocumentEvents","useDocumentInfo","useLivePreviewContext","useLocale","ShimmerEffect","DeviceContainer","IFrame","LivePreviewToolbar","baseClass","LivePreviewWindow","props","$","appIsReady","breakpoint","iframeHasLoaded","iframeRef","isLivePreviewing","popupRef","previewWindowType","setIframeHasLoaded","url","locale","mostRecentUpdate","formState","id","collectionSlug","globalSlug","t0","window","values","message","type","data","externallyUpdatedRelationship","code","current","postMessage","contentWindow","t1","t2","message_0","t3","t4","t5","t6","filter","Boolean","t7","join","t8","_jsx","className","children","_jsxs","ref","height"],"sources":["../../../../src/elements/LivePreview/Window/index.tsx"],"sourcesContent":["'use client'\n\nimport type { EditViewProps } from 'payload'\n\nimport { reduceFieldsToValues } from 'payload/shared'\nimport React, { useEffect } from 'react'\n\nimport { useAllFormFields } from '../../../forms/Form/context.js'\nimport { useDocumentEvents } from '../../../providers/DocumentEvents/index.js'\nimport { useDocumentInfo } from '../../../providers/DocumentInfo/index.js'\nimport { useLivePreviewContext } from '../../../providers/LivePreview/context.js'\nimport { useLocale } from '../../../providers/Locale/index.js'\nimport { ShimmerEffect } from '../../ShimmerEffect/index.js'\nimport { DeviceContainer } from '../Device/index.js'\nimport './index.scss'\nimport { IFrame } from '../IFrame/index.js'\nimport { LivePreviewToolbar } from '../Toolbar/index.js'\n\nconst baseClass = 'live-preview-window'\n\nexport const LivePreviewWindow: React.FC<EditViewProps> = (props) => {\n const {\n appIsReady,\n breakpoint,\n iframeHasLoaded,\n iframeRef,\n isLivePreviewing,\n popupRef,\n previewWindowType,\n setIframeHasLoaded,\n url,\n } = useLivePreviewContext()\n\n const locale = useLocale()\n\n const { mostRecentUpdate } = useDocumentEvents()\n\n const [formState] = useAllFormFields()\n const { id, collectionSlug, globalSlug } = useDocumentInfo()\n\n // For client-side apps, send data through `window.postMessage`\n // The preview could either be an iframe embedded on the page\n // Or it could be a separate popup window\n // We need to transmit data to both accordingly\n useEffect(() => {\n if (!isLivePreviewing) {\n return\n }\n\n // For performance, do no reduce fields to values until after the iframe or popup has loaded\n if (formState && window && 'postMessage' in window && appIsReady) {\n const values = reduceFieldsToValues(formState, true)\n\n if (!values.id) {\n values.id = id\n }\n\n const message = {\n type: 'payload-live-preview',\n collectionSlug,\n data: values,\n externallyUpdatedRelationship: mostRecentUpdate,\n globalSlug,\n locale: locale.code,\n }\n\n // Post message to external popup window\n if (previewWindowType === 'popup' && popupRef.current) {\n popupRef.current.postMessage(message, url)\n }\n\n // Post message to embedded iframe\n if (previewWindowType === 'iframe' && iframeRef.current) {\n iframeRef.current.contentWindow?.postMessage(message, url)\n }\n }\n }, [\n formState,\n url,\n collectionSlug,\n globalSlug,\n iframeHasLoaded,\n id,\n previewWindowType,\n popupRef,\n appIsReady,\n iframeRef,\n setIframeHasLoaded,\n mostRecentUpdate,\n locale,\n isLivePreviewing,\n ])\n\n // To support SSR, we transmit a `window.postMessage` event without a payload\n // This is because the event will ultimately trigger a server-side roundtrip\n // i.e., save, save draft, autosave, etc. will fire `router.refresh()`\n useEffect(() => {\n if (!isLivePreviewing) {\n return\n }\n\n const message = {\n type: 'payload-document-event',\n }\n\n // Post message to external popup window\n if (previewWindowType === 'popup' && popupRef.current) {\n popupRef.current.postMessage(message, url)\n }\n\n // Post message to embedded iframe\n if (previewWindowType === 'iframe' && iframeRef.current) {\n iframeRef.current.contentWindow?.postMessage(message, url)\n }\n }, [mostRecentUpdate, iframeRef, popupRef, previewWindowType, url, isLivePreviewing])\n\n if (previewWindowType === 'iframe') {\n return (\n <div\n className={[\n baseClass,\n isLivePreviewing && `${baseClass}--is-live-previewing`,\n breakpoint && breakpoint !== 'responsive' && `${baseClass}--has-breakpoint`,\n ]\n .filter(Boolean)\n .join(' ')}\n >\n <div className={`${baseClass}__wrapper`}>\n <LivePreviewToolbar {...props} />\n <div className={`${baseClass}__main`}>\n <DeviceContainer>\n {url ? (\n <IFrame ref={iframeRef} setIframeHasLoaded={setIframeHasLoaded} url={url} />\n ) : (\n <ShimmerEffect height=\"100%\" />\n )}\n </DeviceContainer>\n </div>\n </div>\n </div>\n )\n }\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["reduceFieldsToValues","React","useEffect","useAllFormFields","useDocumentEvents","useDocumentInfo","useLivePreviewContext","useLocale","ShimmerEffect","DeviceContainer","IFrame","LivePreviewToolbar","baseClass","LivePreviewWindow","props","appIsReady","breakpoint","iframeHasLoaded","iframeRef","isLivePreviewing","popupRef","previewWindowType","setIframeHasLoaded","url","locale","mostRecentUpdate","formState","id","collectionSlug","globalSlug","window","values","message","type","data","externallyUpdatedRelationship","code","current","postMessage","contentWindow","_jsx","className","filter","Boolean","join","_jsxs","ref","height"],"sources":["../../../../src/elements/LivePreview/Window/index.tsx"],"sourcesContent":["'use client'\n\nimport type { EditViewProps } from 'payload'\n\nimport { reduceFieldsToValues } from 'payload/shared'\nimport React, { useEffect } from 'react'\n\nimport { useAllFormFields } from '../../../forms/Form/context.js'\nimport { useDocumentEvents } from '../../../providers/DocumentEvents/index.js'\nimport { useDocumentInfo } from '../../../providers/DocumentInfo/index.js'\nimport { useLivePreviewContext } from '../../../providers/LivePreview/context.js'\nimport { useLocale } from '../../../providers/Locale/index.js'\nimport { ShimmerEffect } from '../../ShimmerEffect/index.js'\nimport { DeviceContainer } from '../Device/index.js'\nimport './index.scss'\nimport { IFrame } from '../IFrame/index.js'\nimport { LivePreviewToolbar } from '../Toolbar/index.js'\n\nconst baseClass = 'live-preview-window'\n\nexport const LivePreviewWindow: React.FC<EditViewProps> = (props) => {\n const {\n appIsReady,\n breakpoint,\n iframeHasLoaded,\n iframeRef,\n isLivePreviewing,\n popupRef,\n previewWindowType,\n setIframeHasLoaded,\n url,\n } = useLivePreviewContext()\n\n const locale = useLocale()\n\n const { mostRecentUpdate } = useDocumentEvents()\n\n const [formState] = useAllFormFields()\n const { id, collectionSlug, globalSlug } = useDocumentInfo()\n\n // For client-side apps, send data through `window.postMessage`\n // The preview could either be an iframe embedded on the page\n // Or it could be a separate popup window\n // We need to transmit data to both accordingly\n useEffect(() => {\n if (!isLivePreviewing) {\n return\n }\n\n // For performance, do no reduce fields to values until after the iframe or popup has loaded\n if (formState && window && 'postMessage' in window && appIsReady) {\n const values = reduceFieldsToValues(formState, true)\n\n if (!values.id) {\n values.id = id\n }\n\n const message = {\n type: 'payload-live-preview',\n collectionSlug,\n data: values,\n externallyUpdatedRelationship: mostRecentUpdate,\n globalSlug,\n locale: locale.code,\n }\n\n // Post message to external popup window\n if (previewWindowType === 'popup' && popupRef.current) {\n popupRef.current.postMessage(message, url)\n }\n\n // Post message to embedded iframe\n if (previewWindowType === 'iframe' && iframeRef.current) {\n iframeRef.current.contentWindow?.postMessage(message, url)\n }\n }\n }, [\n formState,\n url,\n collectionSlug,\n globalSlug,\n iframeHasLoaded,\n id,\n previewWindowType,\n popupRef,\n appIsReady,\n iframeRef,\n setIframeHasLoaded,\n mostRecentUpdate,\n locale,\n isLivePreviewing,\n ])\n\n // To support SSR, we transmit a `window.postMessage` event without a payload\n // This is because the event will ultimately trigger a server-side roundtrip\n // i.e., save, save draft, autosave, etc. will fire `router.refresh()`\n useEffect(() => {\n if (!isLivePreviewing) {\n return\n }\n\n const message = {\n type: 'payload-document-event',\n }\n\n // Post message to external popup window\n if (previewWindowType === 'popup' && popupRef.current) {\n popupRef.current.postMessage(message, url)\n }\n\n // Post message to embedded iframe\n if (previewWindowType === 'iframe' && iframeRef.current) {\n iframeRef.current.contentWindow?.postMessage(message, url)\n }\n }, [mostRecentUpdate, iframeRef, popupRef, previewWindowType, url, isLivePreviewing])\n\n if (previewWindowType === 'iframe') {\n return (\n <div\n className={[\n baseClass,\n isLivePreviewing && `${baseClass}--is-live-previewing`,\n breakpoint && breakpoint !== 'responsive' && `${baseClass}--has-breakpoint`,\n ]\n .filter(Boolean)\n .join(' ')}\n >\n <div className={`${baseClass}__wrapper`}>\n <LivePreviewToolbar {...props} />\n <div className={`${baseClass}__main`}>\n <DeviceContainer>\n {url ? (\n <IFrame ref={iframeRef} setIframeHasLoaded={setIframeHasLoaded} url={url} />\n ) : (\n <ShimmerEffect height=\"100%\" />\n )}\n </DeviceContainer>\n </div>\n </div>\n </div>\n )\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -10,7 +10,7 @@ import { useTranslation } from '../../providers/Translation/index.js';
10
10
  import './index.scss';
11
11
  const baseClass = 'loading-overlay';
12
12
  export const LoadingOverlay = t0 => {
13
- const $ = _c(11);
13
+ const $ = _c(8);
14
14
  const {
15
15
  animationDuration,
16
16
  loadingText,
@@ -36,15 +36,6 @@ export const LoadingOverlay = t0 => {
36
36
  const t6 = animationDuration || "500ms";
37
37
  let t7;
38
38
  if ($[3] !== loadingText || $[4] !== t || $[5] !== t5 || $[6] !== t6) {
39
- let t8;
40
- if ($[8] !== loadingText || $[9] !== t) {
41
- t8 = loadingText || t("general:loading");
42
- $[8] = loadingText;
43
- $[9] = t;
44
- $[10] = t8;
45
- } else {
46
- t8 = $[10];
47
- }
48
39
  t7 = _jsxs("div", {
49
40
  className: t5,
50
41
  style: {
@@ -65,7 +56,7 @@ export const LoadingOverlay = t0 => {
65
56
  })]
66
57
  }), _jsx("span", {
67
58
  className: `${baseClass}__text`,
68
- children: t8
59
+ children: loadingText || t("general:loading")
69
60
  })]
70
61
  });
71
62
  $[3] = loadingText;
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["c","_c","getTranslation","React","useLoadingOverlay","useFormProcessing","useTranslation","baseClass","LoadingOverlay","t0","$","animationDuration","loadingText","overlayType","show","t1","undefined","t","t2","t3","t4","filter","Boolean","t5","join","t6","t7","t8","_jsxs","className","style","children","_jsx","LoadingOverlayToggle","name","key","type","toggleLoadingOverlay","isLoading","useEffect","FormLoadingOverlayToggle","action","formIsLoading","loadingSuffix","isProcessing","i18n","labels","create","loading","update","trim"],"sources":["../../../src/elements/Loading/index.tsx"],"sourcesContent":["'use client'\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport type { LoadingOverlayTypes } from '../../elements/LoadingOverlay/types.js'\n\nimport { useLoadingOverlay } from '../../elements/LoadingOverlay/index.js'\nimport { useFormProcessing } from '../../forms/Form/context.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'loading-overlay'\n\ntype LoadingOverlayProps = {\n animationDuration?: string\n loadingText?: string\n overlayType?: string\n show?: boolean\n}\n\nexport const LoadingOverlay: React.FC<LoadingOverlayProps> = ({\n animationDuration,\n loadingText,\n overlayType,\n show = true,\n}) => {\n const { t } = useTranslation()\n\n return (\n <div\n className={[\n baseClass,\n show ? `${baseClass}--entering` : `${baseClass}--exiting`,\n overlayType ? `${baseClass}--${overlayType}` : '',\n ]\n .filter(Boolean)\n .join(' ')}\n style={{\n animationDuration: animationDuration || '500ms',\n }}\n >\n <div className={`${baseClass}__bars`}>\n <div className={`${baseClass}__bar`} />\n <div className={`${baseClass}__bar`} />\n <div className={`${baseClass}__bar`} />\n <div className={`${baseClass}__bar`} />\n <div className={`${baseClass}__bar`} />\n </div>\n\n <span className={`${baseClass}__text`}>{loadingText || t('general:loading')}</span>\n </div>\n )\n}\n\nexport type UseLoadingOverlayToggleProps = {\n loadingText?: string\n name: string\n show: boolean\n type?: LoadingOverlayTypes\n}\nexport const LoadingOverlayToggle: React.FC<UseLoadingOverlayToggleProps> = ({\n name: key,\n type = 'fullscreen',\n loadingText,\n show,\n}) => {\n const { toggleLoadingOverlay } = useLoadingOverlay()\n\n React.useEffect(() => {\n toggleLoadingOverlay({\n type,\n isLoading: show,\n key,\n loadingText: loadingText || undefined,\n })\n\n return () => {\n toggleLoadingOverlay({\n type,\n isLoading: false,\n key,\n })\n }\n }, [show, toggleLoadingOverlay, key, type, loadingText])\n\n return null\n}\n\nexport type FormLoadingOverlayToggleProps = {\n action: 'create' | 'loading' | 'update'\n formIsLoading?: boolean\n loadingSuffix?: string\n name: string\n type?: LoadingOverlayTypes\n}\n\nexport const FormLoadingOverlayToggle: React.FC<FormLoadingOverlayToggleProps> = ({\n name,\n type = 'fullscreen',\n action,\n formIsLoading = false,\n loadingSuffix,\n}) => {\n const isProcessing = useFormProcessing()\n const { i18n, t } = useTranslation()\n\n const labels = {\n create: t('general:creating'),\n loading: t('general:loading'),\n update: t('general:updating'),\n }\n\n return (\n <LoadingOverlayToggle\n loadingText={`${labels[action]} ${\n loadingSuffix ? getTranslation(loadingSuffix, i18n) : ''\n }`.trim()}\n name={name}\n show={formIsLoading || isProcessing}\n type={type}\n />\n )\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["c","_c","getTranslation","React","useLoadingOverlay","useFormProcessing","useTranslation","baseClass","LoadingOverlay","t0","$","animationDuration","loadingText","overlayType","show","t1","undefined","t","t2","t3","t4","filter","Boolean","t5","join","t6","t7","_jsxs","className","style","children","_jsx","LoadingOverlayToggle","name","key","type","toggleLoadingOverlay","isLoading","useEffect","FormLoadingOverlayToggle","action","formIsLoading","loadingSuffix","isProcessing","i18n","labels","create","loading","update","trim"],"sources":["../../../src/elements/Loading/index.tsx"],"sourcesContent":["'use client'\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport type { LoadingOverlayTypes } from '../../elements/LoadingOverlay/types.js'\n\nimport { useLoadingOverlay } from '../../elements/LoadingOverlay/index.js'\nimport { useFormProcessing } from '../../forms/Form/context.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'loading-overlay'\n\ntype LoadingOverlayProps = {\n animationDuration?: string\n loadingText?: string\n overlayType?: string\n show?: boolean\n}\n\nexport const LoadingOverlay: React.FC<LoadingOverlayProps> = ({\n animationDuration,\n loadingText,\n overlayType,\n show = true,\n}) => {\n const { t } = useTranslation()\n\n return (\n <div\n className={[\n baseClass,\n show ? `${baseClass}--entering` : `${baseClass}--exiting`,\n overlayType ? `${baseClass}--${overlayType}` : '',\n ]\n .filter(Boolean)\n .join(' ')}\n style={{\n animationDuration: animationDuration || '500ms',\n }}\n >\n <div className={`${baseClass}__bars`}>\n <div className={`${baseClass}__bar`} />\n <div className={`${baseClass}__bar`} />\n <div className={`${baseClass}__bar`} />\n <div className={`${baseClass}__bar`} />\n <div className={`${baseClass}__bar`} />\n </div>\n\n <span className={`${baseClass}__text`}>{loadingText || t('general:loading')}</span>\n </div>\n )\n}\n\nexport type UseLoadingOverlayToggleProps = {\n loadingText?: string\n name: string\n show: boolean\n type?: LoadingOverlayTypes\n}\nexport const LoadingOverlayToggle: React.FC<UseLoadingOverlayToggleProps> = ({\n name: key,\n type = 'fullscreen',\n loadingText,\n show,\n}) => {\n const { toggleLoadingOverlay } = useLoadingOverlay()\n\n React.useEffect(() => {\n toggleLoadingOverlay({\n type,\n isLoading: show,\n key,\n loadingText: loadingText || undefined,\n })\n\n return () => {\n toggleLoadingOverlay({\n type,\n isLoading: false,\n key,\n })\n }\n }, [show, toggleLoadingOverlay, key, type, loadingText])\n\n return null\n}\n\nexport type FormLoadingOverlayToggleProps = {\n action: 'create' | 'loading' | 'update'\n formIsLoading?: boolean\n loadingSuffix?: string\n name: string\n type?: LoadingOverlayTypes\n}\n\nexport const FormLoadingOverlayToggle: React.FC<FormLoadingOverlayToggleProps> = ({\n name,\n type = 'fullscreen',\n action,\n formIsLoading = false,\n loadingSuffix,\n}) => {\n const isProcessing = useFormProcessing()\n const { i18n, t } = useTranslation()\n\n const labels = {\n create: t('general:creating'),\n loading: t('general:loading'),\n update: t('general:updating'),\n }\n\n return (\n <LoadingOverlayToggle\n loadingText={`${labels[action]} ${\n loadingSuffix ? getTranslation(loadingSuffix, i18n) : ''\n }`.trim()}\n name={name}\n show={formIsLoading || isProcessing}\n type={type}\n />\n )\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1,6 +1,5 @@
1
1
  'use client';
2
2
 
3
- import { c as _c } from "react/compiler-runtime";
4
3
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
5
4
  import React, { createContext } from 'react';
6
5
  import { LoadingOverlay } from '../../elements/Loading/index.js';
@@ -12,118 +11,63 @@ const Context = /*#__PURE__*/createContext({
12
11
  isOnScreen: false,
13
12
  toggleLoadingOverlay: undefined
14
13
  });
15
- export const LoadingOverlayProvider = t0 => {
16
- const $ = _c(21);
17
- const {
18
- children
19
- } = t0;
14
+ export const LoadingOverlayProvider = ({
15
+ children
16
+ }) => {
20
17
  const {
21
18
  t
22
19
  } = useTranslation();
23
- let t1;
24
- if ($[0] !== t) {
25
- t1 = t("general:loading");
26
- $[0] = t;
27
- $[1] = t1;
28
- } else {
29
- t1 = $[1];
30
- }
31
- const fallbackText = t1;
20
+ const fallbackText = t('general:loading');
32
21
  const [overlays, dispatchOverlay] = React.useReducer(reducer, defaultLoadingOverlayState);
33
- let t2;
34
- if ($[2] !== overlays.isLoading) {
35
- t2 = {
36
- delayBeforeShow: 1000,
37
- inTimeout: animatedDuration,
38
- minShowTime: 500,
39
- outTimeout: animatedDuration,
40
- show: overlays.isLoading
41
- };
42
- $[2] = overlays.isLoading;
43
- $[3] = t2;
44
- } else {
45
- t2 = $[3];
46
- }
47
22
  const {
48
23
  isMounted,
49
24
  isUnmounting,
50
25
  triggerDelayedRender
51
- } = useDelayedRender(t2);
52
- let t3;
53
- if ($[4] !== fallbackText || $[5] !== triggerDelayedRender) {
54
- t3 = t4 => {
55
- const {
56
- type,
57
- isLoading,
58
- key,
59
- loadingText: t5
60
- } = t4;
61
- const loadingText = t5 === undefined ? fallbackText : t5;
62
- if (isLoading) {
63
- triggerDelayedRender();
64
- dispatchOverlay({
65
- type: "add",
66
- payload: {
67
- type,
68
- key,
69
- loadingText
70
- }
71
- });
72
- } else {
73
- dispatchOverlay({
74
- type: "remove",
75
- payload: {
76
- type,
77
- key
78
- }
79
- });
80
- }
81
- };
82
- $[4] = fallbackText;
83
- $[5] = triggerDelayedRender;
84
- $[6] = t3;
85
- } else {
86
- t3 = $[6];
87
- }
88
- const toggleLoadingOverlay = t3;
89
- let t4;
90
- if ($[7] !== children || $[8] !== fallbackText || $[9] !== isMounted || $[10] !== isUnmounting || $[11] !== overlays.loadingText || $[12] !== overlays.overlayType || $[13] !== toggleLoadingOverlay) {
91
- let t5;
92
- if ($[15] !== fallbackText || $[16] !== isMounted || $[17] !== isUnmounting || $[18] !== overlays.loadingText || $[19] !== overlays.overlayType) {
93
- t5 = isMounted && _jsx(LoadingOverlay, {
94
- animationDuration: `${animatedDuration}ms`,
95
- loadingText: overlays.loadingText || fallbackText,
96
- overlayType: overlays.overlayType,
97
- show: !isUnmounting
26
+ } = useDelayedRender({
27
+ delayBeforeShow: 1000,
28
+ inTimeout: animatedDuration,
29
+ minShowTime: 500,
30
+ outTimeout: animatedDuration,
31
+ show: overlays.isLoading
32
+ });
33
+ const toggleLoadingOverlay = React.useCallback(({
34
+ type,
35
+ isLoading,
36
+ key,
37
+ loadingText = fallbackText
38
+ }) => {
39
+ if (isLoading) {
40
+ triggerDelayedRender();
41
+ dispatchOverlay({
42
+ type: 'add',
43
+ payload: {
44
+ type,
45
+ key,
46
+ loadingText
47
+ }
98
48
  });
99
- $[15] = fallbackText;
100
- $[16] = isMounted;
101
- $[17] = isUnmounting;
102
- $[18] = overlays.loadingText;
103
- $[19] = overlays.overlayType;
104
- $[20] = t5;
105
49
  } else {
106
- t5 = $[20];
50
+ dispatchOverlay({
51
+ type: 'remove',
52
+ payload: {
53
+ type,
54
+ key
55
+ }
56
+ });
107
57
  }
108
- t4 = _jsxs(Context, {
109
- value: {
110
- isOnScreen: isMounted,
111
- toggleLoadingOverlay
112
- },
113
- children: [t5, children]
114
- });
115
- $[7] = children;
116
- $[8] = fallbackText;
117
- $[9] = isMounted;
118
- $[10] = isUnmounting;
119
- $[11] = overlays.loadingText;
120
- $[12] = overlays.overlayType;
121
- $[13] = toggleLoadingOverlay;
122
- $[14] = t4;
123
- } else {
124
- t4 = $[14];
125
- }
126
- return t4;
58
+ }, [triggerDelayedRender, fallbackText]);
59
+ return /*#__PURE__*/_jsxs(Context, {
60
+ value: {
61
+ isOnScreen: isMounted,
62
+ toggleLoadingOverlay
63
+ },
64
+ children: [isMounted && /*#__PURE__*/_jsx(LoadingOverlay, {
65
+ animationDuration: `${animatedDuration}ms`,
66
+ loadingText: overlays.loadingText || fallbackText,
67
+ overlayType: overlays.overlayType,
68
+ show: !isUnmounting
69
+ }), children]
70
+ });
127
71
  };
128
72
  export const useLoadingOverlay = () => {
129
73
  const contextHook = React.use(Context);