@payloadcms/ui 3.0.0-beta.92 → 3.0.0-beta.94

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 (112) hide show
  1. package/dist/elements/BulkUpload/AddFilesView/index.d.ts.map +1 -1
  2. package/dist/elements/BulkUpload/AddFilesView/index.js +44 -30
  3. package/dist/elements/BulkUpload/AddFilesView/index.js.map +1 -1
  4. package/dist/elements/BulkUpload/AddFilesView/index.scss +14 -1
  5. package/dist/elements/BulkUpload/AddingFilesView/index.d.ts.map +1 -1
  6. package/dist/elements/BulkUpload/AddingFilesView/index.js +7 -7
  7. package/dist/elements/BulkUpload/AddingFilesView/index.js.map +1 -1
  8. package/dist/elements/BulkUpload/DiscardWithoutSaving/index.d.ts.map +1 -1
  9. package/dist/elements/BulkUpload/DiscardWithoutSaving/index.js +14 -17
  10. package/dist/elements/BulkUpload/DiscardWithoutSaving/index.js.map +1 -1
  11. package/dist/elements/BulkUpload/DrawerCloseButton/index.d.ts +1 -2
  12. package/dist/elements/BulkUpload/DrawerCloseButton/index.d.ts.map +1 -1
  13. package/dist/elements/BulkUpload/DrawerCloseButton/index.js +5 -8
  14. package/dist/elements/BulkUpload/DrawerCloseButton/index.js.map +1 -1
  15. package/dist/elements/BulkUpload/EditForm/index.d.ts.map +1 -1
  16. package/dist/elements/BulkUpload/EditForm/index.js +31 -28
  17. package/dist/elements/BulkUpload/EditForm/index.js.map +1 -1
  18. package/dist/elements/BulkUpload/FileSidebar/index.d.ts.map +1 -1
  19. package/dist/elements/BulkUpload/FileSidebar/index.js +65 -55
  20. package/dist/elements/BulkUpload/FileSidebar/index.js.map +1 -1
  21. package/dist/elements/BulkUpload/FileSidebar/index.scss +4 -0
  22. package/dist/elements/BulkUpload/FormsManager/index.d.ts +4 -7
  23. package/dist/elements/BulkUpload/FormsManager/index.d.ts.map +1 -1
  24. package/dist/elements/BulkUpload/FormsManager/index.js +62 -36
  25. package/dist/elements/BulkUpload/FormsManager/index.js.map +1 -1
  26. package/dist/elements/BulkUpload/Header/index.d.ts.map +1 -1
  27. package/dist/elements/BulkUpload/Header/index.js +1 -3
  28. package/dist/elements/BulkUpload/Header/index.js.map +1 -1
  29. package/dist/elements/BulkUpload/index.d.ts +21 -5
  30. package/dist/elements/BulkUpload/index.d.ts.map +1 -1
  31. package/dist/elements/BulkUpload/index.js +148 -51
  32. package/dist/elements/BulkUpload/index.js.map +1 -1
  33. package/dist/elements/DocumentDrawer/DrawerContent.d.ts.map +1 -1
  34. package/dist/elements/DocumentDrawer/DrawerContent.js +18 -15
  35. package/dist/elements/DocumentDrawer/DrawerContent.js.map +1 -1
  36. package/dist/elements/DocumentDrawer/types.d.ts +1 -0
  37. package/dist/elements/DocumentDrawer/types.d.ts.map +1 -1
  38. package/dist/elements/DocumentDrawer/types.js.map +1 -1
  39. package/dist/elements/DraggableSortable/index.d.ts.map +1 -1
  40. package/dist/elements/DraggableSortable/index.js +1 -0
  41. package/dist/elements/DraggableSortable/index.js.map +1 -1
  42. package/dist/elements/Dropzone/index.d.ts +3 -3
  43. package/dist/elements/Dropzone/index.d.ts.map +1 -1
  44. package/dist/elements/Dropzone/index.js +23 -50
  45. package/dist/elements/Dropzone/index.js.map +1 -1
  46. package/dist/elements/Dropzone/index.scss +6 -23
  47. package/dist/elements/FileDetails/DraggableFileDetails/index.d.ts.map +1 -1
  48. package/dist/elements/FileDetails/DraggableFileDetails/index.js.map +1 -1
  49. package/dist/elements/FileDetails/StaticFileDetails/index.d.ts.map +1 -1
  50. package/dist/elements/FileDetails/StaticFileDetails/index.js +0 -1
  51. package/dist/elements/FileDetails/StaticFileDetails/index.js.map +1 -1
  52. package/dist/elements/FileDetails/StaticFileDetails/index.scss +1 -0
  53. package/dist/elements/ListDrawer/index.scss +7 -0
  54. package/dist/elements/PublishButton/index.d.ts.map +1 -1
  55. package/dist/elements/PublishButton/index.js +108 -45
  56. package/dist/elements/PublishButton/index.js.map +1 -1
  57. package/dist/elements/ShimmerEffect/index.d.ts +3 -3
  58. package/dist/elements/ShimmerEffect/index.d.ts.map +1 -1
  59. package/dist/elements/ShimmerEffect/index.js.map +1 -1
  60. package/dist/elements/Thumbnail/index.d.ts +10 -6
  61. package/dist/elements/Thumbnail/index.d.ts.map +1 -1
  62. package/dist/elements/Thumbnail/index.js +84 -9
  63. package/dist/elements/Thumbnail/index.js.map +1 -1
  64. package/dist/elements/Upload/index.d.ts.map +1 -1
  65. package/dist/elements/Upload/index.js +59 -33
  66. package/dist/elements/Upload/index.js.map +1 -1
  67. package/dist/elements/Upload/index.scss +9 -0
  68. package/dist/exports/client/{CodeEditor-MTP455NO.js → CodeEditor-P66JEENA.js} +2 -2
  69. package/dist/exports/client/{chunk-NJHSEGFB.js → chunk-XKP472RX.js} +1 -1
  70. package/dist/exports/client/{chunk-NJHSEGFB.js.map → chunk-XKP472RX.js.map} +1 -1
  71. package/dist/exports/client/index.d.ts +3 -2
  72. package/dist/exports/client/index.d.ts.map +1 -1
  73. package/dist/exports/client/index.js +19 -19
  74. package/dist/exports/client/index.js.map +4 -4
  75. package/dist/fields/Upload/HasMany/index.d.ts +16 -2
  76. package/dist/fields/Upload/HasMany/index.d.ts.map +1 -1
  77. package/dist/fields/Upload/HasMany/index.js +148 -224
  78. package/dist/fields/Upload/HasMany/index.js.map +1 -1
  79. package/dist/fields/Upload/HasMany/index.scss +12 -56
  80. package/dist/fields/Upload/HasOne/index.d.ts +13 -9
  81. package/dist/fields/Upload/HasOne/index.d.ts.map +1 -1
  82. package/dist/fields/Upload/HasOne/index.js +30 -121
  83. package/dist/fields/Upload/HasOne/index.js.map +1 -1
  84. package/dist/fields/Upload/HasOne/index.scss +0 -68
  85. package/dist/fields/Upload/{HasOne/Input.d.ts → Input.d.ts} +9 -4
  86. package/dist/fields/Upload/Input.d.ts.map +1 -0
  87. package/dist/fields/Upload/Input.js +366 -0
  88. package/dist/fields/Upload/Input.js.map +1 -0
  89. package/dist/fields/Upload/RelationshipContent/index.d.ts +21 -0
  90. package/dist/fields/Upload/RelationshipContent/index.d.ts.map +1 -0
  91. package/dist/fields/Upload/RelationshipContent/index.js +135 -0
  92. package/dist/fields/Upload/RelationshipContent/index.js.map +1 -0
  93. package/dist/fields/Upload/RelationshipContent/index.scss +51 -0
  94. package/dist/fields/Upload/UploadCard/index.d.ts +10 -0
  95. package/dist/fields/Upload/UploadCard/index.d.ts.map +1 -0
  96. package/dist/fields/Upload/UploadCard/index.js +15 -0
  97. package/dist/fields/Upload/UploadCard/index.js.map +1 -0
  98. package/dist/fields/Upload/UploadCard/index.scss +27 -0
  99. package/dist/fields/Upload/index.d.ts +4 -4
  100. package/dist/fields/Upload/index.d.ts.map +1 -1
  101. package/dist/fields/Upload/index.js +85 -91
  102. package/dist/fields/Upload/index.js.map +1 -1
  103. package/dist/fields/Upload/index.scss +57 -0
  104. package/dist/providers/Root/index.d.ts +12 -12
  105. package/dist/providers/Root/index.d.ts.map +1 -1
  106. package/dist/providers/Root/index.js.map +1 -1
  107. package/dist/styles.css +1 -1
  108. package/package.json +4 -4
  109. package/dist/fields/Upload/HasOne/Input.d.ts.map +0 -1
  110. package/dist/fields/Upload/HasOne/Input.js +0 -324
  111. package/dist/fields/Upload/HasOne/Input.js.map +0 -1
  112. /package/dist/exports/client/{CodeEditor-MTP455NO.js.map → CodeEditor-P66JEENA.js.map} +0 -0
@@ -1 +1 @@
1
- {"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/DocumentDrawer/types.ts"],"sourcesContent":["import type React from 'react'\nimport type { HTMLAttributes } from 'react'\n\nimport type { DocumentInfoContext } from '../../providers/DocumentInfo/types.js'\nimport type { Props as DrawerProps } from '../Drawer/types.js'\n\nexport type DocumentDrawerProps = {\n readonly collectionSlug: string\n readonly drawerSlug?: string\n readonly id?: null | number | string\n readonly onSave?: DocumentInfoContext['onSave']\n} & Pick<DrawerProps, 'Header'>\n\nexport type DocumentTogglerProps = {\n readonly children?: React.ReactNode\n readonly className?: string\n readonly collectionSlug: string\n readonly disabled?: boolean\n readonly drawerSlug?: string\n readonly id?: string\n} & HTMLAttributes<HTMLButtonElement>\n\nexport type UseDocumentDrawer = (args: { collectionSlug: string; id?: number | string }) => [\n React.FC<Omit<DocumentDrawerProps, 'collectionSlug' | 'id'>>, // drawer\n React.FC<Omit<DocumentTogglerProps, 'collectionSlug' | 'id'>>, // toggler\n {\n closeDrawer: () => void\n drawerDepth: number\n drawerSlug: string\n isDrawerOpen: boolean\n openDrawer: () => void\n toggleDrawer: () => void\n },\n]\n"],"mappings":"AAsBA","ignoreList":[]}
1
+ {"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/DocumentDrawer/types.ts"],"sourcesContent":["import type React from 'react'\nimport type { HTMLAttributes } from 'react'\n\nimport type { DocumentInfoContext } from '../../providers/DocumentInfo/types.js'\nimport type { Props as DrawerProps } from '../Drawer/types.js'\n\nexport type DocumentDrawerProps = {\n readonly AfterFields?: React.ReactNode\n readonly collectionSlug: string\n readonly drawerSlug?: string\n readonly id?: null | number | string\n readonly onSave?: DocumentInfoContext['onSave']\n} & Pick<DrawerProps, 'Header'>\n\nexport type DocumentTogglerProps = {\n readonly children?: React.ReactNode\n readonly className?: string\n readonly collectionSlug: string\n readonly disabled?: boolean\n readonly drawerSlug?: string\n readonly id?: string\n} & HTMLAttributes<HTMLButtonElement>\n\nexport type UseDocumentDrawer = (args: { collectionSlug: string; id?: number | string }) => [\n React.FC<Omit<DocumentDrawerProps, 'collectionSlug' | 'id'>>, // drawer\n React.FC<Omit<DocumentTogglerProps, 'collectionSlug' | 'id'>>, // toggler\n {\n closeDrawer: () => void\n drawerDepth: number\n drawerSlug: string\n isDrawerOpen: boolean\n openDrawer: () => void\n toggleDrawer: () => void\n },\n]\n"],"mappings":"AAuBA","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DraggableSortable/index.tsx"],"names":[],"mappings":"AAaA,OAAO,KAA6B,MAAM,OAAO,CAAA;AAEjD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAEvC,OAAO,EAAE,KAAK,EAAE,CAAA;AAEhB,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAmD7C,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DraggableSortable/index.tsx"],"names":[],"mappings":"AAaA,OAAO,KAA6B,MAAM,OAAO,CAAA;AAEjD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAEvC,OAAO,EAAE,KAAK,EAAE,CAAA;AAEhB,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAqD7C,CAAA"}
@@ -55,6 +55,7 @@ export const DraggableSortable = props => {
55
55
  active,
56
56
  over
57
57
  } = event;
58
+ event.activatorEvent.stopPropagation();
58
59
  if (!active || !over) {
59
60
  return;
60
61
  }
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["c","_c","DndContext","KeyboardSensor","PointerSensor","closestCenter","useDroppable","useSensor","useSensors","SortableContext","sortableKeyboardCoordinates","React","useCallback","useId","DraggableSortable","props","$","children","className","ids","onDragEnd","id","t0","setNodeRef","t1","Symbol","for","activationConstraint","distance","t2","coordinateGetter","sensors","t3","event","active","over","moveFromIndex","findIndex","_id","moveToIndex","_id_0","handleDragEnd","t4","_jsx","collisionDetection","items","ref"],"sources":["../../../src/elements/DraggableSortable/index.tsx"],"sourcesContent":["'use client'\nimport type { DragEndEvent } from '@dnd-kit/core'\n\nimport {\n DndContext,\n KeyboardSensor,\n PointerSensor,\n closestCenter,\n useDroppable,\n useSensor,\n useSensors,\n} from '@dnd-kit/core'\nimport { SortableContext, sortableKeyboardCoordinates } from '@dnd-kit/sortable'\nimport React, { useCallback, useId } from 'react'\n\nimport type { Props } from './types.js'\n\nexport { Props }\n\nexport const DraggableSortable: React.FC<Props> = (props) => {\n const { children, className, ids, onDragEnd } = props\n\n const id = useId()\n\n const { setNodeRef } = useDroppable({\n id,\n })\n\n const sensors = useSensors(\n useSensor(PointerSensor, {\n activationConstraint: {\n distance: 5,\n },\n }),\n useSensor(KeyboardSensor, {\n coordinateGetter: sortableKeyboardCoordinates,\n }),\n )\n\n const handleDragEnd = useCallback(\n (event: DragEndEvent) => {\n const { active, over } = event\n\n if (!active || !over) return\n\n if (typeof onDragEnd === 'function') {\n onDragEnd({\n event,\n moveFromIndex: ids.findIndex((_id) => _id === active.id),\n moveToIndex: ids.findIndex((_id) => _id === over.id),\n })\n }\n },\n [onDragEnd, ids],\n )\n\n return (\n <DndContext\n collisionDetection={closestCenter}\n id={id}\n onDragEnd={handleDragEnd}\n sensors={sensors}\n >\n <SortableContext items={ids}>\n <div className={className} ref={setNodeRef}>\n {children}\n </div>\n </SortableContext>\n </DndContext>\n )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,SACEC,UAAU,EACVC,cAAc,EACdC,aAAa,EACbC,aAAa,EACbC,YAAY,EACZC,SAAS,EACTC,UAAU,QACL;AACP,SAASC,eAAe,EAAEC,2BAA2B,QAAQ;AAC7D,OAAOC,KAAA,IAASC,WAAW,EAAEC,KAAK,QAAQ;AAM1C,OAAO,MAAMC,iBAAA,GAAqCC,KAAA;EAAA,MAAAC,CAAA,GAAAf,EAAA;EAChD;IAAAgB,QAAA;IAAAC,SAAA;IAAAC,GAAA;IAAAC;EAAA,IAAgDL,KAAA;EAEhD,MAAAM,EAAA,GAAWR,KAAA;EAAA,IAAAS,EAAA;EAAA,IAAAN,CAAA,QAAAK,EAAA;IAEyBC,EAAA;MAAAD;IAAA;IAEpCL,CAAA,MAAAK,EAAA;IAAAL,CAAA,MAAAM,EAAA;EAAA;IAAAA,EAAA,GAAAN,CAAA;EAAA;EAFA;IAAAO;EAAA,IAAuBjB,YAAA,CAAagB,EAEpC;EAAA,IAAAE,EAAA;EAAA,IAAAR,CAAA,QAAAS,MAAA,CAAAC,GAAA;IAG2BF,EAAA;MAAAG,oBAAA;QAAAC,QAAA;MAAA;IAAA;IAIzBZ,CAAA,MAAAQ,EAAA;EAAA;IAAAA,EAAA,GAAAR,CAAA;EAAA;EAAA,IAAAa,EAAA;EAAA,IAAAb,CAAA,QAAAS,MAAA,CAAAC,GAAA;IAC0BG,EAAA;MAAAC,gBAAA,EAAApB;IAAA;IAE1BM,CAAA,MAAAa,EAAA;EAAA;IAAAA,EAAA,GAAAb,CAAA;EAAA;EARF,MAAAe,OAAA,GAAgBvB,UAAA,CACdD,SAAA,CAAAH,aAAA,EAAyBoB,EAIzB,GACAjB,SAAA,CAAAJ,cAAA,EAA0B0B,EAE1B;EAAA,IAAAG,EAAA;EAAA,IAAAhB,CAAA,QAAAI,SAAA,IAAAJ,CAAA,QAAAG,GAAA;IAIAa,EAAA,GAAAC,KAAA;MACE;QAAAC,MAAA;QAAAC;MAAA,IAAyBF,KAAA;MAAA,IAErB,CAACC,MAAA,KAAWC,IAAA;QAAA;MAAA;MAAA,IAEZ,OAAOf,SAAA,KAAc;QACvBA,SAAA;UAAAa,KAAA;UAAAG,aAAA,EAEiBjB,GAAA,CAAAkB,SAAA,CAAAC,GAAA,IAAuBA,GAAA,KAAQJ,MAAA,CAAAb,EAAS;UAAAkB,WAAA,EAC1CpB,GAAA,CAAAkB,SAAA,CAAAG,KAAA,IAAuBF,KAAA,KAAQH,IAAA,CAAAd,EAAO;QAAA,CACrD;MAAA;IAAA;IAEJL,CAAA,MAAAI,SAAA;IAAAJ,CAAA,MAAAG,GAAA;IAAAH,CAAA,MAAAgB,EAAA;EAAA;IAAAA,EAAA,GAAAhB,CAAA;EAAA;EAbF,MAAAyB,aAAA,GAAsBT,EAcJ;EAAA,IAAAU,EAAA;EAAA,IAAA1B,CAAA,QAAAE,SAAA,IAAAF,CAAA,QAAAO,UAAA,IAAAP,CAAA,QAAAC,QAAA,IAAAD,CAAA,SAAAG,GAAA,IAAAH,CAAA,SAAAK,EAAA,IAAAL,CAAA,SAAAyB,aAAA,IAAAzB,CAAA,SAAAe,OAAA;IAIhBW,EAAA,GAAAC,IAAA,CAAAzC,UAAA;MAAA0C,kBAAA,EAAAvC,aAAA;MAAAgB,EAAA;MAAAD,SAAA,EAGaqB,aAAA;MAAAV,OAAA;MAAAd,QAAA,EAGX0B,IAAA,CAAAlC,eAAA;QAAAoC,KAAA,EAAwB1B,GAAA;QAAAF,QAAA,EACtB0B,IAAA,CAAC;UAAAzB,SAAA;UAAA4B,GAAA,EAA+BvB,UAAA;UAAAN;QAAA,C;;;;;;;;;;;;;;SAPpCyB,E;CAaJ","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["c","_c","DndContext","KeyboardSensor","PointerSensor","closestCenter","useDroppable","useSensor","useSensors","SortableContext","sortableKeyboardCoordinates","React","useCallback","useId","DraggableSortable","props","$","children","className","ids","onDragEnd","id","t0","setNodeRef","t1","Symbol","for","activationConstraint","distance","t2","coordinateGetter","sensors","t3","event","active","over","activatorEvent","stopPropagation","moveFromIndex","findIndex","_id","moveToIndex","_id_0","handleDragEnd","t4","_jsx","collisionDetection","items","ref"],"sources":["../../../src/elements/DraggableSortable/index.tsx"],"sourcesContent":["'use client'\nimport type { DragEndEvent } from '@dnd-kit/core'\n\nimport {\n DndContext,\n KeyboardSensor,\n PointerSensor,\n closestCenter,\n useDroppable,\n useSensor,\n useSensors,\n} from '@dnd-kit/core'\nimport { SortableContext, sortableKeyboardCoordinates } from '@dnd-kit/sortable'\nimport React, { useCallback, useId } from 'react'\n\nimport type { Props } from './types.js'\n\nexport { Props }\n\nexport const DraggableSortable: React.FC<Props> = (props) => {\n const { children, className, ids, onDragEnd } = props\n\n const id = useId()\n\n const { setNodeRef } = useDroppable({\n id,\n })\n\n const sensors = useSensors(\n useSensor(PointerSensor, {\n activationConstraint: {\n distance: 5,\n },\n }),\n useSensor(KeyboardSensor, {\n coordinateGetter: sortableKeyboardCoordinates,\n }),\n )\n\n const handleDragEnd = useCallback(\n (event: DragEndEvent) => {\n const { active, over } = event\n\n event.activatorEvent.stopPropagation()\n\n if (!active || !over) return\n\n if (typeof onDragEnd === 'function') {\n onDragEnd({\n event,\n moveFromIndex: ids.findIndex((_id) => _id === active.id),\n moveToIndex: ids.findIndex((_id) => _id === over.id),\n })\n }\n },\n [onDragEnd, ids],\n )\n\n return (\n <DndContext\n collisionDetection={closestCenter}\n id={id}\n onDragEnd={handleDragEnd}\n sensors={sensors}\n >\n <SortableContext items={ids}>\n <div className={className} ref={setNodeRef}>\n {children}\n </div>\n </SortableContext>\n </DndContext>\n )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,SACEC,UAAU,EACVC,cAAc,EACdC,aAAa,EACbC,aAAa,EACbC,YAAY,EACZC,SAAS,EACTC,UAAU,QACL;AACP,SAASC,eAAe,EAAEC,2BAA2B,QAAQ;AAC7D,OAAOC,KAAA,IAASC,WAAW,EAAEC,KAAK,QAAQ;AAM1C,OAAO,MAAMC,iBAAA,GAAqCC,KAAA;EAAA,MAAAC,CAAA,GAAAf,EAAA;EAChD;IAAAgB,QAAA;IAAAC,SAAA;IAAAC,GAAA;IAAAC;EAAA,IAAgDL,KAAA;EAEhD,MAAAM,EAAA,GAAWR,KAAA;EAAA,IAAAS,EAAA;EAAA,IAAAN,CAAA,QAAAK,EAAA;IAEyBC,EAAA;MAAAD;IAAA;IAEpCL,CAAA,MAAAK,EAAA;IAAAL,CAAA,MAAAM,EAAA;EAAA;IAAAA,EAAA,GAAAN,CAAA;EAAA;EAFA;IAAAO;EAAA,IAAuBjB,YAAA,CAAagB,EAEpC;EAAA,IAAAE,EAAA;EAAA,IAAAR,CAAA,QAAAS,MAAA,CAAAC,GAAA;IAG2BF,EAAA;MAAAG,oBAAA;QAAAC,QAAA;MAAA;IAAA;IAIzBZ,CAAA,MAAAQ,EAAA;EAAA;IAAAA,EAAA,GAAAR,CAAA;EAAA;EAAA,IAAAa,EAAA;EAAA,IAAAb,CAAA,QAAAS,MAAA,CAAAC,GAAA;IAC0BG,EAAA;MAAAC,gBAAA,EAAApB;IAAA;IAE1BM,CAAA,MAAAa,EAAA;EAAA;IAAAA,EAAA,GAAAb,CAAA;EAAA;EARF,MAAAe,OAAA,GAAgBvB,UAAA,CACdD,SAAA,CAAAH,aAAA,EAAyBoB,EAIzB,GACAjB,SAAA,CAAAJ,cAAA,EAA0B0B,EAE1B;EAAA,IAAAG,EAAA;EAAA,IAAAhB,CAAA,QAAAI,SAAA,IAAAJ,CAAA,QAAAG,GAAA;IAIAa,EAAA,GAAAC,KAAA;MACE;QAAAC,MAAA;QAAAC;MAAA,IAAyBF,KAAA;MAEzBA,KAAA,CAAAG,cAAA,CAAAC,eAAA,CAAoC;MAAA,IAEhC,CAACH,MAAA,KAAWC,IAAA;QAAA;MAAA;MAAA,IAEZ,OAAOf,SAAA,KAAc;QACvBA,SAAA;UAAAa,KAAA;UAAAK,aAAA,EAEiBnB,GAAA,CAAAoB,SAAA,CAAAC,GAAA,IAAuBA,GAAA,KAAQN,MAAA,CAAAb,EAAS;UAAAoB,WAAA,EAC1CtB,GAAA,CAAAoB,SAAA,CAAAG,KAAA,IAAuBF,KAAA,KAAQL,IAAA,CAAAd,EAAO;QAAA,CACrD;MAAA;IAAA;IAEJL,CAAA,MAAAI,SAAA;IAAAJ,CAAA,MAAAG,GAAA;IAAAH,CAAA,MAAAgB,EAAA;EAAA;IAAAA,EAAA,GAAAhB,CAAA;EAAA;EAfF,MAAA2B,aAAA,GAAsBX,EAgBJ;EAAA,IAAAY,EAAA;EAAA,IAAA5B,CAAA,QAAAE,SAAA,IAAAF,CAAA,QAAAO,UAAA,IAAAP,CAAA,QAAAC,QAAA,IAAAD,CAAA,SAAAG,GAAA,IAAAH,CAAA,SAAAK,EAAA,IAAAL,CAAA,SAAA2B,aAAA,IAAA3B,CAAA,SAAAe,OAAA;IAIhBa,EAAA,GAAAC,IAAA,CAAA3C,UAAA;MAAA4C,kBAAA,EAAAzC,aAAA;MAAAgB,EAAA;MAAAD,SAAA,EAGauB,aAAA;MAAAZ,OAAA;MAAAd,QAAA,EAGX4B,IAAA,CAAApC,eAAA;QAAAsC,KAAA,EAAwB5B,GAAA;QAAAF,QAAA,EACtB4B,IAAA,CAAC;UAAA3B,SAAA;UAAA8B,GAAA,EAA+BzB,UAAA;UAAAN;QAAA,C;;;;;;;;;;;;;;SAPpC2B,E;CAaJ","ignoreList":[]}
@@ -1,11 +1,11 @@
1
1
  import React from 'react';
2
2
  import './index.scss';
3
3
  export type Props = {
4
+ readonly children?: React.ReactNode;
4
5
  readonly className?: string;
5
- readonly mimeTypes?: string[];
6
+ readonly dropzoneStyle?: 'default' | 'none';
6
7
  readonly multipleFiles?: boolean;
7
8
  readonly onChange: (e: FileList) => void;
8
- readonly onPasteUrlClick?: () => void;
9
9
  };
10
- export declare const Dropzone: React.FC<Props>;
10
+ export declare function Dropzone({ children, className, dropzoneStyle, multipleFiles, onChange, }: Props): React.JSX.Element;
11
11
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Dropzone/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,cAAc,CAAA;AASrB,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,EAAE,CAAA;IAC7B,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAA;IAChC,QAAQ,CAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,QAAQ,KAAK,IAAI,CAAA;IACxC,QAAQ,CAAC,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;CACtC,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA2HpC,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Dropzone/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,cAAc,CAAA;AASrB,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACnC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,aAAa,CAAC,EAAE,SAAS,GAAG,MAAM,CAAA;IAC3C,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAA;IAChC,QAAQ,CAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,QAAQ,KAAK,IAAI,CAAA;CACzC,CAAA;AAED,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,SAAS,EACT,aAAyB,EACzB,aAAa,EACb,QAAQ,GACT,EAAE,KAAK,qBA6FP"}
@@ -1,35 +1,38 @@
1
1
  'use client';
2
2
 
3
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ import { jsx as _jsx } from "react/jsx-runtime";
4
4
  import React from 'react';
5
- import { useTranslation } from '../../providers/Translation/index.js';
6
- import { Button } from '../Button/index.js';
7
5
  import './index.scss';
8
6
  const handleDragOver = e => {
9
7
  e.preventDefault();
10
8
  e.stopPropagation();
11
9
  };
12
10
  const baseClass = 'dropzone';
13
- export const Dropzone = ({
11
+ export function Dropzone({
12
+ children,
14
13
  className,
15
- mimeTypes,
14
+ dropzoneStyle = 'default',
16
15
  multipleFiles,
17
- onChange,
18
- onPasteUrlClick
19
- }) => {
16
+ onChange
17
+ }) {
20
18
  const dropRef = React.useRef(null);
21
19
  const [dragging, setDragging] = React.useState(false);
22
- const inputRef = React.useRef(null);
23
- const {
24
- t
25
- } = useTranslation();
20
+ const addFiles = React.useCallback(files => {
21
+ if (!multipleFiles && files.length > 1) {
22
+ const dataTransfer = new DataTransfer();
23
+ dataTransfer.items.add(files[0]);
24
+ onChange(dataTransfer.files);
25
+ } else {
26
+ onChange(files);
27
+ }
28
+ }, [multipleFiles, onChange]);
26
29
  const handlePaste = React.useCallback(e => {
27
30
  e.preventDefault();
28
31
  e.stopPropagation();
29
32
  if (e.clipboardData.files && e.clipboardData.files.length > 0) {
30
- onChange(e.clipboardData.files);
33
+ addFiles(e.clipboardData.files);
31
34
  }
32
- }, [onChange]);
35
+ }, [addFiles]);
33
36
  const handleDragEnter = React.useCallback(e_0 => {
34
37
  e_0.preventDefault();
35
38
  e_0.stopPropagation();
@@ -45,16 +48,11 @@ export const Dropzone = ({
45
48
  e_2.stopPropagation();
46
49
  setDragging(false);
47
50
  if (e_2.dataTransfer.files && e_2.dataTransfer.files.length > 0) {
48
- onChange(e_2.dataTransfer.files);
51
+ addFiles(e_2.dataTransfer.files);
49
52
  setDragging(false);
50
53
  e_2.dataTransfer.clearData();
51
54
  }
52
- }, [onChange]);
53
- const handleFileSelection = React.useCallback(e_3 => {
54
- if (e_3.target.files && e_3.target.files.length > 0) {
55
- onChange(e_3.target.files);
56
- }
57
- }, [onChange]);
55
+ }, [addFiles]);
58
56
  React.useEffect(() => {
59
57
  const div = dropRef.current;
60
58
  if (div) {
@@ -73,36 +71,11 @@ export const Dropzone = ({
73
71
  }
74
72
  return () => null;
75
73
  }, [handleDragEnter, handleDragLeave, handleDrop, handlePaste]);
76
- const classes = [baseClass, className, dragging ? 'dragging' : ''].filter(Boolean).join(' ');
77
- return /*#__PURE__*/_jsxs("div", {
74
+ const classes = [baseClass, className, dragging ? 'dragging' : '', `dropzoneStyle--${dropzoneStyle}`].filter(Boolean).join(' ');
75
+ return /*#__PURE__*/_jsx("div", {
78
76
  className: classes,
79
77
  ref: dropRef,
80
- children: [/*#__PURE__*/_jsx(Button, {
81
- buttonStyle: "secondary",
82
- className: `${baseClass}__file-button`,
83
- onClick: () => {
84
- inputRef.current.click();
85
- },
86
- size: "medium",
87
- children: t('upload:selectFile')
88
- }), typeof onPasteUrlClick === 'function' && /*#__PURE__*/_jsx(Button, {
89
- buttonStyle: "secondary",
90
- className: `${baseClass}__file-button`,
91
- onClick: onPasteUrlClick,
92
- size: "medium",
93
- children: t('upload:pasteURL')
94
- }), /*#__PURE__*/_jsx("input", {
95
- accept: mimeTypes?.join(','),
96
- "aria-hidden": "true",
97
- className: `${baseClass}__hidden-input`,
98
- multiple: multipleFiles,
99
- onChange: handleFileSelection,
100
- ref: inputRef,
101
- type: "file"
102
- }), /*#__PURE__*/_jsxs("p", {
103
- className: `${baseClass}__label`,
104
- children: [t('general:or'), " ", t('upload:dragAndDrop')]
105
- })]
78
+ children: children
106
79
  });
107
- };
80
+ }
108
81
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["React","useTranslation","Button","handleDragOver","e","preventDefault","stopPropagation","baseClass","Dropzone","className","mimeTypes","multipleFiles","onChange","onPasteUrlClick","dropRef","useRef","dragging","setDragging","useState","inputRef","t","handlePaste","useCallback","clipboardData","files","length","handleDragEnter","handleDragLeave","handleDrop","dataTransfer","clearData","handleFileSelection","target","useEffect","div","current","addEventListener","removeEventListener","classes","filter","Boolean","join","_jsxs","ref","_jsx","buttonStyle","onClick","click","size","accept","multiple","type"],"sources":["../../../src/elements/Dropzone/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Button } from '../Button/index.js'\nimport './index.scss'\n\nconst handleDragOver = (e: DragEvent) => {\n e.preventDefault()\n e.stopPropagation()\n}\n\nconst baseClass = 'dropzone'\n\nexport type Props = {\n readonly className?: string\n readonly mimeTypes?: string[]\n readonly multipleFiles?: boolean\n readonly onChange: (e: FileList) => void\n readonly onPasteUrlClick?: () => void\n}\n\nexport const Dropzone: React.FC<Props> = ({\n className,\n mimeTypes,\n multipleFiles,\n onChange,\n onPasteUrlClick,\n}) => {\n const dropRef = React.useRef<HTMLDivElement>(null)\n const [dragging, setDragging] = React.useState(false)\n const inputRef = React.useRef(null)\n\n const { t } = useTranslation()\n\n const handlePaste = React.useCallback(\n (e: ClipboardEvent) => {\n e.preventDefault()\n e.stopPropagation()\n\n if (e.clipboardData.files && e.clipboardData.files.length > 0) {\n onChange(e.clipboardData.files)\n }\n },\n [onChange],\n )\n\n const handleDragEnter = React.useCallback((e: DragEvent) => {\n e.preventDefault()\n e.stopPropagation()\n setDragging(true)\n }, [])\n\n const handleDragLeave = React.useCallback((e: DragEvent) => {\n e.preventDefault()\n e.stopPropagation()\n setDragging(false)\n }, [])\n\n const handleDrop = React.useCallback(\n (e: DragEvent) => {\n e.preventDefault()\n e.stopPropagation()\n setDragging(false)\n\n if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {\n onChange(e.dataTransfer.files)\n setDragging(false)\n\n e.dataTransfer.clearData()\n }\n },\n [onChange],\n )\n\n const handleFileSelection = React.useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n if (e.target.files && e.target.files.length > 0) {\n onChange(e.target.files)\n }\n },\n [onChange],\n )\n\n React.useEffect(() => {\n const div = dropRef.current\n\n if (div) {\n div.addEventListener('dragenter', handleDragEnter)\n div.addEventListener('dragleave', handleDragLeave)\n div.addEventListener('dragover', handleDragOver)\n div.addEventListener('drop', handleDrop)\n div.addEventListener('paste', handlePaste)\n\n return () => {\n div.removeEventListener('dragenter', handleDragEnter)\n div.removeEventListener('dragleave', handleDragLeave)\n div.removeEventListener('dragover', handleDragOver)\n div.removeEventListener('drop', handleDrop)\n div.removeEventListener('paste', handlePaste)\n }\n }\n\n return () => null\n }, [handleDragEnter, handleDragLeave, handleDrop, handlePaste])\n\n const classes = [baseClass, className, dragging ? 'dragging' : ''].filter(Boolean).join(' ')\n\n return (\n <div className={classes} ref={dropRef}>\n <Button\n buttonStyle=\"secondary\"\n className={`${baseClass}__file-button`}\n onClick={() => {\n inputRef.current.click()\n }}\n size=\"medium\"\n >\n {t('upload:selectFile')}\n </Button>\n {typeof onPasteUrlClick === 'function' && (\n <Button\n buttonStyle=\"secondary\"\n className={`${baseClass}__file-button`}\n onClick={onPasteUrlClick}\n size=\"medium\"\n >\n {t('upload:pasteURL')}\n </Button>\n )}\n <input\n accept={mimeTypes?.join(',')}\n aria-hidden=\"true\"\n className={`${baseClass}__hidden-input`}\n multiple={multipleFiles}\n onChange={handleFileSelection}\n ref={inputRef}\n type=\"file\"\n />\n\n <p className={`${baseClass}__label`}>\n {t('general:or')} {t('upload:dragAndDrop')}\n </p>\n </div>\n )\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["React","handleDragOver","e","preventDefault","stopPropagation","baseClass","Dropzone","children","className","dropzoneStyle","multipleFiles","onChange","dropRef","useRef","dragging","setDragging","useState","addFiles","useCallback","files","length","dataTransfer","DataTransfer","items","add","handlePaste","clipboardData","handleDragEnter","handleDragLeave","handleDrop","clearData","useEffect","div","current","addEventListener","removeEventListener","classes","filter","Boolean","join","_jsx","ref"],"sources":["../../../src/elements/Dropzone/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport './index.scss'\n\nconst handleDragOver = (e: DragEvent) => {\n e.preventDefault()\n e.stopPropagation()\n}\n\nconst baseClass = 'dropzone'\n\nexport type Props = {\n readonly children?: React.ReactNode\n readonly className?: string\n readonly dropzoneStyle?: 'default' | 'none'\n readonly multipleFiles?: boolean\n readonly onChange: (e: FileList) => void\n}\n\nexport function Dropzone({\n children,\n className,\n dropzoneStyle = 'default',\n multipleFiles,\n onChange,\n}: Props) {\n const dropRef = React.useRef<HTMLDivElement>(null)\n const [dragging, setDragging] = React.useState(false)\n\n const addFiles = React.useCallback(\n (files: FileList) => {\n if (!multipleFiles && files.length > 1) {\n const dataTransfer = new DataTransfer()\n dataTransfer.items.add(files[0])\n onChange(dataTransfer.files)\n } else {\n onChange(files)\n }\n },\n [multipleFiles, onChange],\n )\n\n const handlePaste = React.useCallback(\n (e: ClipboardEvent) => {\n e.preventDefault()\n e.stopPropagation()\n\n if (e.clipboardData.files && e.clipboardData.files.length > 0) {\n addFiles(e.clipboardData.files)\n }\n },\n [addFiles],\n )\n\n const handleDragEnter = React.useCallback((e: DragEvent) => {\n e.preventDefault()\n e.stopPropagation()\n setDragging(true)\n }, [])\n\n const handleDragLeave = React.useCallback((e: DragEvent) => {\n e.preventDefault()\n e.stopPropagation()\n setDragging(false)\n }, [])\n\n const handleDrop = React.useCallback(\n (e: DragEvent) => {\n e.preventDefault()\n e.stopPropagation()\n setDragging(false)\n\n if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {\n addFiles(e.dataTransfer.files)\n setDragging(false)\n\n e.dataTransfer.clearData()\n }\n },\n [addFiles],\n )\n\n React.useEffect(() => {\n const div = dropRef.current\n\n if (div) {\n div.addEventListener('dragenter', handleDragEnter)\n div.addEventListener('dragleave', handleDragLeave)\n div.addEventListener('dragover', handleDragOver)\n div.addEventListener('drop', handleDrop)\n div.addEventListener('paste', handlePaste)\n\n return () => {\n div.removeEventListener('dragenter', handleDragEnter)\n div.removeEventListener('dragleave', handleDragLeave)\n div.removeEventListener('dragover', handleDragOver)\n div.removeEventListener('drop', handleDrop)\n div.removeEventListener('paste', handlePaste)\n }\n }\n\n return () => null\n }, [handleDragEnter, handleDragLeave, handleDrop, handlePaste])\n\n const classes = [\n baseClass,\n className,\n dragging ? 'dragging' : '',\n `dropzoneStyle--${dropzoneStyle}`,\n ]\n .filter(Boolean)\n .join(' ')\n\n return (\n <div className={classes} ref={dropRef}>\n {children}\n </div>\n )\n}\n"],"mappings":"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","ignoreList":[]}
@@ -4,9 +4,8 @@
4
4
  position: relative;
5
5
  display: flex;
6
6
  align-items: center;
7
- gap: base(0.4);
8
- padding: base(1.6);
9
- background: var(--theme-elevation-50);
7
+ padding: calc(var(--base) * .9) calc(var(--base) / 2);
8
+ background: transparent;
10
9
  border: 1px dotted var(--theme-elevation-400);
11
10
  border-radius: var(--style-radius-s);
12
11
  height: 100%;
@@ -18,6 +17,7 @@
18
17
  margin: 0;
19
18
  display: flex;
20
19
  justify-content: center;
20
+ align-items: center;
21
21
  }
22
22
 
23
23
  &.dragging {
@@ -30,29 +30,12 @@
30
30
  }
31
31
  }
32
32
 
33
- &__label {
34
- margin: 0;
35
- text-transform: lowercase;
36
- }
37
-
38
- &__hidden-input {
39
- position: absolute;
40
- pointer-events: none;
41
- visibility: hidden;
42
- }
43
-
44
33
  @include mid-break {
45
34
  display: block;
46
35
  text-align: center;
36
+ }
47
37
 
48
- .btn {
49
- margin: 0 auto;
50
- width: 100%;
51
- max-width: 200px;
52
- }
53
-
54
- &__label {
55
- display: none;
56
- }
38
+ &.dropzoneStyle--none {
39
+ all: unset;
57
40
  }
58
41
  }
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/FileDetails/DraggableFileDetails/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,cAAc,CAAA;AAIrB,OAAO,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAOzE,MAAM,MAAM,yBAAyB,GAAG;IACtC,cAAc,EAAE,MAAM,CAAA;IACtB,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAA;IACvC,GAAG,EAAE;QACH,KAAK,CAAC,EAAE,SAAS,CAAA;KAClB,GAAG,IAAI,CAAA;IACR,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,OAAO,EAAE,OAAO,CAAA;IAChB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACpC,QAAQ,EAAE,MAAM,CAAA;IAChB,YAAY,EAAE,yBAAyB,CAAC,QAAQ,CAAC,CAAA;CAClD,CAAA;AAED,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CAgFpE,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/FileDetails/DraggableFileDetails/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,cAAc,CAAA;AAIrB,OAAO,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAOzE,MAAM,MAAM,yBAAyB,GAAG;IACtC,cAAc,EAAE,MAAM,CAAA;IACtB,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAA;IACvC,GAAG,EAAE;QACH,KAAK,CAAC,EAAE,SAAS,CAAA;KAClB,GAAG,IAAI,CAAA;IACR,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,OAAO,EAAE,OAAO,CAAA;IAChB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACpC,QAAQ,EAAE,MAAM,CAAA;IAChB,YAAY,EAAE,yBAAyB,CAAC,QAAQ,CAAC,CAAA;CAClD,CAAA;AAED,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CAqEpE,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["c","_c","React","Button","Thumbnail","baseClass","DraggableSortableItem","DragHandleIcon","EditIcon","useDocumentDrawer","DraggableFileDetails","props","$","collectionSlug","doc","imageCacheTag","isSortable","removeItem","rowIndex","uploadConfig","id","filename","thumbnailURL","url","t0","DocumentDrawer","DocumentDrawerToggler","t1","draggableSortableItemProps","_jsxs","className","filter","Boolean","join","ref","setNodeRef","style","transform","transition","zIndex","isDragging","undefined","children","_jsx","attributes","listeners","fileSrc","buttonStyle","icon","iconStyle","onClick","round","t2"],"sources":["../../../../src/elements/FileDetails/DraggableFileDetails/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { Button } from '../../Button/index.js'\nimport { Thumbnail } from '../../Thumbnail/index.js'\nimport { UploadActions } from '../../Upload/index.js'\nimport { FileMeta } from '../FileMeta/index.js'\nimport './index.scss'\n\nconst baseClass = 'file-details-draggable'\n\nimport type { Data, FileSizes, SanitizedCollectionConfig } from 'payload'\n\nimport { DraggableSortableItem } from '../../../elements/DraggableSortable/DraggableSortableItem/index.js'\nimport { DragHandleIcon } from '../../../icons/DragHandle/index.js'\nimport { EditIcon } from '../../../icons/Edit/index.js'\nimport { useDocumentDrawer } from '../../DocumentDrawer/index.js'\n\nexport type DraggableFileDetailsProps = {\n collectionSlug: string\n customUploadActions?: React.ReactNode[]\n doc: {\n sizes?: FileSizes\n } & Data\n enableAdjustments?: boolean\n hasImageSizes?: boolean\n hasMany: boolean\n imageCacheTag?: string\n isSortable?: boolean\n removeItem?: (index: number) => void\n rowIndex: number\n uploadConfig: SanitizedCollectionConfig['upload']\n}\n\nexport const DraggableFileDetails: React.FC<DraggableFileDetailsProps> = (props) => {\n const {\n collectionSlug,\n customUploadActions,\n doc,\n enableAdjustments,\n hasImageSizes,\n hasMany,\n imageCacheTag,\n isSortable,\n removeItem,\n rowIndex,\n uploadConfig,\n } = props\n\n const { id, filename, filesize, height, mimeType, thumbnailURL, url, width } = doc\n\n const [DocumentDrawer, DocumentDrawerToggler] = useDocumentDrawer({\n id,\n collectionSlug,\n })\n\n return (\n <DraggableSortableItem id={id} key={id}>\n {(draggableSortableItemProps) => (\n <div\n className={[\n baseClass,\n draggableSortableItemProps && isSortable && `${baseClass}--has-drag-handle`,\n ]\n .filter(Boolean)\n .join(' ')}\n ref={draggableSortableItemProps.setNodeRef}\n style={{\n transform: draggableSortableItemProps.transform,\n transition: draggableSortableItemProps.transition,\n zIndex: draggableSortableItemProps.isDragging ? 1 : undefined,\n }}\n >\n <div className={`${baseClass}--drag-wrapper`}>\n {isSortable && draggableSortableItemProps && (\n <div\n className={`${baseClass}__drag`}\n {...draggableSortableItemProps.attributes}\n {...draggableSortableItemProps.listeners}\n >\n <DragHandleIcon />\n </div>\n )}\n <Thumbnail\n className={`${baseClass}__thumbnail`}\n collectionSlug={collectionSlug}\n doc={doc}\n fileSrc={thumbnailURL || url}\n imageCacheTag={imageCacheTag}\n uploadConfig={uploadConfig}\n />\n </div>\n <div className={`${baseClass}__main-detail`}>{filename}</div>\n\n <div className={`${baseClass}__actions`}>\n <DocumentDrawer />\n <DocumentDrawerToggler>\n <EditIcon />\n </DocumentDrawerToggler>\n {removeItem && (\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__remove`}\n icon=\"x\"\n iconStyle=\"none\"\n onClick={() => removeItem(rowIndex)}\n round\n />\n )}\n </div>\n </div>\n )}\n </DraggableSortableItem>\n )\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["c","_c","React","Button","Thumbnail","baseClass","DraggableSortableItem","DragHandleIcon","EditIcon","useDocumentDrawer","DraggableFileDetails","props","$","collectionSlug","doc","imageCacheTag","isSortable","removeItem","rowIndex","uploadConfig","id","filename","thumbnailURL","url","t0","DocumentDrawer","DocumentDrawerToggler","t1","draggableSortableItemProps","_jsxs","className","filter","Boolean","join","ref","setNodeRef","style","transform","transition","zIndex","isDragging","undefined","children","_jsx","attributes","listeners","fileSrc","buttonStyle","icon","iconStyle","onClick","round","t2"],"sources":["../../../../src/elements/FileDetails/DraggableFileDetails/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { Button } from '../../Button/index.js'\nimport { Thumbnail } from '../../Thumbnail/index.js'\nimport { UploadActions } from '../../Upload/index.js'\nimport { FileMeta } from '../FileMeta/index.js'\nimport './index.scss'\n\nconst baseClass = 'file-details-draggable'\n\nimport type { Data, FileSizes, SanitizedCollectionConfig } from 'payload'\n\nimport { DraggableSortableItem } from '../../../elements/DraggableSortable/DraggableSortableItem/index.js'\nimport { DragHandleIcon } from '../../../icons/DragHandle/index.js'\nimport { EditIcon } from '../../../icons/Edit/index.js'\nimport { useDocumentDrawer } from '../../DocumentDrawer/index.js'\n\nexport type DraggableFileDetailsProps = {\n collectionSlug: string\n customUploadActions?: React.ReactNode[]\n doc: {\n sizes?: FileSizes\n } & Data\n enableAdjustments?: boolean\n hasImageSizes?: boolean\n hasMany: boolean\n imageCacheTag?: string\n isSortable?: boolean\n removeItem?: (index: number) => void\n rowIndex: number\n uploadConfig: SanitizedCollectionConfig['upload']\n}\n\nexport const DraggableFileDetails: React.FC<DraggableFileDetailsProps> = (props) => {\n const { collectionSlug, doc, imageCacheTag, isSortable, removeItem, rowIndex, uploadConfig } =\n props\n\n const { id, filename, thumbnailURL, url } = doc\n\n const [DocumentDrawer, DocumentDrawerToggler] = useDocumentDrawer({\n id,\n collectionSlug,\n })\n\n return (\n <DraggableSortableItem id={id} key={id}>\n {(draggableSortableItemProps) => (\n <div\n className={[\n baseClass,\n draggableSortableItemProps && isSortable && `${baseClass}--has-drag-handle`,\n ]\n .filter(Boolean)\n .join(' ')}\n ref={draggableSortableItemProps.setNodeRef}\n style={{\n transform: draggableSortableItemProps.transform,\n transition: draggableSortableItemProps.transition,\n zIndex: draggableSortableItemProps.isDragging ? 1 : undefined,\n }}\n >\n <div className={`${baseClass}--drag-wrapper`}>\n {isSortable && draggableSortableItemProps && (\n <div\n className={`${baseClass}__drag`}\n {...draggableSortableItemProps.attributes}\n {...draggableSortableItemProps.listeners}\n >\n <DragHandleIcon />\n </div>\n )}\n <Thumbnail\n className={`${baseClass}__thumbnail`}\n collectionSlug={collectionSlug}\n doc={doc}\n fileSrc={thumbnailURL || url}\n imageCacheTag={imageCacheTag}\n uploadConfig={uploadConfig}\n />\n </div>\n <div className={`${baseClass}__main-detail`}>{filename}</div>\n\n <div className={`${baseClass}__actions`}>\n <DocumentDrawer />\n <DocumentDrawerToggler>\n <EditIcon />\n </DocumentDrawerToggler>\n {removeItem && (\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__remove`}\n icon=\"x\"\n iconStyle=\"none\"\n onClick={() => removeItem(rowIndex)}\n round\n />\n )}\n </div>\n </div>\n )}\n </DraggableSortableItem>\n )\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/FileDetails/StaticFileDetails/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,cAAc,CAAA;AAIrB,OAAO,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAEzE,MAAM,MAAM,sBAAsB,GAAG;IACnC,cAAc,EAAE,MAAM,CAAA;IACtB,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAA;IACvC,GAAG,EAAE;QACH,KAAK,CAAC,EAAE,SAAS,CAAA;KAClB,GAAG,IAAI,CAAA;IACR,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAA;IACzB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,YAAY,EAAE,yBAAyB,CAAC,QAAQ,CAAC,CAAA;CAClD,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA4D9D,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/FileDetails/StaticFileDetails/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,cAAc,CAAA;AAIrB,OAAO,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAEzE,MAAM,MAAM,sBAAsB,GAAG;IACnC,cAAc,EAAE,MAAM,CAAA;IACtB,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAA;IACvC,GAAG,EAAE;QACH,KAAK,CAAC,EAAE,SAAS,CAAA;KAClB,GAAG,IAAI,CAAA;IACR,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAA;IACzB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,YAAY,EAAE,yBAAyB,CAAC,QAAQ,CAAC,CAAA;CAClD,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA2D9D,CAAA"}
@@ -35,7 +35,6 @@ export const StaticFileDetails = props => {
35
35
  children: [/*#__PURE__*/_jsx(Thumbnail, {
36
36
  // size="small"
37
37
  className: `${baseClass}__thumbnail`,
38
- collectionSlug: collectionSlug,
39
38
  doc: doc,
40
39
  fileSrc: thumbnailURL || url,
41
40
  imageCacheTag: imageCacheTag,
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["React","Button","Thumbnail","UploadActions","FileMeta","baseClass","StaticFileDetails","props","collectionSlug","customUploadActions","doc","enableAdjustments","handleRemove","hasImageSizes","imageCacheTag","uploadConfig","id","filename","filesize","height","mimeType","thumbnailURL","url","width","_jsx","className","_jsxs","fileSrc","collection","customActions","Boolean","enablePreviewSizes","buttonStyle","icon","iconStyle","onClick","round"],"sources":["../../../../src/elements/FileDetails/StaticFileDetails/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { Button } from '../../Button/index.js'\nimport { Thumbnail } from '../../Thumbnail/index.js'\nimport { UploadActions } from '../../Upload/index.js'\nimport { FileMeta } from '../FileMeta/index.js'\nimport './index.scss'\n\nconst baseClass = 'file-details'\n\nimport type { Data, FileSizes, SanitizedCollectionConfig } from 'payload'\n\nexport type StaticFileDetailsProps = {\n collectionSlug: string\n customUploadActions?: React.ReactNode[]\n doc: {\n sizes?: FileSizes\n } & Data\n enableAdjustments?: boolean\n handleRemove?: () => void\n hasImageSizes?: boolean\n imageCacheTag?: string\n uploadConfig: SanitizedCollectionConfig['upload']\n}\n\nexport const StaticFileDetails: React.FC<StaticFileDetailsProps> = (props) => {\n const {\n collectionSlug,\n customUploadActions,\n doc,\n enableAdjustments,\n handleRemove,\n hasImageSizes,\n imageCacheTag,\n uploadConfig,\n } = props\n\n const { id, filename, filesize, height, mimeType, thumbnailURL, url, width } = doc\n\n return (\n <div className={baseClass}>\n <header>\n <Thumbnail\n // size=\"small\"\n className={`${baseClass}__thumbnail`}\n collectionSlug={collectionSlug}\n doc={doc}\n fileSrc={thumbnailURL || url}\n imageCacheTag={imageCacheTag}\n uploadConfig={uploadConfig}\n />\n <div className={`${baseClass}__main-detail`}>\n <FileMeta\n collection={collectionSlug}\n filename={filename as string}\n filesize={filesize as number}\n height={height as number}\n id={id as string}\n mimeType={mimeType as string}\n url={url as string}\n width={width as number}\n />\n\n {(enableAdjustments || customUploadActions) && (\n <UploadActions\n customActions={customUploadActions}\n enableAdjustments={Boolean(enableAdjustments)}\n enablePreviewSizes={hasImageSizes && doc.filename}\n mimeType={mimeType}\n />\n )}\n </div>\n {handleRemove && (\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__remove`}\n icon=\"x\"\n iconStyle=\"with-border\"\n onClick={handleRemove}\n round\n />\n )}\n </header>\n </div>\n )\n}\n"],"mappings":"AAAA;;;AACA,OAAOA,KAAA,MAAW;AAElB,SAASC,MAAM,QAAQ;AACvB,SAASC,SAAS,QAAQ;AAC1B,SAASC,aAAa,QAAQ;AAC9B,SAASC,QAAQ,QAAQ;AACzB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAiBlB,OAAO,MAAMC,iBAAA,GAAuDC,KAAA;EAClE,MAAM;IACJC,cAAc;IACdC,mBAAmB;IACnBC,GAAG;IACHC,iBAAiB;IACjBC,YAAY;IACZC,aAAa;IACbC,aAAa;IACbC;EAAY,CACb,GAAGR,KAAA;EAEJ,MAAM;IAAES,EAAE;IAAEC,QAAQ;IAAEC,QAAQ;IAAEC,MAAM;IAAEC,QAAQ;IAAEC,YAAY;IAAEC,GAAG;IAAEC;EAAK,CAAE,GAAGb,GAAA;EAE/E,oBACEc,IAAA,CAAC;IAAIC,SAAA,EAAWpB,SAAA;cACd,aAAAqB,KAAA,CAAC;8BACCF,IAAA,CAACtB,SAAA;QACC;QACAuB,SAAA,EAAW,GAAGpB,SAAA,aAAsB;QACpCG,cAAA,EAAgBA,cAAA;QAChBE,GAAA,EAAKA,GAAA;QACLiB,OAAA,EAASN,YAAA,IAAgBC,GAAA;QACzBR,aAAA,EAAeA,aAAA;QACfC,YAAA,EAAcA;uBAEhBW,KAAA,CAAC;QAAID,SAAA,EAAW,GAAGpB,SAAA,eAAwB;gCACzCmB,IAAA,CAACpB,QAAA;UACCwB,UAAA,EAAYpB,cAAA;UACZS,QAAA,EAAUA,QAAA;UACVC,QAAA,EAAUA,QAAA;UACVC,MAAA,EAAQA,MAAA;UACRH,EAAA,EAAIA,EAAA;UACJI,QAAA,EAAUA,QAAA;UACVE,GAAA,EAAKA,GAAA;UACLC,KAAA,EAAOA;YAGP,CAAAZ,iBAAA,IAAqBF,mBAAkB,kBACvCe,IAAA,CAACrB,aAAA;UACC0B,aAAA,EAAepB,mBAAA;UACfE,iBAAA,EAAmBmB,OAAA,CAAQnB,iBAAA;UAC3BoB,kBAAA,EAAoBlB,aAAA,IAAiBH,GAAA,CAAIO,QAAQ;UACjDG,QAAA,EAAUA;;UAIfR,YAAA,iBACCY,IAAA,CAACvB,MAAA;QACC+B,WAAA,EAAY;QACZP,SAAA,EAAW,GAAGpB,SAAA,UAAmB;QACjC4B,IAAA,EAAK;QACLC,SAAA,EAAU;QACVC,OAAA,EAASvB,YAAA;QACTwB,KAAK;;;;AAMjB","ignoreList":[]}
1
+ {"version":3,"file":"index.js","names":["React","Button","Thumbnail","UploadActions","FileMeta","baseClass","StaticFileDetails","props","collectionSlug","customUploadActions","doc","enableAdjustments","handleRemove","hasImageSizes","imageCacheTag","uploadConfig","id","filename","filesize","height","mimeType","thumbnailURL","url","width","_jsx","className","_jsxs","fileSrc","collection","customActions","Boolean","enablePreviewSizes","buttonStyle","icon","iconStyle","onClick","round"],"sources":["../../../../src/elements/FileDetails/StaticFileDetails/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { Button } from '../../Button/index.js'\nimport { Thumbnail } from '../../Thumbnail/index.js'\nimport { UploadActions } from '../../Upload/index.js'\nimport { FileMeta } from '../FileMeta/index.js'\nimport './index.scss'\n\nconst baseClass = 'file-details'\n\nimport type { Data, FileSizes, SanitizedCollectionConfig } from 'payload'\n\nexport type StaticFileDetailsProps = {\n collectionSlug: string\n customUploadActions?: React.ReactNode[]\n doc: {\n sizes?: FileSizes\n } & Data\n enableAdjustments?: boolean\n handleRemove?: () => void\n hasImageSizes?: boolean\n imageCacheTag?: string\n uploadConfig: SanitizedCollectionConfig['upload']\n}\n\nexport const StaticFileDetails: React.FC<StaticFileDetailsProps> = (props) => {\n const {\n collectionSlug,\n customUploadActions,\n doc,\n enableAdjustments,\n handleRemove,\n hasImageSizes,\n imageCacheTag,\n uploadConfig,\n } = props\n\n const { id, filename, filesize, height, mimeType, thumbnailURL, url, width } = doc\n\n return (\n <div className={baseClass}>\n <header>\n <Thumbnail\n // size=\"small\"\n className={`${baseClass}__thumbnail`}\n doc={doc}\n fileSrc={thumbnailURL || url}\n imageCacheTag={imageCacheTag}\n uploadConfig={uploadConfig}\n />\n <div className={`${baseClass}__main-detail`}>\n <FileMeta\n collection={collectionSlug}\n filename={filename as string}\n filesize={filesize as number}\n height={height as number}\n id={id as string}\n mimeType={mimeType as string}\n url={url as string}\n width={width as number}\n />\n\n {(enableAdjustments || customUploadActions) && (\n <UploadActions\n customActions={customUploadActions}\n enableAdjustments={Boolean(enableAdjustments)}\n enablePreviewSizes={hasImageSizes && doc.filename}\n mimeType={mimeType}\n />\n )}\n </div>\n {handleRemove && (\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__remove`}\n icon=\"x\"\n iconStyle=\"with-border\"\n onClick={handleRemove}\n round\n />\n )}\n </header>\n </div>\n )\n}\n"],"mappings":"AAAA;;;AACA,OAAOA,KAAA,MAAW;AAElB,SAASC,MAAM,QAAQ;AACvB,SAASC,SAAS,QAAQ;AAC1B,SAASC,aAAa,QAAQ;AAC9B,SAASC,QAAQ,QAAQ;AACzB,OAAO;AAEP,MAAMC,SAAA,GAAY;AAiBlB,OAAO,MAAMC,iBAAA,GAAuDC,KAAA;EAClE,MAAM;IACJC,cAAc;IACdC,mBAAmB;IACnBC,GAAG;IACHC,iBAAiB;IACjBC,YAAY;IACZC,aAAa;IACbC,aAAa;IACbC;EAAY,CACb,GAAGR,KAAA;EAEJ,MAAM;IAAES,EAAE;IAAEC,QAAQ;IAAEC,QAAQ;IAAEC,MAAM;IAAEC,QAAQ;IAAEC,YAAY;IAAEC,GAAG;IAAEC;EAAK,CAAE,GAAGb,GAAA;EAE/E,oBACEc,IAAA,CAAC;IAAIC,SAAA,EAAWpB,SAAA;cACd,aAAAqB,KAAA,CAAC;8BACCF,IAAA,CAACtB,SAAA;QACC;QACAuB,SAAA,EAAW,GAAGpB,SAAA,aAAsB;QACpCK,GAAA,EAAKA,GAAA;QACLiB,OAAA,EAASN,YAAA,IAAgBC,GAAA;QACzBR,aAAA,EAAeA,aAAA;QACfC,YAAA,EAAcA;uBAEhBW,KAAA,CAAC;QAAID,SAAA,EAAW,GAAGpB,SAAA,eAAwB;gCACzCmB,IAAA,CAACpB,QAAA;UACCwB,UAAA,EAAYpB,cAAA;UACZS,QAAA,EAAUA,QAAA;UACVC,QAAA,EAAUA,QAAA;UACVC,MAAA,EAAQA,MAAA;UACRH,EAAA,EAAIA,EAAA;UACJI,QAAA,EAAUA,QAAA;UACVE,GAAA,EAAKA,GAAA;UACLC,KAAA,EAAOA;YAGP,CAAAZ,iBAAA,IAAqBF,mBAAkB,kBACvCe,IAAA,CAACrB,aAAA;UACC0B,aAAA,EAAepB,mBAAA;UACfE,iBAAA,EAAmBmB,OAAA,CAAQnB,iBAAA;UAC3BoB,kBAAA,EAAoBlB,aAAA,IAAiBH,GAAA,CAAIO,QAAQ;UACjDG,QAAA,EAAUA;;UAIfR,YAAA,iBACCY,IAAA,CAACvB,MAAA;QACC+B,WAAA,EAAY;QACZP,SAAA,EAAW,GAAGpB,SAAA,UAAmB;QACjC4B,IAAA,EAAK;QACLC,SAAA,EAAU;QACVC,OAAA,EAASvB,YAAA;QACTwB,KAAK;;;;AAMjB","ignoreList":[]}
@@ -10,6 +10,7 @@
10
10
  display: flex;
11
11
  flex-direction: row;
12
12
  flex-wrap: wrap;
13
+ position: relative;
13
14
  }
14
15
 
15
16
  &__remove {
@@ -20,6 +20,7 @@
20
20
  flex-wrap: wrap;
21
21
  flex-grow: 1;
22
22
  align-items: flex-start;
23
+ align-items: center;
23
24
 
24
25
  button .pill {
25
26
  pointer-events: none;
@@ -43,11 +44,17 @@
43
44
  padding: 0;
44
45
  cursor: pointer;
45
46
  color: inherit;
47
+ border-radius: var(--style-radius-s);
46
48
 
47
49
  &:focus:not(:focus-visible),
48
50
  &:focus-within:not(:focus-visible) {
49
51
  outline: none;
50
52
  }
53
+
54
+ &:focus-visible {
55
+ outline: var(--accessibility-outline);
56
+ outline-offset: var(--accessibility-outline-offset);
57
+ }
51
58
 
52
59
  &:disabled {
53
60
  pointer-events: none;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/PublishButton/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAE9C,OAAO,KAAsB,MAAM,OAAO,CAAA;AAU1C,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CA2C7D,CAAA;AAED,KAAK,KAAK,GAAG;IACX,eAAe,CAAC,EAAE,eAAe,CAAA;CAClC,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAGzC,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/PublishButton/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAE9C,OAAO,KAAsB,MAAM,OAAO,CAAA;AAa1C,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAwF7D,CAAA;AAED,KAAK,KAAK,GAAG;IACX,eAAe,CAAC,EAAE,eAAe,CAAA;CAClC,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAGzC,CAAA"}
@@ -7,15 +7,32 @@ import { useForm, useFormModified } from '../../forms/Form/context.js';
7
7
  import { FormSubmit } from '../../forms/Submit/index.js';
8
8
  import { useHotkey } from '../../hooks/useHotkey.js';
9
9
  import { RenderComponent } from '../../providers/Config/RenderComponent.js';
10
+ import { useConfig } from '../../providers/Config/index.js';
10
11
  import { useDocumentInfo } from '../../providers/DocumentInfo/index.js';
11
12
  import { useEditDepth } from '../../providers/EditDepth/index.js';
13
+ import { useLocale } from '../../providers/Locale/index.js';
14
+ import { useOperation } from '../../providers/Operation/index.js';
12
15
  import { useTranslation } from '../../providers/Translation/index.js';
13
16
  export const DefaultPublishButton = t0 => {
14
- const $ = _c(14);
17
+ const $ = _c(24);
15
18
  const {
16
19
  label: labelProp
17
20
  } = t0;
18
21
  const {
22
+ config: t1
23
+ } = useConfig();
24
+ const {
25
+ routes: t2,
26
+ serverURL
27
+ } = t1;
28
+ const {
29
+ api
30
+ } = t2;
31
+ const {
32
+ id,
33
+ collectionSlug,
34
+ docConfig,
35
+ globalSlug,
19
36
  hasPublishPermission,
20
37
  publishedDoc,
21
38
  unpublishedVersions
@@ -25,92 +42,138 @@ export const DefaultPublishButton = t0 => {
25
42
  } = useForm();
26
43
  const modified = useFormModified();
27
44
  const editDepth = useEditDepth();
45
+ const {
46
+ code: locale
47
+ } = useLocale();
28
48
  const {
29
49
  t
30
50
  } = useTranslation();
31
- let t1;
51
+ let t3;
32
52
  if ($[0] !== labelProp || $[1] !== t) {
33
- t1 = labelProp || t("version:publishChanges");
53
+ t3 = labelProp || t("version:publishChanges");
34
54
  $[0] = labelProp;
35
55
  $[1] = t;
36
- $[2] = t1;
56
+ $[2] = t3;
37
57
  } else {
38
- t1 = $[2];
58
+ t3 = $[2];
39
59
  }
40
- const label = t1;
60
+ const label = t3;
41
61
  const hasNewerVersions = unpublishedVersions?.totalDocs > 0;
42
62
  const canPublish = hasPublishPermission && (modified || hasNewerVersions || !publishedDoc);
43
- let t2;
44
- if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
45
- t2 = ["s"];
46
- $[3] = t2;
63
+ const operation = useOperation();
64
+ const forceDisable = operation === "update" && !modified;
65
+ let t4;
66
+ if ($[3] !== forceDisable || $[4] !== locale || $[5] !== collectionSlug || $[6] !== serverURL || $[7] !== api || $[8] !== id || $[9] !== globalSlug || $[10] !== submit) {
67
+ t4 = async () => {
68
+ if (forceDisable) {
69
+ return;
70
+ }
71
+ const search = `?locale=${locale}&depth=0&fallback-locale=null&draft=true`;
72
+ let action;
73
+ let method = "POST";
74
+ if (collectionSlug) {
75
+ action = `${serverURL}${api}/${collectionSlug}${id ? `/${id}` : ""}${search}`;
76
+ if (id) {
77
+ method = "PATCH";
78
+ }
79
+ }
80
+ if (globalSlug) {
81
+ action = `${serverURL}${api}/globals/${globalSlug}${search}`;
82
+ }
83
+ await submit({
84
+ action,
85
+ method,
86
+ overrides: {
87
+ _status: "draft"
88
+ },
89
+ skipValidation: true
90
+ });
91
+ };
92
+ $[3] = forceDisable;
93
+ $[4] = locale;
94
+ $[5] = collectionSlug;
95
+ $[6] = serverURL;
96
+ $[7] = api;
97
+ $[8] = id;
98
+ $[9] = globalSlug;
99
+ $[10] = submit;
100
+ $[11] = t4;
47
101
  } else {
48
- t2 = $[3];
102
+ t4 = $[11];
49
103
  }
50
- let t3;
51
- if ($[4] !== editDepth) {
52
- t3 = {
104
+ const saveDraft = t4;
105
+ let t5;
106
+ if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
107
+ t5 = ["s"];
108
+ $[12] = t5;
109
+ } else {
110
+ t5 = $[12];
111
+ }
112
+ let t6;
113
+ if ($[13] !== editDepth) {
114
+ t6 = {
53
115
  cmdCtrlKey: true,
54
116
  editDepth,
55
- keyCodes: t2
117
+ keyCodes: t5
56
118
  };
57
- $[4] = editDepth;
58
- $[5] = t3;
119
+ $[13] = editDepth;
120
+ $[14] = t6;
59
121
  } else {
60
- t3 = $[5];
122
+ t6 = $[14];
61
123
  }
62
- let t4;
63
- if ($[6] !== submit) {
64
- t4 = e => {
124
+ let t7;
125
+ if ($[15] !== saveDraft || $[16] !== docConfig.versions) {
126
+ t7 = e => {
65
127
  e.preventDefault();
66
128
  e.stopPropagation();
67
- if (submit) {
68
- submit();
129
+ if (saveDraft && docConfig.versions?.drafts && docConfig.versions?.drafts?.autosave) {
130
+ saveDraft();
69
131
  }
70
132
  };
71
- $[6] = submit;
72
- $[7] = t4;
133
+ $[15] = saveDraft;
134
+ $[16] = docConfig.versions;
135
+ $[17] = t7;
73
136
  } else {
74
- t4 = $[7];
137
+ t7 = $[17];
75
138
  }
76
- useHotkey(t3, t4);
77
- let t5;
78
- if ($[8] !== submit) {
79
- t5 = () => {
139
+ useHotkey(t6, t7);
140
+ let t8;
141
+ if ($[18] !== submit) {
142
+ t8 = () => {
80
143
  submit({
81
144
  overrides: {
82
145
  _status: "published"
83
146
  }
84
147
  });
85
148
  };
86
- $[8] = submit;
87
- $[9] = t5;
149
+ $[18] = submit;
150
+ $[19] = t8;
88
151
  } else {
89
- t5 = $[9];
152
+ t8 = $[19];
90
153
  }
91
- const publish = t5;
154
+ const publish = t8;
92
155
  if (!hasPublishPermission) {
93
156
  return null;
94
157
  }
95
- const t6 = !canPublish;
96
- let t7;
97
- if ($[10] !== t6 || $[11] !== publish || $[12] !== label) {
98
- t7 = _jsx(FormSubmit, {
158
+ const t9 = !canPublish;
159
+ let t10;
160
+ if ($[20] !== t9 || $[21] !== publish || $[22] !== label) {
161
+ t10 = _jsx(FormSubmit, {
99
162
  buttonId: "action-save",
100
- disabled: t6,
163
+ disabled: t9,
101
164
  onClick: publish,
102
165
  size: "medium",
103
166
  type: "button",
104
167
  children: label
105
168
  });
106
- $[10] = t6;
107
- $[11] = publish;
108
- $[12] = label;
109
- $[13] = t7;
169
+ $[20] = t9;
170
+ $[21] = publish;
171
+ $[22] = label;
172
+ $[23] = t10;
110
173
  } else {
111
- t7 = $[13];
174
+ t10 = $[23];
112
175
  }
113
- return t7;
176
+ return t10;
114
177
  };
115
178
  export const PublishButton = ({
116
179
  CustomComponent