@payloadcms/ui 4.0.0-canary.2 → 4.0.0-canary.21

package/dist/elements/DatePicker/DatePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.js","names":["c","_c","React","ReactDatePickerDefaultImport","registerLocale","setDefaultLocale","ReactDatePicker","default","CalendarIcon","ChevronIcon","useTranslation","getFormattedLocale","baseClass","DatePicker","props","$","id","displayFormat","customDisplayFormat","maxDate","maxTime","minDate","minTime","monthsToShow","t0","onChange","onChangeFromProps","overrides","pickerAppearance","t1","placeholder","placeholderText","readOnly","timeFormat","t2","timeIntervals","t3","value","undefined","i18n","dateFormat","incomingDate","newDate","Date","includes","tzOffset","getTimezoneOffset","setHours","setMilliseconds","dateTimePickerProps","customInputRef","disabled","monthsShown","Math","min","nextMonthButtonLabel","_jsx","direction","popperPlacement","previousMonthButtonLabel","selected","shouldCloseOnSelect","showMonthYearPicker","showPopperArrow","showTimeSelect","showTimeSelectOnly","t4","t5","filter","Boolean","classes","join","t6","t7","dateFNS","language","datepickerLocale","t8","console","warn","useEffect","className","children","_jsxs","dropdownMode","showMonthDropdown","showYearDropdown"],"sources":["../../../src/elements/DatePicker/DatePicker.tsx"],"sourcesContent":["'use client'\nimport type { DatePickerProps } from 'react-datepicker'\n\nimport React from 'react'\nimport ReactDatePickerDefaultImport, { registerLocale, setDefaultLocale } from 'react-datepicker'\nconst ReactDatePicker =\n  'default' in ReactDatePickerDefaultImport\n    ? ReactDatePickerDefaultImport.default\n    : ReactDatePickerDefaultImport\n\nimport type { Props } from './types.js'\n\nimport { CalendarIcon } from '../../icons/Calendar/index.js'\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { getFormattedLocale } from './getFormattedLocale.js'\nimport './index.css'\n\nconst baseClass = 'date-time-picker'\n\nconst DatePicker: React.FC<Props> = (props) => {\n  const {\n    id,\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  let dateFormat = customDisplayFormat\n\n  if (!customDisplayFormat) {\n    // when no displayFormat is provided, determine format based on the picker appearance\n    if (pickerAppearance === 'default') {\n      dateFormat = 'MM/dd/yyyy'\n    } else if (pickerAppearance === 'dayAndTime') {\n      dateFormat = 'MMM d, yyy h:mm a'\n    } else if (pickerAppearance === 'timeOnly') {\n      dateFormat = 'h:mm a'\n    } else if (pickerAppearance === 'dayOnly') {\n      dateFormat = 'MMM dd'\n    } else if (pickerAppearance === 'monthOnly') {\n      dateFormat = 'MMMM'\n    }\n  }\n\n  const onChange: Extract<\n    DatePickerProps,\n    { selectsMultiple?: never; selectsRange?: never }\n  >['onChange'] = (incomingDate) => {\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\n    if (newDate instanceof Date && !dateFormat.includes('SSS')) {\n      // Unless the dateFormat includes milliseconds, set milliseconds to 0\n      // This is to ensure that the timestamp is consistent with the displayFormat\n      newDate.setMilliseconds(0)\n    }\n\n    if (typeof onChangeFromProps === 'function') {\n      onChangeFromProps(newDate)\n    }\n  }\n\n  const dateTimePickerProps: Extract<\n    DatePickerProps,\n    { selectsMultiple?: never; selectsRange?: never }\n  > = {\n    customInputRef: 'ref',\n    dateFormat,\n    disabled: readOnly,\n    maxDate,\n    maxTime,\n    minDate,\n    minTime,\n    monthsShown: Math.min(2, monthsToShow),\n    nextMonthButtonLabel: <ChevronIcon direction=\"right\" />,\n    nextYearButtonLabel: '›',\n    onChange,\n    placeholderText,\n    popperPlacement: 'bottom-start',\n    previousMonthButtonLabel: <ChevronIcon direction=\"left\" />,\n    previousYearButtonLabel: '‹',\n    selected: value && new Date(value),\n    shouldCloseOnSelect: false,\n    showMonthYearPicker: pickerAppearance === 'monthOnly',\n    showPopperArrow: false,\n    showTimeSelect: pickerAppearance === 'dayAndTime' || pickerAppearance === 'timeOnly',\n    showTimeSelectOnly: pickerAppearance === 'timeOnly',\n    timeFormat,\n    timeIntervals,\n    ...(overrides as Extract<\n      DatePickerProps,\n      { selectsMultiple?: never; selectsRange?: never } // to satisfy TypeScript. Overrides can enable selectsMultiple or selectsRange but then it's up to the user to ensure they pass in the correct onChange\n    >),\n  }\n\n  const classes = [baseClass, `${baseClass}__appearance--${pickerAppearance}`]\n    .filter(Boolean)\n    .join(' ')\n\n  React.useEffect(() => {\n    if (i18n.dateFNS) {\n      try {\n        const datepickerLocale = getFormattedLocale(i18n.language)\n        registerLocale(datepickerLocale, i18n.dateFNS)\n        setDefaultLocale(datepickerLocale)\n      } catch (_error) {\n        // eslint-disable-next-line no-console\n        console.warn(`Could not find DatePicker locale for ${i18n.language}`)\n      }\n    }\n  }, [i18n.language, i18n.dateFNS])\n\n  return (\n    <div className={classes} id={id}>\n      <div className={`${baseClass}__input-wrapper`}>\n        <ReactDatePicker\n          {...dateTimePickerProps}\n          dropdownMode=\"select\"\n          showMonthDropdown={pickerAppearance !== 'monthOnly'}\n          showYearDropdown={pickerAppearance !== 'monthOnly'}\n        />\n        <CalendarIcon />\n      </div>\n    </div>\n  )\n}\n\n// eslint-disable-next-line no-restricted-exports\nexport default DatePicker\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"DatePicker.js","names":["c","_c","React","ReactDatePickerDefaultImport","registerLocale","setDefaultLocale","ReactDatePicker","default","CalendarIcon","ChevronIcon","useTranslation","getFormattedLocale","baseClass","DatePicker","props","$","id","displayFormat","customDisplayFormat","maxDate","maxTime","minDate","minTime","monthsToShow","t0","onChange","onChangeFromProps","overrides","pickerAppearance","t1","placeholder","placeholderText","readOnly","timeFormat","t2","timeIntervals","t3","value","undefined","i18n","dateFormat","incomingDate","newDate","Date","includes","tzOffset","getTimezoneOffset","setHours","setMilliseconds","dateTimePickerProps","customInputRef","disabled","monthsShown","Math","min","nextMonthButtonLabel","_jsx","direction","popperPlacement","portalId","previousMonthButtonLabel","selected","shouldCloseOnSelect","showMonthYearPicker","showPopperArrow","showTimeSelect","showTimeSelectOnly","t4","t5","filter","Boolean","classes","join","t6","t7","dateFNS","language","datepickerLocale","t8","console","warn","useEffect","className","children","_jsxs","dropdownMode","showMonthDropdown","showYearDropdown"],"sources":["../../../src/elements/DatePicker/DatePicker.tsx"],"sourcesContent":["'use client'\nimport type { DatePickerProps } from 'react-datepicker'\n\nimport React from 'react'\nimport ReactDatePickerDefaultImport, { registerLocale, setDefaultLocale } from 'react-datepicker'\nconst ReactDatePicker =\n  'default' in ReactDatePickerDefaultImport\n    ? ReactDatePickerDefaultImport.default\n    : ReactDatePickerDefaultImport\n\nimport type { Props } from './types.js'\n\nimport { CalendarIcon } from '../../icons/Calendar/index.js'\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { getFormattedLocale } from './getFormattedLocale.js'\nimport './index.css'\n\nconst baseClass = 'date-time-picker'\n\nconst DatePicker: React.FC<Props> = (props) => {\n  const {\n    id,\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  let dateFormat = customDisplayFormat\n\n  if (!customDisplayFormat) {\n    // when no displayFormat is provided, determine format based on the picker appearance\n    if (pickerAppearance === 'default') {\n      dateFormat = 'MM/dd/yyyy'\n    } else if (pickerAppearance === 'dayAndTime') {\n      dateFormat = 'MMM d, yyy h:mm a'\n    } else if (pickerAppearance === 'timeOnly') {\n      dateFormat = 'h:mm a'\n    } else if (pickerAppearance === 'dayOnly') {\n      dateFormat = 'MMM dd'\n    } else if (pickerAppearance === 'monthOnly') {\n      dateFormat = 'MMMM'\n    }\n  }\n\n  const onChange: Extract<\n    DatePickerProps,\n    { selectsMultiple?: never; selectsRange?: never }\n  >['onChange'] = (incomingDate) => {\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\n    if (newDate instanceof Date && !dateFormat.includes('SSS')) {\n      // Unless the dateFormat includes milliseconds, set milliseconds to 0\n      // This is to ensure that the timestamp is consistent with the displayFormat\n      newDate.setMilliseconds(0)\n    }\n\n    if (typeof onChangeFromProps === 'function') {\n      onChangeFromProps(newDate)\n    }\n  }\n\n  const dateTimePickerProps: Extract<\n    DatePickerProps,\n    { selectsMultiple?: never; selectsRange?: never }\n  > = {\n    customInputRef: 'ref',\n    dateFormat,\n    disabled: readOnly,\n    maxDate,\n    maxTime,\n    minDate,\n    minTime,\n    monthsShown: Math.min(2, monthsToShow),\n    nextMonthButtonLabel: <ChevronIcon direction=\"right\" />,\n    nextYearButtonLabel: '›',\n    onChange,\n    placeholderText,\n    popperPlacement: 'bottom-start',\n    portalId: 'date-time-picker-portal',\n    previousMonthButtonLabel: <ChevronIcon direction=\"left\" />,\n    previousYearButtonLabel: '‹',\n    selected: value && new Date(value),\n    shouldCloseOnSelect: false,\n    showMonthYearPicker: pickerAppearance === 'monthOnly',\n    showPopperArrow: false,\n    showTimeSelect: pickerAppearance === 'dayAndTime' || pickerAppearance === 'timeOnly',\n    showTimeSelectOnly: pickerAppearance === 'timeOnly',\n    timeFormat,\n    timeIntervals,\n    ...(overrides as Extract<\n      DatePickerProps,\n      { selectsMultiple?: never; selectsRange?: never } // to satisfy TypeScript. Overrides can enable selectsMultiple or selectsRange but then it's up to the user to ensure they pass in the correct onChange\n    >),\n  }\n\n  const classes = [baseClass, `${baseClass}__appearance--${pickerAppearance}`]\n    .filter(Boolean)\n    .join(' ')\n\n  React.useEffect(() => {\n    if (i18n.dateFNS) {\n      try {\n        const datepickerLocale = getFormattedLocale(i18n.language)\n        registerLocale(datepickerLocale, i18n.dateFNS)\n        setDefaultLocale(datepickerLocale)\n      } catch (_error) {\n        // eslint-disable-next-line no-console\n        console.warn(`Could not find DatePicker locale for ${i18n.language}`)\n      }\n    }\n  }, [i18n.language, i18n.dateFNS])\n\n  return (\n    <div className={classes} id={id}>\n      <div className={`${baseClass}__input-wrapper`}>\n        <ReactDatePicker\n          {...dateTimePickerProps}\n          dropdownMode=\"select\"\n          showMonthDropdown={pickerAppearance !== 'monthOnly'}\n          showYearDropdown={pickerAppearance !== 'monthOnly'}\n        />\n        <CalendarIcon />\n      </div>\n    </div>\n  )\n}\n\n// eslint-disable-next-line no-restricted-exports\nexport default DatePicker\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/DatePicker/getFormattedLocale.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"getFormattedLocale.d.ts","sourceRoot":"","sources":["../../../src/elements/DatePicker/getFormattedLocale.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,kBAAkB,GAAI,iBAAiB,QAWnD,CAAA"}
+{"version":3,"file":"getFormattedLocale.d.ts","sourceRoot":"","sources":["../../../src/elements/DatePicker/getFormattedLocale.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,kBAAkB,4BAW9B,CAAA"}

package/dist/elements/DatePicker/index.css

@@ -40,7 +40,7 @@
   }
 
   .react-datepicker-popper {
-    z-index: 10;
+    z-index: var(--z-portal-element);
     line-height: 0;
   }
 
@@ -277,7 +277,7 @@
   .react-datepicker__month-year-read-view--down-arrow {
     border-color: var(--color-icon-secondary);
     border-style: solid;
-    border-width: 2px 2px 0 0;
+    border-width: var(--stroke-width-medium) var(--stroke-width-medium) 0 0;
     content: '';
     display: block;
     height: 6px;
@@ -373,7 +373,7 @@
   }
 
   .react-datepicker__monthPicker {
-    border-top: 1px solid var(--color-border);
+    border-top: var(--stroke-width-small) solid var(--color-border);
   }
 
   .react-datepicker__month-text {
@@ -413,7 +413,7 @@
     background-color: transparent;
     padding: var(--spacer-2);
     padding-bottom: 0;
-    border-top: 1px solid var(--color-border);
+    border-top: var(--stroke-width-small) solid var(--color-border);
     width: 100%;
     order: 3;
   }
@@ -614,13 +614,13 @@
 
   .react-datepicker__time-container {
     float: right;
-    border-left: 1px solid var(--color-border);
+    border-left: var(--stroke-width-small) solid var(--color-border);
     width: var(--time-column-width);
 
     .react-datepicker__time {
       position: relative;
       background: transparent;
-      border-top: 1px solid var(--color-border);
+      border-top: var(--stroke-width-small) solid var(--color-border);
       border-bottom-right-radius: var(--radius-large);
 
       .react-datepicker__time-box {
@@ -722,7 +722,7 @@
 
   .react-datepicker__today-button {
     background: var(--color-bg-secondary);
-    border-top: 1px solid var(--color-border);
+    border-top: var(--stroke-width-small) solid var(--color-border);
     cursor: pointer;
     text-align: center;
     font-weight: var(--text-body-medium-strong-font-weight);
@@ -827,7 +827,7 @@
     font-weight: var(--text-body-medium-font-weight);
     line-height: var(--text-body-medium-line-height);
     width: 100%;
-    min-height: var(--field-min-height);
+    min-height: var(--field-min-height-large);
     border: var(--stroke-width-small) solid var(--field-color-border);
     border-radius: var(--field-border-radius);
     background: var(--field-color-bg);
@@ -868,7 +868,7 @@
   /* ——— Error state ——— */
   .date-time-picker--has-error .react-datepicker__input-container input {
     border-color: var(--field-color-border-error);
-    border-width: 2px;
+    border-width: var(--stroke-width-medium);
     padding: calc(var(--spacer-1) - 1px) calc(var(--spacer-2-5) - 1px);
     padding-right: calc(2.25rem - 1px);
   }
@@ -894,7 +894,7 @@
 
     .date-time-picker .react-datepicker__time-container {
       width: auto;
-      border-top: 1px solid var(--color-border);
+      border-top: var(--stroke-width-small) solid var(--color-border);
     }
 
     .date-time-picker .react-datepicker__header--time {

package/dist/elements/DatePicker/index.js

@@ -6,7 +6,7 @@ import { ShimmerEffect } from '../ShimmerEffect/index.js';
 const DatePicker = /*#__PURE__*/lazy(() => import('./DatePicker.js'));
 export const DatePickerField = props => /*#__PURE__*/_jsx(Suspense, {
   fallback: /*#__PURE__*/_jsx(ShimmerEffect, {
-    height: "var(--field-min-height)"
+    height: "var(--field-min-height-large)"
   }),
   children: /*#__PURE__*/_jsx(DatePicker, {
     ...props

package/dist/elements/DatePicker/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["React","lazy","Suspense","ShimmerEffect","DatePicker","DatePickerField","props","_jsx","fallback","height"],"sources":["../../../src/elements/DatePicker/index.tsx"],"sourcesContent":["'use client'\nimport React, { lazy, Suspense } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\n\nconst DatePicker = lazy(() => import('./DatePicker.js'))\n\nexport const DatePickerField: React.FC<Props> = (props) => (\n  <Suspense fallback={<ShimmerEffect height=\"var(--field-min-height)\" />}>\n    <DatePicker {...props} />\n  </Suspense>\n)\n"],"mappings":"AAAA;;;AACA,OAAOA,KAAA,IAASC,IAAI,EAAEC,QAAQ,QAAQ;AAItC,SAASC,aAAa,QAAQ;AAE9B,MAAMC,UAAA,gBAAaH,IAAA,CAAK,MAAM,MAAM,CAAC;AAErC,OAAO,MAAMI,eAAA,GAAoCC,KAAA,iBAC/CC,IAAA,CAACL,QAAA;EAASM,QAAA,eAAUD,IAAA,CAACJ,aAAA;IAAcM,MAAA,EAAO;;YACxC,aAAAF,IAAA,CAACH,UAAA;IAAY,GAAGE","ignoreList":[]}
+{"version":3,"file":"index.js","names":["React","lazy","Suspense","ShimmerEffect","DatePicker","DatePickerField","props","_jsx","fallback","height"],"sources":["../../../src/elements/DatePicker/index.tsx"],"sourcesContent":["'use client'\nimport React, { lazy, Suspense } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\n\nconst DatePicker = lazy(() => import('./DatePicker.js'))\n\nexport const DatePickerField: React.FC<Props> = (props) => (\n  <Suspense fallback={<ShimmerEffect height=\"var(--field-min-height-large)\" />}>\n    <DatePicker {...props} />\n  </Suspense>\n)\n"],"mappings":"AAAA;;;AACA,OAAOA,KAAA,IAASC,IAAI,EAAEC,QAAQ,QAAQ;AAItC,SAASC,aAAa,QAAQ;AAE9B,MAAMC,UAAA,gBAAaH,IAAA,CAAK,MAAM,MAAM,CAAC;AAErC,OAAO,MAAMI,eAAA,GAAoCC,KAAA,iBAC/CC,IAAA,CAACL,QAAA;EAASM,QAAA,eAAUD,IAAA,CAACJ,aAAA;IAAcM,MAAA,EAAO;;YACxC,aAAAF,IAAA,CAACH,UAAA;IAAY,GAAGE","ignoreList":[]}

package/dist/elements/DeleteDocument/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DeleteDocument/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAKxD,OAAO,KAA0C,MAAM,OAAO,CAAA;AAG9D,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,+BAA+B,CAAA;AAkB9E,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;IAC1B,QAAQ,CAAC,cAAc,EAAE,yBAAyB,CAAC,MAAM,CAAC,CAAA;IAC1D,QAAQ,CAAC,EAAE,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,QAAQ,CAAC,EAAE,yBAAyB,CAAC,UAAU,CAAC,CAAA;IACzD,QAAQ,CAAC,mBAAmB,CAAC,EAAE,OAAO,CAAA;IACtC,QAAQ,CAAC,aAAa,EAAE,yBAAyB,CAAC,QAAQ,CAAC,CAAC,UAAU,CAAC,CAAA;IACvE,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,UAAU,EAAE,yBAAyB,CAAC,OAAO,CAAC,CAAC,YAAY,CAAC,CAAA;CACtE,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA4K1C,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DeleteDocument/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,SAAS,CAAA;AAKxD,OAAO,KAA0C,MAAM,OAAO,CAAA;AAG9D,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,+BAA+B,CAAA;AAmB9E,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;IAC1B,QAAQ,CAAC,cAAc,EAAE,yBAAyB,CAAC,MAAM,CAAC,CAAA;IAC1D,QAAQ,CAAC,EAAE,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,QAAQ,CAAC,EAAE,yBAAyB,CAAC,UAAU,CAAC,CAAA;IACzD,QAAQ,CAAC,mBAAmB,CAAC,EAAE,OAAO,CAAA;IACtC,QAAQ,CAAC,aAAa,EAAE,yBAAyB,CAAC,QAAQ,CAAC,CAAC,UAAU,CAAC,CAAA;IACvE,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,UAAU,EAAE,yBAAyB,CAAC,OAAO,CAAC,CAAC,YAAY,CAAC,CAAA;CACtE,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA4L1C,CAAA"}

package/dist/elements/DeleteDocument/index.js

@@ -9,6 +9,7 @@ import { toast } from 'sonner';
 import { CheckboxInput } from '../../fields/Checkbox/Input.js';
 import { useForm } from '../../forms/Form/context.js';
 import { useConfig } from '../../providers/Config/index.js';
+import { useDocumentEvents } from '../../providers/DocumentEvents/index.js';
 import { useDocumentInfo } from '../../providers/DocumentInfo/index.js';
 import { useDocumentTitle } from '../../providers/DocumentTitle/index.js';
 import { useRouter } from '../../providers/RouterAdapter/index.js';
@@ -63,6 +64,9 @@ export const DeleteDocument = props => {
   const {
     openModal
   } = useModal();
+  const {
+    reportUpdate
+  } = useDocumentEvents();
   const modalSlug = `delete-${id}`;
   const [deletePermanently, setDeletePermanently] = useState(false);
   const addDefaultError = useCallback(() => {
@@ -102,7 +106,17 @@ export const DeleteDocument = props => {
           label: getTranslation(singularLabel, i18n),
           title
         }) || json.message);
+        // A trashed document also disappears from default queries, so both permanent
+        // deletes and trashing report as a `delete` event.
+        const deleteEvent = {
+          id,
+          entitySlug: collectionSlug,
+          operation: 'delete',
+          updatedAt: new Date().toISOString()
+        };
         if (redirectAfterDelete) {
+          // Navigating away tears this surface down, so just notify other surfaces.
+          reportUpdate(deleteEvent);
           return startRouteTransition(() => router.push(formatAdminURL({
             adminRoute,
             path: `/collections/${collectionSlug}`
@@ -114,6 +128,7 @@ export const DeleteDocument = props => {
             collectionConfig
           });
         }
+        reportUpdate(deleteEvent);
         return;
       }
       if (json.errors) {
@@ -125,7 +140,7 @@ export const DeleteDocument = props => {
     } catch (_err) {
       return addDefaultError();
     }
-  }, [deletePermanently, setModified, hasDeletePermission, hasTrashPermission, api, collectionSlug, id, t, singularLabel, addDefaultError, i18n, title, router, adminRoute, redirectAfterDelete, onDelete, collectionConfig, startRouteTransition]);
+  }, [deletePermanently, setModified, hasDeletePermission, hasTrashPermission, api, collectionSlug, id, t, singularLabel, addDefaultError, i18n, title, router, adminRoute, redirectAfterDelete, onDelete, collectionConfig, startRouteTransition, reportUpdate]);
   if (id) {
     return /*#__PURE__*/_jsxs(Fragment, {
       children: [/*#__PURE__*/_jsx(PopupList.Button, {

package/dist/elements/DeleteDocument/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["useModal","getTranslation","formatAdminURL","React","Fragment","useCallback","useState","toast","CheckboxInput","useForm","useConfig","useDocumentInfo","useDocumentTitle","useRouter","useRouteTransition","useTranslation","requests","shouldPermanentlyDelete","ConfirmationModal","PopupList","Translation","baseClass","DeleteDocument","props","id","buttonId","collectionSlug","onDelete","redirectAfterDelete","singularLabel","title","titleFromProps","config","routes","admin","adminRoute","api","getEntityConfig","collectionConfig","hasDeletePermission","hasTrashPermission","setModified","router","i18n","t","startRouteTransition","openModal","modalSlug","deletePermanently","setDeletePermanently","addDefaultError","error","handleDelete","permanentlyDelete","url","apiRoute","path","res","delete","headers","language","patch","body","JSON","stringify","deletedAt","Date","toISOString","json","status","success","label","message","push","errors","forEach","_err","_jsxs","_jsx","Button","onClick","elements","1","children","i18nKey","trash","variables","checked","name","onToggle","e","target","className","confirmingLabel","heading","onConfirm"],"sources":["../../../src/elements/DeleteDocument/index.tsx"],"sourcesContent":["'use client'\nimport type { SanitizedCollectionConfig } from 'payload'\n\nimport { useModal } from '@faceless-ui/modal'\nimport { getTranslation } from '@payloadcms/translations'\nimport { formatAdminURL } from 'payload/shared'\nimport React, { Fragment, useCallback, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport type { DocumentDrawerContextType } from '../DocumentDrawer/Provider.js'\n\nimport { CheckboxInput } from '../../fields/Checkbox/Input.js'\nimport { useForm } from '../../forms/Form/context.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useDocumentTitle } from '../../providers/DocumentTitle/index.js'\nimport { useRouter } from '../../providers/RouterAdapter/index.js'\nimport { useRouteTransition } from '../../providers/RouteTransition/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { requests } from '../../utilities/api.js'\nimport { shouldPermanentlyDelete } from '../../utilities/shouldPermanentlyDelete.js'\nimport { ConfirmationModal } from '../ConfirmationModal/index.js'\nimport { PopupList } from '../Popup/index.js'\nimport { Translation } from '../Translation/index.js'\n\nconst baseClass = 'delete-document'\n\nexport type Props = {\n  readonly buttonId?: string\n  readonly collectionSlug: SanitizedCollectionConfig['slug']\n  readonly id?: string\n  readonly onDelete?: DocumentDrawerContextType['onDelete']\n  readonly redirectAfterDelete?: boolean\n  readonly singularLabel: SanitizedCollectionConfig['labels']['singular']\n  readonly title?: string\n  readonly useAsTitle: SanitizedCollectionConfig['admin']['useAsTitle']\n}\n\nexport const DeleteDocument: React.FC<Props> = (props) => {\n  const {\n    id,\n    buttonId,\n    collectionSlug,\n    onDelete,\n    redirectAfterDelete = true,\n    singularLabel,\n    title: titleFromProps,\n  } = props\n\n  const {\n    config: {\n      routes: { admin: adminRoute, api },\n    },\n    getEntityConfig,\n  } = useConfig()\n\n  const collectionConfig = getEntityConfig({ collectionSlug })\n\n  const { hasDeletePermission, hasTrashPermission } = useDocumentInfo()\n  const { setModified } = useForm()\n  const router = useRouter()\n  const { i18n, t } = useTranslation()\n  const { title } = useDocumentTitle()\n  const { startRouteTransition } = useRouteTransition()\n  const { openModal } = useModal()\n\n  const modalSlug = `delete-${id}`\n\n  const [deletePermanently, setDeletePermanently] = useState(false)\n\n  const addDefaultError = useCallback(() => {\n    toast.error(t('error:deletingTitle', { title }))\n  }, [t, title])\n\n  const handleDelete = useCallback(async () => {\n    setModified(false)\n\n    const permanentlyDelete = shouldPermanentlyDelete({\n      deletePermanently,\n      hasDeletePermission,\n      hasTrashPermission,\n    })\n\n    try {\n      const url = formatAdminURL({\n        apiRoute: api,\n        path: `/${collectionSlug}/${id}`,\n      })\n      const res = permanentlyDelete\n        ? await requests.delete(url, {\n            headers: {\n              'Accept-Language': i18n.language,\n              'Content-Type': 'application/json',\n            },\n          })\n        : await requests.patch(url, {\n            body: JSON.stringify({\n              deletedAt: new Date().toISOString(),\n            }),\n            headers: {\n              'Accept-Language': i18n.language,\n              'Content-Type': 'application/json',\n            },\n          })\n\n      const json = await res.json()\n\n      if (res.status < 400) {\n        toast.success(\n          t(permanentlyDelete ? 'general:titleDeleted' : 'general:titleTrashed', {\n            label: getTranslation(singularLabel, i18n),\n            title,\n          }) || json.message,\n        )\n\n        if (redirectAfterDelete) {\n          return startRouteTransition(() =>\n            router.push(formatAdminURL({ adminRoute, path: `/collections/${collectionSlug}` })),\n          )\n        }\n\n        if (typeof onDelete === 'function') {\n          await onDelete({ id, collectionConfig })\n        }\n\n        return\n      }\n\n      if (json.errors) {\n        json.errors.forEach((error) => toast.error(error.message))\n      } else {\n        addDefaultError()\n      }\n\n      return\n    } catch (_err) {\n      return addDefaultError()\n    }\n  }, [\n    deletePermanently,\n    setModified,\n    hasDeletePermission,\n    hasTrashPermission,\n    api,\n    collectionSlug,\n    id,\n    t,\n    singularLabel,\n    addDefaultError,\n    i18n,\n    title,\n    router,\n    adminRoute,\n    redirectAfterDelete,\n    onDelete,\n    collectionConfig,\n    startRouteTransition,\n  ])\n\n  if (id) {\n    return (\n      <Fragment>\n        <PopupList.Button\n          id={buttonId}\n          onClick={() => {\n            openModal(modalSlug)\n          }}\n        >\n          {t('general:delete')}\n        </PopupList.Button>\n        <ConfirmationModal\n          body={\n            <Fragment>\n              <Translation\n                elements={{\n                  '1': ({ children }) => <strong>{children}</strong>,\n                }}\n                i18nKey={\n                  collectionConfig.trash && hasTrashPermission\n                    ? 'general:aboutToTrash'\n                    : 'general:aboutToDelete'\n                }\n                t={t}\n                variables={{\n                  label: getTranslation(singularLabel, i18n),\n                  title: titleFromProps || title || id,\n                }}\n              />\n              {collectionConfig.trash && hasTrashPermission && hasDeletePermission && (\n                <CheckboxInput\n                  checked={deletePermanently}\n                  id=\"delete-forever\"\n                  label={t('general:deletePermanently')}\n                  name=\"delete-forever\"\n                  onToggle={(e) => setDeletePermanently(e.target.checked)}\n                />\n              )}\n            </Fragment>\n          }\n          className={baseClass}\n          confirmingLabel={t('general:deleting')}\n          heading={t('general:confirmDeletion')}\n          modalSlug={modalSlug}\n          onConfirm={handleDelete}\n        />\n      </Fragment>\n    )\n  }\n\n  return null\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["useModal","getTranslation","formatAdminURL","React","Fragment","useCallback","useState","toast","CheckboxInput","useForm","useConfig","useDocumentEvents","useDocumentInfo","useDocumentTitle","useRouter","useRouteTransition","useTranslation","requests","shouldPermanentlyDelete","ConfirmationModal","PopupList","Translation","baseClass","DeleteDocument","props","id","buttonId","collectionSlug","onDelete","redirectAfterDelete","singularLabel","title","titleFromProps","config","routes","admin","adminRoute","api","getEntityConfig","collectionConfig","hasDeletePermission","hasTrashPermission","setModified","router","i18n","t","startRouteTransition","openModal","reportUpdate","modalSlug","deletePermanently","setDeletePermanently","addDefaultError","error","handleDelete","permanentlyDelete","url","apiRoute","path","res","delete","headers","language","patch","body","JSON","stringify","deletedAt","Date","toISOString","json","status","success","label","message","deleteEvent","entitySlug","operation","updatedAt","push","errors","forEach","_err","_jsxs","_jsx","Button","onClick","elements","1","children","i18nKey","trash","variables","checked","name","onToggle","e","target","className","confirmingLabel","heading","onConfirm"],"sources":["../../../src/elements/DeleteDocument/index.tsx"],"sourcesContent":["'use client'\nimport type { SanitizedCollectionConfig } from 'payload'\n\nimport { useModal } from '@faceless-ui/modal'\nimport { getTranslation } from '@payloadcms/translations'\nimport { formatAdminURL } from 'payload/shared'\nimport React, { Fragment, useCallback, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport type { DocumentDrawerContextType } from '../DocumentDrawer/Provider.js'\n\nimport { CheckboxInput } from '../../fields/Checkbox/Input.js'\nimport { useForm } from '../../forms/Form/context.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentEvents } from '../../providers/DocumentEvents/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useDocumentTitle } from '../../providers/DocumentTitle/index.js'\nimport { useRouter } from '../../providers/RouterAdapter/index.js'\nimport { useRouteTransition } from '../../providers/RouteTransition/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { requests } from '../../utilities/api.js'\nimport { shouldPermanentlyDelete } from '../../utilities/shouldPermanentlyDelete.js'\nimport { ConfirmationModal } from '../ConfirmationModal/index.js'\nimport { PopupList } from '../Popup/index.js'\nimport { Translation } from '../Translation/index.js'\n\nconst baseClass = 'delete-document'\n\nexport type Props = {\n  readonly buttonId?: string\n  readonly collectionSlug: SanitizedCollectionConfig['slug']\n  readonly id?: string\n  readonly onDelete?: DocumentDrawerContextType['onDelete']\n  readonly redirectAfterDelete?: boolean\n  readonly singularLabel: SanitizedCollectionConfig['labels']['singular']\n  readonly title?: string\n  readonly useAsTitle: SanitizedCollectionConfig['admin']['useAsTitle']\n}\n\nexport const DeleteDocument: React.FC<Props> = (props) => {\n  const {\n    id,\n    buttonId,\n    collectionSlug,\n    onDelete,\n    redirectAfterDelete = true,\n    singularLabel,\n    title: titleFromProps,\n  } = props\n\n  const {\n    config: {\n      routes: { admin: adminRoute, api },\n    },\n    getEntityConfig,\n  } = useConfig()\n\n  const collectionConfig = getEntityConfig({ collectionSlug })\n\n  const { hasDeletePermission, hasTrashPermission } = useDocumentInfo()\n  const { setModified } = useForm()\n  const router = useRouter()\n  const { i18n, t } = useTranslation()\n  const { title } = useDocumentTitle()\n  const { startRouteTransition } = useRouteTransition()\n  const { openModal } = useModal()\n  const { reportUpdate } = useDocumentEvents()\n\n  const modalSlug = `delete-${id}`\n\n  const [deletePermanently, setDeletePermanently] = useState(false)\n\n  const addDefaultError = useCallback(() => {\n    toast.error(t('error:deletingTitle', { title }))\n  }, [t, title])\n\n  const handleDelete = useCallback(async () => {\n    setModified(false)\n\n    const permanentlyDelete = shouldPermanentlyDelete({\n      deletePermanently,\n      hasDeletePermission,\n      hasTrashPermission,\n    })\n\n    try {\n      const url = formatAdminURL({\n        apiRoute: api,\n        path: `/${collectionSlug}/${id}`,\n      })\n      const res = permanentlyDelete\n        ? await requests.delete(url, {\n            headers: {\n              'Accept-Language': i18n.language,\n              'Content-Type': 'application/json',\n            },\n          })\n        : await requests.patch(url, {\n            body: JSON.stringify({\n              deletedAt: new Date().toISOString(),\n            }),\n            headers: {\n              'Accept-Language': i18n.language,\n              'Content-Type': 'application/json',\n            },\n          })\n\n      const json = await res.json()\n\n      if (res.status < 400) {\n        toast.success(\n          t(permanentlyDelete ? 'general:titleDeleted' : 'general:titleTrashed', {\n            label: getTranslation(singularLabel, i18n),\n            title,\n          }) || json.message,\n        )\n\n        // A trashed document also disappears from default queries, so both permanent\n        // deletes and trashing report as a `delete` event.\n        const deleteEvent = {\n          id,\n          entitySlug: collectionSlug,\n          operation: 'delete' as const,\n          updatedAt: new Date().toISOString(),\n        }\n\n        if (redirectAfterDelete) {\n          // Navigating away tears this surface down, so just notify other surfaces.\n          reportUpdate(deleteEvent)\n\n          return startRouteTransition(() =>\n            router.push(formatAdminURL({ adminRoute, path: `/collections/${collectionSlug}` })),\n          )\n        }\n\n        if (typeof onDelete === 'function') {\n          await onDelete({ id, collectionConfig })\n        }\n\n        reportUpdate(deleteEvent)\n\n        return\n      }\n\n      if (json.errors) {\n        json.errors.forEach((error) => toast.error(error.message))\n      } else {\n        addDefaultError()\n      }\n\n      return\n    } catch (_err) {\n      return addDefaultError()\n    }\n  }, [\n    deletePermanently,\n    setModified,\n    hasDeletePermission,\n    hasTrashPermission,\n    api,\n    collectionSlug,\n    id,\n    t,\n    singularLabel,\n    addDefaultError,\n    i18n,\n    title,\n    router,\n    adminRoute,\n    redirectAfterDelete,\n    onDelete,\n    collectionConfig,\n    startRouteTransition,\n    reportUpdate,\n  ])\n\n  if (id) {\n    return (\n      <Fragment>\n        <PopupList.Button\n          id={buttonId}\n          onClick={() => {\n            openModal(modalSlug)\n          }}\n        >\n          {t('general:delete')}\n        </PopupList.Button>\n        <ConfirmationModal\n          body={\n            <Fragment>\n              <Translation\n                elements={{\n                  '1': ({ children }) => <strong>{children}</strong>,\n                }}\n                i18nKey={\n                  collectionConfig.trash && hasTrashPermission\n                    ? 'general:aboutToTrash'\n                    : 'general:aboutToDelete'\n                }\n                t={t}\n                variables={{\n                  label: getTranslation(singularLabel, i18n),\n                  title: titleFromProps || title || id,\n                }}\n              />\n              {collectionConfig.trash && hasTrashPermission && hasDeletePermission && (\n                <CheckboxInput\n                  checked={deletePermanently}\n                  id=\"delete-forever\"\n                  label={t('general:deletePermanently')}\n                  name=\"delete-forever\"\n                  onToggle={(e) => setDeletePermanently(e.target.checked)}\n                />\n              )}\n            </Fragment>\n          }\n          className={baseClass}\n          confirmingLabel={t('general:deleting')}\n          heading={t('general:confirmDeletion')}\n          modalSlug={modalSlug}\n          onConfirm={handleDelete}\n        />\n      </Fragment>\n    )\n  }\n\n  return null\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/Dialog/DialogHeader/index.d.ts

@@ -1,6 +1,10 @@
 import React from 'react';
 export type DialogHeaderProps = {
     readonly children?: React.ReactNode;
+    readonly className?: string;
+    readonly onClose?: ({ modalSlug }: {
+        modalSlug: string;
+    }) => void;
     readonly showClose?: boolean;
     readonly title?: React.ReactNode;
 };

package/dist/elements/Dialog/DialogHeader/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Dialog/DialogHeader/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AASzB,MAAM,MAAM,iBAAiB,GAAG;IAC9B,QAAQ,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACnC,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAA;IAC5B,QAAQ,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACjC,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA4BpD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Dialog/DialogHeader/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAUzB,MAAM,MAAM,iBAAiB,GAAG;IAC9B,QAAQ,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACnC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,EAAE;QAAE,SAAS,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IACjE,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAA;IAC5B,QAAQ,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACjC,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA0CpD,CAAA"}

package/dist/elements/Dialog/DialogHeader/index.js

@@ -7,11 +7,14 @@ import { XIcon } from '../../../icons/X/index.js';
 import { Button } from '../../Button/index.js';
 import { useModal } from '../../Modal/index.js';
 import { useDialogContext } from '../context.js';
+import { DialogTitle } from '../DialogTitle/index.js';
 const baseClass = 'dialog';
 export const DialogHeader = t0 => {
-  const $ = _c(10);
+  const $ = _c(12);
   const {
     children,
+    className,
+    onClose,
     showClose,
     title
   } = t0;
@@ -27,43 +30,55 @@ export const DialogHeader = t0 => {
   }
   const t1 = showClose && `${baseClass}__header--has-close`;
   let t2;
-  if ($[0] !== t1) {
-    t2 = [`${baseClass}__header`, t1].filter(Boolean);
-    $[0] = t1;
-    $[1] = t2;
+  if ($[0] !== className || $[1] !== t1) {
+    t2 = [`${baseClass}__header`, t1, className].filter(Boolean);
+    $[0] = className;
+    $[1] = t1;
+    $[2] = t2;
   } else {
-    t2 = $[1];
+    t2 = $[2];
   }
   const t3 = t2.join(" ");
   let t4;
-  if ($[2] !== children || $[3] !== closeModal || $[4] !== isConfirming || $[5] !== showClose || $[6] !== slug || $[7] !== t3 || $[8] !== title) {
+  if ($[3] !== children || $[4] !== closeModal || $[5] !== isConfirming || $[6] !== onClose || $[7] !== showClose || $[8] !== slug || $[9] !== t3 || $[10] !== title) {
     t4 = _jsxs("div", {
       className: t3,
-      children: [title ? _jsx("h4", {
-        className: `${baseClass}__title`,
-        children: title
-      }) : null, children ? _jsx("div", {
-        className: `${baseClass}__header-extras`,
-        children
-      }) : null, showClose ? _jsx(Button, {
-        "aria-label": "Close",
-        buttonStyle: "ghost",
-        disabled: isConfirming,
-        icon: _jsx(XIcon, {}),
-        margin: false,
-        onClick: () => closeModal(slug)
-      }) : null]
+      children: [title ? typeof title === "string" ? _jsx(DialogTitle, {
+        title
+      }) : title : null, _jsxs("div", {
+        className: `${baseClass}__header-end`,
+        children: [children ? _jsx("div", {
+          className: `${baseClass}__header-extras`,
+          children
+        }) : null, showClose ? _jsx(Button, {
+          "aria-label": "Close",
+          buttonStyle: "ghost",
+          disabled: isConfirming,
+          icon: _jsx(XIcon, {}),
+          margin: false,
+          onClick: () => {
+            if (onClose) {
+              onClose({
+                modalSlug: slug
+              });
+            } else {
+              closeModal(slug);
+            }
+          }
+        }) : null]
+      })]
     });
-    $[2] = children;
-    $[3] = closeModal;
-    $[4] = isConfirming;
-    $[5] = showClose;
-    $[6] = slug;
-    $[7] = t3;
-    $[8] = title;
-    $[9] = t4;
+    $[3] = children;
+    $[4] = closeModal;
+    $[5] = isConfirming;
+    $[6] = onClose;
+    $[7] = showClose;
+    $[8] = slug;
+    $[9] = t3;
+    $[10] = title;
+    $[11] = t4;
   } else {
-    t4 = $[9];
+    t4 = $[11];
   }
   return t4;
 };

package/dist/elements/Dialog/DialogHeader/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","XIcon","Button","useModal","useDialogContext","baseClass","DialogHeader","t0","$","children","showClose","title","slug","isConfirming","closeModal","t1","t2","filter","Boolean","t3","join","t4","_jsxs","className","_jsx","buttonStyle","disabled","icon","margin","onClick"],"sources":["../../../../src/elements/Dialog/DialogHeader/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { XIcon } from '../../../icons/X/index.js'\nimport { Button } from '../../Button/index.js'\nimport { useModal } from '../../Modal/index.js'\nimport { useDialogContext } from '../context.js'\n\nconst baseClass = 'dialog'\n\nexport type DialogHeaderProps = {\n  readonly children?: React.ReactNode\n  readonly showClose?: boolean\n  readonly title?: React.ReactNode\n}\n\nexport const DialogHeader: React.FC<DialogHeaderProps> = ({ children, showClose, title }) => {\n  const { slug, isConfirming } = useDialogContext()\n  const { closeModal } = useModal()\n\n  if (!title && !children && !showClose) {\n    return null\n  }\n\n  return (\n    <div\n      className={[`${baseClass}__header`, showClose && `${baseClass}__header--has-close`]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      {title ? <h4 className={`${baseClass}__title`}>{title}</h4> : null}\n      {children ? <div className={`${baseClass}__header-extras`}>{children}</div> : null}\n      {showClose ? (\n        <Button\n          aria-label=\"Close\"\n          buttonStyle=\"ghost\"\n          disabled={isConfirming}\n          icon={<XIcon />}\n          margin={false}\n          onClick={() => closeModal(slug)}\n        />\n      ) : null}\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,MAAW;AAElB,SAASC,KAAK,QAAQ;AACtB,SAASC,MAAM,QAAQ;AACvB,SAASC,QAAQ,QAAQ;AACzB,SAASC,gBAAgB,QAAQ;AAEjC,MAAMC,SAAA,GAAY;AAQlB,OAAO,MAAMC,YAAA,GAA4CC,EAAA;EAAA,MAAAC,CAAA,GAAAT,EAAA;EAAC;IAAAU,QAAA;IAAAC,SAAA;IAAAC;EAAA,IAAAJ,EAA8B;EACtF;IAAAK,IAAA;IAAAC;EAAA,IAA+BT,gBAAA;EAC/B;IAAAU;EAAA,IAAuBX,QAAA;EAAA,IAEnB,CAACQ,KAAA,KAAUF,QAAA,KAAaC,SAAA;IAAA;EAAA;EAMY,MAAAK,EAAA,GAAAL,SAAA,IAAa,GAAAL,SAAA,qBAAiC;EAAA,IAAAW,EAAA;EAAA,IAAAR,CAAA,QAAAO,EAAA;IAAvEC,EAAA,IAAC,GAAAX,SAAA,UAAsB,EAAEU,EAA8C,EAAAE,MAAA,CAAAC,OACxE;IAAAV,CAAA,MAAAO,EAAA;IAAAP,CAAA,MAAAQ,EAAA;EAAA;IAAAA,EAAA,GAAAR,CAAA;EAAA;EADC,MAAAW,EAAA,GAAAH,EACD,CAAAI,IAAA,CACF;EAAA,IAAAC,EAAA;EAAA,IAAAb,CAAA,QAAAC,QAAA,IAAAD,CAAA,QAAAM,UAAA,IAAAN,CAAA,QAAAK,YAAA,IAAAL,CAAA,QAAAE,SAAA,IAAAF,CAAA,QAAAI,IAAA,IAAAJ,CAAA,QAAAW,EAAA,IAAAX,CAAA,QAAAG,KAAA;IAHVU,EAAA,GAAAC,KAAA,CAAC;MAAAC,SAAA,EACYJ,EAEH;MAAAV,QAAA,GAEPE,KAAA,GAAQa,IAAA,CAAC;QAAAD,SAAA,EAAc,GAAAlB,SAAA,SAAqB;QAAAI,QAAA,EAAGE;MAAA,C,QAAc,EAC7DF,QAAA,GAAWe,IAAA,CAAC;QAAAD,SAAA,EAAe,GAAAlB,SAAA,iBAA6B;QAAAI;MAAA,C,QAAqB,EAC7EC,SAAA,GACCc,IAAA,CAAAtB,MAAA;QAAA,cACa;QAAAuB,WAAA,EACC;QAAAC,QAAA,EACFb,YAAA;QAAAc,IAAA,EACJH,IAAA,CAAAvB,KAAA,IAAC;QAAA2B,MAAA;QAAAC,OAAA,EAAAA,CAAA,KAEQf,UAAA,CAAWF,IAAA;MAAA,C,QAE1B;IAAA,C;;;;;;;;;;;;SAhBNS,E;CAmBJ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","XIcon","Button","useModal","useDialogContext","DialogTitle","baseClass","DialogHeader","t0","$","children","className","onClose","showClose","title","slug","isConfirming","closeModal","t1","t2","filter","Boolean","t3","join","t4","_jsxs","_jsx","buttonStyle","disabled","icon","margin","onClick","modalSlug"],"sources":["../../../../src/elements/Dialog/DialogHeader/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { XIcon } from '../../../icons/X/index.js'\nimport { Button } from '../../Button/index.js'\nimport { useModal } from '../../Modal/index.js'\nimport { useDialogContext } from '../context.js'\nimport { DialogTitle } from '../DialogTitle/index.js'\n\nconst baseClass = 'dialog'\n\nexport type DialogHeaderProps = {\n  readonly children?: React.ReactNode\n  readonly className?: string\n  readonly onClose?: ({ modalSlug }: { modalSlug: string }) => void\n  readonly showClose?: boolean\n  readonly title?: React.ReactNode\n}\n\nexport const DialogHeader: React.FC<DialogHeaderProps> = ({\n  children,\n  className,\n  onClose,\n  showClose,\n  title,\n}) => {\n  const { slug, isConfirming } = useDialogContext()\n  const { closeModal } = useModal()\n\n  if (!title && !children && !showClose) {\n    return null\n  }\n\n  return (\n    <div\n      className={[`${baseClass}__header`, showClose && `${baseClass}__header--has-close`, className]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      {title ? typeof title === 'string' ? <DialogTitle title={title} /> : title : null}\n      <div className={`${baseClass}__header-end`}>\n        {children ? <div className={`${baseClass}__header-extras`}>{children}</div> : null}\n        {showClose ? (\n          <Button\n            aria-label=\"Close\"\n            buttonStyle=\"ghost\"\n            disabled={isConfirming}\n            icon={<XIcon />}\n            margin={false}\n            onClick={() => {\n              if (onClose) {\n                onClose({ modalSlug: slug })\n              } else {\n                closeModal(slug)\n              }\n            }}\n          />\n        ) : null}\n      </div>\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AACA,OAAOC,KAAA,MAAW;AAElB,SAASC,KAAK,QAAQ;AACtB,SAASC,MAAM,QAAQ;AACvB,SAASC,QAAQ,QAAQ;AACzB,SAASC,gBAAgB,QAAQ;AACjC,SAASC,WAAW,QAAQ;AAE5B,MAAMC,SAAA,GAAY;AAUlB,OAAO,MAAMC,YAAA,GAA4CC,EAAA;EAAA,MAAAC,CAAA,GAAAV,EAAA;EAAC;IAAAW,QAAA;IAAAC,SAAA;IAAAC,OAAA;IAAAC,SAAA;IAAAC;EAAA,IAAAN,EAMzD;EACC;IAAAO,IAAA;IAAAC;EAAA,IAA+BZ,gBAAA;EAC/B;IAAAa;EAAA,IAAuBd,QAAA;EAAA,IAEnB,CAACW,KAAA,KAAUJ,QAAA,KAAaG,SAAA;IAAA;EAAA;EAMY,MAAAK,EAAA,GAAAL,SAAA,IAAa,GAAAP,SAAA,qBAAiC;EAAA,IAAAa,EAAA;EAAA,IAAAV,CAAA,QAAAE,SAAA,IAAAF,CAAA,QAAAS,EAAA;IAAvEC,EAAA,IAAC,GAAAb,SAAA,UAAsB,EAAEY,EAA8C,EAAEP,SAAA,EAAAS,MAAA,CAAAC,OAC1E;IAAAZ,CAAA,MAAAE,SAAA;IAAAF,CAAA,MAAAS,EAAA;IAAAT,CAAA,MAAAU,EAAA;EAAA;IAAAA,EAAA,GAAAV,CAAA;EAAA;EADC,MAAAa,EAAA,GAAAH,EACD,CAAAI,IAAA,CACF;EAAA,IAAAC,EAAA;EAAA,IAAAf,CAAA,QAAAC,QAAA,IAAAD,CAAA,QAAAQ,UAAA,IAAAR,CAAA,QAAAO,YAAA,IAAAP,CAAA,QAAAG,OAAA,IAAAH,CAAA,QAAAI,SAAA,IAAAJ,CAAA,QAAAM,IAAA,IAAAN,CAAA,QAAAa,EAAA,IAAAb,CAAA,SAAAK,KAAA;IAHVU,EAAA,GAAAC,KAAA,CAAC;MAAAd,SAAA,EACYW,EAEH;MAAAZ,QAAA,GAEPI,KAAA,GAAQ,OAAOA,KAAA,KAAU,WAAWY,IAAA,CAAArB,WAAA;QAAAS;MAAA,C,IAAgCA,KAAA,OAAQ,EAC7EW,KAAA,CAAC;QAAAd,SAAA,EAAe,GAAAL,SAAA,cAA0B;QAAAI,QAAA,GACvCA,QAAA,GAAWgB,IAAA,CAAC;UAAAf,SAAA,EAAe,GAAAL,SAAA,iBAA6B;UAAAI;QAAA,C,QAAqB,EAC7EG,SAAA,GACCa,IAAA,CAAAxB,MAAA;UAAA,cACa;UAAAyB,WAAA,EACC;UAAAC,QAAA,EACFZ,YAAA;UAAAa,IAAA,EACJH,IAAA,CAAAzB,KAAA,IAAC;UAAA6B,MAAA;UAAAC,OAAA,EAAAA,CAAA;YAAA,IAGDnB,OAAA;cACFA,OAAA;gBAAAoB,SAAA,EAAqBjB;cAAA,CAAK;YAAA;cAE1BE,UAAA,CAAWF,IAAA;YAAA;UAAA;QAAA,C,QAIf;MAAA,C;;;;;;;;;;;;;;SAvBRS,E;CA2BJ","ignoreList":[]}

package/dist/elements/Dialog/DialogModal/index.d.ts

@@ -14,5 +14,10 @@ export type DialogModalProps = {
     readonly slug: string;
 };
 export declare const DialogModal: React.FC<DialogModalProps>;
+export declare const DialogDepthContext: React.Context<number>;
+export declare const useDialogDepth: () => number;
+export declare const DialogDepthProvider: React.FC<{
+    children: React.ReactNode;
+}>;
 export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/elements/Dialog/DialogModal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Dialog/DialogModal/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAA;AAC1C,OAAO,KAA8B,MAAM,OAAO,CAAA;AAIlD,OAAO,cAAc,CAAA;AAErB,KAAK,gBAAgB,GAAG,cAAc,CAAC,OAAO,KAAK,CAAC,CAAC,kBAAkB,CAAC,CAAA;AAIxE,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;AAErD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACnC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAA;IAC9B,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAA;IAC7B,QAAQ,CAAC,gBAAgB,CAAC,EAAE,gBAAgB,CAAA;IAC5C,QAAQ,CAAC,IAAI,CAAC,EAAE,UAAU,CAAA;IAC1B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA8ClD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Dialog/DialogModal/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,OAAO,EAAE,KAAK,EAAE,MAAM,oBAAoB,CAAA;AAC1C,OAAO,KAAkD,MAAM,OAAO,CAAA;AAItE,OAAO,cAAc,CAAA;AAErB,KAAK,gBAAgB,GAAG,cAAc,CAAC,OAAO,KAAK,CAAC,CAAC,kBAAkB,CAAC,CAAA;AAIxE,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;AAErD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,QAAQ,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACnC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;IAC3B,QAAQ,CAAC,WAAW,CAAC,EAAE,OAAO,CAAA;IAC9B,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAA;IAC7B,QAAQ,CAAC,gBAAgB,CAAC,EAAE,gBAAgB,CAAA;IAC5C,QAAQ,CAAC,IAAI,CAAC,EAAE,UAAU,CAAA;IAC1B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAiDlD,CAAA;AAED,eAAO,MAAM,kBAAkB,uBAAmB,CAAA;AAElD,eAAO,MAAM,cAAc,QAAO,MAAiC,CAAA;AAEnE,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,CAKvE,CAAA"}

package/dist/elements/Dialog/DialogModal/index.js

@@ -3,13 +3,13 @@
 import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Modal } from '@faceless-ui/modal';
-import React, { useEffect, useState } from 'react';
+import React, { createContext, use, useEffect, useState } from 'react';
 import { drawerZBase, useDrawerDepth } from '../../Drawer/index.js';
 import { DialogContext } from '../context.js';
 import '../index.css';
 const baseClass = 'dialog';
 export const DialogModal = t0 => {
-  const $ = _c(15);
+  const $ = _c(16);
   const {
     slug,
     children,
@@ -24,6 +24,7 @@ export const DialogModal = t0 => {
   const size = t3 === undefined ? "small" : t3;
   const [isConfirming, setConfirming] = useState(false);
   const drawerDepth = useDrawerDepth();
+  const dialogDepth = useDialogDepth();
   let t4;
   let t5;
   if ($[0] !== closeOnEsc) {
@@ -45,51 +46,77 @@ export const DialogModal = t0 => {
   }
   useEffect(t4, t5);
   let t6;
-  if ($[3] !== children || $[4] !== className || $[5] !== closeOnBlur || $[6] !== drawerDepth || $[7] !== focusTrapOptions || $[8] !== isConfirming || $[9] !== size || $[10] !== slug) {
+  if ($[3] !== children || $[4] !== className || $[5] !== closeOnBlur || $[6] !== dialogDepth || $[7] !== drawerDepth || $[8] !== focusTrapOptions || $[9] !== isConfirming || $[10] !== size || $[11] !== slug) {
     const t7 = `${baseClass}--${size}`;
     let t8;
-    if ($[12] !== className || $[13] !== t7) {
+    if ($[13] !== className || $[14] !== t7) {
       t8 = [baseClass, t7, className].filter(Boolean);
-      $[12] = className;
-      $[13] = t7;
-      $[14] = t8;
+      $[13] = className;
+      $[14] = t7;
+      $[15] = t8;
     } else {
-      t8 = $[14];
+      t8 = $[15];
     }
-    t6 = _jsx(DialogContext, {
-      value: {
-        slug,
-        isConfirming,
-        setConfirming
-      },
-      children: _jsx(Modal, {
-        closeOnBlur,
-        focusTrapOptions,
-        slug,
-        style: {
-          zIndex: drawerZBase + drawerDepth + 1
+    t6 = _jsx(DialogDepthProvider, {
+      children: _jsx(DialogContext, {
+        value: {
+          slug,
+          isConfirming,
+          setConfirming
         },
-        children: _jsx("div", {
-          className: t8.join(" "),
-          role: "document",
-          children
+        children: _jsx(Modal, {
+          closeOnBlur,
+          focusTrapOptions,
+          slug,
+          style: {
+            zIndex: drawerZBase + drawerDepth + dialogDepth + 1
+          },
+          children: _jsx("div", {
+            className: t8.join(" "),
+            role: "document",
+            children
+          })
         })
       })
     });
     $[3] = children;
     $[4] = className;
     $[5] = closeOnBlur;
-    $[6] = drawerDepth;
-    $[7] = focusTrapOptions;
-    $[8] = isConfirming;
-    $[9] = size;
-    $[10] = slug;
-    $[11] = t6;
+    $[6] = dialogDepth;
+    $[7] = drawerDepth;
+    $[8] = focusTrapOptions;
+    $[9] = isConfirming;
+    $[10] = size;
+    $[11] = slug;
+    $[12] = t6;
   } else {
-    t6 = $[11];
+    t6 = $[12];
   }
   return t6;
 };
+export const DialogDepthContext = /*#__PURE__*/createContext(0);
+export const useDialogDepth = () => use(DialogDepthContext);
+export const DialogDepthProvider = t0 => {
+  const $ = _c(3);
+  const {
+    children
+  } = t0;
+  const parentDepth = useDialogDepth();
+  const depth = parentDepth + 1;
+  let t1;
+  if ($[0] !== children || $[1] !== depth) {
+    t1 = _jsx(DialogDepthContext, {
+      value: depth,
+      children
+    });
+    $[0] = children;
+    $[1] = depth;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  return t1;
+};
 function _temp(e) {
   if (e.key === "Escape") {
     e.stopImmediatePropagation();

package/dist/elements/Dialog/DialogModal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","Modal","React","useEffect","useState","drawerZBase","useDrawerDepth","DialogContext","baseClass","DialogModal","t0","$","slug","children","className","closeOnBlur","t1","closeOnEsc","t2","focusTrapOptions","size","t3","undefined","isConfirming","setConfirming","drawerDepth","t4","t5","handler","_temp","document","addEventListener","removeEventListener","t6","t7","t8","filter","Boolean","_jsx","value","style","zIndex","join","role","e","key","stopImmediatePropagation","preventDefault"],"sources":["../../../../src/elements/Dialog/DialogModal/index.tsx"],"sourcesContent":["'use client'\nimport type { ComponentProps } from 'react'\n\nimport { Modal } from '@faceless-ui/modal'\nimport React, { useEffect, useState } from 'react'\n\nimport { drawerZBase, useDrawerDepth } from '../../Drawer/index.js'\nimport { DialogContext } from '../context.js'\nimport '../index.css'\n\ntype FocusTrapOptions = ComponentProps<typeof Modal>['focusTrapOptions']\n\nconst baseClass = 'dialog'\n\nexport type DialogSize = 'large' | 'medium' | 'small'\n\nexport type DialogModalProps = {\n  readonly children?: React.ReactNode\n  readonly className?: string\n  readonly closeOnBlur?: boolean\n  readonly closeOnEsc?: boolean\n  readonly focusTrapOptions?: FocusTrapOptions\n  readonly size?: DialogSize\n  readonly slug: string\n}\n\nexport const DialogModal: React.FC<DialogModalProps> = ({\n  slug,\n  children,\n  className,\n  closeOnBlur = false,\n  closeOnEsc = true,\n  focusTrapOptions,\n  size = 'small',\n}) => {\n  const [isConfirming, setConfirming] = useState(false)\n  const drawerDepth = useDrawerDepth()\n\n  useEffect(() => {\n    if (closeOnEsc) {\n      return\n    }\n\n    const handler = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        e.stopImmediatePropagation()\n        e.preventDefault()\n      }\n    }\n\n    // Capture phase fires before ModalProvider's bubble-phase listener\n    document.addEventListener('keydown', handler, true)\n    return () => document.removeEventListener('keydown', handler, true)\n  }, [closeOnEsc])\n\n  return (\n    <DialogContext value={{ slug, isConfirming, setConfirming }}>\n      <Modal\n        closeOnBlur={closeOnBlur}\n        focusTrapOptions={focusTrapOptions}\n        slug={slug}\n        style={{ zIndex: drawerZBase + drawerDepth + 1 }}\n      >\n        <div\n          className={[baseClass, `${baseClass}--${size}`, className].filter(Boolean).join(' ')}\n          role=\"document\"\n        >\n          {children}\n        </div>\n      </Modal>\n    </DialogContext>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,SAASC,KAAK,QAAQ;AACtB,OAAOC,KAAA,IAASC,SAAS,EAAEC,QAAQ,QAAQ;AAE3C,SAASC,WAAW,EAAEC,cAAc,QAAQ;AAC5C,SAASC,aAAa,QAAQ;AAC9B,OAAO;AAIP,MAAMC,SAAA,GAAY;AAclB,OAAO,MAAMC,WAAA,GAA0CC,EAAA;EAAA,MAAAC,CAAA,GAAAX,EAAA;EAAC;IAAAY,IAAA;IAAAC,QAAA;IAAAC,SAAA;IAAAC,WAAA,EAAAC,EAAA;IAAAC,UAAA,EAAAC,EAAA;IAAAC,gBAAA;IAAAC,IAAA,EAAAC;EAAA,IAAAX,EAQvD;EAJC,MAAAK,WAAA,GAAAC,EAAmB,KAAAM,SAAA,WAAnBN,EAAmB;EACnB,MAAAC,UAAA,GAAAC,EAAiB,KAAAI,SAAA,UAAjBJ,EAAiB;EAEjB,MAAAE,IAAA,GAAAC,EAAc,KAAAC,SAAA,GAAP,OAAO,GAAdD,EAAc;EAEd,OAAAE,YAAA,EAAAC,aAAA,IAAsCpB,QAAA,MAAS;EAC/C,MAAAqB,WAAA,GAAoBnB,cAAA;EAAA,IAAAoB,EAAA;EAAA,IAAAC,EAAA;EAAA,IAAAhB,CAAA,QAAAM,UAAA;IAEVS,EAAA,GAAAA,CAAA;MAAA,IACJT,UAAA;QAAA;MAAA;MAIJ,MAAAW,OAAA,GAAAC,KAAA;MAQAC,QAAA,CAAAC,gBAAA,CAA0B,WAAWH,OAAA,MAAS;MAAA,aACjCE,QAAA,CAAAE,mBAAA,CAA6B,WAAWJ,OAAA,MAAS;IAAA;IAC7DD,EAAA,IAACV,UAAA;IAAWN,CAAA,MAAAM,UAAA;IAAAN,CAAA,MAAAe,EAAA;IAAAf,CAAA,MAAAgB,EAAA;EAAA;IAAAD,EAAA,GAAAf,CAAA;IAAAgB,EAAA,GAAAhB,CAAA;EAAA;EAffR,SAAA,CAAUuB,EAeV,EAAGC,EAAY;EAAA,IAAAM,EAAA;EAAA,IAAAtB,CAAA,QAAAE,QAAA,IAAAF,CAAA,QAAAG,SAAA,IAAAH,CAAA,QAAAI,WAAA,IAAAJ,CAAA,QAAAc,WAAA,IAAAd,CAAA,QAAAQ,gBAAA,IAAAR,CAAA,QAAAY,YAAA,IAAAZ,CAAA,QAAAS,IAAA,IAAAT,CAAA,SAAAC,IAAA;IAWgB,MAAAsB,EAAA,MAAA1B,SAAA,KAAiBY,IAAA,EAAM;IAAA,IAAAe,EAAA;IAAA,IAAAxB,CAAA,SAAAG,SAAA,IAAAH,CAAA,SAAAuB,EAAA;MAAnCC,EAAA,IAAA3B,SAAA,EAAY0B,EAAuB,EAAEpB,SAAA,EAAAsB,MAAA,CAAAC,OAAkB;MAAA1B,CAAA,OAAAG,SAAA;MAAAH,CAAA,OAAAuB,EAAA;MAAAvB,CAAA,OAAAwB,EAAA;IAAA;MAAAA,EAAA,GAAAxB,CAAA;IAAA;IARxEsB,EAAA,GAAAK,IAAA,CAAA/B,aAAA;MAAAgC,KAAA;QAAA3B,IAAA;QAAAW,YAAA;QAAAC;MAAA;MAAAX,QAAA,EACEyB,IAAA,CAAArC,KAAA;QAAAc,WAAA;QAAAI,gBAAA;QAAAP,IAAA;QAAA4B,KAAA;UAAAC,MAAA,EAImBpC,WAAA,GAAcoB,WAAA;QAAc;QAAAZ,QAAA,EAE7CyB,IAAA,CAAC;UAAAxB,SAAA,EACYqB,EAAuD,CAAAO,IAAA,CAAc;UAAAC,IAAA,EAC3E;UAAA9B;QAAA,C;;;;;;;;;;;;;;;SATXoB,E;CAgBJ;AA9CuD,SAAAJ,MAAAe,CAAA;EAAA,IAkB7CA,CAAA,CAAAC,GAAA,KAAU;IACZD,CAAA,CAAAE,wBAAA,CAA0B;IAC1BF,CAAA,CAAAG,cAAA,CAAgB;EAAA;AAAA","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","Modal","React","createContext","use","useEffect","useState","drawerZBase","useDrawerDepth","DialogContext","baseClass","DialogModal","t0","$","slug","children","className","closeOnBlur","t1","closeOnEsc","t2","focusTrapOptions","size","t3","undefined","isConfirming","setConfirming","drawerDepth","dialogDepth","useDialogDepth","t4","t5","handler","_temp","document","addEventListener","removeEventListener","t6","t7","t8","filter","Boolean","_jsx","DialogDepthProvider","value","style","zIndex","join","role","DialogDepthContext","parentDepth","depth","e","key","stopImmediatePropagation","preventDefault"],"sources":["../../../../src/elements/Dialog/DialogModal/index.tsx"],"sourcesContent":["'use client'\nimport type { ComponentProps } from 'react'\n\nimport { Modal } from '@faceless-ui/modal'\nimport React, { createContext, use, useEffect, useState } from 'react'\n\nimport { drawerZBase, useDrawerDepth } from '../../Drawer/index.js'\nimport { DialogContext } from '../context.js'\nimport '../index.css'\n\ntype FocusTrapOptions = ComponentProps<typeof Modal>['focusTrapOptions']\n\nconst baseClass = 'dialog'\n\nexport type DialogSize = 'large' | 'medium' | 'small'\n\nexport type DialogModalProps = {\n  readonly children?: React.ReactNode\n  readonly className?: string\n  readonly closeOnBlur?: boolean\n  readonly closeOnEsc?: boolean\n  readonly focusTrapOptions?: FocusTrapOptions\n  readonly size?: DialogSize\n  readonly slug: string\n}\n\nexport const DialogModal: React.FC<DialogModalProps> = ({\n  slug,\n  children,\n  className,\n  closeOnBlur = false,\n  closeOnEsc = true,\n  focusTrapOptions,\n  size = 'small',\n}) => {\n  const [isConfirming, setConfirming] = useState(false)\n  const drawerDepth = useDrawerDepth()\n  const dialogDepth = useDialogDepth()\n\n  useEffect(() => {\n    if (closeOnEsc) {\n      return\n    }\n\n    const handler = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        e.stopImmediatePropagation()\n        e.preventDefault()\n      }\n    }\n\n    // Capture phase fires before ModalProvider's bubble-phase listener\n    document.addEventListener('keydown', handler, true)\n    return () => document.removeEventListener('keydown', handler, true)\n  }, [closeOnEsc])\n\n  return (\n    <DialogDepthProvider>\n      <DialogContext value={{ slug, isConfirming, setConfirming }}>\n        <Modal\n          closeOnBlur={closeOnBlur}\n          focusTrapOptions={focusTrapOptions}\n          slug={slug}\n          style={{ zIndex: drawerZBase + drawerDepth + dialogDepth + 1 }}\n        >\n          <div\n            className={[baseClass, `${baseClass}--${size}`, className].filter(Boolean).join(' ')}\n            role=\"document\"\n          >\n            {children}\n          </div>\n        </Modal>\n      </DialogContext>\n    </DialogDepthProvider>\n  )\n}\n\nexport const DialogDepthContext = createContext(0)\n\nexport const useDialogDepth = (): number => use(DialogDepthContext)\n\nexport const DialogDepthProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {\n  const parentDepth = useDialogDepth()\n  const depth = parentDepth + 1\n\n  return <DialogDepthContext value={depth}>{children}</DialogDepthContext>\n}\n"],"mappings":"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","ignoreList":[]}