@payloadcms/ui 3.68.0-internal-debug.e9b66ee → 3.68.0-internal.35482da

package/dist/elements/DatePicker/DatePicker.js

@@ -1,4 +1,7 @@
 'use client';
+
+import { c as _c } from "react/compiler-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import ReactDatePickerDefaultImport, { registerLocale, setDefaultLocale } from 'react-datepicker';
 const ReactDatePicker = 'default' in ReactDatePickerDefaultImport ? ReactDatePickerDefaultImport.default : ReactDatePickerDefaultImport;
@@ -9,96 +12,144 @@ import './library.scss';
 import './index.scss';
 import { getFormattedLocale } from './getFormattedLocale.js';
 const baseClass = 'date-time-picker';
-const DatePicker = (props)=>{
-    const { id, displayFormat: customDisplayFormat, maxDate, maxTime, minDate, minTime, monthsToShow = 1, onChange: onChangeFromProps, overrides, pickerAppearance = 'default', placeholder: placeholderText, readOnly, timeFormat = 'h:mm aa', timeIntervals = 30, value } = props;
-    // Use the user's AdminUI language preference for the locale
-    const { i18n } = useTranslation();
-    let dateFormat = customDisplayFormat;
-    if (!customDisplayFormat) {
-        // when no displayFormat is provided, determine format based on the picker appearance
-        if (pickerAppearance === 'default') {
-            dateFormat = 'MM/dd/yyyy';
-        } else if (pickerAppearance === 'dayAndTime') {
-            dateFormat = 'MMM d, yyy h:mm a';
-        } else if (pickerAppearance === 'timeOnly') {
-            dateFormat = 'h:mm a';
-        } else if (pickerAppearance === 'dayOnly') {
-            dateFormat = 'MMM dd';
-        } else if (pickerAppearance === 'monthOnly') {
-            dateFormat = 'MMMM';
+const DatePicker = props => {
+  const $ = _c(6);
+  const {
+    id,
+    displayFormat: customDisplayFormat,
+    maxDate,
+    maxTime,
+    minDate,
+    minTime,
+    monthsToShow: t0,
+    onChange: onChangeFromProps,
+    overrides,
+    pickerAppearance: t1,
+    placeholder: placeholderText,
+    readOnly,
+    timeFormat: t2,
+    timeIntervals: t3,
+    value
+  } = props;
+  const monthsToShow = t0 === undefined ? 1 : t0;
+  const pickerAppearance = t1 === undefined ? "default" : t1;
+  const timeFormat = t2 === undefined ? "h:mm aa" : t2;
+  const timeIntervals = t3 === undefined ? 30 : t3;
+  const {
+    i18n
+  } = useTranslation();
+  let dateFormat = customDisplayFormat;
+  if (!customDisplayFormat) {
+    if (pickerAppearance === "default") {
+      dateFormat = "MM/dd/yyyy";
+    } else {
+      if (pickerAppearance === "dayAndTime") {
+        dateFormat = "MMM d, yyy h:mm a";
+      } else {
+        if (pickerAppearance === "timeOnly") {
+          dateFormat = "h:mm a";
+        } else {
+          if (pickerAppearance === "dayOnly") {
+            dateFormat = "MMM dd";
+          } else {
+            if (pickerAppearance === "monthOnly") {
+              dateFormat = "MMMM";
+            }
+          }
         }
+      }
     }
-    const onChange = (incomingDate)=>{
-        const newDate = incomingDate;
-        if (newDate instanceof Date && [
-            'dayOnly',
-            'default',
-            'monthOnly'
-        ].includes(pickerAppearance)) {
-            const tzOffset = incomingDate.getTimezoneOffset() / 60;
-            newDate.setHours(12 - tzOffset, 0);
-        }
-        if (newDate instanceof Date && !dateFormat.includes('SSS')) {
-            // Unless the dateFormat includes milliseconds, set milliseconds to 0
-            // This is to ensure that the timestamp is consistent with the displayFormat
-            newDate.setMilliseconds(0);
-        }
-        if (typeof onChangeFromProps === 'function') {
-            onChangeFromProps(newDate);
+  }
+  const onChange = incomingDate => {
+    const newDate = incomingDate;
+    if (newDate instanceof Date && ["dayOnly", "default", "monthOnly"].includes(pickerAppearance)) {
+      const tzOffset = incomingDate.getTimezoneOffset() / 60;
+      newDate.setHours(12 - tzOffset, 0);
+    }
+    if (newDate instanceof Date && !dateFormat.includes("SSS")) {
+      newDate.setMilliseconds(0);
+    }
+    if (typeof onChangeFromProps === "function") {
+      onChangeFromProps(newDate);
+    }
+  };
+  const dateTimePickerProps = {
+    customInputRef: "ref",
+    dateFormat,
+    disabled: readOnly,
+    maxDate,
+    maxTime,
+    minDate,
+    minTime,
+    monthsShown: Math.min(2, monthsToShow),
+    onChange,
+    placeholderText,
+    popperPlacement: "bottom-start",
+    selected: value && new Date(value),
+    showMonthYearPicker: pickerAppearance === "monthOnly",
+    showPopperArrow: false,
+    showTimeSelect: pickerAppearance === "dayAndTime" || pickerAppearance === "timeOnly",
+    timeFormat,
+    timeIntervals,
+    ...overrides
+  };
+  const t4 = `${baseClass}__appearance--${pickerAppearance}`;
+  let t5;
+  if ($[0] !== t4) {
+    t5 = [baseClass, t4].filter(Boolean);
+    $[0] = t4;
+    $[1] = t5;
+  } else {
+    t5 = $[1];
+  }
+  const classes = t5.join(" ");
+  let t6;
+  let t7;
+  if ($[2] !== i18n.dateFNS || $[3] !== i18n.language) {
+    t6 = () => {
+      if (i18n.dateFNS) {
+        ;
+        try {
+          const datepickerLocale = getFormattedLocale(i18n.language);
+          registerLocale(datepickerLocale, i18n.dateFNS);
+          setDefaultLocale(datepickerLocale);
+        } catch (t8) {
+          console.warn(`Could not find DatePicker locale for ${i18n.language}`);
         }
+      }
     };
-    const dateTimePickerProps = {
-        customInputRef: 'ref',
-        dateFormat,
-        disabled: readOnly,
-        maxDate,
-        maxTime,
-        minDate,
-        minTime,
-        monthsShown: Math.min(2, monthsToShow),
-        onChange,
-        placeholderText,
-        popperPlacement: 'bottom-start',
-        selected: value && new Date(value),
-        showMonthYearPicker: pickerAppearance === 'monthOnly',
-        showPopperArrow: false,
-        showTimeSelect: pickerAppearance === 'dayAndTime' || pickerAppearance === 'timeOnly',
-        timeFormat,
-        timeIntervals,
-        ...overrides
-    };
-    // 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
-    const classes = [
-        baseClass,
-        `${baseClass}__appearance--${pickerAppearance}`
-    ].filter(Boolean).join(' ');
-    React.useEffect(()=>{
-        if (i18n.dateFNS) {
-            try {
-                const datepickerLocale = getFormattedLocale(i18n.language);
-                registerLocale(datepickerLocale, i18n.dateFNS);
-                setDefaultLocale(datepickerLocale);
-            } catch (e) {
-                console.warn(`Could not find DatePicker locale for ${i18n.language}`);
-            }
-        }
-    }, [
-        i18n.language,
-        i18n.dateFNS
-    ]);
-    return <div className={classes} id={id}>
-      <div className={`${baseClass}__icon-wrap`}>
-        {dateTimePickerProps.selected && <button className={`${baseClass}__clear-button`} onClick={()=>onChange(null)} type="button">
-            <XIcon/>
-          </button>}
-        <CalendarIcon/>
-      </div>
-      <div className={`${baseClass}__input-wrapper`}>
-        <ReactDatePicker {...dateTimePickerProps} dropdownMode="select" showMonthDropdown showYearDropdown/>
-      </div>
-    </div>;
+    t7 = [i18n.language, i18n.dateFNS];
+    $[2] = i18n.dateFNS;
+    $[3] = i18n.language;
+    $[4] = t6;
+    $[5] = t7;
+  } else {
+    t6 = $[4];
+    t7 = $[5];
+  }
+  React.useEffect(t6, t7);
+  return _jsxs("div", {
+    className: classes,
+    id,
+    children: [_jsxs("div", {
+      className: `${baseClass}__icon-wrap`,
+      children: [dateTimePickerProps.selected && _jsx("button", {
+        className: `${baseClass}__clear-button`,
+        onClick: () => onChange(null),
+        type: "button",
+        children: _jsx(XIcon, {})
+      }), _jsx(CalendarIcon, {})]
+    }), _jsx("div", {
+      className: `${baseClass}__input-wrapper`,
+      children: _jsx(ReactDatePicker, {
+        ...dateTimePickerProps,
+        dropdownMode: "select",
+        showMonthDropdown: true,
+        showYearDropdown: true
+      })
+    })]
+  });
 };
 // eslint-disable-next-line no-restricted-exports
 export default DatePicker;
-
 //# sourceMappingURL=DatePicker.js.map

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

@@ -1 +1 @@
-{"version":3,"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 { XIcon } from '../../icons/X/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './library.scss'\nimport './index.scss'\nimport { getFormattedLocale } from './getFormattedLocale.js'\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    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 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 (e) {\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}__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          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","setDefaultLocale","ReactDatePicker","default","CalendarIcon","XIcon","useTranslation","getFormattedLocale","baseClass","DatePicker","props","id","displayFormat","customDisplayFormat","maxDate","maxTime","minDate","minTime","monthsToShow","onChange","onChangeFromProps","overrides","pickerAppearance","placeholder","placeholderText","readOnly","timeFormat","timeIntervals","value","i18n","dateFormat","incomingDate","newDate","Date","includes","tzOffset","getTimezoneOffset","setHours","setMilliseconds","dateTimePickerProps","customInputRef","disabled","monthsShown","Math","min","popperPlacement","selected","showMonthYearPicker","showPopperArrow","showTimeSelect","classes","filter","Boolean","join","useEffect","dateFNS","datepickerLocale","language","e","console","warn","div","className","button","onClick","type","dropdownMode","showMonthDropdown","showYearDropdown"],"mappings":"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"}
+{"version":3,"file":"DatePicker.js","names":["c","_c","React","ReactDatePickerDefaultImport","registerLocale","setDefaultLocale","ReactDatePicker","default","CalendarIcon","XIcon","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","popperPlacement","selected","showMonthYearPicker","showPopperArrow","showTimeSelect","t4","t5","filter","Boolean","classes","join","t6","t7","dateFNS","language","datepickerLocale","t8","console","warn","useEffect","_jsxs","className","children","_jsx","onClick","type","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 { XIcon } from '../../icons/X/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './library.scss'\nimport './index.scss'\nimport { getFormattedLocale } from './getFormattedLocale.js'\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    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 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 (e) {\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}__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          showMonthDropdown\n          showYearDropdown\n        />\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.js

@@ -1,14 +1,13 @@
 'use client';
-export const getFormattedLocale = (language = 'enUS')=>{
-    const formattedLocales = {
-        en: 'enUS',
-        my: 'enUS',
-        // Burmese is not currently supported
-        ua: 'uk',
-        zh: 'zhCN'
-    };
-    const formattedLocale = formattedLocales[language] || language;
-    return formattedLocale;
-};
 
+export const getFormattedLocale = (language = 'enUS') => {
+  const formattedLocales = {
+    en: 'enUS',
+    my: 'enUS',
+    ua: 'uk',
+    zh: 'zhCN'
+  };
+  const formattedLocale = formattedLocales[language] || language;
+  return formattedLocale;
+};
 //# sourceMappingURL=getFormattedLocale.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/DatePicker/getFormattedLocale.ts"],"sourcesContent":["'use client'\nexport const getFormattedLocale = (language = 'enUS') => {\n  const formattedLocales = {\n    en: 'enUS',\n    my: 'enUS', // Burmese is not currently supported\n    ua: 'uk',\n    zh: 'zhCN',\n  }\n\n  const formattedLocale = formattedLocales[language] || language\n\n  return formattedLocale\n}\n"],"names":["getFormattedLocale","language","formattedLocales","en","my","ua","zh","formattedLocale"],"mappings":"AAAA;AACA,OAAO,MAAMA,qBAAqB,CAACC,WAAW,MAAM;IAClD,MAAMC,mBAAmB;QACvBC,IAAI;QACJC,IAAI;QAAQ,qCAAqC;QACjDC,IAAI;QACJC,IAAI;IACN;IAEA,MAAMC,kBAAkBL,gBAAgB,CAACD,SAAS,IAAIA;IAEtD,OAAOM;AACT,EAAC"}
+{"version":3,"file":"getFormattedLocale.js","names":["getFormattedLocale","language","formattedLocales","en","my","ua","zh","formattedLocale"],"sources":["../../../src/elements/DatePicker/getFormattedLocale.ts"],"sourcesContent":["'use client'\nexport const getFormattedLocale = (language = 'enUS') => {\n  const formattedLocales = {\n    en: 'enUS',\n    my: 'enUS', // Burmese is not currently supported\n    ua: 'uk',\n    zh: 'zhCN',\n  }\n\n  const formattedLocale = formattedLocales[language] || language\n\n  return formattedLocale\n}\n"],"mappings":"AAAA;;AACA,OAAO,MAAMA,kBAAA,GAAqBA,CAACC,QAAA,GAAW,MAAM;EAClD,MAAMC,gBAAA,GAAmB;IACvBC,EAAA,EAAI;IACJC,EAAA,EAAI;IACJC,EAAA,EAAI;IACJC,EAAA,EAAI;EACN;EAEA,MAAMC,eAAA,GAAkBL,gBAAgB,CAACD,QAAA,CAAS,IAAIA,QAAA;EAEtD,OAAOM,eAAA;AACT","ignoreList":[]}

package/dist/elements/DatePicker/index.js

@@ -1,9 +1,15 @@
 'use client';
-import { lazy, Suspense } from 'react';
-import { ShimmerEffect } from '../ShimmerEffect/index.js';
-const DatePicker = lazy(()=>import('./DatePicker.js'));
-export const DatePickerField = (props)=><Suspense fallback={<ShimmerEffect height={50}/>}>
-    <DatePicker {...props}/>
-  </Suspense>;
 
+import { jsx as _jsx } from "react/jsx-runtime";
+import React, { lazy, Suspense } from 'react';
+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: 50
+  }),
+  children: /*#__PURE__*/_jsx(DatePicker, {
+    ...props
+  })
+});
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"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={50} />}>\n    <DatePicker {...props} />\n  </Suspense>\n)\n"],"names":["lazy","Suspense","ShimmerEffect","DatePicker","DatePickerField","props","fallback","height"],"mappings":"AAAA;AACA,SAAgBA,IAAI,EAAEC,QAAQ,QAAQ,QAAO;AAI7C,SAASC,aAAa,QAAQ,4BAA2B;AAEzD,MAAMC,aAAaH,KAAK,IAAM,MAAM,CAAC;AAErC,OAAO,MAAMI,kBAAmC,CAACC,SAC9CJ,SAASK,WAAWJ,cAAcK,QAAQ,OAAQ;IACjD,CAACJ,YAAY,GAAGE,KAAK,GAAI;EAC3B,EAAEJ,UACH"}
+{"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={50} />}>\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,EAAQ;;YACzC,aAAAF,IAAA,CAACH,UAAA;IAAY,GAAGE","ignoreList":[]}

package/dist/elements/DatePicker/types.js

@@ -1,3 +1,2 @@
-export { };
-
+export {};
 //# sourceMappingURL=types.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/DatePicker/types.ts"],"sourcesContent":["import type { DayPickerProps, SharedProps, TimePickerProps } from 'payload'\n\nexport type Props = {\n  id?: string\n  onChange?: (val: Date) => void\n  placeholder?: string\n  readOnly?: boolean\n  value?: Date | string\n} & DayPickerProps &\n  SharedProps &\n  TimePickerProps\n"],"names":[],"mappings":"AAEA,WAQiB"}
+{"version":3,"file":"types.js","names":[],"sources":["../../../src/elements/DatePicker/types.ts"],"sourcesContent":["import type { DayPickerProps, SharedProps, TimePickerProps } from 'payload'\n\nexport type Props = {\n  id?: string\n  onChange?: (val: Date) => void\n  placeholder?: string\n  readOnly?: boolean\n  value?: Date | string\n} & DayPickerProps &\n  SharedProps &\n  TimePickerProps\n"],"mappings":"AAEA","ignoreList":[]}

package/dist/elements/DefaultListViewTabs/index.js

@@ -1,72 +1,146 @@
 'use client';
+
+import { c as _c } from "react/compiler-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import { useRouter } from 'next/navigation.js';
 import { formatAdminURL } from 'payload/shared';
+import React from 'react';
 import { usePreferences } from '../../providers/Preferences/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
 import { Button } from '../Button/index.js';
 import './index.scss';
 const baseClass = 'default-list-view-tabs';
-export const DefaultListViewTabs = ({ collectionConfig, config, onChange, viewType })=>{
-    const { i18n, t } = useTranslation();
-    const { setPreference } = usePreferences();
-    const router = useRouter();
-    const isTrashEnabled = collectionConfig.trash;
-    const isFoldersEnabled = collectionConfig.folders && config.folders;
-    if (!isTrashEnabled && !isFoldersEnabled) {
-        return null;
-    }
-    const handleViewChange = async (newViewType)=>{
-        if (onChange) {
-            onChange(newViewType);
-        }
-        if (newViewType === 'list' || newViewType === 'folders') {
-            await setPreference(`collection-${collectionConfig.slug}`, {
-                listViewType: newViewType
-            });
-        }
-        let path = `/collections/${collectionConfig.slug}`;
-        switch(newViewType){
-            case 'folders':
-                if (config.folders) {
-                    path = `/collections/${collectionConfig.slug}/${config.folders.slug}`;
-                }
-                break;
-            case 'trash':
-                path = `/collections/${collectionConfig.slug}/trash`;
-                break;
-        }
-        const url = formatAdminURL({
-            adminRoute: config.routes.admin,
-            path,
-            serverURL: config.serverURL
+export const DefaultListViewTabs = t0 => {
+  const $ = _c(20);
+  const {
+    collectionConfig,
+    config,
+    onChange,
+    viewType
+  } = t0;
+  const {
+    i18n,
+    t
+  } = useTranslation();
+  const {
+    setPreference
+  } = usePreferences();
+  const router = useRouter();
+  const isTrashEnabled = collectionConfig.trash;
+  const isFoldersEnabled = collectionConfig.folders && config.folders;
+  if (!isTrashEnabled && !isFoldersEnabled) {
+    return null;
+  }
+  let t1;
+  if ($[0] !== collectionConfig.slug || $[1] !== config || $[2] !== onChange || $[3] !== router || $[4] !== setPreference) {
+    t1 = async newViewType => {
+      if (onChange) {
+        onChange(newViewType);
+      }
+      if (newViewType === "list" || newViewType === "folders") {
+        await setPreference(`collection-${collectionConfig.slug}`, {
+          listViewType: newViewType
         });
-        router.push(url);
+      }
+      let path = `/collections/${collectionConfig.slug}`;
+      bb21: switch (newViewType) {
+        case "folders":
+          {
+            if (config.folders) {
+              path = `/collections/${collectionConfig.slug}/${config.folders.slug}`;
+            }
+            break bb21;
+          }
+        case "trash":
+          {
+            path = `/collections/${collectionConfig.slug}/trash`;
+          }
+      }
+      const url = formatAdminURL({
+        adminRoute: config.routes.admin,
+        path,
+        serverURL: config.serverURL
+      });
+      router.push(url);
     };
-    const allButtonLabel = `${t('general:all')} ${getTranslation(collectionConfig?.labels?.plural, i18n)}`;
-    const allButtonId = allButtonLabel.toLowerCase().replace(/\s+/g, '-');
-    return <div className={baseClass}>
-      <Button buttonStyle="tab" className={[
-        `${baseClass}__button`,
-        viewType === 'list' && `${baseClass}__button--active`
-    ].filter(Boolean).join(' ')} disabled={viewType === 'list'} el="button" id={allButtonId} onClick={()=>handleViewChange('list')}>
-        {t('general:all')} {getTranslation(collectionConfig?.labels?.plural, i18n)}
-      </Button>
-
-      {isFoldersEnabled && <Button buttonStyle="tab" className={[
-        `${baseClass}__button`,
-        viewType === 'folders' && `${baseClass}__button--active`
-    ].filter(Boolean).join(' ')} disabled={viewType === 'folders'} el="button" onClick={()=>handleViewChange('folders')}>
-          {t('folder:byFolder')}
-        </Button>}
-
-      {isTrashEnabled && <Button buttonStyle="tab" className={[
-        `${baseClass}__button`,
-        viewType === 'trash' && `${baseClass}__button--active`
-    ].filter(Boolean).join(' ')} disabled={viewType === 'trash'} el="button" id="trash-view-pill" onClick={()=>handleViewChange('trash')}>
-          {t('general:trash')}
-        </Button>}
-    </div>;
+    $[0] = collectionConfig.slug;
+    $[1] = config;
+    $[2] = onChange;
+    $[3] = router;
+    $[4] = setPreference;
+    $[5] = t1;
+  } else {
+    t1 = $[5];
+  }
+  const handleViewChange = t1;
+  const allButtonLabel = `${t("general:all")} ${getTranslation(collectionConfig?.labels?.plural, i18n)}`;
+  let t2;
+  if ($[6] !== allButtonLabel || $[7] !== collectionConfig.labels?.plural || $[8] !== handleViewChange || $[9] !== i18n || $[10] !== isFoldersEnabled || $[11] !== isTrashEnabled || $[12] !== t || $[13] !== viewType) {
+    let t3;
+    if ($[15] === Symbol.for("react.memo_cache_sentinel")) {
+      t3 = /\s+/g;
+      $[15] = t3;
+    } else {
+      t3 = $[15];
+    }
+    const allButtonId = allButtonLabel.toLowerCase().replace(t3, "-");
+    const t4 = viewType === "list" && `${baseClass}__button--active`;
+    let t5;
+    if ($[16] !== t4) {
+      t5 = [`${baseClass}__button`, t4].filter(Boolean);
+      $[16] = t4;
+      $[17] = t5;
+    } else {
+      t5 = $[17];
+    }
+    let t6;
+    if ($[18] !== handleViewChange) {
+      t6 = () => handleViewChange("list");
+      $[18] = handleViewChange;
+      $[19] = t6;
+    } else {
+      t6 = $[19];
+    }
+    t2 = _jsxs("div", {
+      className: baseClass,
+      children: [_jsxs(Button, {
+        buttonStyle: "tab",
+        className: t5.join(" "),
+        disabled: viewType === "list",
+        el: "button",
+        id: allButtonId,
+        onClick: t6,
+        children: [t("general:all"), " ", getTranslation(collectionConfig?.labels?.plural, i18n)]
+      }), isFoldersEnabled && _jsx(Button, {
+        buttonStyle: "tab",
+        className: [`${baseClass}__button`, viewType === "folders" && `${baseClass}__button--active`].filter(Boolean).join(" "),
+        disabled: viewType === "folders",
+        el: "button",
+        onClick: () => handleViewChange("folders"),
+        children: t("folder:byFolder")
+      }), isTrashEnabled && _jsx(Button, {
+        buttonStyle: "tab",
+        className: [`${baseClass}__button`, viewType === "trash" && `${baseClass}__button--active`].filter(Boolean).join(" "),
+        disabled: viewType === "trash",
+        el: "button",
+        id: "trash-view-pill",
+        onClick: () => handleViewChange("trash"),
+        children: t("general:trash")
+      })]
+    });
+    $[6] = allButtonLabel;
+    $[7] = collectionConfig.labels?.plural;
+    $[8] = handleViewChange;
+    $[9] = i18n;
+    $[10] = isFoldersEnabled;
+    $[11] = isTrashEnabled;
+    $[12] = t;
+    $[13] = viewType;
+    $[14] = t2;
+  } else {
+    t2 = $[14];
+  }
+  return t2;
 };
-
 //# sourceMappingURL=index.js.map