@payloadcms/ui 3.0.0-beta.54 → 3.0.0-beta.56

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 (57) hide show
  1. package/dist/elements/DatePicker/DatePicker.d.ts +2 -2
  2. package/dist/elements/DatePicker/DatePicker.d.ts.map +1 -1
  3. package/dist/elements/DatePicker/DatePicker.js +2 -2
  4. package/dist/elements/DatePicker/DatePicker.js.map +1 -1
  5. package/dist/elements/FileDetails/index.d.ts +2 -1
  6. package/dist/elements/FileDetails/index.d.ts.map +1 -1
  7. package/dist/elements/FileDetails/index.js +6 -5
  8. package/dist/elements/FileDetails/index.js.map +1 -1
  9. package/dist/elements/SaveDraftButton/index.d.ts +1 -0
  10. package/dist/elements/SaveDraftButton/index.d.ts.map +1 -1
  11. package/dist/elements/SaveDraftButton/index.js +1 -1
  12. package/dist/elements/SaveDraftButton/index.js.map +1 -1
  13. package/dist/elements/Upload/index.d.ts +9 -5
  14. package/dist/elements/Upload/index.d.ts.map +1 -1
  15. package/dist/elements/Upload/index.js +53 -41
  16. package/dist/elements/Upload/index.js.map +1 -1
  17. package/dist/elements/Upload/index.scss +1 -1
  18. package/dist/exports/client/DatePicker-BN5AOAME.js +14 -0
  19. package/dist/exports/client/DatePicker-BN5AOAME.js.map +8 -0
  20. package/dist/exports/client/chunk-3X2D2TP2.js +30 -0
  21. package/dist/exports/client/chunk-3X2D2TP2.js.map +8 -0
  22. package/dist/exports/client/index.d.ts +6 -3
  23. package/dist/exports/client/index.d.ts.map +1 -1
  24. package/dist/exports/client/index.js +6 -6
  25. package/dist/exports/client/index.js.map +4 -4
  26. package/dist/fields/Upload/Input.d.ts +1 -0
  27. package/dist/fields/Upload/Input.d.ts.map +1 -1
  28. package/dist/fields/Upload/Input.js +2 -1
  29. package/dist/fields/Upload/Input.js.map +1 -1
  30. package/dist/forms/Form/index.js +2 -2
  31. package/dist/forms/Form/index.js.map +1 -1
  32. package/dist/providers/Auth/index.d.ts +2 -0
  33. package/dist/providers/Auth/index.d.ts.map +1 -1
  34. package/dist/providers/Auth/index.js +5 -0
  35. package/dist/providers/Auth/index.js.map +1 -1
  36. package/dist/providers/ComponentMap/buildComponentMap/collections.d.ts.map +1 -1
  37. package/dist/providers/ComponentMap/buildComponentMap/collections.js +9 -4
  38. package/dist/providers/ComponentMap/buildComponentMap/collections.js.map +1 -1
  39. package/dist/providers/ComponentMap/buildComponentMap/globals.d.ts.map +1 -1
  40. package/dist/providers/ComponentMap/buildComponentMap/globals.js +1 -0
  41. package/dist/providers/ComponentMap/buildComponentMap/globals.js.map +1 -1
  42. package/dist/providers/ComponentMap/buildComponentMap/types.d.ts +1 -0
  43. package/dist/providers/ComponentMap/buildComponentMap/types.d.ts.map +1 -1
  44. package/dist/providers/ComponentMap/buildComponentMap/types.js.map +1 -1
  45. package/dist/styles.css +1 -1
  46. package/dist/utilities/buildFieldSchemaMap/index.d.ts.map +1 -1
  47. package/dist/utilities/buildFieldSchemaMap/index.js +2 -5
  48. package/dist/utilities/buildFieldSchemaMap/index.js.map +1 -1
  49. package/dist/utilities/buildFieldSchemaMap/traverseFields.d.ts +1 -2
  50. package/dist/utilities/buildFieldSchemaMap/traverseFields.d.ts.map +1 -1
  51. package/dist/utilities/buildFieldSchemaMap/traverseFields.js +7 -11
  52. package/dist/utilities/buildFieldSchemaMap/traverseFields.js.map +1 -1
  53. package/package.json +4 -4
  54. package/dist/exports/client/DatePicker-CBQPW5J5.js +0 -30
  55. package/dist/exports/client/DatePicker-CBQPW5J5.js.map +0 -8
  56. package/dist/exports/client/chunk-DODCWLCH.js +0 -14
  57. package/dist/exports/client/chunk-DODCWLCH.js.map +0 -8
@@ -2,6 +2,6 @@ import React from 'react';
2
2
  import 'react-datepicker/dist/react-datepicker.css';
3
3
  import type { Props } from './types.js';
4
4
  import './index.scss';
5
- declare const DateTime: React.FC<Props>;
6
- export default DateTime;
5
+ declare const DatePicker: React.FC<Props>;
6
+ export default DatePicker;
7
7
  //# sourceMappingURL=DatePicker.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../src/elements/DatePicker/DatePicker.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,4CAA4C,CAAA;AAEnD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAMvC,OAAO,cAAc,CAAA;AAIrB,QAAA,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAmG7B,CAAA;AAGD,eAAe,QAAQ,CAAA"}
1
+ {"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../src/elements/DatePicker/DatePicker.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,4CAA4C,CAAA;AAEnD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAMvC,OAAO,cAAc,CAAA;AAIrB,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAmG/B,CAAA;AAGD,eAAe,UAAU,CAAA"}
@@ -10,7 +10,7 @@ import { useTranslation } from '../../providers/Translation/index.js';
10
10
  import { getFormattedLocale } from './getFormattedLocale.js';
11
11
  import './index.scss';
12
12
  const baseClass = 'date-time-picker';
13
- const DateTime = (props)=>{
13
+ const DatePicker = (props)=>{
14
14
  const { displayFormat: customDisplayFormat, maxDate, maxTime, minDate, minTime, monthsToShow = 1, onChange: onChangeFromProps, overrides, pickerAppearance = 'default', placeholder: placeholderText, readOnly, timeFormat = 'h:mm aa', timeIntervals = 30, value } = props;
15
15
  // Use the user's AdminUI language preference for the locale
16
16
  const { i18n } = useTranslation();
@@ -94,6 +94,6 @@ const DateTime = (props)=>{
94
94
  });
95
95
  };
96
96
  // eslint-disable-next-line no-restricted-exports
97
- export default DateTime;
97
+ export default DatePicker;
98
98
 
99
99
  //# sourceMappingURL=DatePicker.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/elements/DatePicker/DatePicker.tsx"],"sourcesContent":["'use client'\nimport type { ReactDatePickerProps } from 'react-datepicker'\n\nimport React from 'react'\nimport ReactDatePickerDefaultImport, { registerLocale } from 'react-datepicker'\nconst ReactDatePicker = (ReactDatePickerDefaultImport.default ||\n ReactDatePickerDefaultImport) as unknown as typeof ReactDatePickerDefaultImport.default\nimport 'react-datepicker/dist/react-datepicker.css'\n\nimport type { Props } from './types.js'\n\nimport { CalendarIcon } from '../../icons/Calendar/index.js'\nimport { XIcon } from '../../icons/X/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { getFormattedLocale } from './getFormattedLocale.js'\nimport './index.scss'\n\nconst baseClass = 'date-time-picker'\n\nconst DateTime: React.FC<Props> = (props) => {\n const {\n displayFormat: customDisplayFormat,\n maxDate,\n maxTime,\n minDate,\n minTime,\n monthsToShow = 1,\n onChange: onChangeFromProps,\n overrides,\n pickerAppearance = 'default',\n placeholder: placeholderText,\n readOnly,\n timeFormat = 'h:mm aa',\n timeIntervals = 30,\n value,\n } = props\n\n // Use the user's AdminUI language preference for the locale\n const { i18n } = useTranslation()\n\n const datepickerLocale = getFormattedLocale(i18n.language)\n\n try {\n registerLocale(datepickerLocale, i18n.dateFNS)\n } catch (e) {\n console.warn(`Could not find DatePicker locale for ${i18n.language}`)\n }\n\n let dateFormat = customDisplayFormat\n\n if (!customDisplayFormat) {\n // when no displayFormat is provided, determine format based on the picker appearance\n if (pickerAppearance === 'default') dateFormat = 'MM/dd/yyyy'\n else if (pickerAppearance === 'dayAndTime') dateFormat = 'MMM d, yyy h:mm a'\n else if (pickerAppearance === 'timeOnly') dateFormat = 'h:mm a'\n else if (pickerAppearance === 'dayOnly') dateFormat = 'MMM dd'\n else if (pickerAppearance === 'monthOnly') dateFormat = 'MMMM'\n }\n\n const onChange = (incomingDate: Date) => {\n const newDate = incomingDate\n if (newDate instanceof Date && ['dayOnly', 'default', 'monthOnly'].includes(pickerAppearance)) {\n const tzOffset = incomingDate.getTimezoneOffset() / 60\n newDate.setHours(12 - tzOffset, 0)\n }\n if (typeof onChangeFromProps === 'function') onChangeFromProps(newDate)\n }\n\n const dateTimePickerProps: ReactDatePickerProps = {\n customInputRef: 'ref',\n dateFormat,\n disabled: readOnly,\n maxDate,\n maxTime,\n minDate,\n minTime,\n monthsShown: Math.min(2, monthsToShow),\n onChange,\n placeholderText,\n popperPlacement: 'bottom-start',\n selected: value && new Date(value),\n showMonthYearPicker: pickerAppearance === 'monthOnly',\n showPopperArrow: false,\n showTimeSelect: pickerAppearance === 'dayAndTime' || pickerAppearance === 'timeOnly',\n timeFormat,\n timeIntervals,\n ...overrides,\n }\n\n const classes = [baseClass, `${baseClass}__appearance--${pickerAppearance}`]\n .filter(Boolean)\n .join(' ')\n\n return (\n <div className={classes}>\n <div className={`${baseClass}__icon-wrap`}>\n {dateTimePickerProps.selected && (\n <button\n className={`${baseClass}__clear-button`}\n onClick={() => onChange(null)}\n type=\"button\"\n >\n <XIcon />\n </button>\n )}\n <CalendarIcon />\n </div>\n <div className={`${baseClass}__input-wrapper`}>\n <ReactDatePicker\n {...dateTimePickerProps}\n dropdownMode=\"select\"\n locale={datepickerLocale}\n showMonthDropdown\n showYearDropdown\n />\n </div>\n </div>\n )\n}\n\n// eslint-disable-next-line no-restricted-exports\nexport default DateTime\n"],"names":["React","ReactDatePickerDefaultImport","registerLocale","ReactDatePicker","default","CalendarIcon","XIcon","useTranslation","getFormattedLocale","baseClass","DateTime","props","displayFormat","customDisplayFormat","maxDate","maxTime","minDate","minTime","monthsToShow","onChange","onChangeFromProps","overrides","pickerAppearance","placeholder","placeholderText","readOnly","timeFormat","timeIntervals","value","i18n","datepickerLocale","language","dateFNS","e","console","warn","dateFormat","incomingDate","newDate","Date","includes","tzOffset","getTimezoneOffset","setHours","dateTimePickerProps","customInputRef","disabled","monthsShown","Math","min","popperPlacement","selected","showMonthYearPicker","showPopperArrow","showTimeSelect","classes","filter","Boolean","join","div","className","button","onClick","type","dropdownMode","locale","showMonthDropdown","showYearDropdown"],"mappings":"AAAA;;AAGA,OAAOA,WAAW,QAAO;AACzB,OAAOC,gCAAgCC,cAAc,QAAQ,mBAAkB;AAC/E,MAAMC,kBAAmBF,6BAA6BG,OAAO,IAC3DH;AACF,OAAO,6CAA4C;AAInD,SAASI,YAAY,QAAQ,gCAA+B;AAC5D,SAASC,KAAK,QAAQ,yBAAwB;AAC9C,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,kBAAkB,QAAQ,0BAAyB;AAC5D,OAAO,eAAc;AAErB,MAAMC,YAAY;AAElB,MAAMC,WAA4B,CAACC;IACjC,MAAM,EACJC,eAAeC,mBAAmB,EAClCC,OAAO,EACPC,OAAO,EACPC,OAAO,EACPC,OAAO,EACPC,eAAe,CAAC,EAChBC,UAAUC,iBAAiB,EAC3BC,SAAS,EACTC,mBAAmB,SAAS,EAC5BC,aAAaC,eAAe,EAC5BC,QAAQ,EACRC,aAAa,SAAS,EACtBC,gBAAgB,EAAE,EAClBC,KAAK,EACN,GAAGjB;IAEJ,4DAA4D;IAC5D,MAAM,EAAEkB,IAAI,EAAE,GAAGtB;IAEjB,MAAMuB,mBAAmBtB,mBAAmBqB,KAAKE,QAAQ;IAEzD,IAAI;QACF7B,eAAe4B,kBAAkBD,KAAKG,OAAO;IAC/C,EAAE,OAAOC,GAAG;QACVC,QAAQC,IAAI,CAAC,CAAC,qCAAqC,EAAEN,KAAKE,QAAQ,CAAC,CAAC;IACtE;IAEA,IAAIK,aAAavB;IAEjB,IAAI,CAACA,qBAAqB;QACxB,qFAAqF;QACrF,IAAIS,qBAAqB,WAAWc,aAAa;aAC5C,IAAId,qBAAqB,cAAcc,aAAa;aACpD,IAAId,qBAAqB,YAAYc,aAAa;aAClD,IAAId,qBAAqB,WAAWc,aAAa;aACjD,IAAId,qBAAqB,aAAac,aAAa;IAC1D;IAEA,MAAMjB,WAAW,CAACkB;QAChB,MAAMC,UAAUD;QAChB,IAAIC,mBAAmBC,QAAQ;YAAC;YAAW;YAAW;SAAY,CAACC,QAAQ,CAAClB,mBAAmB;YAC7F,MAAMmB,WAAWJ,aAAaK,iBAAiB,KAAK;YACpDJ,QAAQK,QAAQ,CAAC,KAAKF,UAAU;QAClC;QACA,IAAI,OAAOrB,sBAAsB,YAAYA,kBAAkBkB;IACjE;IAEA,MAAMM,sBAA4C;QAChDC,gBAAgB;QAChBT;QACAU,UAAUrB;QACVX;QACAC;QACAC;QACAC;QACA8B,aAAaC,KAAKC,GAAG,CAAC,GAAG/B;QACzBC;QACAK;QACA0B,iBAAiB;QACjBC,UAAUvB,SAAS,IAAIW,KAAKX;QAC5BwB,qBAAqB9B,qBAAqB;QAC1C+B,iBAAiB;QACjBC,gBAAgBhC,qBAAqB,gBAAgBA,qBAAqB;QAC1EI;QACAC;QACA,GAAGN,SAAS;IACd;IAEA,MAAMkC,UAAU;QAAC9C;QAAW,CAAC,EAAEA,UAAU,cAAc,EAAEa,iBAAiB,CAAC;KAAC,CACzEkC,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,qBACE,MAACC;QAAIC,WAAWL;;0BACd,MAACI;gBAAIC,WAAW,CAAC,EAAEnD,UAAU,WAAW,CAAC;;oBACtCmC,oBAAoBO,QAAQ,kBAC3B,KAACU;wBACCD,WAAW,CAAC,EAAEnD,UAAU,cAAc,CAAC;wBACvCqD,SAAS,IAAM3C,SAAS;wBACxB4C,MAAK;kCAEL,cAAA,KAACzD;;kCAGL,KAACD;;;0BAEH,KAACsD;gBAAIC,WAAW,CAAC,EAAEnD,UAAU,eAAe,CAAC;0BAC3C,cAAA,KAACN;oBACE,GAAGyC,mBAAmB;oBACvBoB,cAAa;oBACbC,QAAQnC;oBACRoC,iBAAiB;oBACjBC,gBAAgB;;;;;AAK1B;AAEA,iDAAiD;AACjD,eAAezD,SAAQ"}
1
+ {"version":3,"sources":["../../../src/elements/DatePicker/DatePicker.tsx"],"sourcesContent":["'use client'\nimport type { ReactDatePickerProps } from 'react-datepicker'\n\nimport React from 'react'\nimport ReactDatePickerDefaultImport, { registerLocale } from 'react-datepicker'\nconst ReactDatePicker = (ReactDatePickerDefaultImport.default ||\n ReactDatePickerDefaultImport) as unknown as typeof ReactDatePickerDefaultImport.default\nimport 'react-datepicker/dist/react-datepicker.css'\n\nimport type { Props } from './types.js'\n\nimport { CalendarIcon } from '../../icons/Calendar/index.js'\nimport { XIcon } from '../../icons/X/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { getFormattedLocale } from './getFormattedLocale.js'\nimport './index.scss'\n\nconst baseClass = 'date-time-picker'\n\nconst DatePicker: React.FC<Props> = (props) => {\n const {\n displayFormat: customDisplayFormat,\n maxDate,\n maxTime,\n minDate,\n minTime,\n monthsToShow = 1,\n onChange: onChangeFromProps,\n overrides,\n pickerAppearance = 'default',\n placeholder: placeholderText,\n readOnly,\n timeFormat = 'h:mm aa',\n timeIntervals = 30,\n value,\n } = props\n\n // Use the user's AdminUI language preference for the locale\n const { i18n } = useTranslation()\n\n const datepickerLocale = getFormattedLocale(i18n.language)\n\n try {\n registerLocale(datepickerLocale, i18n.dateFNS)\n } catch (e) {\n console.warn(`Could not find DatePicker locale for ${i18n.language}`)\n }\n\n let dateFormat = customDisplayFormat\n\n if (!customDisplayFormat) {\n // when no displayFormat is provided, determine format based on the picker appearance\n if (pickerAppearance === 'default') dateFormat = 'MM/dd/yyyy'\n else if (pickerAppearance === 'dayAndTime') dateFormat = 'MMM d, yyy h:mm a'\n else if (pickerAppearance === 'timeOnly') dateFormat = 'h:mm a'\n else if (pickerAppearance === 'dayOnly') dateFormat = 'MMM dd'\n else if (pickerAppearance === 'monthOnly') dateFormat = 'MMMM'\n }\n\n const onChange = (incomingDate: Date) => {\n const newDate = incomingDate\n if (newDate instanceof Date && ['dayOnly', 'default', 'monthOnly'].includes(pickerAppearance)) {\n const tzOffset = incomingDate.getTimezoneOffset() / 60\n newDate.setHours(12 - tzOffset, 0)\n }\n if (typeof onChangeFromProps === 'function') onChangeFromProps(newDate)\n }\n\n const dateTimePickerProps: ReactDatePickerProps = {\n customInputRef: 'ref',\n dateFormat,\n disabled: readOnly,\n maxDate,\n maxTime,\n minDate,\n minTime,\n monthsShown: Math.min(2, monthsToShow),\n onChange,\n placeholderText,\n popperPlacement: 'bottom-start',\n selected: value && new Date(value),\n showMonthYearPicker: pickerAppearance === 'monthOnly',\n showPopperArrow: false,\n showTimeSelect: pickerAppearance === 'dayAndTime' || pickerAppearance === 'timeOnly',\n timeFormat,\n timeIntervals,\n ...overrides,\n }\n\n const classes = [baseClass, `${baseClass}__appearance--${pickerAppearance}`]\n .filter(Boolean)\n .join(' ')\n\n return (\n <div className={classes}>\n <div className={`${baseClass}__icon-wrap`}>\n {dateTimePickerProps.selected && (\n <button\n className={`${baseClass}__clear-button`}\n onClick={() => onChange(null)}\n type=\"button\"\n >\n <XIcon />\n </button>\n )}\n <CalendarIcon />\n </div>\n <div className={`${baseClass}__input-wrapper`}>\n <ReactDatePicker\n {...dateTimePickerProps}\n dropdownMode=\"select\"\n locale={datepickerLocale}\n showMonthDropdown\n showYearDropdown\n />\n </div>\n </div>\n )\n}\n\n// eslint-disable-next-line no-restricted-exports\nexport default DatePicker\n"],"names":["React","ReactDatePickerDefaultImport","registerLocale","ReactDatePicker","default","CalendarIcon","XIcon","useTranslation","getFormattedLocale","baseClass","DatePicker","props","displayFormat","customDisplayFormat","maxDate","maxTime","minDate","minTime","monthsToShow","onChange","onChangeFromProps","overrides","pickerAppearance","placeholder","placeholderText","readOnly","timeFormat","timeIntervals","value","i18n","datepickerLocale","language","dateFNS","e","console","warn","dateFormat","incomingDate","newDate","Date","includes","tzOffset","getTimezoneOffset","setHours","dateTimePickerProps","customInputRef","disabled","monthsShown","Math","min","popperPlacement","selected","showMonthYearPicker","showPopperArrow","showTimeSelect","classes","filter","Boolean","join","div","className","button","onClick","type","dropdownMode","locale","showMonthDropdown","showYearDropdown"],"mappings":"AAAA;;AAGA,OAAOA,WAAW,QAAO;AACzB,OAAOC,gCAAgCC,cAAc,QAAQ,mBAAkB;AAC/E,MAAMC,kBAAmBF,6BAA6BG,OAAO,IAC3DH;AACF,OAAO,6CAA4C;AAInD,SAASI,YAAY,QAAQ,gCAA+B;AAC5D,SAASC,KAAK,QAAQ,yBAAwB;AAC9C,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,kBAAkB,QAAQ,0BAAyB;AAC5D,OAAO,eAAc;AAErB,MAAMC,YAAY;AAElB,MAAMC,aAA8B,CAACC;IACnC,MAAM,EACJC,eAAeC,mBAAmB,EAClCC,OAAO,EACPC,OAAO,EACPC,OAAO,EACPC,OAAO,EACPC,eAAe,CAAC,EAChBC,UAAUC,iBAAiB,EAC3BC,SAAS,EACTC,mBAAmB,SAAS,EAC5BC,aAAaC,eAAe,EAC5BC,QAAQ,EACRC,aAAa,SAAS,EACtBC,gBAAgB,EAAE,EAClBC,KAAK,EACN,GAAGjB;IAEJ,4DAA4D;IAC5D,MAAM,EAAEkB,IAAI,EAAE,GAAGtB;IAEjB,MAAMuB,mBAAmBtB,mBAAmBqB,KAAKE,QAAQ;IAEzD,IAAI;QACF7B,eAAe4B,kBAAkBD,KAAKG,OAAO;IAC/C,EAAE,OAAOC,GAAG;QACVC,QAAQC,IAAI,CAAC,CAAC,qCAAqC,EAAEN,KAAKE,QAAQ,CAAC,CAAC;IACtE;IAEA,IAAIK,aAAavB;IAEjB,IAAI,CAACA,qBAAqB;QACxB,qFAAqF;QACrF,IAAIS,qBAAqB,WAAWc,aAAa;aAC5C,IAAId,qBAAqB,cAAcc,aAAa;aACpD,IAAId,qBAAqB,YAAYc,aAAa;aAClD,IAAId,qBAAqB,WAAWc,aAAa;aACjD,IAAId,qBAAqB,aAAac,aAAa;IAC1D;IAEA,MAAMjB,WAAW,CAACkB;QAChB,MAAMC,UAAUD;QAChB,IAAIC,mBAAmBC,QAAQ;YAAC;YAAW;YAAW;SAAY,CAACC,QAAQ,CAAClB,mBAAmB;YAC7F,MAAMmB,WAAWJ,aAAaK,iBAAiB,KAAK;YACpDJ,QAAQK,QAAQ,CAAC,KAAKF,UAAU;QAClC;QACA,IAAI,OAAOrB,sBAAsB,YAAYA,kBAAkBkB;IACjE;IAEA,MAAMM,sBAA4C;QAChDC,gBAAgB;QAChBT;QACAU,UAAUrB;QACVX;QACAC;QACAC;QACAC;QACA8B,aAAaC,KAAKC,GAAG,CAAC,GAAG/B;QACzBC;QACAK;QACA0B,iBAAiB;QACjBC,UAAUvB,SAAS,IAAIW,KAAKX;QAC5BwB,qBAAqB9B,qBAAqB;QAC1C+B,iBAAiB;QACjBC,gBAAgBhC,qBAAqB,gBAAgBA,qBAAqB;QAC1EI;QACAC;QACA,GAAGN,SAAS;IACd;IAEA,MAAMkC,UAAU;QAAC9C;QAAW,CAAC,EAAEA,UAAU,cAAc,EAAEa,iBAAiB,CAAC;KAAC,CACzEkC,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,qBACE,MAACC;QAAIC,WAAWL;;0BACd,MAACI;gBAAIC,WAAW,CAAC,EAAEnD,UAAU,WAAW,CAAC;;oBACtCmC,oBAAoBO,QAAQ,kBAC3B,KAACU;wBACCD,WAAW,CAAC,EAAEnD,UAAU,cAAc,CAAC;wBACvCqD,SAAS,IAAM3C,SAAS;wBACxB4C,MAAK;kCAEL,cAAA,KAACzD;;kCAGL,KAACD;;;0BAEH,KAACsD;gBAAIC,WAAW,CAAC,EAAEnD,UAAU,eAAe,CAAC;0BAC3C,cAAA,KAACN;oBACE,GAAGyC,mBAAmB;oBACvBoB,cAAa;oBACbC,QAAQnC;oBACRoC,iBAAiB;oBACjBC,gBAAgB;;;;;AAK1B;AAEA,iDAAiD;AACjD,eAAezD,WAAU"}
@@ -2,11 +2,12 @@ import React from 'react';
2
2
  import './index.scss';
3
3
  import type { Data, FileSizes, SanitizedCollectionConfig } from 'payload';
4
4
  export type FileDetailsProps = {
5
- canEdit?: boolean;
6
5
  collectionSlug: string;
6
+ customUploadActions?: React.ReactNode[];
7
7
  doc: Data & {
8
8
  sizes?: FileSizes;
9
9
  };
10
+ enableAdjustments?: boolean;
10
11
  handleRemove?: () => void;
11
12
  hasImageSizes?: boolean;
12
13
  imageCacheTag?: string;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/FileDetails/index.tsx"],"names":[],"mappings":"AAEA,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,gBAAgB,GAAG;IAC7B,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,cAAc,EAAE,MAAM,CAAA;IACtB,GAAG,EAAE,IAAI,GAAG;QACV,KAAK,CAAC,EAAE,SAAS,CAAA;KAClB,CAAA;IACD,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,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA6ClD,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/FileDetails/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,gBAAgB,GAAG;IAC7B,cAAc,EAAE,MAAM,CAAA;IACtB,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAA;IACvC,GAAG,EAAE,IAAI,GAAG;QACV,KAAK,CAAC,EAAE,SAAS,CAAA;KAClB,CAAA;IACD,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,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAwDlD,CAAA"}
@@ -1,6 +1,5 @@
1
1
  'use client';
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
- import { isImage } from 'payload/shared';
4
3
  import React from 'react';
5
4
  import { UploadActions } from '../../elements/Upload/index.js';
6
5
  import { Button } from '../Button/index.js';
@@ -9,7 +8,7 @@ import { FileMeta } from './FileMeta/index.js';
9
8
  import './index.scss';
10
9
  const baseClass = 'file-details';
11
10
  export const FileDetails = (props)=>{
12
- const { canEdit, collectionSlug, doc, handleRemove, hasImageSizes, imageCacheTag, uploadConfig } = props;
11
+ const { collectionSlug, customUploadActions, doc, enableAdjustments, handleRemove, hasImageSizes, imageCacheTag, uploadConfig } = props;
13
12
  const { id, filename, filesize, height, mimeType, thumbnailURL, url, width } = doc;
14
13
  return /*#__PURE__*/ _jsx("div", {
15
14
  className: baseClass,
@@ -35,9 +34,11 @@ export const FileDetails = (props)=>{
35
34
  url: url,
36
35
  width: width
37
36
  }),
38
- isImage(mimeType) && mimeType !== 'image/svg+xml' && /*#__PURE__*/ _jsx(UploadActions, {
39
- canEdit: canEdit,
40
- showSizePreviews: hasImageSizes && doc.filename
37
+ /*#__PURE__*/ _jsx(UploadActions, {
38
+ customActions: customUploadActions,
39
+ enableAdjustments: enableAdjustments,
40
+ enablePreviewSizes: hasImageSizes && doc.filename,
41
+ mimeType: mimeType
41
42
  })
42
43
  ]
43
44
  }),
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/elements/FileDetails/index.tsx"],"sourcesContent":["'use client'\nimport { isImage } from 'payload/shared'\nimport React from 'react'\n\nimport { UploadActions } from '../../elements/Upload/index.js'\nimport { Button } from '../Button/index.js'\nimport { Thumbnail } from '../Thumbnail/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 FileDetailsProps = {\n canEdit?: boolean\n collectionSlug: string\n doc: Data & {\n sizes?: FileSizes\n }\n handleRemove?: () => void\n hasImageSizes?: boolean\n imageCacheTag?: string\n uploadConfig: SanitizedCollectionConfig['upload']\n}\n\nexport const FileDetails: React.FC<FileDetailsProps> = (props) => {\n const { canEdit, collectionSlug, doc, handleRemove, hasImageSizes, imageCacheTag, 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 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 {isImage(mimeType as string) && mimeType !== 'image/svg+xml' && (\n <UploadActions canEdit={canEdit} showSizePreviews={hasImageSizes && doc.filename} />\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"],"names":["isImage","React","UploadActions","Button","Thumbnail","FileMeta","baseClass","FileDetails","props","canEdit","collectionSlug","doc","handleRemove","hasImageSizes","imageCacheTag","uploadConfig","id","filename","filesize","height","mimeType","thumbnailURL","url","width","div","className","header","fileSrc","collection","showSizePreviews","buttonStyle","icon","iconStyle","onClick","round"],"mappings":"AAAA;;AACA,SAASA,OAAO,QAAQ,iBAAgB;AACxC,OAAOC,WAAW,QAAO;AAEzB,SAASC,aAAa,QAAQ,iCAAgC;AAC9D,SAASC,MAAM,QAAQ,qBAAoB;AAC3C,SAASC,SAAS,QAAQ,wBAAuB;AACjD,SAASC,QAAQ,QAAQ,sBAAqB;AAC9C,OAAO,eAAc;AAErB,MAAMC,YAAY;AAgBlB,OAAO,MAAMC,cAA0C,CAACC;IACtD,MAAM,EAAEC,OAAO,EAAEC,cAAc,EAAEC,GAAG,EAAEC,YAAY,EAAEC,aAAa,EAAEC,aAAa,EAAEC,YAAY,EAAE,GAC9FP;IAEF,MAAM,EAAEQ,EAAE,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,MAAM,EAAEC,QAAQ,EAAEC,YAAY,EAAEC,GAAG,EAAEC,KAAK,EAAE,GAAGZ;IAE/E,qBACE,KAACa;QAAIC,WAAWnB;kBACd,cAAA,MAACoB;;8BACC,KAACtB;oBACCM,gBAAgBA;oBAChBC,KAAKA;oBACLgB,SAASN,gBAAgBC;oBACzBR,eAAeA;oBACfC,cAAcA;;8BAEhB,MAACS;oBAAIC,WAAW,CAAC,EAAEnB,UAAU,aAAa,CAAC;;sCACzC,KAACD;4BACCuB,YAAYlB;4BACZO,UAAUA;4BACVC,UAAUA;4BACVC,QAAQA;4BACRH,IAAIA;4BACJI,UAAUA;4BACVE,KAAKA;4BACLC,OAAOA;;wBAGRvB,QAAQoB,aAAuBA,aAAa,iCAC3C,KAAClB;4BAAcO,SAASA;4BAASoB,kBAAkBhB,iBAAiBF,IAAIM,QAAQ;;;;gBAGnFL,8BACC,KAACT;oBACC2B,aAAY;oBACZL,WAAW,CAAC,EAAEnB,UAAU,QAAQ,CAAC;oBACjCyB,MAAK;oBACLC,WAAU;oBACVC,SAASrB;oBACTsB,KAAK;;;;;AAMjB,EAAC"}
1
+ {"version":3,"sources":["../../../src/elements/FileDetails/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { UploadActions } from '../../elements/Upload/index.js'\nimport { Button } from '../Button/index.js'\nimport { Thumbnail } from '../Thumbnail/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 FileDetailsProps = {\n collectionSlug: string\n customUploadActions?: React.ReactNode[]\n doc: Data & {\n sizes?: FileSizes\n }\n enableAdjustments?: boolean\n handleRemove?: () => void\n hasImageSizes?: boolean\n imageCacheTag?: string\n uploadConfig: SanitizedCollectionConfig['upload']\n}\n\nexport const FileDetails: React.FC<FileDetailsProps> = (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 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 <UploadActions\n customActions={customUploadActions}\n enableAdjustments={enableAdjustments}\n enablePreviewSizes={hasImageSizes && doc.filename}\n mimeType={mimeType}\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"],"names":["React","UploadActions","Button","Thumbnail","FileMeta","baseClass","FileDetails","props","collectionSlug","customUploadActions","doc","enableAdjustments","handleRemove","hasImageSizes","imageCacheTag","uploadConfig","id","filename","filesize","height","mimeType","thumbnailURL","url","width","div","className","header","fileSrc","collection","customActions","enablePreviewSizes","buttonStyle","icon","iconStyle","onClick","round"],"mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAEzB,SAASC,aAAa,QAAQ,iCAAgC;AAC9D,SAASC,MAAM,QAAQ,qBAAoB;AAC3C,SAASC,SAAS,QAAQ,wBAAuB;AACjD,SAASC,QAAQ,QAAQ,sBAAqB;AAC9C,OAAO,eAAc;AAErB,MAAMC,YAAY;AAiBlB,OAAO,MAAMC,cAA0C,CAACC;IACtD,MAAM,EACJC,cAAc,EACdC,mBAAmB,EACnBC,GAAG,EACHC,iBAAiB,EACjBC,YAAY,EACZC,aAAa,EACbC,aAAa,EACbC,YAAY,EACb,GAAGR;IAEJ,MAAM,EAAES,EAAE,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,MAAM,EAAEC,QAAQ,EAAEC,YAAY,EAAEC,GAAG,EAAEC,KAAK,EAAE,GAAGb;IAE/E,qBACE,KAACc;QAAIC,WAAWpB;kBACd,cAAA,MAACqB;;8BACC,KAACvB;oBACCK,gBAAgBA;oBAChBE,KAAKA;oBACLiB,SAASN,gBAAgBC;oBACzBR,eAAeA;oBACfC,cAAcA;;8BAEhB,MAACS;oBAAIC,WAAW,CAAC,EAAEpB,UAAU,aAAa,CAAC;;sCACzC,KAACD;4BACCwB,YAAYpB;4BACZS,UAAUA;4BACVC,UAAUA;4BACVC,QAAQA;4BACRH,IAAIA;4BACJI,UAAUA;4BACVE,KAAKA;4BACLC,OAAOA;;sCAGT,KAACtB;4BACC4B,eAAepB;4BACfE,mBAAmBA;4BACnBmB,oBAAoBjB,iBAAiBH,IAAIO,QAAQ;4BACjDG,UAAUA;;;;gBAGbR,8BACC,KAACV;oBACC6B,aAAY;oBACZN,WAAW,CAAC,EAAEpB,UAAU,QAAQ,CAAC;oBACjC2B,MAAK;oBACLC,WAAU;oBACVC,SAAStB;oBACTuB,KAAK;;;;;AAMjB,EAAC"}
@@ -1,4 +1,5 @@
1
1
  import React from 'react';
2
+ export declare const DefaultSaveDraftButton: React.FC;
2
3
  type Props = {
3
4
  CustomComponent?: React.ReactNode;
4
5
  };
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/SaveDraftButton/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAoFlD,KAAK,KAAK,GAAG;IACX,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAClC,CAAA;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAG3C,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/SaveDraftButton/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAclD,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAoE1C,CAAA;AAED,KAAK,KAAK,GAAG;IACX,eAAe,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAClC,CAAA;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAG3C,CAAA"}
@@ -11,7 +11,7 @@ import { useLocale } from '../../providers/Locale/index.js';
11
11
  import { useOperation } from '../../providers/Operation/index.js';
12
12
  import { useTranslation } from '../../providers/Translation/index.js';
13
13
  const baseClass = 'save-draft';
14
- const DefaultSaveDraftButton = ()=>{
14
+ export const DefaultSaveDraftButton = ()=>{
15
15
  const { routes: { api }, serverURL } = useConfig();
16
16
  const { id, collectionSlug, globalSlug } = useDocumentInfo();
17
17
  const modified = useFormModified();
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/elements/SaveDraftButton/index.tsx"],"sourcesContent":["'use client'\n\nimport React, { useCallback, useRef } from 'react'\n\nimport { useForm, useFormModified } from '../../forms/Form/context.js'\nimport { FormSubmit } from '../../forms/Submit/index.js'\nimport { useHotkey } from '../../hooks/useHotkey.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useOperation } from '../../providers/Operation/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\n\nconst baseClass = 'save-draft'\n\nconst DefaultSaveDraftButton: React.FC = () => {\n const {\n routes: { api },\n serverURL,\n } = useConfig()\n const { id, collectionSlug, globalSlug } = useDocumentInfo()\n const modified = useFormModified()\n const { code: locale } = useLocale()\n const ref = useRef<HTMLButtonElement>(null)\n const editDepth = useEditDepth()\n const { t } = useTranslation()\n const { submit } = useForm()\n const operation = useOperation()\n\n const forceDisable = operation === 'update' && !modified\n\n const saveDraft = useCallback(async () => {\n if (forceDisable) return\n\n const search = `?locale=${locale}&depth=0&fallback-locale=null&draft=true`\n let action\n let method = 'POST'\n\n if (collectionSlug) {\n action = `${serverURL}${api}/${collectionSlug}${id ? `/${id}` : ''}${search}`\n if (id) method = 'PATCH'\n }\n\n if (globalSlug) {\n action = `${serverURL}${api}/globals/${globalSlug}${search}`\n }\n\n await submit({\n action,\n method,\n overrides: {\n _status: 'draft',\n },\n skipValidation: true,\n })\n }, [submit, collectionSlug, globalSlug, serverURL, api, locale, id, forceDisable])\n\n useHotkey({ cmdCtrlKey: true, editDepth, keyCodes: ['s'] }, (e) => {\n if (forceDisable) {\n // absorb the event\n }\n\n e.preventDefault()\n e.stopPropagation()\n if (ref?.current) {\n ref.current.click()\n }\n })\n\n return (\n <FormSubmit\n buttonId=\"action-save-draft\"\n buttonStyle=\"secondary\"\n className={baseClass}\n disabled={forceDisable}\n onClick={saveDraft}\n ref={ref}\n size=\"small\"\n type=\"button\"\n >\n {t('version:saveDraft')}\n </FormSubmit>\n )\n}\n\ntype Props = {\n CustomComponent?: React.ReactNode\n}\n\nexport const SaveDraftButton: React.FC<Props> = ({ CustomComponent }) => {\n if (CustomComponent) return CustomComponent\n return <DefaultSaveDraftButton />\n}\n"],"names":["React","useCallback","useRef","useForm","useFormModified","FormSubmit","useHotkey","useConfig","useDocumentInfo","useEditDepth","useLocale","useOperation","useTranslation","baseClass","DefaultSaveDraftButton","routes","api","serverURL","id","collectionSlug","globalSlug","modified","code","locale","ref","editDepth","t","submit","operation","forceDisable","saveDraft","search","action","method","overrides","_status","skipValidation","cmdCtrlKey","keyCodes","e","preventDefault","stopPropagation","current","click","buttonId","buttonStyle","className","disabled","onClick","size","type","SaveDraftButton","CustomComponent"],"mappings":"AAAA;;AAEA,OAAOA,SAASC,WAAW,EAAEC,MAAM,QAAQ,QAAO;AAElD,SAASC,OAAO,EAAEC,eAAe,QAAQ,8BAA6B;AACtE,SAASC,UAAU,QAAQ,8BAA6B;AACxD,SAASC,SAAS,QAAQ,2BAA0B;AACpD,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,YAAY,QAAQ,qCAAoC;AACjE,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,YAAY,QAAQ,qCAAoC;AACjE,SAASC,cAAc,QAAQ,uCAAsC;AAErE,MAAMC,YAAY;AAElB,MAAMC,yBAAmC;IACvC,MAAM,EACJC,QAAQ,EAAEC,GAAG,EAAE,EACfC,SAAS,EACV,GAAGV;IACJ,MAAM,EAAEW,EAAE,EAAEC,cAAc,EAAEC,UAAU,EAAE,GAAGZ;IAC3C,MAAMa,WAAWjB;IACjB,MAAM,EAAEkB,MAAMC,MAAM,EAAE,GAAGb;IACzB,MAAMc,MAAMtB,OAA0B;IACtC,MAAMuB,YAAYhB;IAClB,MAAM,EAAEiB,CAAC,EAAE,GAAGd;IACd,MAAM,EAAEe,MAAM,EAAE,GAAGxB;IACnB,MAAMyB,YAAYjB;IAElB,MAAMkB,eAAeD,cAAc,YAAY,CAACP;IAEhD,MAAMS,YAAY7B,YAAY;QAC5B,IAAI4B,cAAc;QAElB,MAAME,SAAS,CAAC,QAAQ,EAAER,OAAO,wCAAwC,CAAC;QAC1E,IAAIS;QACJ,IAAIC,SAAS;QAEb,IAAId,gBAAgB;YAClBa,SAAS,CAAC,EAAEf,UAAU,EAAED,IAAI,CAAC,EAAEG,eAAe,EAAED,KAAK,CAAC,CAAC,EAAEA,GAAG,CAAC,GAAG,GAAG,EAAEa,OAAO,CAAC;YAC7E,IAAIb,IAAIe,SAAS;QACnB;QAEA,IAAIb,YAAY;YACdY,SAAS,CAAC,EAAEf,UAAU,EAAED,IAAI,SAAS,EAAEI,WAAW,EAAEW,OAAO,CAAC;QAC9D;QAEA,MAAMJ,OAAO;YACXK;YACAC;YACAC,WAAW;gBACTC,SAAS;YACX;YACAC,gBAAgB;QAClB;IACF,GAAG;QAACT;QAAQR;QAAgBC;QAAYH;QAAWD;QAAKO;QAAQL;QAAIW;KAAa;IAEjFvB,UAAU;QAAE+B,YAAY;QAAMZ;QAAWa,UAAU;YAAC;SAAI;IAAC,GAAG,CAACC;QAC3D,IAAIV,cAAc;QAChB,mBAAmB;QACrB;QAEAU,EAAEC,cAAc;QAChBD,EAAEE,eAAe;QACjB,IAAIjB,KAAKkB,SAAS;YAChBlB,IAAIkB,OAAO,CAACC,KAAK;QACnB;IACF;IAEA,qBACE,KAACtC;QACCuC,UAAS;QACTC,aAAY;QACZC,WAAWjC;QACXkC,UAAUlB;QACVmB,SAASlB;QACTN,KAAKA;QACLyB,MAAK;QACLC,MAAK;kBAEJxB,EAAE;;AAGT;AAMA,OAAO,MAAMyB,kBAAmC,CAAC,EAAEC,eAAe,EAAE;IAClE,IAAIA,iBAAiB,OAAOA;IAC5B,qBAAO,KAACtC;AACV,EAAC"}
1
+ {"version":3,"sources":["../../../src/elements/SaveDraftButton/index.tsx"],"sourcesContent":["'use client'\n\nimport React, { useCallback, useRef } from 'react'\n\nimport { useForm, useFormModified } from '../../forms/Form/context.js'\nimport { FormSubmit } from '../../forms/Submit/index.js'\nimport { useHotkey } from '../../hooks/useHotkey.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useOperation } from '../../providers/Operation/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\n\nconst baseClass = 'save-draft'\n\nexport const DefaultSaveDraftButton: React.FC = () => {\n const {\n routes: { api },\n serverURL,\n } = useConfig()\n const { id, collectionSlug, globalSlug } = useDocumentInfo()\n const modified = useFormModified()\n const { code: locale } = useLocale()\n const ref = useRef<HTMLButtonElement>(null)\n const editDepth = useEditDepth()\n const { t } = useTranslation()\n const { submit } = useForm()\n const operation = useOperation()\n\n const forceDisable = operation === 'update' && !modified\n\n const saveDraft = useCallback(async () => {\n if (forceDisable) return\n\n const search = `?locale=${locale}&depth=0&fallback-locale=null&draft=true`\n let action\n let method = 'POST'\n\n if (collectionSlug) {\n action = `${serverURL}${api}/${collectionSlug}${id ? `/${id}` : ''}${search}`\n if (id) method = 'PATCH'\n }\n\n if (globalSlug) {\n action = `${serverURL}${api}/globals/${globalSlug}${search}`\n }\n\n await submit({\n action,\n method,\n overrides: {\n _status: 'draft',\n },\n skipValidation: true,\n })\n }, [submit, collectionSlug, globalSlug, serverURL, api, locale, id, forceDisable])\n\n useHotkey({ cmdCtrlKey: true, editDepth, keyCodes: ['s'] }, (e) => {\n if (forceDisable) {\n // absorb the event\n }\n\n e.preventDefault()\n e.stopPropagation()\n if (ref?.current) {\n ref.current.click()\n }\n })\n\n return (\n <FormSubmit\n buttonId=\"action-save-draft\"\n buttonStyle=\"secondary\"\n className={baseClass}\n disabled={forceDisable}\n onClick={saveDraft}\n ref={ref}\n size=\"small\"\n type=\"button\"\n >\n {t('version:saveDraft')}\n </FormSubmit>\n )\n}\n\ntype Props = {\n CustomComponent?: React.ReactNode\n}\n\nexport const SaveDraftButton: React.FC<Props> = ({ CustomComponent }) => {\n if (CustomComponent) return CustomComponent\n return <DefaultSaveDraftButton />\n}\n"],"names":["React","useCallback","useRef","useForm","useFormModified","FormSubmit","useHotkey","useConfig","useDocumentInfo","useEditDepth","useLocale","useOperation","useTranslation","baseClass","DefaultSaveDraftButton","routes","api","serverURL","id","collectionSlug","globalSlug","modified","code","locale","ref","editDepth","t","submit","operation","forceDisable","saveDraft","search","action","method","overrides","_status","skipValidation","cmdCtrlKey","keyCodes","e","preventDefault","stopPropagation","current","click","buttonId","buttonStyle","className","disabled","onClick","size","type","SaveDraftButton","CustomComponent"],"mappings":"AAAA;;AAEA,OAAOA,SAASC,WAAW,EAAEC,MAAM,QAAQ,QAAO;AAElD,SAASC,OAAO,EAAEC,eAAe,QAAQ,8BAA6B;AACtE,SAASC,UAAU,QAAQ,8BAA6B;AACxD,SAASC,SAAS,QAAQ,2BAA0B;AACpD,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,YAAY,QAAQ,qCAAoC;AACjE,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,YAAY,QAAQ,qCAAoC;AACjE,SAASC,cAAc,QAAQ,uCAAsC;AAErE,MAAMC,YAAY;AAElB,OAAO,MAAMC,yBAAmC;IAC9C,MAAM,EACJC,QAAQ,EAAEC,GAAG,EAAE,EACfC,SAAS,EACV,GAAGV;IACJ,MAAM,EAAEW,EAAE,EAAEC,cAAc,EAAEC,UAAU,EAAE,GAAGZ;IAC3C,MAAMa,WAAWjB;IACjB,MAAM,EAAEkB,MAAMC,MAAM,EAAE,GAAGb;IACzB,MAAMc,MAAMtB,OAA0B;IACtC,MAAMuB,YAAYhB;IAClB,MAAM,EAAEiB,CAAC,EAAE,GAAGd;IACd,MAAM,EAAEe,MAAM,EAAE,GAAGxB;IACnB,MAAMyB,YAAYjB;IAElB,MAAMkB,eAAeD,cAAc,YAAY,CAACP;IAEhD,MAAMS,YAAY7B,YAAY;QAC5B,IAAI4B,cAAc;QAElB,MAAME,SAAS,CAAC,QAAQ,EAAER,OAAO,wCAAwC,CAAC;QAC1E,IAAIS;QACJ,IAAIC,SAAS;QAEb,IAAId,gBAAgB;YAClBa,SAAS,CAAC,EAAEf,UAAU,EAAED,IAAI,CAAC,EAAEG,eAAe,EAAED,KAAK,CAAC,CAAC,EAAEA,GAAG,CAAC,GAAG,GAAG,EAAEa,OAAO,CAAC;YAC7E,IAAIb,IAAIe,SAAS;QACnB;QAEA,IAAIb,YAAY;YACdY,SAAS,CAAC,EAAEf,UAAU,EAAED,IAAI,SAAS,EAAEI,WAAW,EAAEW,OAAO,CAAC;QAC9D;QAEA,MAAMJ,OAAO;YACXK;YACAC;YACAC,WAAW;gBACTC,SAAS;YACX;YACAC,gBAAgB;QAClB;IACF,GAAG;QAACT;QAAQR;QAAgBC;QAAYH;QAAWD;QAAKO;QAAQL;QAAIW;KAAa;IAEjFvB,UAAU;QAAE+B,YAAY;QAAMZ;QAAWa,UAAU;YAAC;SAAI;IAAC,GAAG,CAACC;QAC3D,IAAIV,cAAc;QAChB,mBAAmB;QACrB;QAEAU,EAAEC,cAAc;QAChBD,EAAEE,eAAe;QACjB,IAAIjB,KAAKkB,SAAS;YAChBlB,IAAIkB,OAAO,CAACC,KAAK;QACnB;IACF;IAEA,qBACE,KAACtC;QACCuC,UAAS;QACTC,aAAY;QACZC,WAAWjC;QACXkC,UAAUlB;QACVmB,SAASlB;QACTN,KAAKA;QACLyB,MAAK;QACLC,MAAK;kBAEJxB,EAAE;;AAGT,EAAC;AAMD,OAAO,MAAMyB,kBAAmC,CAAC,EAAEC,eAAe,EAAE;IAClE,IAAIA,iBAAiB,OAAOA;IAC5B,qBAAO,KAACtC;AACV,EAAC"}
@@ -3,16 +3,20 @@ import React from 'react';
3
3
  import './index.scss';
4
4
  export declare const editDrawerSlug = "edit-upload";
5
5
  export declare const sizePreviewSlug = "preview-sizes";
6
- export declare const UploadActions: ({ canEdit, showSizePreviews }: {
7
- canEdit: any;
8
- showSizePreviews: any;
9
- }) => React.JSX.Element;
6
+ type UploadActionsArgs = {
7
+ customActions?: React.ReactNode[];
8
+ enableAdjustments: boolean;
9
+ enablePreviewSizes: boolean;
10
+ mimeType: string;
11
+ };
12
+ export declare const UploadActions: ({ customActions, enableAdjustments, enablePreviewSizes, mimeType, }: UploadActionsArgs) => React.JSX.Element;
10
13
  export type UploadProps = {
11
14
  collectionSlug: string;
15
+ customActions?: React.ReactNode[];
12
16
  initialState?: FormState;
13
17
  onChange?: (file?: File) => void;
14
- updatedAt?: string;
15
18
  uploadConfig: SanitizedCollectionConfig['upload'];
16
19
  };
17
20
  export declare const Upload: React.FC<UploadProps>;
21
+ export {};
18
22
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Upload/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAGnE,OAAO,KAA2C,MAAM,OAAO,CAAA;AAiB/D,OAAO,cAAc,CAAA;AAGrB,eAAO,MAAM,cAAc,gBAAgB,CAAA;AAC3C,eAAO,MAAM,eAAe,kBAAkB,CAAA;AAU9C,eAAO,MAAM,aAAa;;;uBAgBzB,CAAA;AAED,MAAM,MAAM,WAAW,GAAG;IACxB,cAAc,EAAE,MAAM,CAAA;IACtB,YAAY,CAAC,EAAE,SAAS,CAAA;IACxB,QAAQ,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,KAAK,IAAI,CAAA;IAChC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,YAAY,EAAE,yBAAyB,CAAC,QAAQ,CAAC,CAAA;CAClD,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA8LxC,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Upload/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAGnE,OAAO,KAA2C,MAAM,OAAO,CAAA;AAiB/D,OAAO,cAAc,CAAA;AAGrB,eAAO,MAAM,cAAc,gBAAgB,CAAA;AAC3C,eAAO,MAAM,eAAe,kBAAkB,CAAA;AAU9C,KAAK,iBAAiB,GAAG;IACvB,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAA;IACjC,iBAAiB,EAAE,OAAO,CAAA;IAC1B,kBAAkB,EAAE,OAAO,CAAA;IAC3B,QAAQ,EAAE,MAAM,CAAA;CACjB,CAAA;AAED,eAAO,MAAM,aAAa,wEAKvB,iBAAiB,sBA8BnB,CAAA;AAED,MAAM,MAAM,WAAW,GAAG;IACxB,cAAc,EAAE,MAAM,CAAA;IACtB,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAA;IACjC,YAAY,CAAC,EAAE,SAAS,CAAA;IACxB,QAAQ,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,KAAK,IAAI,CAAA;IAChC,YAAY,EAAE,yBAAyB,CAAC,QAAQ,CAAC,CAAA;CAClD,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAkMxC,CAAA"}
@@ -27,26 +27,37 @@ const validate = (value)=>{
27
27
  }
28
28
  return true;
29
29
  };
30
- export const UploadActions = ({ canEdit, showSizePreviews })=>{
30
+ export const UploadActions = ({ customActions, enableAdjustments, enablePreviewSizes, mimeType })=>{
31
31
  const { t } = useTranslation();
32
+ const fileTypeIsAdjustable = isImage(mimeType) && mimeType !== 'image/svg+xml';
33
+ if (!fileTypeIsAdjustable && (!customActions || customActions.length === 0)) return null;
32
34
  return /*#__PURE__*/ _jsxs("div", {
33
- className: `${baseClass}__file-mutation`,
35
+ className: `${baseClass}__upload-actions`,
34
36
  children: [
35
- showSizePreviews && /*#__PURE__*/ _jsx(DrawerToggler, {
36
- className: `${baseClass}__previewSizes`,
37
- slug: sizePreviewSlug,
38
- children: t('upload:previewSizes')
37
+ fileTypeIsAdjustable && /*#__PURE__*/ _jsxs(React.Fragment, {
38
+ children: [
39
+ enablePreviewSizes && /*#__PURE__*/ _jsx(DrawerToggler, {
40
+ className: `${baseClass}__previewSizes`,
41
+ slug: sizePreviewSlug,
42
+ children: t('upload:previewSizes')
43
+ }),
44
+ enableAdjustments && /*#__PURE__*/ _jsx(DrawerToggler, {
45
+ className: `${baseClass}__edit`,
46
+ slug: editDrawerSlug,
47
+ children: t('upload:editImage')
48
+ })
49
+ ]
39
50
  }),
40
- canEdit && /*#__PURE__*/ _jsx(DrawerToggler, {
41
- className: `${baseClass}__edit`,
42
- slug: editDrawerSlug,
43
- children: t('upload:editImage')
51
+ customActions && customActions.map((CustomAction, i)=>{
52
+ return /*#__PURE__*/ _jsx(React.Fragment, {
53
+ children: CustomAction
54
+ }, i);
44
55
  })
45
56
  ]
46
57
  });
47
58
  };
48
59
  export const Upload = (props)=>{
49
- const { collectionSlug, initialState, onChange, updatedAt, uploadConfig } = props;
60
+ const { collectionSlug, customActions, initialState, onChange, uploadConfig } = props;
50
61
  const [replacingFile, setReplacingFile] = useState(false);
51
62
  const [fileSrc, setFileSrc] = useState(null);
52
63
  const { t } = useTranslation();
@@ -62,6 +73,25 @@ export const Upload = (props)=>{
62
73
  x: 0,
63
74
  y: 0
64
75
  });
76
+ const handleFileChange = React.useCallback((newFile)=>{
77
+ if (newFile instanceof File) {
78
+ const fileReader = new FileReader();
79
+ fileReader.onload = (e)=>{
80
+ const imgSrc = e.target?.result;
81
+ if (typeof imgSrc === 'string') {
82
+ setFileSrc(imgSrc);
83
+ }
84
+ };
85
+ fileReader.readAsDataURL(newFile);
86
+ }
87
+ setValue(newFile);
88
+ if (typeof onChange === 'function') {
89
+ onChange(newFile);
90
+ }
91
+ }, [
92
+ onChange,
93
+ setValue
94
+ ]);
65
95
  const handleFileNameChange = (e)=>{
66
96
  const updatedFileName = e.target.value;
67
97
  if (value) {
@@ -72,22 +102,21 @@ export const Upload = (props)=>{
72
102
  ], updatedFileName, {
73
103
  type: fileValue.type
74
104
  });
75
- setValue(newFile) // Updating the state with the new File object
76
- ;
105
+ handleFileChange(newFile);
77
106
  }
78
107
  };
79
108
  const handleFileSelection = React.useCallback((files)=>{
80
109
  const fileToUpload = files?.[0];
81
- setValue(fileToUpload);
110
+ handleFileChange(fileToUpload);
82
111
  }, [
83
- setValue
112
+ handleFileChange
84
113
  ]);
85
114
  const handleFileRemoval = useCallback(()=>{
86
115
  setReplacingFile(true);
87
- setValue(null);
116
+ handleFileChange(null);
88
117
  setFileSrc('');
89
118
  }, [
90
- setValue
119
+ handleFileChange
91
120
  ]);
92
121
  const onEditsSave = React.useCallback(({ crop, focalPosition })=>{
93
122
  setCrop({
@@ -114,25 +143,6 @@ export const Upload = (props)=>{
114
143
  }, [
115
144
  initialState
116
145
  ]);
117
- useEffect(()=>{
118
- if (value instanceof File) {
119
- const fileReader = new FileReader();
120
- fileReader.onload = (e)=>{
121
- const imgSrc = e.target?.result;
122
- if (typeof imgSrc === 'string') {
123
- setFileSrc(imgSrc);
124
- }
125
- };
126
- fileReader.readAsDataURL(value);
127
- }
128
- if (typeof onChange === 'function') {
129
- onChange(value);
130
- }
131
- }, [
132
- value,
133
- onChange,
134
- updatedAt
135
- ]);
136
146
  const canRemoveUpload = docPermissions?.update?.permission && 'delete' in docPermissions && docPermissions?.delete?.permission;
137
147
  const hasImageSizes = uploadConfig?.imageSizes?.length > 0;
138
148
  const hasResizeOptions = Boolean(uploadConfig?.resizeOptions);
@@ -151,9 +161,9 @@ export const Upload = (props)=>{
151
161
  showError: showError
152
162
  }),
153
163
  doc.filename && !replacingFile && /*#__PURE__*/ _jsx(FileDetails, {
154
- canEdit: showCrop || showFocalPoint,
155
164
  collectionSlug: collectionSlug,
156
165
  doc: doc,
166
+ enableAdjustments: showCrop || showFocalPoint,
157
167
  handleRemove: canRemoveUpload ? handleFileRemoval : undefined,
158
168
  hasImageSizes: hasImageSizes,
159
169
  imageCacheTag: doc.updatedAt,
@@ -167,7 +177,7 @@ export const Upload = (props)=>{
167
177
  mimeTypes: uploadConfig?.mimeTypes,
168
178
  onChange: handleFileSelection
169
179
  }),
170
- value && /*#__PURE__*/ _jsxs(React.Fragment, {
180
+ value && fileSrc && /*#__PURE__*/ _jsxs(React.Fragment, {
171
181
  children: [
172
182
  /*#__PURE__*/ _jsx("div", {
173
183
  className: `${baseClass}__thumbnail-wrap`,
@@ -185,9 +195,11 @@ export const Upload = (props)=>{
185
195
  type: "text",
186
196
  value: value.name
187
197
  }),
188
- isImage(value.type) && value.type !== 'image/svg+xml' && /*#__PURE__*/ _jsx(UploadActions, {
189
- canEdit: showCrop || showFocalPoint,
190
- showSizePreviews: hasImageSizes && doc.filename && !replacingFile
198
+ /*#__PURE__*/ _jsx(UploadActions, {
199
+ customActions: customActions,
200
+ enableAdjustments: showCrop || showFocalPoint,
201
+ enablePreviewSizes: hasImageSizes && doc.filename && !replacingFile,
202
+ mimeType: value.type
191
203
  })
192
204
  ]
193
205
  }),
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/elements/Upload/index.tsx"],"sourcesContent":["'use client'\nimport type { FormState, SanitizedCollectionConfig } from 'payload'\n\nimport { isImage } from 'payload/shared'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport { FieldError } from '../../fields/FieldError/index.js'\nimport { fieldBaseClass } from '../../fields/shared/index.js'\nimport { useForm } from '../../forms/Form/context.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useFormQueryParams } from '../../providers/FormQueryParams/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { reduceFieldsToValues } from '../../utilities/reduceFieldsToValues.js'\nimport { Button } from '../Button/index.js'\nimport { Drawer, DrawerToggler } from '../Drawer/index.js'\nimport { Dropzone } from '../Dropzone/index.js'\nimport { EditUpload } from '../EditUpload/index.js'\nimport { FileDetails } from '../FileDetails/index.js'\nimport { PreviewSizes } from '../PreviewSizes/index.js'\nimport { Thumbnail } from '../Thumbnail/index.js'\nimport './index.scss'\n\nconst baseClass = 'file-field'\nexport const editDrawerSlug = 'edit-upload'\nexport const sizePreviewSlug = 'preview-sizes'\n\nconst validate = (value) => {\n if (!value && value !== undefined) {\n return 'A file is required.'\n }\n\n return true\n}\n\nexport const UploadActions = ({ canEdit, showSizePreviews }) => {\n const { t } = useTranslation()\n return (\n <div className={`${baseClass}__file-mutation`}>\n {showSizePreviews && (\n <DrawerToggler className={`${baseClass}__previewSizes`} slug={sizePreviewSlug}>\n {t('upload:previewSizes')}\n </DrawerToggler>\n )}\n {canEdit && (\n <DrawerToggler className={`${baseClass}__edit`} slug={editDrawerSlug}>\n {t('upload:editImage')}\n </DrawerToggler>\n )}\n </div>\n )\n}\n\nexport type UploadProps = {\n collectionSlug: string\n initialState?: FormState\n onChange?: (file?: File) => void\n updatedAt?: string\n uploadConfig: SanitizedCollectionConfig['upload']\n}\n\nexport const Upload: React.FC<UploadProps> = (props) => {\n const { collectionSlug, initialState, onChange, updatedAt, uploadConfig } = props\n\n const [replacingFile, setReplacingFile] = useState(false)\n const [fileSrc, setFileSrc] = useState<null | string>(null)\n const { t } = useTranslation()\n const { setModified } = useForm()\n const { dispatchFormQueryParams, formQueryParams } = useFormQueryParams()\n const [doc, setDoc] = useState(reduceFieldsToValues(initialState || {}, true))\n const { docPermissions } = useDocumentInfo()\n const { errorMessage, setValue, showError, value } = useField<File>({\n path: 'file',\n validate,\n })\n const [_crop, setCrop] = useState({ x: 0, y: 0 })\n\n const handleFileNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const updatedFileName = e.target.value\n if (value) {\n const fileValue = value\n // Creating a new File object with updated properties\n const newFile = new File([fileValue], updatedFileName, { type: fileValue.type })\n setValue(newFile) // Updating the state with the new File object\n }\n }\n\n const handleFileSelection = React.useCallback(\n (files: FileList) => {\n const fileToUpload = files?.[0]\n setValue(fileToUpload)\n },\n [setValue],\n )\n\n const handleFileRemoval = useCallback(() => {\n setReplacingFile(true)\n setValue(null)\n setFileSrc('')\n }, [setValue])\n\n const onEditsSave = React.useCallback(\n ({ crop, focalPosition }) => {\n setCrop({\n x: crop.x || 0,\n y: crop.y || 0,\n })\n\n setModified(true)\n dispatchFormQueryParams({\n type: 'SET',\n params: {\n uploadEdits:\n crop || focalPosition\n ? {\n crop: crop || null,\n focalPoint: focalPosition ? focalPosition : null,\n }\n : null,\n },\n })\n },\n [dispatchFormQueryParams, setModified],\n )\n\n useEffect(() => {\n setDoc(reduceFieldsToValues(initialState || {}, true))\n setReplacingFile(false)\n }, [initialState])\n\n useEffect(() => {\n if (value instanceof File) {\n const fileReader = new FileReader()\n fileReader.onload = (e) => {\n const imgSrc = e.target?.result\n\n if (typeof imgSrc === 'string') {\n setFileSrc(imgSrc)\n }\n }\n fileReader.readAsDataURL(value)\n }\n\n if (typeof onChange === 'function') {\n onChange(value)\n }\n }, [value, onChange, updatedAt])\n\n const canRemoveUpload =\n docPermissions?.update?.permission &&\n 'delete' in docPermissions &&\n docPermissions?.delete?.permission\n\n const hasImageSizes = uploadConfig?.imageSizes?.length > 0\n const hasResizeOptions = Boolean(uploadConfig?.resizeOptions)\n // Explicity check if set to true, default is undefined\n const focalPointEnabled = uploadConfig?.focalPoint === true\n\n const { crop: showCrop = true, focalPoint = true } = uploadConfig\n\n const showFocalPoint = focalPoint && (hasImageSizes || hasResizeOptions || focalPointEnabled)\n\n return (\n <div className={[fieldBaseClass, baseClass].filter(Boolean).join(' ')}>\n <FieldError message={errorMessage} showError={showError} />\n {doc.filename && !replacingFile && (\n <FileDetails\n canEdit={showCrop || showFocalPoint}\n collectionSlug={collectionSlug}\n doc={doc}\n handleRemove={canRemoveUpload ? handleFileRemoval : undefined}\n hasImageSizes={hasImageSizes}\n imageCacheTag={doc.updatedAt}\n uploadConfig={uploadConfig}\n />\n )}\n {(!doc.filename || replacingFile) && (\n <div className={`${baseClass}__upload`}>\n {!value && (\n <Dropzone\n className={`${baseClass}__dropzone`}\n mimeTypes={uploadConfig?.mimeTypes}\n onChange={handleFileSelection}\n />\n )}\n\n {value && (\n <React.Fragment>\n <div className={`${baseClass}__thumbnail-wrap`}>\n <Thumbnail\n collectionSlug={collectionSlug}\n fileSrc={isImage(value.type) ? fileSrc : null}\n />\n </div>\n <div className={`${baseClass}__file-adjustments`}>\n <input\n className={`${baseClass}__filename`}\n onChange={handleFileNameChange}\n type=\"text\"\n value={value.name}\n />\n\n {isImage(value.type) && value.type !== 'image/svg+xml' && (\n <UploadActions\n canEdit={showCrop || showFocalPoint}\n showSizePreviews={hasImageSizes && doc.filename && !replacingFile}\n />\n )}\n </div>\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__remove`}\n icon=\"x\"\n iconStyle=\"with-border\"\n onClick={handleFileRemoval}\n round\n tooltip={t('general:cancel')}\n />\n </React.Fragment>\n )}\n </div>\n )}\n {(value || doc.filename) && (\n <Drawer Header={null} slug={editDrawerSlug}>\n <EditUpload\n fileName={value?.name || doc?.filename}\n fileSrc={fileSrc || doc?.url}\n imageCacheTag={doc.updatedAt}\n initialCrop={formQueryParams?.uploadEdits?.crop ?? {}}\n initialFocalPoint={{\n x: formQueryParams?.uploadEdits?.focalPoint.x || doc.focalX || 50,\n y: formQueryParams?.uploadEdits?.focalPoint.y || doc.focalY || 50,\n }}\n onSave={onEditsSave}\n showCrop={showCrop}\n showFocalPoint={showFocalPoint}\n />\n </Drawer>\n )}\n {doc && hasImageSizes && (\n <Drawer\n className={`${baseClass}__previewDrawer`}\n hoverTitle\n slug={sizePreviewSlug}\n title={t('upload:sizesFor', { label: doc?.filename })}\n >\n <PreviewSizes doc={doc} imageCacheTag={doc.updatedAt} uploadConfig={uploadConfig} />\n </Drawer>\n )}\n </div>\n )\n}\n"],"names":["isImage","React","useCallback","useEffect","useState","FieldError","fieldBaseClass","useForm","useField","useDocumentInfo","useFormQueryParams","useTranslation","reduceFieldsToValues","Button","Drawer","DrawerToggler","Dropzone","EditUpload","FileDetails","PreviewSizes","Thumbnail","baseClass","editDrawerSlug","sizePreviewSlug","validate","value","undefined","UploadActions","canEdit","showSizePreviews","t","div","className","slug","Upload","props","collectionSlug","initialState","onChange","updatedAt","uploadConfig","replacingFile","setReplacingFile","fileSrc","setFileSrc","setModified","dispatchFormQueryParams","formQueryParams","doc","setDoc","docPermissions","errorMessage","setValue","showError","path","_crop","setCrop","x","y","handleFileNameChange","e","updatedFileName","target","fileValue","newFile","File","type","handleFileSelection","files","fileToUpload","handleFileRemoval","onEditsSave","crop","focalPosition","params","uploadEdits","focalPoint","fileReader","FileReader","onload","imgSrc","result","readAsDataURL","canRemoveUpload","update","permission","delete","hasImageSizes","imageSizes","length","hasResizeOptions","Boolean","resizeOptions","focalPointEnabled","showCrop","showFocalPoint","filter","join","message","filename","handleRemove","imageCacheTag","mimeTypes","Fragment","input","name","buttonStyle","icon","iconStyle","onClick","round","tooltip","Header","fileName","url","initialCrop","initialFocalPoint","focalX","focalY","onSave","hoverTitle","title","label"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../src/elements/Upload/index.tsx"],"sourcesContent":["'use client'\nimport type { FormState, SanitizedCollectionConfig } from 'payload'\n\nimport { isImage } from 'payload/shared'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport { FieldError } from '../../fields/FieldError/index.js'\nimport { fieldBaseClass } from '../../fields/shared/index.js'\nimport { useForm } from '../../forms/Form/context.js'\nimport { useField } from '../../forms/useField/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useFormQueryParams } from '../../providers/FormQueryParams/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { reduceFieldsToValues } from '../../utilities/reduceFieldsToValues.js'\nimport { Button } from '../Button/index.js'\nimport { Drawer, DrawerToggler } from '../Drawer/index.js'\nimport { Dropzone } from '../Dropzone/index.js'\nimport { EditUpload } from '../EditUpload/index.js'\nimport { FileDetails } from '../FileDetails/index.js'\nimport { PreviewSizes } from '../PreviewSizes/index.js'\nimport { Thumbnail } from '../Thumbnail/index.js'\nimport './index.scss'\n\nconst baseClass = 'file-field'\nexport const editDrawerSlug = 'edit-upload'\nexport const sizePreviewSlug = 'preview-sizes'\n\nconst validate = (value) => {\n if (!value && value !== undefined) {\n return 'A file is required.'\n }\n\n return true\n}\n\ntype UploadActionsArgs = {\n customActions?: React.ReactNode[]\n enableAdjustments: boolean\n enablePreviewSizes: boolean\n mimeType: string\n}\n\nexport const UploadActions = ({\n customActions,\n enableAdjustments,\n enablePreviewSizes,\n mimeType,\n}: UploadActionsArgs) => {\n const { t } = useTranslation()\n\n const fileTypeIsAdjustable = isImage(mimeType) && mimeType !== 'image/svg+xml'\n\n if (!fileTypeIsAdjustable && (!customActions || customActions.length === 0)) return null\n\n return (\n <div className={`${baseClass}__upload-actions`}>\n {fileTypeIsAdjustable && (\n <React.Fragment>\n {enablePreviewSizes && (\n <DrawerToggler className={`${baseClass}__previewSizes`} slug={sizePreviewSlug}>\n {t('upload:previewSizes')}\n </DrawerToggler>\n )}\n {enableAdjustments && (\n <DrawerToggler className={`${baseClass}__edit`} slug={editDrawerSlug}>\n {t('upload:editImage')}\n </DrawerToggler>\n )}\n </React.Fragment>\n )}\n\n {customActions &&\n customActions.map((CustomAction, i) => {\n return <React.Fragment key={i}>{CustomAction}</React.Fragment>\n })}\n </div>\n )\n}\n\nexport type UploadProps = {\n collectionSlug: string\n customActions?: React.ReactNode[]\n initialState?: FormState\n onChange?: (file?: File) => void\n uploadConfig: SanitizedCollectionConfig['upload']\n}\n\nexport const Upload: React.FC<UploadProps> = (props) => {\n const { collectionSlug, customActions, initialState, onChange, uploadConfig } = props\n\n const [replacingFile, setReplacingFile] = useState(false)\n const [fileSrc, setFileSrc] = useState<null | string>(null)\n const { t } = useTranslation()\n const { setModified } = useForm()\n const { dispatchFormQueryParams, formQueryParams } = useFormQueryParams()\n const [doc, setDoc] = useState(reduceFieldsToValues(initialState || {}, true))\n const { docPermissions } = useDocumentInfo()\n const { errorMessage, setValue, showError, value } = useField<File>({\n path: 'file',\n validate,\n })\n const [_crop, setCrop] = useState({ x: 0, y: 0 })\n\n const handleFileChange = React.useCallback(\n (newFile: File) => {\n if (newFile instanceof File) {\n const fileReader = new FileReader()\n fileReader.onload = (e) => {\n const imgSrc = e.target?.result\n\n if (typeof imgSrc === 'string') {\n setFileSrc(imgSrc)\n }\n }\n fileReader.readAsDataURL(newFile)\n }\n\n setValue(newFile)\n\n if (typeof onChange === 'function') {\n onChange(newFile)\n }\n },\n [onChange, setValue],\n )\n\n const handleFileNameChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const updatedFileName = e.target.value\n if (value) {\n const fileValue = value\n // Creating a new File object with updated properties\n const newFile = new File([fileValue], updatedFileName, { type: fileValue.type })\n handleFileChange(newFile)\n }\n }\n\n const handleFileSelection = React.useCallback(\n (files: FileList) => {\n const fileToUpload = files?.[0]\n handleFileChange(fileToUpload)\n },\n [handleFileChange],\n )\n\n const handleFileRemoval = useCallback(() => {\n setReplacingFile(true)\n handleFileChange(null)\n setFileSrc('')\n }, [handleFileChange])\n\n const onEditsSave = React.useCallback(\n ({ crop, focalPosition }) => {\n setCrop({\n x: crop.x || 0,\n y: crop.y || 0,\n })\n\n setModified(true)\n dispatchFormQueryParams({\n type: 'SET',\n params: {\n uploadEdits:\n crop || focalPosition\n ? {\n crop: crop || null,\n focalPoint: focalPosition ? focalPosition : null,\n }\n : null,\n },\n })\n },\n [dispatchFormQueryParams, setModified],\n )\n\n useEffect(() => {\n setDoc(reduceFieldsToValues(initialState || {}, true))\n setReplacingFile(false)\n }, [initialState])\n\n const canRemoveUpload =\n docPermissions?.update?.permission &&\n 'delete' in docPermissions &&\n docPermissions?.delete?.permission\n\n const hasImageSizes = uploadConfig?.imageSizes?.length > 0\n const hasResizeOptions = Boolean(uploadConfig?.resizeOptions)\n // Explicity check if set to true, default is undefined\n const focalPointEnabled = uploadConfig?.focalPoint === true\n\n const { crop: showCrop = true, focalPoint = true } = uploadConfig\n\n const showFocalPoint = focalPoint && (hasImageSizes || hasResizeOptions || focalPointEnabled)\n\n return (\n <div className={[fieldBaseClass, baseClass].filter(Boolean).join(' ')}>\n <FieldError message={errorMessage} showError={showError} />\n {doc.filename && !replacingFile && (\n <FileDetails\n collectionSlug={collectionSlug}\n doc={doc}\n enableAdjustments={showCrop || showFocalPoint}\n handleRemove={canRemoveUpload ? handleFileRemoval : undefined}\n hasImageSizes={hasImageSizes}\n imageCacheTag={doc.updatedAt}\n uploadConfig={uploadConfig}\n />\n )}\n {(!doc.filename || replacingFile) && (\n <div className={`${baseClass}__upload`}>\n {!value && (\n <Dropzone\n className={`${baseClass}__dropzone`}\n mimeTypes={uploadConfig?.mimeTypes}\n onChange={handleFileSelection}\n />\n )}\n\n {value && fileSrc && (\n <React.Fragment>\n <div className={`${baseClass}__thumbnail-wrap`}>\n <Thumbnail\n collectionSlug={collectionSlug}\n fileSrc={isImage(value.type) ? fileSrc : null}\n />\n </div>\n <div className={`${baseClass}__file-adjustments`}>\n <input\n className={`${baseClass}__filename`}\n onChange={handleFileNameChange}\n type=\"text\"\n value={value.name}\n />\n <UploadActions\n customActions={customActions}\n enableAdjustments={showCrop || showFocalPoint}\n enablePreviewSizes={hasImageSizes && doc.filename && !replacingFile}\n mimeType={value.type}\n />\n </div>\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__remove`}\n icon=\"x\"\n iconStyle=\"with-border\"\n onClick={handleFileRemoval}\n round\n tooltip={t('general:cancel')}\n />\n </React.Fragment>\n )}\n </div>\n )}\n {(value || doc.filename) && (\n <Drawer Header={null} slug={editDrawerSlug}>\n <EditUpload\n fileName={value?.name || doc?.filename}\n fileSrc={fileSrc || doc?.url}\n imageCacheTag={doc.updatedAt}\n initialCrop={formQueryParams?.uploadEdits?.crop ?? {}}\n initialFocalPoint={{\n x: formQueryParams?.uploadEdits?.focalPoint.x || doc.focalX || 50,\n y: formQueryParams?.uploadEdits?.focalPoint.y || doc.focalY || 50,\n }}\n onSave={onEditsSave}\n showCrop={showCrop}\n showFocalPoint={showFocalPoint}\n />\n </Drawer>\n )}\n {doc && hasImageSizes && (\n <Drawer\n className={`${baseClass}__previewDrawer`}\n hoverTitle\n slug={sizePreviewSlug}\n title={t('upload:sizesFor', { label: doc?.filename })}\n >\n <PreviewSizes doc={doc} imageCacheTag={doc.updatedAt} uploadConfig={uploadConfig} />\n </Drawer>\n )}\n </div>\n )\n}\n"],"names":["isImage","React","useCallback","useEffect","useState","FieldError","fieldBaseClass","useForm","useField","useDocumentInfo","useFormQueryParams","useTranslation","reduceFieldsToValues","Button","Drawer","DrawerToggler","Dropzone","EditUpload","FileDetails","PreviewSizes","Thumbnail","baseClass","editDrawerSlug","sizePreviewSlug","validate","value","undefined","UploadActions","customActions","enableAdjustments","enablePreviewSizes","mimeType","t","fileTypeIsAdjustable","length","div","className","Fragment","slug","map","CustomAction","i","Upload","props","collectionSlug","initialState","onChange","uploadConfig","replacingFile","setReplacingFile","fileSrc","setFileSrc","setModified","dispatchFormQueryParams","formQueryParams","doc","setDoc","docPermissions","errorMessage","setValue","showError","path","_crop","setCrop","x","y","handleFileChange","newFile","File","fileReader","FileReader","onload","e","imgSrc","target","result","readAsDataURL","handleFileNameChange","updatedFileName","fileValue","type","handleFileSelection","files","fileToUpload","handleFileRemoval","onEditsSave","crop","focalPosition","params","uploadEdits","focalPoint","canRemoveUpload","update","permission","delete","hasImageSizes","imageSizes","hasResizeOptions","Boolean","resizeOptions","focalPointEnabled","showCrop","showFocalPoint","filter","join","message","filename","handleRemove","imageCacheTag","updatedAt","mimeTypes","input","name","buttonStyle","icon","iconStyle","onClick","round","tooltip","Header","fileName","url","initialCrop","initialFocalPoint","focalX","focalY","onSave","hoverTitle","title","label"],"mappings":"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"}
@@ -48,7 +48,7 @@
48
48
  background-color: var(--theme-bg);
49
49
  }
50
50
 
51
- &__file-mutation {
51
+ &__upload-actions {
52
52
  display: flex;
53
53
  gap: calc(var(--base) / 2);
54
54
  flex-wrap: wrap;
@@ -0,0 +1,14 @@
1
+ "use client";
2
+ // Workaround for react-datepicker and other cjs dependencies potentially inserting require("react") statements
3
+ import * as requireReact from 'react';
4
+ import * as requireReactDom from 'react-dom';
5
+
6
+ function require(m) {
7
+ if (m === 'react') return requireReact;
8
+ if (m === 'react-dom') return requireReactDom;
9
+ throw new Error(`Unknown module ${m}`);
10
+ }
11
+ // Workaround end
12
+
13
+ import{j as a}from"./chunk-3X2D2TP2.js";import"./chunk-5LKBKI4T.js";export{a as default};
14
+ //# sourceMappingURL=DatePicker-BN5AOAME.js.map
@@ -0,0 +1,8 @@
1
+ "use client";
2
+ {
3
+ "version": 3,
4
+ "sources": [],
5
+ "sourcesContent": [],
6
+ "mappings": "",
7
+ "names": []
8
+ }