@payloadcms/ui 3.0.0-beta.36 → 3.0.0-beta.38

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/FieldSelect/index.tsx"],"sourcesContent":["import type { FieldWithPath } from 'payload/types'\n\nimport React, { Fragment, type JSX, useState } from 'react'\n\nimport type { FieldMap, MappedField } from '../../providers/ComponentMap/buildComponentMap/types.js'\n\nimport { FieldLabel } from '../../forms/FieldLabel/index.js'\nimport { useForm } from '../../forms/Form/context.js'\nimport { createNestedClientFieldPath } from '../../forms/Form/createNestedFieldPath.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { ReactSelect } from '../ReactSelect/index.js'\nimport './index.scss'\n\nconst baseClass = 'field-select'\n\nexport type FieldSelectProps = {\n  fieldMap: FieldMap\n  setSelected: (fields: FieldWithPath[]) => void\n}\n\nconst combineLabel = ({\n  customLabel,\n  field,\n  prefix,\n}: {\n  customLabel?: string\n  field?: MappedField\n  prefix?: JSX.Element | string\n}): JSX.Element => {\n  const CustomLabelToRender =\n    field &&\n    'CustomLabel' in field.fieldComponentProps &&\n    field.fieldComponentProps.CustomLabel !== undefined\n      ? field.fieldComponentProps.CustomLabel\n      : null\n  const DefaultLabelToRender =\n    field && 'label' in field.fieldComponentProps && field.fieldComponentProps.label ? (\n      <FieldLabel\n        label={field.fieldComponentProps.label}\n        {...(field.fieldComponentProps.labelProps || {})}\n      />\n    ) : null\n\n  const LabelToRender = CustomLabelToRender || DefaultLabelToRender || customLabel\n\n  if (!LabelToRender) return null\n\n  return (\n    <Fragment>\n      {prefix && (\n        <Fragment>\n          <span style={{ display: 'inline-block' }}>{prefix}</span>\n          {' > '}\n        </Fragment>\n      )}\n      <span style={{ display: 'inline-block' }}>{LabelToRender}</span>\n    </Fragment>\n  )\n}\n\nconst reduceFields = ({\n  fieldMap,\n  labelPrefix = null,\n  path = '',\n}: {\n  fieldMap: FieldMap\n  labelPrefix?: JSX.Element | string\n  path?: string\n}): { Label: JSX.Element; value: FieldWithPath }[] => {\n  if (!fieldMap) {\n    return []\n  }\n\n  return fieldMap?.reduce((fieldsToUse, field) => {\n    const { isFieldAffectingData } = field\n    // escape for a variety of reasons\n    if (\n      isFieldAffectingData &&\n      (field.disableBulkEdit ||\n        field.unique ||\n        field.isHidden ||\n        ('readOnly' in field.fieldComponentProps && field.fieldComponentProps.readOnly))\n    ) {\n      return fieldsToUse\n    }\n\n    if (\n      !(field.type === 'array' || field.type === 'blocks') &&\n      'fieldMap' in field.fieldComponentProps\n    ) {\n      return [\n        ...fieldsToUse,\n        ...reduceFields({\n          fieldMap: field.fieldComponentProps.fieldMap,\n          labelPrefix: combineLabel({ field, prefix: labelPrefix }),\n          path: createNestedClientFieldPath(path, field),\n        }),\n      ]\n    }\n\n    if (field.type === 'tabs' && 'tabs' in field.fieldComponentProps) {\n      return [\n        ...fieldsToUse,\n        ...field.fieldComponentProps.tabs.reduce((tabFields, tab) => {\n          if ('fieldMap' in tab) {\n            const isNamedTab = 'name' in tab && tab.name\n            return [\n              ...tabFields,\n              ...reduceFields({\n                fieldMap: tab.fieldMap,\n                labelPrefix,\n                path: isNamedTab ? createNestedClientFieldPath(path, field) : path,\n              }),\n            ]\n          }\n        }, []),\n      ]\n    }\n\n    const formattedField = {\n      label: combineLabel({ field, prefix: labelPrefix }),\n      value: {\n        ...field,\n        path: createNestedClientFieldPath(path, field),\n      },\n    }\n\n    return [...fieldsToUse, formattedField]\n  }, [])\n}\n\nexport const FieldSelect: React.FC<FieldSelectProps> = ({ fieldMap, setSelected }) => {\n  const { t } = useTranslation()\n  const [options] = useState(() => reduceFields({ fieldMap }))\n\n  const { dispatchFields, getFields } = useForm()\n\n  const handleChange = (selected) => {\n    const activeFields = getFields()\n    if (selected === null) {\n      setSelected([])\n    } else {\n      setSelected(selected.map(({ value }) => value))\n    }\n\n    // remove deselected values from form state\n    if (selected === null || Object.keys(activeFields || []).length > selected.length) {\n      Object.keys(activeFields).forEach((path) => {\n        if (\n          selected === null ||\n          !selected.find((field) => {\n            return field.value.path === path\n          })\n        ) {\n          dispatchFields({\n            type: 'REMOVE',\n            path,\n          })\n        }\n      })\n    }\n  }\n\n  return (\n    <div className={baseClass}>\n      <FieldLabel label={t('fields:selectFieldsToEdit')} />\n      <ReactSelect\n        getOptionValue={(option) => {\n          if (typeof option.value === 'object' && 'path' in option.value) {\n            return String(option.value.path)\n          }\n          return String(option.value)\n        }}\n        isMulti\n        onChange={handleChange}\n        options={options}\n      />\n    </div>\n  )\n}\n"],"names":["React","Fragment","useState","FieldLabel","useForm","createNestedClientFieldPath","useTranslation","ReactSelect","baseClass","combineLabel","customLabel","field","prefix","CustomLabelToRender","fieldComponentProps","CustomLabel","undefined","DefaultLabelToRender","label","labelProps","LabelToRender","span","style","display","reduceFields","fieldMap","labelPrefix","path","reduce","fieldsToUse","isFieldAffectingData","disableBulkEdit","unique","isHidden","readOnly","type","tabs","tabFields","tab","isNamedTab","name","formattedField","value","FieldSelect","setSelected","t","options","dispatchFields","getFields","handleChange","selected","activeFields","map","Object","keys","length","forEach","find","div","className","getOptionValue","option","String","isMulti","onChange"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../src/elements/FieldSelect/index.tsx"],"sourcesContent":["'use client'\nimport type { FieldWithPath } from 'payload/types'\n\nimport React, { Fragment, type JSX, useState } from 'react'\n\nimport type { FieldMap, MappedField } from '../../providers/ComponentMap/buildComponentMap/types.js'\n\nimport { FieldLabel } from '../../forms/FieldLabel/index.js'\nimport { useForm } from '../../forms/Form/context.js'\nimport { createNestedClientFieldPath } from '../../forms/Form/createNestedFieldPath.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { ReactSelect } from '../ReactSelect/index.js'\nimport './index.scss'\n\nconst baseClass = 'field-select'\n\nexport type FieldSelectProps = {\n  fieldMap: FieldMap\n  setSelected: (fields: FieldWithPath[]) => void\n}\n\nconst combineLabel = ({\n  customLabel,\n  field,\n  prefix,\n}: {\n  customLabel?: string\n  field?: MappedField\n  prefix?: JSX.Element | string\n}): JSX.Element => {\n  const CustomLabelToRender =\n    field &&\n    'CustomLabel' in field.fieldComponentProps &&\n    field.fieldComponentProps.CustomLabel !== undefined\n      ? field.fieldComponentProps.CustomLabel\n      : null\n  const DefaultLabelToRender =\n    field && 'label' in field.fieldComponentProps && field.fieldComponentProps.label ? (\n      <FieldLabel\n        label={field.fieldComponentProps.label}\n        {...(field.fieldComponentProps.labelProps || {})}\n      />\n    ) : null\n\n  const LabelToRender = CustomLabelToRender || DefaultLabelToRender || customLabel\n\n  if (!LabelToRender) return null\n\n  return (\n    <Fragment>\n      {prefix && (\n        <Fragment>\n          <span style={{ display: 'inline-block' }}>{prefix}</span>\n          {' > '}\n        </Fragment>\n      )}\n      <span style={{ display: 'inline-block' }}>{LabelToRender}</span>\n    </Fragment>\n  )\n}\n\nconst reduceFields = ({\n  fieldMap,\n  labelPrefix = null,\n  path = '',\n}: {\n  fieldMap: FieldMap\n  labelPrefix?: JSX.Element | string\n  path?: string\n}): { Label: JSX.Element; value: FieldWithPath }[] => {\n  if (!fieldMap) {\n    return []\n  }\n\n  return fieldMap?.reduce((fieldsToUse, field) => {\n    const { isFieldAffectingData } = field\n    // escape for a variety of reasons\n    if (\n      isFieldAffectingData &&\n      (field.disableBulkEdit ||\n        field.unique ||\n        field.isHidden ||\n        ('readOnly' in field.fieldComponentProps && field.fieldComponentProps.readOnly))\n    ) {\n      return fieldsToUse\n    }\n\n    if (\n      !(field.type === 'array' || field.type === 'blocks') &&\n      'fieldMap' in field.fieldComponentProps\n    ) {\n      return [\n        ...fieldsToUse,\n        ...reduceFields({\n          fieldMap: field.fieldComponentProps.fieldMap,\n          labelPrefix: combineLabel({ field, prefix: labelPrefix }),\n          path: createNestedClientFieldPath(path, field),\n        }),\n      ]\n    }\n\n    if (field.type === 'tabs' && 'tabs' in field.fieldComponentProps) {\n      return [\n        ...fieldsToUse,\n        ...field.fieldComponentProps.tabs.reduce((tabFields, tab) => {\n          if ('fieldMap' in tab) {\n            const isNamedTab = 'name' in tab && tab.name\n            return [\n              ...tabFields,\n              ...reduceFields({\n                fieldMap: tab.fieldMap,\n                labelPrefix,\n                path: isNamedTab ? createNestedClientFieldPath(path, field) : path,\n              }),\n            ]\n          }\n        }, []),\n      ]\n    }\n\n    const formattedField = {\n      label: combineLabel({ field, prefix: labelPrefix }),\n      value: {\n        ...field,\n        path: createNestedClientFieldPath(path, field),\n      },\n    }\n\n    return [...fieldsToUse, formattedField]\n  }, [])\n}\n\nexport const FieldSelect: React.FC<FieldSelectProps> = ({ fieldMap, setSelected }) => {\n  const { t } = useTranslation()\n  const [options] = useState(() => reduceFields({ fieldMap }))\n\n  const { dispatchFields, getFields } = useForm()\n\n  const handleChange = (selected) => {\n    const activeFields = getFields()\n    if (selected === null) {\n      setSelected([])\n    } else {\n      setSelected(selected.map(({ value }) => value))\n    }\n\n    // remove deselected values from form state\n    if (selected === null || Object.keys(activeFields || []).length > selected.length) {\n      Object.keys(activeFields).forEach((path) => {\n        if (\n          selected === null ||\n          !selected.find((field) => {\n            return field.value.path === path\n          })\n        ) {\n          dispatchFields({\n            type: 'REMOVE',\n            path,\n          })\n        }\n      })\n    }\n  }\n\n  return (\n    <div className={baseClass}>\n      <FieldLabel label={t('fields:selectFieldsToEdit')} />\n      <ReactSelect\n        getOptionValue={(option) => {\n          if (typeof option.value === 'object' && 'path' in option.value) {\n            return String(option.value.path)\n          }\n          return String(option.value)\n        }}\n        isMulti\n        onChange={handleChange}\n        options={options}\n      />\n    </div>\n  )\n}\n"],"names":["React","Fragment","useState","FieldLabel","useForm","createNestedClientFieldPath","useTranslation","ReactSelect","baseClass","combineLabel","customLabel","field","prefix","CustomLabelToRender","fieldComponentProps","CustomLabel","undefined","DefaultLabelToRender","label","labelProps","LabelToRender","span","style","display","reduceFields","fieldMap","labelPrefix","path","reduce","fieldsToUse","isFieldAffectingData","disableBulkEdit","unique","isHidden","readOnly","type","tabs","tabFields","tab","isNamedTab","name","formattedField","value","FieldSelect","setSelected","t","options","dispatchFields","getFields","handleChange","selected","activeFields","map","Object","keys","length","forEach","find","div","className","getOptionValue","option","String","isMulti","onChange"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,OAAOA,SAASC,QAAQ,EAAYC,QAAQ,QAAQ,QAAO;AAI3D,SAASC,UAAU,QAAQ,kCAAiC;AAC5D,SAASC,OAAO,QAAQ,8BAA6B;AACrD,SAASC,2BAA2B,QAAQ,4CAA2C;AACvF,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,WAAW,QAAQ,0BAAyB;AAGrD,MAAMC,YAAY;AAOlB,MAAMC,eAAe,CAAC,EACpBC,WAAW,EACXC,KAAK,EACLC,MAAM,EAKP;IACC,MAAMC,sBACJF,SACA,iBAAiBA,MAAMG,mBAAmB,IAC1CH,MAAMG,mBAAmB,CAACC,WAAW,KAAKC,YACtCL,MAAMG,mBAAmB,CAACC,WAAW,GACrC;IACN,MAAME,uBACJN,SAAS,WAAWA,MAAMG,mBAAmB,IAAIH,MAAMG,mBAAmB,CAACI,KAAK,iBAC9E,KAACf;QACCe,OAAOP,MAAMG,mBAAmB,CAACI,KAAK;QACrC,GAAIP,MAAMG,mBAAmB,CAACK,UAAU,IAAI,CAAC,CAAC;SAE/C;IAEN,MAAMC,gBAAgBP,uBAAuBI,wBAAwBP;IAErE,IAAI,CAACU,eAAe,OAAO;IAE3B,qBACE,MAACnB;;YACEW,wBACC,MAACX;;kCACC,KAACoB;wBAAKC,OAAO;4BAAEC,SAAS;wBAAe;kCAAIX;;oBAC1C;;;0BAGL,KAACS;gBAAKC,OAAO;oBAAEC,SAAS;gBAAe;0BAAIH;;;;AAGjD;AAEA,MAAMI,eAAe,CAAC,EACpBC,QAAQ,EACRC,cAAc,IAAI,EAClBC,OAAO,EAAE,EAKV;IACC,IAAI,CAACF,UAAU;QACb,OAAO,EAAE;IACX;IAEA,OAAOA,UAAUG,OAAO,CAACC,aAAalB;QACpC,MAAM,EAAEmB,oBAAoB,EAAE,GAAGnB;QACjC,kCAAkC;QAClC,IACEmB,wBACCnB,CAAAA,MAAMoB,eAAe,IACpBpB,MAAMqB,MAAM,IACZrB,MAAMsB,QAAQ,IACb,cAActB,MAAMG,mBAAmB,IAAIH,MAAMG,mBAAmB,CAACoB,QAAQ,GAChF;YACA,OAAOL;QACT;QAEA,IACE,CAAElB,CAAAA,MAAMwB,IAAI,KAAK,WAAWxB,MAAMwB,IAAI,KAAK,QAAO,KAClD,cAAcxB,MAAMG,mBAAmB,EACvC;YACA,OAAO;mBACFe;mBACAL,aAAa;oBACdC,UAAUd,MAAMG,mBAAmB,CAACW,QAAQ;oBAC5CC,aAAajB,aAAa;wBAAEE;wBAAOC,QAAQc;oBAAY;oBACvDC,MAAMtB,4BAA4BsB,MAAMhB;gBAC1C;aACD;QACH;QAEA,IAAIA,MAAMwB,IAAI,KAAK,UAAU,UAAUxB,MAAMG,mBAAmB,EAAE;YAChE,OAAO;mBACFe;mBACAlB,MAAMG,mBAAmB,CAACsB,IAAI,CAACR,MAAM,CAAC,CAACS,WAAWC;oBACnD,IAAI,cAAcA,KAAK;wBACrB,MAAMC,aAAa,UAAUD,OAAOA,IAAIE,IAAI;wBAC5C,OAAO;+BACFH;+BACAb,aAAa;gCACdC,UAAUa,IAAIb,QAAQ;gCACtBC;gCACAC,MAAMY,aAAalC,4BAA4BsB,MAAMhB,SAASgB;4BAChE;yBACD;oBACH;gBACF,GAAG,EAAE;aACN;QACH;QAEA,MAAMc,iBAAiB;YACrBvB,OAAOT,aAAa;gBAAEE;gBAAOC,QAAQc;YAAY;YACjDgB,OAAO;gBACL,GAAG/B,KAAK;gBACRgB,MAAMtB,4BAA4BsB,MAAMhB;YAC1C;QACF;QAEA,OAAO;eAAIkB;YAAaY;SAAe;IACzC,GAAG,EAAE;AACP;AAEA,OAAO,MAAME,cAA0C,CAAC,EAAElB,QAAQ,EAAEmB,WAAW,EAAE;IAC/E,MAAM,EAAEC,CAAC,EAAE,GAAGvC;IACd,MAAM,CAACwC,QAAQ,GAAG5C,SAAS,IAAMsB,aAAa;YAAEC;QAAS;IAEzD,MAAM,EAAEsB,cAAc,EAAEC,SAAS,EAAE,GAAG5C;IAEtC,MAAM6C,eAAe,CAACC;QACpB,MAAMC,eAAeH;QACrB,IAAIE,aAAa,MAAM;YACrBN,YAAY,EAAE;QAChB,OAAO;YACLA,YAAYM,SAASE,GAAG,CAAC,CAAC,EAAEV,KAAK,EAAE,GAAKA;QAC1C;QAEA,2CAA2C;QAC3C,IAAIQ,aAAa,QAAQG,OAAOC,IAAI,CAACH,gBAAgB,EAAE,EAAEI,MAAM,GAAGL,SAASK,MAAM,EAAE;YACjFF,OAAOC,IAAI,CAACH,cAAcK,OAAO,CAAC,CAAC7B;gBACjC,IACEuB,aAAa,QACb,CAACA,SAASO,IAAI,CAAC,CAAC9C;oBACd,OAAOA,MAAM+B,KAAK,CAACf,IAAI,KAAKA;gBAC9B,IACA;oBACAoB,eAAe;wBACbZ,MAAM;wBACNR;oBACF;gBACF;YACF;QACF;IACF;IAEA,qBACE,MAAC+B;QAAIC,WAAWnD;;0BACd,KAACL;gBAAWe,OAAO2B,EAAE;;0BACrB,KAACtC;gBACCqD,gBAAgB,CAACC;oBACf,IAAI,OAAOA,OAAOnB,KAAK,KAAK,YAAY,UAAUmB,OAAOnB,KAAK,EAAE;wBAC9D,OAAOoB,OAAOD,OAAOnB,KAAK,CAACf,IAAI;oBACjC;oBACA,OAAOmC,OAAOD,OAAOnB,KAAK;gBAC5B;gBACAqB,OAAO;gBACPC,UAAUf;gBACVH,SAASA;;;;AAIjB,EAAC"}

package/dist/elements/FileDetails/FileMeta/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/FileDetails/FileMeta/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAEvC,MAAM,MAAM,aAAa,GAAG;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,QAAQ,EAAE,MAAM,CAAA;IAChB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAMD,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA+C5C,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/FileDetails/FileMeta/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAEvC,MAAM,MAAM,aAAa,GAAG;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,QAAQ,EAAE,MAAM,CAAA;IAChB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAMD,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA+C5C,CAAA"}

package/dist/elements/FileDetails/FileMeta/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { formatFilesize } from 'payload/utilities';
 import React, { useState } from 'react';

package/dist/elements/FileDetails/FileMeta/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/FileDetails/FileMeta/index.tsx"],"sourcesContent":["import { formatFilesize } from 'payload/utilities'\nimport React, { useState } from 'react'\n\nexport type FileMetaProps = {\n  collection?: string\n  filename: string\n  filesize: number\n  height?: number\n  id?: string\n  mimeType: string\n  sizes?: unknown\n  url: string\n  width?: number\n}\n\nimport { Edit } from '../../../icons/Edit/index.js'\nimport { CopyToClipboard } from '../../CopyToClipboard/index.js'\nimport { useDocumentDrawer } from '../../DocumentDrawer/index.js'\nimport { Tooltip } from '../../Tooltip/index.js'\nimport './index.scss'\n\nconst baseClass = 'file-meta'\n\nexport const FileMeta: React.FC<FileMetaProps> = (props) => {\n  const { id, collection, filename, filesize, height, mimeType, url: fileURL, width } = props\n\n  const [hovered, setHovered] = useState(false)\n  const openInDrawer = Boolean(id && collection)\n\n  const [DocumentDrawer, DocumentDrawerToggler] = useDocumentDrawer({\n    id,\n    collectionSlug: collection,\n  })\n\n  return (\n    <div className={baseClass}>\n      <div className={`${baseClass}__url`}>\n        {openInDrawer && <DocumentDrawer />}\n        <a href={fileURL} rel=\"noopener noreferrer\" target=\"_blank\">\n          {filename}\n        </a>\n        <CopyToClipboard defaultMessage=\"Copy URL\" value={fileURL} />\n        {openInDrawer && (\n          <DocumentDrawerToggler\n            className={`${baseClass}__edit`}\n            onMouseEnter={() => setHovered(true)}\n            onMouseLeave={() => setHovered(false)}\n          >\n            <Edit />\n            <Tooltip show={hovered}>Edit</Tooltip>\n          </DocumentDrawerToggler>\n        )}\n      </div>\n      <div className={`${baseClass}__size-type`}>\n        {formatFilesize(filesize)}\n        {width && height && (\n          <React.Fragment>\n            &nbsp;-&nbsp;\n            {width}x{height}\n          </React.Fragment>\n        )}\n        {mimeType && (\n          <React.Fragment>\n            &nbsp;-&nbsp;\n            {mimeType}\n          </React.Fragment>\n        )}\n      </div>\n    </div>\n  )\n}\n"],"names":["formatFilesize","React","useState","Edit","CopyToClipboard","useDocumentDrawer","Tooltip","baseClass","FileMeta","props","id","collection","filename","filesize","height","mimeType","url","fileURL","width","hovered","setHovered","openInDrawer","Boolean","DocumentDrawer","DocumentDrawerToggler","collectionSlug","div","className","a","href","rel","target","defaultMessage","value","onMouseEnter","onMouseLeave","show","Fragment"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,SAASA,cAAc,QAAQ,oBAAmB;AAClD,OAAOC,SAASC,QAAQ,QAAQ,QAAO;AAcvC,SAASC,IAAI,QAAQ,+BAA8B;AACnD,SAASC,eAAe,QAAQ,iCAAgC;AAChE,SAASC,iBAAiB,QAAQ,gCAA+B;AACjE,SAASC,OAAO,QAAQ,yBAAwB;AAGhD,MAAMC,YAAY;AAElB,OAAO,MAAMC,WAAoC,CAACC;IAChD,MAAM,EAAEC,EAAE,EAAEC,UAAU,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,MAAM,EAAEC,QAAQ,EAAEC,KAAKC,OAAO,EAAEC,KAAK,EAAE,GAAGT;IAEtF,MAAM,CAACU,SAASC,WAAW,GAAGlB,SAAS;IACvC,MAAMmB,eAAeC,QAAQZ,MAAMC;IAEnC,MAAM,CAACY,gBAAgBC,sBAAsB,GAAGnB,kBAAkB;QAChEK;QACAe,gBAAgBd;IAClB;IAEA,qBACE,MAACe;QAAIC,WAAWpB;;0BACd,MAACmB;gBAAIC,WAAW,CAAC,EAAEpB,UAAU,KAAK,CAAC;;oBAChCc,8BAAgB,KAACE;kCAClB,KAACK;wBAAEC,MAAMZ;wBAASa,KAAI;wBAAsBC,QAAO;kCAChDnB;;kCAEH,KAACR;wBAAgB4B,gBAAe;wBAAWC,OAAOhB;;oBACjDI,8BACC,MAACG;wBACCG,WAAW,CAAC,EAAEpB,UAAU,MAAM,CAAC;wBAC/B2B,cAAc,IAAMd,WAAW;wBAC/Be,cAAc,IAAMf,WAAW;;0CAE/B,KAACjB;0CACD,KAACG;gCAAQ8B,MAAMjB;0CAAS;;;;;;0BAI9B,MAACO;gBAAIC,WAAW,CAAC,EAAEpB,UAAU,WAAW,CAAC;;oBACtCP,eAAea;oBACfK,SAASJ,wBACR,MAACb,MAAMoC,QAAQ;;4BAAC;4BAEbnB;4BAAM;4BAAEJ;;;oBAGZC,0BACC,MAACd,MAAMoC,QAAQ;;4BAAC;4BAEbtB;;;;;;;AAMb,EAAC"}
+{"version":3,"sources":["../../../../src/elements/FileDetails/FileMeta/index.tsx"],"sourcesContent":["'use client'\nimport { formatFilesize } from 'payload/utilities'\nimport React, { useState } from 'react'\n\nexport type FileMetaProps = {\n  collection?: string\n  filename: string\n  filesize: number\n  height?: number\n  id?: string\n  mimeType: string\n  sizes?: unknown\n  url: string\n  width?: number\n}\n\nimport { Edit } from '../../../icons/Edit/index.js'\nimport { CopyToClipboard } from '../../CopyToClipboard/index.js'\nimport { useDocumentDrawer } from '../../DocumentDrawer/index.js'\nimport { Tooltip } from '../../Tooltip/index.js'\nimport './index.scss'\n\nconst baseClass = 'file-meta'\n\nexport const FileMeta: React.FC<FileMetaProps> = (props) => {\n  const { id, collection, filename, filesize, height, mimeType, url: fileURL, width } = props\n\n  const [hovered, setHovered] = useState(false)\n  const openInDrawer = Boolean(id && collection)\n\n  const [DocumentDrawer, DocumentDrawerToggler] = useDocumentDrawer({\n    id,\n    collectionSlug: collection,\n  })\n\n  return (\n    <div className={baseClass}>\n      <div className={`${baseClass}__url`}>\n        {openInDrawer && <DocumentDrawer />}\n        <a href={fileURL} rel=\"noopener noreferrer\" target=\"_blank\">\n          {filename}\n        </a>\n        <CopyToClipboard defaultMessage=\"Copy URL\" value={fileURL} />\n        {openInDrawer && (\n          <DocumentDrawerToggler\n            className={`${baseClass}__edit`}\n            onMouseEnter={() => setHovered(true)}\n            onMouseLeave={() => setHovered(false)}\n          >\n            <Edit />\n            <Tooltip show={hovered}>Edit</Tooltip>\n          </DocumentDrawerToggler>\n        )}\n      </div>\n      <div className={`${baseClass}__size-type`}>\n        {formatFilesize(filesize)}\n        {width && height && (\n          <React.Fragment>\n            &nbsp;-&nbsp;\n            {width}x{height}\n          </React.Fragment>\n        )}\n        {mimeType && (\n          <React.Fragment>\n            &nbsp;-&nbsp;\n            {mimeType}\n          </React.Fragment>\n        )}\n      </div>\n    </div>\n  )\n}\n"],"names":["formatFilesize","React","useState","Edit","CopyToClipboard","useDocumentDrawer","Tooltip","baseClass","FileMeta","props","id","collection","filename","filesize","height","mimeType","url","fileURL","width","hovered","setHovered","openInDrawer","Boolean","DocumentDrawer","DocumentDrawerToggler","collectionSlug","div","className","a","href","rel","target","defaultMessage","value","onMouseEnter","onMouseLeave","show","Fragment"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,SAASA,cAAc,QAAQ,oBAAmB;AAClD,OAAOC,SAASC,QAAQ,QAAQ,QAAO;AAcvC,SAASC,IAAI,QAAQ,+BAA8B;AACnD,SAASC,eAAe,QAAQ,iCAAgC;AAChE,SAASC,iBAAiB,QAAQ,gCAA+B;AACjE,SAASC,OAAO,QAAQ,yBAAwB;AAGhD,MAAMC,YAAY;AAElB,OAAO,MAAMC,WAAoC,CAACC;IAChD,MAAM,EAAEC,EAAE,EAAEC,UAAU,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,MAAM,EAAEC,QAAQ,EAAEC,KAAKC,OAAO,EAAEC,KAAK,EAAE,GAAGT;IAEtF,MAAM,CAACU,SAASC,WAAW,GAAGlB,SAAS;IACvC,MAAMmB,eAAeC,QAAQZ,MAAMC;IAEnC,MAAM,CAACY,gBAAgBC,sBAAsB,GAAGnB,kBAAkB;QAChEK;QACAe,gBAAgBd;IAClB;IAEA,qBACE,MAACe;QAAIC,WAAWpB;;0BACd,MAACmB;gBAAIC,WAAW,CAAC,EAAEpB,UAAU,KAAK,CAAC;;oBAChCc,8BAAgB,KAACE;kCAClB,KAACK;wBAAEC,MAAMZ;wBAASa,KAAI;wBAAsBC,QAAO;kCAChDnB;;kCAEH,KAACR;wBAAgB4B,gBAAe;wBAAWC,OAAOhB;;oBACjDI,8BACC,MAACG;wBACCG,WAAW,CAAC,EAAEpB,UAAU,MAAM,CAAC;wBAC/B2B,cAAc,IAAMd,WAAW;wBAC/Be,cAAc,IAAMf,WAAW;;0CAE/B,KAACjB;0CACD,KAACG;gCAAQ8B,MAAMjB;0CAAS;;;;;;0BAI9B,MAACO;gBAAIC,WAAW,CAAC,EAAEpB,UAAU,WAAW,CAAC;;oBACtCP,eAAea;oBACfK,SAASJ,wBACR,MAACb,MAAMoC,QAAQ;;4BAAC;4BAEbnB;4BAAM;4BAAEJ;;;oBAGZC,0BACC,MAACd,MAAMoC,QAAQ;;4BAAC;4BAEbtB;;;;;;;AAMb,EAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/FileDetails/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,cAAc,CAAA;AAIrB,OAAO,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,yBAAyB,EAAE,MAAM,eAAe,CAAA;AAE/E,MAAM,MAAM,gBAAgB,GAAG;IAC7B,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,cAAc,EAAE,MAAM,CAAA;IACtB,GAAG,EAAE,IAAI,GAAG;QACV,KAAK,CAAC,EAAE,SAAS,CAAA;KAClB,CAAA;IACD,YAAY,CAAC,EAAE,MAAM,IAAI,CAAA;IACzB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,YAAY,EAAE,yBAAyB,CAAC,QAAQ,CAAC,CAAA;CAClD,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA6ClD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/FileDetails/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,cAAc,CAAA;AAIrB,OAAO,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,yBAAyB,EAAE,MAAM,eAAe,CAAA;AAE/E,MAAM,MAAM,gBAAgB,GAAG;IAC7B,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,cAAc,EAAE,MAAM,CAAA;IACtB,GAAG,EAAE,IAAI,GAAG;QACV,KAAK,CAAC,EAAE,SAAS,CAAA;KAClB,CAAA;IACD,YAAY,CAAC,EAAE,MAAM,IAAI,CAAA;IACzB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,YAAY,EAAE,yBAAyB,CAAC,QAAQ,CAAC,CAAA;CAClD,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA6ClD,CAAA"}

package/dist/elements/FileDetails/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { isImage } from 'payload/utilities';
 import React from 'react';

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/FileDetails/index.tsx"],"sourcesContent":["import { isImage } from 'payload/utilities'\nimport React from 'react'\n\nimport { UploadActions } from '../../elements/Upload/index.js'\nimport { Button } from '../Button/index.js'\nimport { Thumbnail } from '../Thumbnail/index.js'\nimport { FileMeta } from './FileMeta/index.js'\nimport './index.scss'\n\nconst baseClass = 'file-details'\n\nimport type { Data, FileSizes, SanitizedCollectionConfig } from 'payload/types'\n\nexport type FileDetailsProps = {\n  canEdit?: boolean\n  collectionSlug: string\n  doc: Data & {\n    sizes?: FileSizes\n  }\n  handleRemove?: () => void\n  hasImageSizes?: boolean\n  imageCacheTag?: string\n  uploadConfig: SanitizedCollectionConfig['upload']\n}\n\nexport const FileDetails: React.FC<FileDetailsProps> = (props) => {\n  const { canEdit, collectionSlug, doc, handleRemove, hasImageSizes, imageCacheTag, uploadConfig } =\n    props\n\n  const { id, filename, filesize, height, mimeType, thumbnailURL, url, width } = doc\n\n  return (\n    <div className={baseClass}>\n      <header>\n        <Thumbnail\n          collectionSlug={collectionSlug}\n          doc={doc}\n          fileSrc={thumbnailURL || url}\n          imageCacheTag={imageCacheTag}\n          uploadConfig={uploadConfig}\n        />\n        <div className={`${baseClass}__main-detail`}>\n          <FileMeta\n            collection={collectionSlug}\n            filename={filename as string}\n            filesize={filesize as number}\n            height={height as number}\n            id={id as string}\n            mimeType={mimeType as string}\n            url={url as string}\n            width={width as number}\n          />\n\n          {isImage(mimeType as string) && mimeType !== 'image/svg+xml' && (\n            <UploadActions canEdit={canEdit} showSizePreviews={hasImageSizes && doc.filename} />\n          )}\n        </div>\n        {handleRemove && (\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__remove`}\n            icon=\"x\"\n            iconStyle=\"with-border\"\n            onClick={handleRemove}\n            round\n          />\n        )}\n      </header>\n    </div>\n  )\n}\n"],"names":["isImage","React","UploadActions","Button","Thumbnail","FileMeta","baseClass","FileDetails","props","canEdit","collectionSlug","doc","handleRemove","hasImageSizes","imageCacheTag","uploadConfig","id","filename","filesize","height","mimeType","thumbnailURL","url","width","div","className","header","fileSrc","collection","showSizePreviews","buttonStyle","icon","iconStyle","onClick","round"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,SAASA,OAAO,QAAQ,oBAAmB;AAC3C,OAAOC,WAAW,QAAO;AAEzB,SAASC,aAAa,QAAQ,iCAAgC;AAC9D,SAASC,MAAM,QAAQ,qBAAoB;AAC3C,SAASC,SAAS,QAAQ,wBAAuB;AACjD,SAASC,QAAQ,QAAQ,sBAAqB;AAG9C,MAAMC,YAAY;AAgBlB,OAAO,MAAMC,cAA0C,CAACC;IACtD,MAAM,EAAEC,OAAO,EAAEC,cAAc,EAAEC,GAAG,EAAEC,YAAY,EAAEC,aAAa,EAAEC,aAAa,EAAEC,YAAY,EAAE,GAC9FP;IAEF,MAAM,EAAEQ,EAAE,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,MAAM,EAAEC,QAAQ,EAAEC,YAAY,EAAEC,GAAG,EAAEC,KAAK,EAAE,GAAGZ;IAE/E,qBACE,KAACa;QAAIC,WAAWnB;kBACd,cAAA,MAACoB;;8BACC,KAACtB;oBACCM,gBAAgBA;oBAChBC,KAAKA;oBACLgB,SAASN,gBAAgBC;oBACzBR,eAAeA;oBACfC,cAAcA;;8BAEhB,MAACS;oBAAIC,WAAW,CAAC,EAAEnB,UAAU,aAAa,CAAC;;sCACzC,KAACD;4BACCuB,YAAYlB;4BACZO,UAAUA;4BACVC,UAAUA;4BACVC,QAAQA;4BACRH,IAAIA;4BACJI,UAAUA;4BACVE,KAAKA;4BACLC,OAAOA;;wBAGRvB,QAAQoB,aAAuBA,aAAa,iCAC3C,KAAClB;4BAAcO,SAASA;4BAASoB,kBAAkBhB,iBAAiBF,IAAIM,QAAQ;;;;gBAGnFL,8BACC,KAACT;oBACC2B,aAAY;oBACZL,WAAW,CAAC,EAAEnB,UAAU,QAAQ,CAAC;oBACjCyB,MAAK;oBACLC,WAAU;oBACVC,SAASrB;oBACTsB,KAAK;;;;;AAMjB,EAAC"}
+{"version":3,"sources":["../../../src/elements/FileDetails/index.tsx"],"sourcesContent":["'use client'\nimport { isImage } from 'payload/utilities'\nimport React from 'react'\n\nimport { UploadActions } from '../../elements/Upload/index.js'\nimport { Button } from '../Button/index.js'\nimport { Thumbnail } from '../Thumbnail/index.js'\nimport { FileMeta } from './FileMeta/index.js'\nimport './index.scss'\n\nconst baseClass = 'file-details'\n\nimport type { Data, FileSizes, SanitizedCollectionConfig } from 'payload/types'\n\nexport type FileDetailsProps = {\n  canEdit?: boolean\n  collectionSlug: string\n  doc: Data & {\n    sizes?: FileSizes\n  }\n  handleRemove?: () => void\n  hasImageSizes?: boolean\n  imageCacheTag?: string\n  uploadConfig: SanitizedCollectionConfig['upload']\n}\n\nexport const FileDetails: React.FC<FileDetailsProps> = (props) => {\n  const { canEdit, collectionSlug, doc, handleRemove, hasImageSizes, imageCacheTag, uploadConfig } =\n    props\n\n  const { id, filename, filesize, height, mimeType, thumbnailURL, url, width } = doc\n\n  return (\n    <div className={baseClass}>\n      <header>\n        <Thumbnail\n          collectionSlug={collectionSlug}\n          doc={doc}\n          fileSrc={thumbnailURL || url}\n          imageCacheTag={imageCacheTag}\n          uploadConfig={uploadConfig}\n        />\n        <div className={`${baseClass}__main-detail`}>\n          <FileMeta\n            collection={collectionSlug}\n            filename={filename as string}\n            filesize={filesize as number}\n            height={height as number}\n            id={id as string}\n            mimeType={mimeType as string}\n            url={url as string}\n            width={width as number}\n          />\n\n          {isImage(mimeType as string) && mimeType !== 'image/svg+xml' && (\n            <UploadActions canEdit={canEdit} showSizePreviews={hasImageSizes && doc.filename} />\n          )}\n        </div>\n        {handleRemove && (\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__remove`}\n            icon=\"x\"\n            iconStyle=\"with-border\"\n            onClick={handleRemove}\n            round\n          />\n        )}\n      </header>\n    </div>\n  )\n}\n"],"names":["isImage","React","UploadActions","Button","Thumbnail","FileMeta","baseClass","FileDetails","props","canEdit","collectionSlug","doc","handleRemove","hasImageSizes","imageCacheTag","uploadConfig","id","filename","filesize","height","mimeType","thumbnailURL","url","width","div","className","header","fileSrc","collection","showSizePreviews","buttonStyle","icon","iconStyle","onClick","round"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,SAASA,OAAO,QAAQ,oBAAmB;AAC3C,OAAOC,WAAW,QAAO;AAEzB,SAASC,aAAa,QAAQ,iCAAgC;AAC9D,SAASC,MAAM,QAAQ,qBAAoB;AAC3C,SAASC,SAAS,QAAQ,wBAAuB;AACjD,SAASC,QAAQ,QAAQ,sBAAqB;AAG9C,MAAMC,YAAY;AAgBlB,OAAO,MAAMC,cAA0C,CAACC;IACtD,MAAM,EAAEC,OAAO,EAAEC,cAAc,EAAEC,GAAG,EAAEC,YAAY,EAAEC,aAAa,EAAEC,aAAa,EAAEC,YAAY,EAAE,GAC9FP;IAEF,MAAM,EAAEQ,EAAE,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,MAAM,EAAEC,QAAQ,EAAEC,YAAY,EAAEC,GAAG,EAAEC,KAAK,EAAE,GAAGZ;IAE/E,qBACE,KAACa;QAAIC,WAAWnB;kBACd,cAAA,MAACoB;;8BACC,KAACtB;oBACCM,gBAAgBA;oBAChBC,KAAKA;oBACLgB,SAASN,gBAAgBC;oBACzBR,eAAeA;oBACfC,cAAcA;;8BAEhB,MAACS;oBAAIC,WAAW,CAAC,EAAEnB,UAAU,aAAa,CAAC;;sCACzC,KAACD;4BACCuB,YAAYlB;4BACZO,UAAUA;4BACVC,UAAUA;4BACVC,QAAQA;4BACRH,IAAIA;4BACJI,UAAUA;4BACVE,KAAKA;4BACLC,OAAOA;;wBAGRvB,QAAQoB,aAAuBA,aAAa,iCAC3C,KAAClB;4BAAcO,SAASA;4BAASoB,kBAAkBhB,iBAAiBF,IAAIM,QAAQ;;;;gBAGnFL,8BACC,KAACT;oBACC2B,aAAY;oBACZL,WAAW,CAAC,EAAEnB,UAAU,QAAQ,CAAC;oBACjCyB,MAAK;oBACLC,WAAU;oBACVC,SAASrB;oBACTsB,KAAK;;;;;AAMjB,EAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/IDLabel/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAA;CAAE,CAUjF,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/IDLabel/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAA;CAAE,CAUjF,CAAA"}

package/dist/elements/IDLabel/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 const baseClass = 'id-label';

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/IDLabel/index.tsx"],"sourcesContent":["import React from 'react'\n\nimport './index.scss'\n\nconst baseClass = 'id-label'\n\nexport const IDLabel: React.FC<{ className?: string; id: string; prefix?: string }> = ({\n  id,\n  className,\n  prefix = 'ID:',\n}) => (\n  <div className={[baseClass, className].filter(Boolean).join(' ')} title={id}>\n    {prefix}\n    &nbsp;&nbsp;\n    {id}\n  </div>\n)\n"],"names":["React","baseClass","IDLabel","id","className","prefix","div","filter","Boolean","join","title"],"rangeMappings":";;;;;;;;;;;;;;","mappings":";AAAA,OAAOA,WAAW,QAAO;AAIzB,MAAMC,YAAY;AAElB,OAAO,MAAMC,UAAyE,CAAC,EACrFC,EAAE,EACFC,SAAS,EACTC,SAAS,KAAK,EACf,iBACC,MAACC;QAAIF,WAAW;YAACH;YAAWG;SAAU,CAACG,MAAM,CAACC,SAASC,IAAI,CAAC;QAAMC,OAAOP;;YACtEE;YAAO;YAEPF;;OAEJ"}
+{"version":3,"sources":["../../../src/elements/IDLabel/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport './index.scss'\n\nconst baseClass = 'id-label'\n\nexport const IDLabel: React.FC<{ className?: string; id: string; prefix?: string }> = ({\n  id,\n  className,\n  prefix = 'ID:',\n}) => (\n  <div className={[baseClass, className].filter(Boolean).join(' ')} title={id}>\n    {prefix}\n    &nbsp;&nbsp;\n    {id}\n  </div>\n)\n"],"names":["React","baseClass","IDLabel","id","className","prefix","div","filter","Boolean","join","title"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAIzB,MAAMC,YAAY;AAElB,OAAO,MAAMC,UAAyE,CAAC,EACrFC,EAAE,EACFC,SAAS,EACTC,SAAS,KAAK,EACf,iBACC,MAACC;QAAIF,WAAW;YAACH;YAAWG;SAAU,CAACG,MAAM,CAACC,SAASC,IAAI,CAAC;QAAMC,OAAOP;;YACtEE;YAAO;YAEPF;;OAEJ"}

package/dist/elements/Localizer/LocalizerLabel/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Localizer/LocalizerLabel/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAmBA,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Localizer/LocalizerLabel/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAmBA,CAAA"}

package/dist/elements/Localizer/LocalizerLabel/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import React from 'react';

package/dist/elements/Localizer/LocalizerLabel/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/Localizer/LocalizerLabel/index.tsx"],"sourcesContent":["import { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport { Chevron } from '../../../icons/Chevron/index.js'\nimport { useLocale } from '../../../providers/Locale/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'localizer-button'\n\nexport const LocalizerLabel: React.FC<{\n  ariaLabel?: string\n  className?: string\n}> = (props) => {\n  const { ariaLabel, className } = props\n  const locale = useLocale()\n  const { i18n, t } = useTranslation()\n\n  return (\n    <div\n      aria-label={ariaLabel || t('general:locale')}\n      className={[baseClass, className].filter(Boolean).join(' ')}\n    >\n      <div className={`${baseClass}__label`}>{`${t('general:locale')}:`}</div>\n      &nbsp;&nbsp;\n      <span className={`${baseClass}__current-label`}>\n        {`${getTranslation(locale.label, i18n)}`}\n      </span>\n      &nbsp;\n      <Chevron className={`${baseClass}__chevron`} />\n    </div>\n  )\n}\n"],"names":["getTranslation","React","Chevron","useLocale","useTranslation","baseClass","LocalizerLabel","props","ariaLabel","className","locale","i18n","t","div","aria-label","filter","Boolean","join","span","label"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,OAAOC,WAAW,QAAO;AAEzB,SAASC,OAAO,QAAQ,kCAAiC;AACzD,SAASC,SAAS,QAAQ,qCAAoC;AAC9D,SAASC,cAAc,QAAQ,0CAAyC;AAGxE,MAAMC,YAAY;AAElB,OAAO,MAAMC,iBAGR,CAACC;IACJ,MAAM,EAAEC,SAAS,EAAEC,SAAS,EAAE,GAAGF;IACjC,MAAMG,SAASP;IACf,MAAM,EAAEQ,IAAI,EAAEC,CAAC,EAAE,GAAGR;IAEpB,qBACE,MAACS;QACCC,cAAYN,aAAaI,EAAE;QAC3BH,WAAW;YAACJ;YAAWI;SAAU,CAACM,MAAM,CAACC,SAASC,IAAI,CAAC;;0BAEvD,KAACJ;gBAAIJ,WAAW,CAAC,EAAEJ,UAAU,OAAO,CAAC;0BAAG,CAAC,EAAEO,EAAE,kBAAkB,CAAC,CAAC;;YAAO;0BAExE,KAACM;gBAAKT,WAAW,CAAC,EAAEJ,UAAU,eAAe,CAAC;0BAC3C,CAAC,EAAEL,eAAeU,OAAOS,KAAK,EAAER,MAAM,CAAC;;YACnC;0BAEP,KAACT;gBAAQO,WAAW,CAAC,EAAEJ,UAAU,SAAS,CAAC;;;;AAGjD,EAAC"}
+{"version":3,"sources":["../../../../src/elements/Localizer/LocalizerLabel/index.tsx"],"sourcesContent":["'use client'\nimport { getTranslation } from '@payloadcms/translations'\nimport React from 'react'\n\nimport { Chevron } from '../../../icons/Chevron/index.js'\nimport { useLocale } from '../../../providers/Locale/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'localizer-button'\n\nexport const LocalizerLabel: React.FC<{\n  ariaLabel?: string\n  className?: string\n}> = (props) => {\n  const { ariaLabel, className } = props\n  const locale = useLocale()\n  const { i18n, t } = useTranslation()\n\n  return (\n    <div\n      aria-label={ariaLabel || t('general:locale')}\n      className={[baseClass, className].filter(Boolean).join(' ')}\n    >\n      <div className={`${baseClass}__label`}>{`${t('general:locale')}:`}</div>\n      &nbsp;&nbsp;\n      <span className={`${baseClass}__current-label`}>\n        {`${getTranslation(locale.label, i18n)}`}\n      </span>\n      &nbsp;\n      <Chevron className={`${baseClass}__chevron`} />\n    </div>\n  )\n}\n"],"names":["getTranslation","React","Chevron","useLocale","useTranslation","baseClass","LocalizerLabel","props","ariaLabel","className","locale","i18n","t","div","aria-label","filter","Boolean","join","span","label"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,OAAOC,WAAW,QAAO;AAEzB,SAASC,OAAO,QAAQ,kCAAiC;AACzD,SAASC,SAAS,QAAQ,qCAAoC;AAC9D,SAASC,cAAc,QAAQ,0CAAyC;AAGxE,MAAMC,YAAY;AAElB,OAAO,MAAMC,iBAGR,CAACC;IACJ,MAAM,EAAEC,SAAS,EAAEC,SAAS,EAAE,GAAGF;IACjC,MAAMG,SAASP;IACf,MAAM,EAAEQ,IAAI,EAAEC,CAAC,EAAE,GAAGR;IAEpB,qBACE,MAACS;QACCC,cAAYN,aAAaI,EAAE;QAC3BH,WAAW;YAACJ;YAAWI;SAAU,CAACM,MAAM,CAACC,SAASC,IAAI,CAAC;;0BAEvD,KAACJ;gBAAIJ,WAAW,CAAC,EAAEJ,UAAU,OAAO,CAAC;0BAAG,CAAC,EAAEO,EAAE,kBAAkB,CAAC,CAAC;;YAAO;0BAExE,KAACM;gBAAKT,WAAW,CAAC,EAAEJ,UAAU,eAAe,CAAC;0BAC3C,CAAC,EAAEL,eAAeU,OAAOS,KAAK,EAAER,MAAM,CAAC;;YACnC;0BAEP,KAACT;gBAAQO,WAAW,CAAC,EAAEJ,UAAU,SAAS,CAAC;;;;AAGjD,EAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Localizer/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAUzB,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAuDA,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Localizer/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,MAAM,OAAO,CAAA;AAUzB,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAuDA,CAAA"}

package/dist/elements/Localizer/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
 import { useRouter } from 'next/navigation.js';

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Localizer/index.tsx"],"sourcesContent":["import { getTranslation } from '@payloadcms/translations'\nimport { useRouter } from 'next/navigation.js'\nimport React from 'react'\n\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useRouteCache } from '../../providers/RouteCache/index.js'\nimport { useSearchParams } from '../../providers/SearchParams/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { PopupList } from '../Popup/index.js'\nimport { Popup } from '../Popup/index.js'\nimport { LocalizerLabel } from './LocalizerLabel/index.js'\nimport './index.scss'\n\nconst baseClass = 'localizer'\n\nexport const Localizer: React.FC<{\n  className?: string\n}> = (props) => {\n  const { className } = props\n  const config = useConfig()\n  const { localization } = config\n\n  const { i18n } = useTranslation()\n  const locale = useLocale()\n  const { stringifyParams } = useSearchParams()\n  const router = useRouter()\n  const { clearRouteCache } = useRouteCache()\n\n  if (localization) {\n    const { locales } = localization\n\n    return (\n      <div className={[baseClass, className].filter(Boolean).join(' ')}>\n        <Popup\n          button={<LocalizerLabel />}\n          horizontalAlign=\"right\"\n          render={({ close }) => (\n            <PopupList.ButtonGroup>\n              {locales.map((localeOption) => {\n                const localeOptionLabel = getTranslation(localeOption.label, i18n)\n\n                return (\n                  <PopupList.Button\n                    active={locale.code === localeOption.code}\n                    key={localeOption.code}\n                    onClick={() => {\n                      router.replace(\n                        stringifyParams({\n                          params: {\n                            locale: localeOption.code,\n                          },\n                        }),\n                      )\n                      clearRouteCache()\n                      close()\n                    }}\n                  >\n                    {localeOptionLabel}\n                    {localeOptionLabel !== localeOption.code && ` (${localeOption.code})`}\n                  </PopupList.Button>\n                )\n              })}\n            </PopupList.ButtonGroup>\n          )}\n          showScrollbar\n          size=\"large\"\n        />\n      </div>\n    )\n  }\n\n  return null\n}\n"],"names":["getTranslation","useRouter","React","useConfig","useLocale","useRouteCache","useSearchParams","useTranslation","PopupList","Popup","LocalizerLabel","baseClass","Localizer","props","className","config","localization","i18n","locale","stringifyParams","router","clearRouteCache","locales","div","filter","Boolean","join","button","horizontalAlign","render","close","ButtonGroup","map","localeOption","localeOptionLabel","label","Button","active","code","onClick","replace","params","showScrollbar","size"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,SAASC,SAAS,QAAQ,qBAAoB;AAC9C,OAAOC,WAAW,QAAO;AAEzB,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,aAAa,QAAQ,sCAAqC;AACnE,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,SAAS,QAAQ,oBAAmB;AAC7C,SAASC,KAAK,QAAQ,oBAAmB;AACzC,SAASC,cAAc,QAAQ,4BAA2B;AAG1D,MAAMC,YAAY;AAElB,OAAO,MAAMC,YAER,CAACC;IACJ,MAAM,EAAEC,SAAS,EAAE,GAAGD;IACtB,MAAME,SAASZ;IACf,MAAM,EAAEa,YAAY,EAAE,GAAGD;IAEzB,MAAM,EAAEE,IAAI,EAAE,GAAGV;IACjB,MAAMW,SAASd;IACf,MAAM,EAAEe,eAAe,EAAE,GAAGb;IAC5B,MAAMc,SAASnB;IACf,MAAM,EAAEoB,eAAe,EAAE,GAAGhB;IAE5B,IAAIW,cAAc;QAChB,MAAM,EAAEM,OAAO,EAAE,GAAGN;QAEpB,qBACE,KAACO;YAAIT,WAAW;gBAACH;gBAAWG;aAAU,CAACU,MAAM,CAACC,SAASC,IAAI,CAAC;sBAC1D,cAAA,KAACjB;gBACCkB,sBAAQ,KAACjB;gBACTkB,iBAAgB;gBAChBC,QAAQ,CAAC,EAAEC,KAAK,EAAE,iBAChB,KAACtB,UAAUuB,WAAW;kCACnBT,QAAQU,GAAG,CAAC,CAACC;4BACZ,MAAMC,oBAAoBlC,eAAeiC,aAAaE,KAAK,EAAElB;4BAE7D,qBACE,MAACT,UAAU4B,MAAM;gCACfC,QAAQnB,OAAOoB,IAAI,KAAKL,aAAaK,IAAI;gCAEzCC,SAAS;oCACPnB,OAAOoB,OAAO,CACZrB,gBAAgB;wCACdsB,QAAQ;4CACNvB,QAAQe,aAAaK,IAAI;wCAC3B;oCACF;oCAEFjB;oCACAS;gCACF;;oCAECI;oCACAA,sBAAsBD,aAAaK,IAAI,IAAI,CAAC,EAAE,EAAEL,aAAaK,IAAI,CAAC,CAAC,CAAC;;+BAdhEL,aAAaK,IAAI;wBAiB5B;;gBAGJI,aAAa;gBACbC,MAAK;;;IAIb;IAEA,OAAO;AACT,EAAC"}
+{"version":3,"sources":["../../../src/elements/Localizer/index.tsx"],"sourcesContent":["'use client'\nimport { getTranslation } from '@payloadcms/translations'\nimport { useRouter } from 'next/navigation.js'\nimport React from 'react'\n\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useRouteCache } from '../../providers/RouteCache/index.js'\nimport { useSearchParams } from '../../providers/SearchParams/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { PopupList } from '../Popup/index.js'\nimport { Popup } from '../Popup/index.js'\nimport { LocalizerLabel } from './LocalizerLabel/index.js'\nimport './index.scss'\n\nconst baseClass = 'localizer'\n\nexport const Localizer: React.FC<{\n  className?: string\n}> = (props) => {\n  const { className } = props\n  const config = useConfig()\n  const { localization } = config\n\n  const { i18n } = useTranslation()\n  const locale = useLocale()\n  const { stringifyParams } = useSearchParams()\n  const router = useRouter()\n  const { clearRouteCache } = useRouteCache()\n\n  if (localization) {\n    const { locales } = localization\n\n    return (\n      <div className={[baseClass, className].filter(Boolean).join(' ')}>\n        <Popup\n          button={<LocalizerLabel />}\n          horizontalAlign=\"right\"\n          render={({ close }) => (\n            <PopupList.ButtonGroup>\n              {locales.map((localeOption) => {\n                const localeOptionLabel = getTranslation(localeOption.label, i18n)\n\n                return (\n                  <PopupList.Button\n                    active={locale.code === localeOption.code}\n                    key={localeOption.code}\n                    onClick={() => {\n                      router.replace(\n                        stringifyParams({\n                          params: {\n                            locale: localeOption.code,\n                          },\n                        }),\n                      )\n                      clearRouteCache()\n                      close()\n                    }}\n                  >\n                    {localeOptionLabel}\n                    {localeOptionLabel !== localeOption.code && ` (${localeOption.code})`}\n                  </PopupList.Button>\n                )\n              })}\n            </PopupList.ButtonGroup>\n          )}\n          showScrollbar\n          size=\"large\"\n        />\n      </div>\n    )\n  }\n\n  return null\n}\n"],"names":["getTranslation","useRouter","React","useConfig","useLocale","useRouteCache","useSearchParams","useTranslation","PopupList","Popup","LocalizerLabel","baseClass","Localizer","props","className","config","localization","i18n","locale","stringifyParams","router","clearRouteCache","locales","div","filter","Boolean","join","button","horizontalAlign","render","close","ButtonGroup","map","localeOption","localeOptionLabel","label","Button","active","code","onClick","replace","params","showScrollbar","size"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,SAASC,SAAS,QAAQ,qBAAoB;AAC9C,OAAOC,WAAW,QAAO;AAEzB,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,aAAa,QAAQ,sCAAqC;AACnE,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,SAAS,QAAQ,oBAAmB;AAC7C,SAASC,KAAK,QAAQ,oBAAmB;AACzC,SAASC,cAAc,QAAQ,4BAA2B;AAG1D,MAAMC,YAAY;AAElB,OAAO,MAAMC,YAER,CAACC;IACJ,MAAM,EAAEC,SAAS,EAAE,GAAGD;IACtB,MAAME,SAASZ;IACf,MAAM,EAAEa,YAAY,EAAE,GAAGD;IAEzB,MAAM,EAAEE,IAAI,EAAE,GAAGV;IACjB,MAAMW,SAASd;IACf,MAAM,EAAEe,eAAe,EAAE,GAAGb;IAC5B,MAAMc,SAASnB;IACf,MAAM,EAAEoB,eAAe,EAAE,GAAGhB;IAE5B,IAAIW,cAAc;QAChB,MAAM,EAAEM,OAAO,EAAE,GAAGN;QAEpB,qBACE,KAACO;YAAIT,WAAW;gBAACH;gBAAWG;aAAU,CAACU,MAAM,CAACC,SAASC,IAAI,CAAC;sBAC1D,cAAA,KAACjB;gBACCkB,sBAAQ,KAACjB;gBACTkB,iBAAgB;gBAChBC,QAAQ,CAAC,EAAEC,KAAK,EAAE,iBAChB,KAACtB,UAAUuB,WAAW;kCACnBT,QAAQU,GAAG,CAAC,CAACC;4BACZ,MAAMC,oBAAoBlC,eAAeiC,aAAaE,KAAK,EAAElB;4BAE7D,qBACE,MAACT,UAAU4B,MAAM;gCACfC,QAAQnB,OAAOoB,IAAI,KAAKL,aAAaK,IAAI;gCAEzCC,SAAS;oCACPnB,OAAOoB,OAAO,CACZrB,gBAAgB;wCACdsB,QAAQ;4CACNvB,QAAQe,aAAaK,IAAI;wCAC3B;oCACF;oCAEFjB;oCACAS;gCACF;;oCAECI;oCACAA,sBAAsBD,aAAaK,IAAI,IAAI,CAAC,EAAE,EAAEL,aAAaK,IAAI,CAAC,CAAC,CAAC;;+BAdhEL,aAAaK,IAAI;wBAiB5B;;gBAGJI,aAAa;gBACbC,MAAK;;;IAIb;IAEA,OAAO;AACT,EAAC"}

package/dist/elements/Pagination/ClickableArrow/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Pagination/ClickableArrow/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,mBAAmB,GAAG;IAChC,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC5B,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;CACxB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAqBxD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Pagination/ClickableArrow/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,mBAAmB,GAAG;IAChC,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC5B,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAA;CACxB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAqBxD,CAAA"}

package/dist/elements/Pagination/ClickableArrow/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import { Chevron } from '../../../icons/Chevron/index.js';

package/dist/elements/Pagination/ClickableArrow/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/Pagination/ClickableArrow/index.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Chevron } from '../../../icons/Chevron/index.js'\nimport './index.scss'\n\nconst baseClass = 'clickable-arrow'\n\nexport type ClickableArrowProps = {\n  direction?: 'left' | 'right'\n  isDisabled?: boolean\n  updatePage?: () => void\n}\n\nexport const ClickableArrow: React.FC<ClickableArrowProps> = (props) => {\n  const { direction = 'right', isDisabled = false, updatePage } = props\n\n  const classes = [\n    baseClass,\n    isDisabled && `${baseClass}--is-disabled`,\n    direction && `${baseClass}--${direction}`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <button\n      className={classes}\n      disabled={isDisabled}\n      onClick={!isDisabled ? updatePage : undefined}\n      type=\"button\"\n    >\n      <Chevron />\n    </button>\n  )\n}\n"],"names":["React","Chevron","baseClass","ClickableArrow","props","direction","isDisabled","updatePage","classes","filter","Boolean","join","button","className","disabled","onClick","undefined","type"],"rangeMappings":";;;;;;;;;;;;;;;;;;","mappings":";AAAA,OAAOA,WAAW,QAAO;AAEzB,SAASC,OAAO,QAAQ,kCAAiC;AAGzD,MAAMC,YAAY;AAQlB,OAAO,MAAMC,iBAAgD,CAACC;IAC5D,MAAM,EAAEC,YAAY,OAAO,EAAEC,aAAa,KAAK,EAAEC,UAAU,EAAE,GAAGH;IAEhE,MAAMI,UAAU;QACdN;QACAI,cAAc,CAAC,EAAEJ,UAAU,aAAa,CAAC;QACzCG,aAAa,CAAC,EAAEH,UAAU,EAAE,EAAEG,UAAU,CAAC;KAC1C,CACEI,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,qBACE,KAACC;QACCC,WAAWL;QACXM,UAAUR;QACVS,SAAS,CAACT,aAAaC,aAAaS;QACpCC,MAAK;kBAEL,cAAA,KAAChB;;AAGP,EAAC"}
+{"version":3,"sources":["../../../../src/elements/Pagination/ClickableArrow/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport { Chevron } from '../../../icons/Chevron/index.js'\nimport './index.scss'\n\nconst baseClass = 'clickable-arrow'\n\nexport type ClickableArrowProps = {\n  direction?: 'left' | 'right'\n  isDisabled?: boolean\n  updatePage?: () => void\n}\n\nexport const ClickableArrow: React.FC<ClickableArrowProps> = (props) => {\n  const { direction = 'right', isDisabled = false, updatePage } = props\n\n  const classes = [\n    baseClass,\n    isDisabled && `${baseClass}--is-disabled`,\n    direction && `${baseClass}--${direction}`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <button\n      className={classes}\n      disabled={isDisabled}\n      onClick={!isDisabled ? updatePage : undefined}\n      type=\"button\"\n    >\n      <Chevron />\n    </button>\n  )\n}\n"],"names":["React","Chevron","baseClass","ClickableArrow","props","direction","isDisabled","updatePage","classes","filter","Boolean","join","button","className","disabled","onClick","undefined","type"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAEzB,SAASC,OAAO,QAAQ,kCAAiC;AAGzD,MAAMC,YAAY;AAQlB,OAAO,MAAMC,iBAAgD,CAACC;IAC5D,MAAM,EAAEC,YAAY,OAAO,EAAEC,aAAa,KAAK,EAAEC,UAAU,EAAE,GAAGH;IAEhE,MAAMI,UAAU;QACdN;QACAI,cAAc,CAAC,EAAEJ,UAAU,aAAa,CAAC;QACzCG,aAAa,CAAC,EAAEH,UAAU,EAAE,EAAEG,UAAU,CAAC;KAC1C,CACEI,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,qBACE,KAACC;QACCC,WAAWL;QACXM,UAAUR;QACVS,SAAS,CAACT,aAAaC,aAAaS;QACpCC,MAAK;kBAEL,cAAA,KAAChB;;AAGP,EAAC"}

package/dist/elements/Pagination/Page/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Pagination/Page/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,MAAM,MAAM,SAAS,GAAG;IACtB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,UAAU,CAAC,EAAE,CAAC,IAAI,KAAA,KAAK,IAAI,CAAA;CAC5B,CAAA;AAID,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAqBpC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Pagination/Page/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,MAAM,MAAM,SAAS,GAAG;IACtB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,UAAU,CAAC,EAAE,CAAC,IAAI,KAAA,KAAK,IAAI,CAAA;CAC5B,CAAA;AAID,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAqBpC,CAAA"}

package/dist/elements/Pagination/Page/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 const baseClass = 'paginator__page';

package/dist/elements/Pagination/Page/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/Pagination/Page/index.tsx"],"sourcesContent":["import React from 'react'\n\nexport type PageProps = {\n  isCurrent?: boolean\n  isFirstPage?: boolean\n  isLastPage?: boolean\n  page?: number\n  updatePage?: (page) => void\n}\n\nconst baseClass = 'paginator__page'\n\nexport const Page: React.FC<PageProps> = ({\n  isCurrent,\n  isFirstPage = false,\n  isLastPage = false,\n  page = 1,\n  updatePage,\n}) => {\n  const classes = [\n    baseClass,\n    isCurrent && `${baseClass}--is-current`,\n    isFirstPage && `${baseClass}--is-first-page`,\n    isLastPage && `${baseClass}--is-last-page`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <button className={classes} onClick={() => updatePage(page)} type=\"button\">\n      {page}\n    </button>\n  )\n}\n"],"names":["React","baseClass","Page","isCurrent","isFirstPage","isLastPage","page","updatePage","classes","filter","Boolean","join","button","className","onClick","type"],"rangeMappings":";;;;;;;;;;;;;;;;","mappings":";AAAA,OAAOA,WAAW,QAAO;AAUzB,MAAMC,YAAY;AAElB,OAAO,MAAMC,OAA4B,CAAC,EACxCC,SAAS,EACTC,cAAc,KAAK,EACnBC,aAAa,KAAK,EAClBC,OAAO,CAAC,EACRC,UAAU,EACX;IACC,MAAMC,UAAU;QACdP;QACAE,aAAa,CAAC,EAAEF,UAAU,YAAY,CAAC;QACvCG,eAAe,CAAC,EAAEH,UAAU,eAAe,CAAC;QAC5CI,cAAc,CAAC,EAAEJ,UAAU,cAAc,CAAC;KAC3C,CACEQ,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,qBACE,KAACC;QAAOC,WAAWL;QAASM,SAAS,IAAMP,WAAWD;QAAOS,MAAK;kBAC/DT;;AAGP,EAAC"}
+{"version":3,"sources":["../../../../src/elements/Pagination/Page/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nexport type PageProps = {\n  isCurrent?: boolean\n  isFirstPage?: boolean\n  isLastPage?: boolean\n  page?: number\n  updatePage?: (page) => void\n}\n\nconst baseClass = 'paginator__page'\n\nexport const Page: React.FC<PageProps> = ({\n  isCurrent,\n  isFirstPage = false,\n  isLastPage = false,\n  page = 1,\n  updatePage,\n}) => {\n  const classes = [\n    baseClass,\n    isCurrent && `${baseClass}--is-current`,\n    isFirstPage && `${baseClass}--is-first-page`,\n    isLastPage && `${baseClass}--is-last-page`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <button className={classes} onClick={() => updatePage(page)} type=\"button\">\n      {page}\n    </button>\n  )\n}\n"],"names":["React","baseClass","Page","isCurrent","isFirstPage","isLastPage","page","updatePage","classes","filter","Boolean","join","button","className","onClick","type"],"rangeMappings":";;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAUzB,MAAMC,YAAY;AAElB,OAAO,MAAMC,OAA4B,CAAC,EACxCC,SAAS,EACTC,cAAc,KAAK,EACnBC,aAAa,KAAK,EAClBC,OAAO,CAAC,EACRC,UAAU,EACX;IACC,MAAMC,UAAU;QACdP;QACAE,aAAa,CAAC,EAAEF,UAAU,YAAY,CAAC;QACvCG,eAAe,CAAC,EAAEH,UAAU,eAAe,CAAC;QAC5CI,cAAc,CAAC,EAAEJ,UAAU,cAAc,CAAC;KAC3C,CACEQ,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,qBACE,KAACC;QAAOC,WAAWL;QAASM,SAAS,IAAMP,WAAWD;QAAOS,MAAK;kBAC/DT;;AAGP,EAAC"}

package/dist/elements/Pagination/Separator/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Pagination/Separator/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAgE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Pagination/Separator/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAgE,CAAA"}

package/dist/elements/Pagination/Separator/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 export const Separator = ()=>/*#__PURE__*/ _jsx("span", {

package/dist/elements/Pagination/Separator/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/Pagination/Separator/index.tsx"],"sourcesContent":["import React from 'react'\n\nexport const Separator: React.FC = () => <span className=\"paginator__separator\">&mdash;</span>\n"],"names":["React","Separator","span","className"],"rangeMappings":";;;;;","mappings":";AAAA,OAAOA,WAAW,QAAO;AAEzB,OAAO,MAAMC,YAAsB,kBAAM,KAACC;QAAKC,WAAU;kBAAuB;OAAc"}
+{"version":3,"sources":["../../../../src/elements/Pagination/Separator/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nexport const Separator: React.FC = () => <span className=\"paginator__separator\">&mdash;</span>\n"],"names":["React","Separator","span","className"],"rangeMappings":";;;;;;","mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAEzB,OAAO,MAAMC,YAAsB,kBAAM,KAACC;QAAKC,WAAU;kBAAuB;OAAc"}

package/dist/elements/Popup/PopupTrigger/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Popup/PopupTrigger/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,iBAAiB,GAAG;IAC9B,MAAM,EAAE,OAAO,CAAA;IACf,MAAM,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,UAAU,EAAE,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAA;IACzC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAA;CACrC,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAkCpD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/Popup/PopupTrigger/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,cAAc,CAAA;AAIrB,MAAM,MAAM,iBAAiB,GAAG;IAC9B,MAAM,EAAE,OAAO,CAAA;IACf,MAAM,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,UAAU,EAAE,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAA;IACzC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAA;CACrC,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAkCpD,CAAA"}

package/dist/elements/Popup/PopupTrigger/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 const baseClass = 'popup-button';

package/dist/elements/Popup/PopupTrigger/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/Popup/PopupTrigger/index.tsx"],"sourcesContent":["import React from 'react'\n\nimport './index.scss'\n\nconst baseClass = 'popup-button'\n\nexport type PopupTriggerProps = {\n  active: boolean\n  button: React.ReactNode\n  buttonType: 'custom' | 'default' | 'none'\n  className?: string\n  setActive: (active: boolean) => void\n}\n\nexport const PopupTrigger: React.FC<PopupTriggerProps> = (props) => {\n  const { active, button, buttonType, className, setActive } = props\n\n  const classes = [baseClass, className, `${baseClass}--${buttonType}`].filter(Boolean).join(' ')\n\n  const handleClick = () => {\n    setActive(!active)\n  }\n\n  if (buttonType === 'none') {\n    return null\n  }\n\n  if (buttonType === 'custom') {\n    return (\n      <div\n        className={classes}\n        onClick={handleClick}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter') handleClick()\n        }}\n        role=\"button\"\n        tabIndex={0}\n      >\n        {button}\n      </div>\n    )\n  }\n\n  return (\n    <button className={classes} onClick={() => setActive(!active)} tabIndex={0} type=\"button\">\n      {button}\n    </button>\n  )\n}\n"],"names":["React","baseClass","PopupTrigger","props","active","button","buttonType","className","setActive","classes","filter","Boolean","join","handleClick","div","onClick","onKeyDown","e","key","role","tabIndex","type"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAAA,OAAOA,WAAW,QAAO;AAIzB,MAAMC,YAAY;AAUlB,OAAO,MAAMC,eAA4C,CAACC;IACxD,MAAM,EAAEC,MAAM,EAAEC,MAAM,EAAEC,UAAU,EAAEC,SAAS,EAAEC,SAAS,EAAE,GAAGL;IAE7D,MAAMM,UAAU;QAACR;QAAWM;QAAW,CAAC,EAAEN,UAAU,EAAE,EAAEK,WAAW,CAAC;KAAC,CAACI,MAAM,CAACC,SAASC,IAAI,CAAC;IAE3F,MAAMC,cAAc;QAClBL,UAAU,CAACJ;IACb;IAEA,IAAIE,eAAe,QAAQ;QACzB,OAAO;IACT;IAEA,IAAIA,eAAe,UAAU;QAC3B,qBACE,KAACQ;YACCP,WAAWE;YACXM,SAASF;YACTG,WAAW,CAACC;gBACV,IAAIA,EAAEC,GAAG,KAAK,SAASL;YACzB;YACAM,MAAK;YACLC,UAAU;sBAETf;;IAGP;IAEA,qBACE,KAACA;QAAOE,WAAWE;QAASM,SAAS,IAAMP,UAAU,CAACJ;QAASgB,UAAU;QAAGC,MAAK;kBAC9EhB;;AAGP,EAAC"}
+{"version":3,"sources":["../../../../src/elements/Popup/PopupTrigger/index.tsx"],"sourcesContent":["'use client'\nimport React from 'react'\n\nimport './index.scss'\n\nconst baseClass = 'popup-button'\n\nexport type PopupTriggerProps = {\n  active: boolean\n  button: React.ReactNode\n  buttonType: 'custom' | 'default' | 'none'\n  className?: string\n  setActive: (active: boolean) => void\n}\n\nexport const PopupTrigger: React.FC<PopupTriggerProps> = (props) => {\n  const { active, button, buttonType, className, setActive } = props\n\n  const classes = [baseClass, className, `${baseClass}--${buttonType}`].filter(Boolean).join(' ')\n\n  const handleClick = () => {\n    setActive(!active)\n  }\n\n  if (buttonType === 'none') {\n    return null\n  }\n\n  if (buttonType === 'custom') {\n    return (\n      <div\n        className={classes}\n        onClick={handleClick}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter') handleClick()\n        }}\n        role=\"button\"\n        tabIndex={0}\n      >\n        {button}\n      </div>\n    )\n  }\n\n  return (\n    <button className={classes} onClick={() => setActive(!active)} tabIndex={0} type=\"button\">\n      {button}\n    </button>\n  )\n}\n"],"names":["React","baseClass","PopupTrigger","props","active","button","buttonType","className","setActive","classes","filter","Boolean","join","handleClick","div","onClick","onKeyDown","e","key","role","tabIndex","type"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,WAAW,QAAO;AAIzB,MAAMC,YAAY;AAUlB,OAAO,MAAMC,eAA4C,CAACC;IACxD,MAAM,EAAEC,MAAM,EAAEC,MAAM,EAAEC,UAAU,EAAEC,SAAS,EAAEC,SAAS,EAAE,GAAGL;IAE7D,MAAMM,UAAU;QAACR;QAAWM;QAAW,CAAC,EAAEN,UAAU,EAAE,EAAEK,WAAW,CAAC;KAAC,CAACI,MAAM,CAACC,SAASC,IAAI,CAAC;IAE3F,MAAMC,cAAc;QAClBL,UAAU,CAACJ;IACb;IAEA,IAAIE,eAAe,QAAQ;QACzB,OAAO;IACT;IAEA,IAAIA,eAAe,UAAU;QAC3B,qBACE,KAACQ;YACCP,WAAWE;YACXM,SAASF;YACTG,WAAW,CAACC;gBACV,IAAIA,EAAEC,GAAG,KAAK,SAASL;YACzB;YACAM,MAAK;YACLC,UAAU;sBAETf;;IAGP;IAEA,qBACE,KAACA;QAAOE,WAAWE;QAASM,SAAS,IAAMP,UAAU,CAACJ;QAASgB,UAAU;QAAGC,MAAK;kBAC9EhB;;AAGP,EAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/PreviewSizes/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,IAAI,EACJ,QAAQ,EACR,yBAAyB,EAE1B,MAAM,eAAe,CAAA;AAEtB,OAAO,KAAuC,MAAM,OAAO,CAAA;AAG3D,OAAO,cAAc,CAAA;AAIrB,KAAK,QAAQ,GAAG,QAAQ,GAAG;IACzB,GAAG,EAAE,MAAM,CAAA;CACZ,CAAA;AACD,KAAK,iBAAiB,GAAG;IACvB,CAAC,GAAG,EAAE,MAAM,GAAG,QAAQ,CAAA;CACxB,CAAA;AAsDD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,GAAG,EAAE,IAAI,GAAG;QACV,KAAK,CAAC,EAAE,iBAAiB,CAAA;KAC1B,CAAA;IACD,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,YAAY,EAAE,yBAAyB,CAAC,QAAQ,CAAC,CAAA;CAClD,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA4EpD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/PreviewSizes/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,IAAI,EACJ,QAAQ,EACR,yBAAyB,EAE1B,MAAM,eAAe,CAAA;AAEtB,OAAO,KAAuC,MAAM,OAAO,CAAA;AAG3D,OAAO,cAAc,CAAA;AAIrB,KAAK,QAAQ,GAAG,QAAQ,GAAG;IACzB,GAAG,EAAE,MAAM,CAAA;CACZ,CAAA;AACD,KAAK,iBAAiB,GAAG;IACvB,CAAC,GAAG,EAAE,MAAM,GAAG,QAAQ,CAAA;CACxB,CAAA;AAsDD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,GAAG,EAAE,IAAI,GAAG;QACV,KAAK,CAAC,EAAE,iBAAiB,CAAA;KAC1B,CAAA;IACD,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,YAAY,EAAE,yBAAyB,CAAC,QAAQ,CAAC,CAAA;CAClD,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA4EpD,CAAA"}

package/dist/elements/PreviewSizes/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { useEffect, useMemo, useState } from 'react';
 import { FileMeta } from '../FileDetails/FileMeta/index.js';

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/PreviewSizes/index.tsx"],"sourcesContent":["import type {\n  Data,\n  FileSize,\n  SanitizedCollectionConfig,\n  SanitizedUploadConfig,\n} from 'payload/types'\n\nimport React, { useEffect, useMemo, useState } from 'react'\n\nimport { FileMeta } from '../FileDetails/FileMeta/index.js'\nimport './index.scss'\n\nconst baseClass = 'preview-sizes'\n\ntype FileInfo = FileSize & {\n  url: string\n}\ntype FilesSizesWithUrl = {\n  [key: string]: FileInfo\n}\n\nconst sortSizes = (sizes: FilesSizesWithUrl, imageSizes: SanitizedUploadConfig['imageSizes']) => {\n  if (!imageSizes || imageSizes.length === 0) return sizes\n\n  const orderedSizes: FilesSizesWithUrl = {}\n\n  imageSizes.forEach(({ name }) => {\n    if (sizes[name]) {\n      orderedSizes[name] = sizes[name]\n    }\n  })\n\n  return orderedSizes\n}\n\ntype PreviewSizeCardProps = {\n  active: boolean\n  meta: FileInfo\n  name: string\n  onClick?: () => void\n  previewSrc: string\n}\nconst PreviewSizeCard: React.FC<PreviewSizeCardProps> = ({\n  name,\n  active,\n  meta,\n  onClick,\n  previewSrc,\n}) => {\n  return (\n    <div\n      className={[`${baseClass}__sizeOption`, active && `${baseClass}--selected`]\n        .filter(Boolean)\n        .join(' ')}\n      onClick={typeof onClick === 'function' ? onClick : undefined}\n      onKeyDown={(e) => {\n        if (typeof onClick !== 'function') return\n        if (e.key === 'Enter') onClick()\n      }}\n      role=\"button\"\n      tabIndex={0}\n    >\n      <div className={`${baseClass}__image`}>\n        <img alt={meta.filename} src={previewSrc} />\n      </div>\n      <div className={`${baseClass}__sizeMeta`}>\n        <div className={`${baseClass}__sizeName`}>{name}</div>\n        <FileMeta {...meta} />\n      </div>\n    </div>\n  )\n}\n\nexport type PreviewSizesProps = {\n  doc: Data & {\n    sizes?: FilesSizesWithUrl\n  }\n  imageCacheTag?: string\n  uploadConfig: SanitizedCollectionConfig['upload']\n}\n\nexport const PreviewSizes: React.FC<PreviewSizesProps> = ({ doc, imageCacheTag, uploadConfig }) => {\n  const { imageSizes } = uploadConfig\n  const { sizes } = doc\n\n  const [orderedSizes, setOrderedSizes] = useState<FilesSizesWithUrl>(() =>\n    sortSizes(sizes, imageSizes),\n  )\n  const [selectedSize, setSelectedSize] = useState<null | string>(null)\n\n  const generateImageUrl = (doc) => {\n    if (!doc.filename) return null\n    if (doc.url) return `${doc.url}${imageCacheTag ? `?${imageCacheTag}` : ''}`\n  }\n  useEffect(() => {\n    setOrderedSizes(sortSizes(sizes, imageSizes))\n  }, [sizes, imageSizes, imageCacheTag])\n\n  const mainPreviewSrc = selectedSize\n    ? generateImageUrl(doc.sizes[selectedSize])\n    : generateImageUrl(doc)\n\n  const originalImage = useMemo(\n    (): FileInfo => ({\n      filename: doc.filename,\n      filesize: doc.filesize,\n      height: doc.height,\n      mimeType: doc.mimeType,\n      url: doc.url,\n      width: doc.width,\n    }),\n    [doc],\n  )\n  const originalFilename = 'Original'\n\n  return (\n    <div className={baseClass}>\n      <div className={`${baseClass}__imageWrap`}>\n        <div className={`${baseClass}__meta`}>\n          <div className={`${baseClass}__sizeName`}>{selectedSize || originalFilename}</div>\n          <FileMeta {...(selectedSize ? orderedSizes[selectedSize] : originalImage)} />\n        </div>\n        <img alt={doc.filename} className={`${baseClass}__preview`} src={mainPreviewSrc} />\n      </div>\n      <div className={`${baseClass}__listWrap`}>\n        <div className={`${baseClass}__list`}>\n          <PreviewSizeCard\n            active={!selectedSize}\n            meta={originalImage}\n            name={originalFilename}\n            onClick={() => setSelectedSize(null)}\n            previewSrc={generateImageUrl(doc)}\n          />\n\n          {Object.entries(orderedSizes).map(([key, val]) => {\n            const selected = selectedSize === key\n            const previewSrc = generateImageUrl(val)\n\n            if (previewSrc) {\n              return (\n                <PreviewSizeCard\n                  active={selected}\n                  key={key}\n                  meta={val}\n                  name={key}\n                  onClick={() => setSelectedSize(key)}\n                  previewSrc={previewSrc}\n                />\n              )\n            }\n\n            return null\n          })}\n        </div>\n      </div>\n    </div>\n  )\n}\n"],"names":["React","useEffect","useMemo","useState","FileMeta","baseClass","sortSizes","sizes","imageSizes","length","orderedSizes","forEach","name","PreviewSizeCard","active","meta","onClick","previewSrc","div","className","filter","Boolean","join","undefined","onKeyDown","e","key","role","tabIndex","img","alt","filename","src","PreviewSizes","doc","imageCacheTag","uploadConfig","setOrderedSizes","selectedSize","setSelectedSize","generateImageUrl","url","mainPreviewSrc","originalImage","filesize","height","mimeType","width","originalFilename","Object","entries","map","val","selected"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../src/elements/PreviewSizes/index.tsx"],"sourcesContent":["'use client'\nimport type {\n  Data,\n  FileSize,\n  SanitizedCollectionConfig,\n  SanitizedUploadConfig,\n} from 'payload/types'\n\nimport React, { useEffect, useMemo, useState } from 'react'\n\nimport { FileMeta } from '../FileDetails/FileMeta/index.js'\nimport './index.scss'\n\nconst baseClass = 'preview-sizes'\n\ntype FileInfo = FileSize & {\n  url: string\n}\ntype FilesSizesWithUrl = {\n  [key: string]: FileInfo\n}\n\nconst sortSizes = (sizes: FilesSizesWithUrl, imageSizes: SanitizedUploadConfig['imageSizes']) => {\n  if (!imageSizes || imageSizes.length === 0) return sizes\n\n  const orderedSizes: FilesSizesWithUrl = {}\n\n  imageSizes.forEach(({ name }) => {\n    if (sizes[name]) {\n      orderedSizes[name] = sizes[name]\n    }\n  })\n\n  return orderedSizes\n}\n\ntype PreviewSizeCardProps = {\n  active: boolean\n  meta: FileInfo\n  name: string\n  onClick?: () => void\n  previewSrc: string\n}\nconst PreviewSizeCard: React.FC<PreviewSizeCardProps> = ({\n  name,\n  active,\n  meta,\n  onClick,\n  previewSrc,\n}) => {\n  return (\n    <div\n      className={[`${baseClass}__sizeOption`, active && `${baseClass}--selected`]\n        .filter(Boolean)\n        .join(' ')}\n      onClick={typeof onClick === 'function' ? onClick : undefined}\n      onKeyDown={(e) => {\n        if (typeof onClick !== 'function') return\n        if (e.key === 'Enter') onClick()\n      }}\n      role=\"button\"\n      tabIndex={0}\n    >\n      <div className={`${baseClass}__image`}>\n        <img alt={meta.filename} src={previewSrc} />\n      </div>\n      <div className={`${baseClass}__sizeMeta`}>\n        <div className={`${baseClass}__sizeName`}>{name}</div>\n        <FileMeta {...meta} />\n      </div>\n    </div>\n  )\n}\n\nexport type PreviewSizesProps = {\n  doc: Data & {\n    sizes?: FilesSizesWithUrl\n  }\n  imageCacheTag?: string\n  uploadConfig: SanitizedCollectionConfig['upload']\n}\n\nexport const PreviewSizes: React.FC<PreviewSizesProps> = ({ doc, imageCacheTag, uploadConfig }) => {\n  const { imageSizes } = uploadConfig\n  const { sizes } = doc\n\n  const [orderedSizes, setOrderedSizes] = useState<FilesSizesWithUrl>(() =>\n    sortSizes(sizes, imageSizes),\n  )\n  const [selectedSize, setSelectedSize] = useState<null | string>(null)\n\n  const generateImageUrl = (doc) => {\n    if (!doc.filename) return null\n    if (doc.url) return `${doc.url}${imageCacheTag ? `?${imageCacheTag}` : ''}`\n  }\n  useEffect(() => {\n    setOrderedSizes(sortSizes(sizes, imageSizes))\n  }, [sizes, imageSizes, imageCacheTag])\n\n  const mainPreviewSrc = selectedSize\n    ? generateImageUrl(doc.sizes[selectedSize])\n    : generateImageUrl(doc)\n\n  const originalImage = useMemo(\n    (): FileInfo => ({\n      filename: doc.filename,\n      filesize: doc.filesize,\n      height: doc.height,\n      mimeType: doc.mimeType,\n      url: doc.url,\n      width: doc.width,\n    }),\n    [doc],\n  )\n  const originalFilename = 'Original'\n\n  return (\n    <div className={baseClass}>\n      <div className={`${baseClass}__imageWrap`}>\n        <div className={`${baseClass}__meta`}>\n          <div className={`${baseClass}__sizeName`}>{selectedSize || originalFilename}</div>\n          <FileMeta {...(selectedSize ? orderedSizes[selectedSize] : originalImage)} />\n        </div>\n        <img alt={doc.filename} className={`${baseClass}__preview`} src={mainPreviewSrc} />\n      </div>\n      <div className={`${baseClass}__listWrap`}>\n        <div className={`${baseClass}__list`}>\n          <PreviewSizeCard\n            active={!selectedSize}\n            meta={originalImage}\n            name={originalFilename}\n            onClick={() => setSelectedSize(null)}\n            previewSrc={generateImageUrl(doc)}\n          />\n\n          {Object.entries(orderedSizes).map(([key, val]) => {\n            const selected = selectedSize === key\n            const previewSrc = generateImageUrl(val)\n\n            if (previewSrc) {\n              return (\n                <PreviewSizeCard\n                  active={selected}\n                  key={key}\n                  meta={val}\n                  name={key}\n                  onClick={() => setSelectedSize(key)}\n                  previewSrc={previewSrc}\n                />\n              )\n            }\n\n            return null\n          })}\n        </div>\n      </div>\n    </div>\n  )\n}\n"],"names":["React","useEffect","useMemo","useState","FileMeta","baseClass","sortSizes","sizes","imageSizes","length","orderedSizes","forEach","name","PreviewSizeCard","active","meta","onClick","previewSrc","div","className","filter","Boolean","join","undefined","onKeyDown","e","key","role","tabIndex","img","alt","filename","src","PreviewSizes","doc","imageCacheTag","uploadConfig","setOrderedSizes","selectedSize","setSelectedSize","generateImageUrl","url","mainPreviewSrc","originalImage","filesize","height","mimeType","width","originalFilename","Object","entries","map","val","selected"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAQA,OAAOA,SAASC,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,QAAO;AAE3D,SAASC,QAAQ,QAAQ,mCAAkC;AAG3D,MAAMC,YAAY;AASlB,MAAMC,YAAY,CAACC,OAA0BC;IAC3C,IAAI,CAACA,cAAcA,WAAWC,MAAM,KAAK,GAAG,OAAOF;IAEnD,MAAMG,eAAkC,CAAC;IAEzCF,WAAWG,OAAO,CAAC,CAAC,EAAEC,IAAI,EAAE;QAC1B,IAAIL,KAAK,CAACK,KAAK,EAAE;YACfF,YAAY,CAACE,KAAK,GAAGL,KAAK,CAACK,KAAK;QAClC;IACF;IAEA,OAAOF;AACT;AASA,MAAMG,kBAAkD,CAAC,EACvDD,IAAI,EACJE,MAAM,EACNC,IAAI,EACJC,OAAO,EACPC,UAAU,EACX;IACC,qBACE,MAACC;QACCC,WAAW;YAAC,CAAC,EAAEd,UAAU,YAAY,CAAC;YAAES,UAAU,CAAC,EAAET,UAAU,UAAU,CAAC;SAAC,CACxEe,MAAM,CAACC,SACPC,IAAI,CAAC;QACRN,SAAS,OAAOA,YAAY,aAAaA,UAAUO;QACnDC,WAAW,CAACC;YACV,IAAI,OAAOT,YAAY,YAAY;YACnC,IAAIS,EAAEC,GAAG,KAAK,SAASV;QACzB;QACAW,MAAK;QACLC,UAAU;;0BAEV,KAACV;gBAAIC,WAAW,CAAC,EAAEd,UAAU,OAAO,CAAC;0BACnC,cAAA,KAACwB;oBAAIC,KAAKf,KAAKgB,QAAQ;oBAAEC,KAAKf;;;0BAEhC,MAACC;gBAAIC,WAAW,CAAC,EAAEd,UAAU,UAAU,CAAC;;kCACtC,KAACa;wBAAIC,WAAW,CAAC,EAAEd,UAAU,UAAU,CAAC;kCAAGO;;kCAC3C,KAACR;wBAAU,GAAGW,IAAI;;;;;;AAI1B;AAUA,OAAO,MAAMkB,eAA4C,CAAC,EAAEC,GAAG,EAAEC,aAAa,EAAEC,YAAY,EAAE;IAC5F,MAAM,EAAE5B,UAAU,EAAE,GAAG4B;IACvB,MAAM,EAAE7B,KAAK,EAAE,GAAG2B;IAElB,MAAM,CAACxB,cAAc2B,gBAAgB,GAAGlC,SAA4B,IAClEG,UAAUC,OAAOC;IAEnB,MAAM,CAAC8B,cAAcC,gBAAgB,GAAGpC,SAAwB;IAEhE,MAAMqC,mBAAmB,CAACN;QACxB,IAAI,CAACA,IAAIH,QAAQ,EAAE,OAAO;QAC1B,IAAIG,IAAIO,GAAG,EAAE,OAAO,CAAC,EAAEP,IAAIO,GAAG,CAAC,EAAEN,gBAAgB,CAAC,CAAC,EAAEA,cAAc,CAAC,GAAG,GAAG,CAAC;IAC7E;IACAlC,UAAU;QACRoC,gBAAgB/B,UAAUC,OAAOC;IACnC,GAAG;QAACD;QAAOC;QAAY2B;KAAc;IAErC,MAAMO,iBAAiBJ,eACnBE,iBAAiBN,IAAI3B,KAAK,CAAC+B,aAAa,IACxCE,iBAAiBN;IAErB,MAAMS,gBAAgBzC,QACpB,IAAiB,CAAA;YACf6B,UAAUG,IAAIH,QAAQ;YACtBa,UAAUV,IAAIU,QAAQ;YACtBC,QAAQX,IAAIW,MAAM;YAClBC,UAAUZ,IAAIY,QAAQ;YACtBL,KAAKP,IAAIO,GAAG;YACZM,OAAOb,IAAIa,KAAK;QAClB,CAAA,GACA;QAACb;KAAI;IAEP,MAAMc,mBAAmB;IAEzB,qBACE,MAAC9B;QAAIC,WAAWd;;0BACd,MAACa;gBAAIC,WAAW,CAAC,EAAEd,UAAU,WAAW,CAAC;;kCACvC,MAACa;wBAAIC,WAAW,CAAC,EAAEd,UAAU,MAAM,CAAC;;0CAClC,KAACa;gCAAIC,WAAW,CAAC,EAAEd,UAAU,UAAU,CAAC;0CAAGiC,gBAAgBU;;0CAC3D,KAAC5C;gCAAU,GAAIkC,eAAe5B,YAAY,CAAC4B,aAAa,GAAGK,aAAa;;;;kCAE1E,KAACd;wBAAIC,KAAKI,IAAIH,QAAQ;wBAAEZ,WAAW,CAAC,EAAEd,UAAU,SAAS,CAAC;wBAAE2B,KAAKU;;;;0BAEnE,KAACxB;gBAAIC,WAAW,CAAC,EAAEd,UAAU,UAAU,CAAC;0BACtC,cAAA,MAACa;oBAAIC,WAAW,CAAC,EAAEd,UAAU,MAAM,CAAC;;sCAClC,KAACQ;4BACCC,QAAQ,CAACwB;4BACTvB,MAAM4B;4BACN/B,MAAMoC;4BACNhC,SAAS,IAAMuB,gBAAgB;4BAC/BtB,YAAYuB,iBAAiBN;;wBAG9Be,OAAOC,OAAO,CAACxC,cAAcyC,GAAG,CAAC,CAAC,CAACzB,KAAK0B,IAAI;4BAC3C,MAAMC,WAAWf,iBAAiBZ;4BAClC,MAAMT,aAAauB,iBAAiBY;4BAEpC,IAAInC,YAAY;gCACd,qBACE,KAACJ;oCACCC,QAAQuC;oCAERtC,MAAMqC;oCACNxC,MAAMc;oCACNV,SAAS,IAAMuB,gBAAgBb;oCAC/BT,YAAYA;mCAJPS;4BAOX;4BAEA,OAAO;wBACT;;;;;;AAKV,EAAC"}

package/dist/elements/ReactSelect/ClearIndicator/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/ReactSelect/ClearIndicator/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAA;AAEvD,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,aAAa,CAAA;AAGvD,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,CAwB1E,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/ReactSelect/ClearIndicator/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAA;AAEvD,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,aAAa,CAAA;AAGvD,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,CAwB1E,CAAA"}

package/dist/elements/ReactSelect/ClearIndicator/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import { X } from '../../../icons/X/index.js';

package/dist/elements/ReactSelect/ClearIndicator/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/ReactSelect/ClearIndicator/index.tsx"],"sourcesContent":["import type { ClearIndicatorProps } from 'react-select'\n\nimport React from 'react'\n\nimport type { Option as OptionType } from '../types.js'\n\nimport { X } from '../../../icons/X/index.js'\nimport './index.scss'\n\nconst baseClass = 'clear-indicator'\n\nexport const ClearIndicator: React.FC<ClearIndicatorProps<OptionType, true>> = (props) => {\n  const {\n    clearValue,\n    innerProps: { ref, ...restInnerProps },\n  } = props\n\n  return (\n    <div\n      className={baseClass}\n      // TODO Fix this - Broke with React 19 types\n      ref={typeof ref === 'string' ? null : ref}\n      {...restInnerProps}\n      onKeyDown={(e) => {\n        if (e.key === 'Enter') {\n          clearValue()\n          e.stopPropagation()\n        }\n      }}\n      role=\"button\"\n      tabIndex={0}\n    >\n      <X className={`${baseClass}__icon`} />\n    </div>\n  )\n}\n"],"names":["React","X","baseClass","ClearIndicator","props","clearValue","innerProps","ref","restInnerProps","div","className","onKeyDown","e","key","stopPropagation","role","tabIndex"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAEA,OAAOA,WAAW,QAAO;AAIzB,SAASC,CAAC,QAAQ,4BAA2B;AAG7C,MAAMC,YAAY;AAElB,OAAO,MAAMC,iBAAkE,CAACC;IAC9E,MAAM,EACJC,UAAU,EACVC,YAAY,EAAEC,GAAG,EAAE,GAAGC,gBAAgB,EACvC,GAAGJ;IAEJ,qBACE,KAACK;QACCC,WAAWR;QACX,4CAA4C;QAC5CK,KAAK,OAAOA,QAAQ,WAAW,OAAOA;QACrC,GAAGC,cAAc;QAClBG,WAAW,CAACC;YACV,IAAIA,EAAEC,GAAG,KAAK,SAAS;gBACrBR;gBACAO,EAAEE,eAAe;YACnB;QACF;QACAC,MAAK;QACLC,UAAU;kBAEV,cAAA,KAACf;YAAES,WAAW,CAAC,EAAER,UAAU,MAAM,CAAC;;;AAGxC,EAAC"}
+{"version":3,"sources":["../../../../src/elements/ReactSelect/ClearIndicator/index.tsx"],"sourcesContent":["'use client'\nimport type { ClearIndicatorProps } from 'react-select'\n\nimport React from 'react'\n\nimport type { Option as OptionType } from '../types.js'\n\nimport { X } from '../../../icons/X/index.js'\nimport './index.scss'\n\nconst baseClass = 'clear-indicator'\n\nexport const ClearIndicator: React.FC<ClearIndicatorProps<OptionType, true>> = (props) => {\n  const {\n    clearValue,\n    innerProps: { ref, ...restInnerProps },\n  } = props\n\n  return (\n    <div\n      className={baseClass}\n      // TODO Fix this - Broke with React 19 types\n      ref={typeof ref === 'string' ? null : ref}\n      {...restInnerProps}\n      onKeyDown={(e) => {\n        if (e.key === 'Enter') {\n          clearValue()\n          e.stopPropagation()\n        }\n      }}\n      role=\"button\"\n      tabIndex={0}\n    >\n      <X className={`${baseClass}__icon`} />\n    </div>\n  )\n}\n"],"names":["React","X","baseClass","ClearIndicator","props","clearValue","innerProps","ref","restInnerProps","div","className","onKeyDown","e","key","stopPropagation","role","tabIndex"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,OAAOA,WAAW,QAAO;AAIzB,SAASC,CAAC,QAAQ,4BAA2B;AAG7C,MAAMC,YAAY;AAElB,OAAO,MAAMC,iBAAkE,CAACC;IAC9E,MAAM,EACJC,UAAU,EACVC,YAAY,EAAEC,GAAG,EAAE,GAAGC,gBAAgB,EACvC,GAAGJ;IAEJ,qBACE,KAACK;QACCC,WAAWR;QACX,4CAA4C;QAC5CK,KAAK,OAAOA,QAAQ,WAAW,OAAOA;QACrC,GAAGC,cAAc;QAClBG,WAAW,CAACC;YACV,IAAIA,EAAEC,GAAG,KAAK,SAAS;gBACrBR;gBACAO,EAAEE,eAAe;YACnB;QACF;QACAC,MAAK;QACLC,UAAU;kBAEV,cAAA,KAACf;YAAES,WAAW,CAAC,EAAER,UAAU,MAAM,CAAC;;;AAGxC,EAAC"}

package/dist/elements/ReactSelect/Control/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/ReactSelect/Control/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,cAAc,CAAA;AAEhD,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AAEzC,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAAC,MAAM,EAAE,GAAG,CAAC,CAsCvD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/ReactSelect/Control/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,cAAc,CAAA;AAEhD,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AAEzC,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAAC,MAAM,EAAE,GAAG,CAAC,CAsCvD,CAAA"}

package/dist/elements/ReactSelect/Control/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import { components as SelectComponents } from 'react-select';

package/dist/elements/ReactSelect/Control/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/ReactSelect/Control/index.tsx"],"sourcesContent":["import type { ControlProps } from 'react-select'\n\nimport React from 'react'\nimport { components as SelectComponents } from 'react-select'\n\nimport type { Option } from '../types.js'\n\nexport const Control: React.FC<ControlProps<Option, any>> = (props) => {\n  const {\n    children,\n    innerProps,\n    // @ts-expect-error-next-line // TODO Fix this - moduleResolution 16 breaks our declare module\n    selectProps: { customProps: { disableKeyDown, disableMouseDown } = {} } = {},\n  } = props\n\n  return (\n    <React.Fragment>\n      {/* @ts-expect-error // TODO Fix this - Broke with React 19 types */}\n      <SelectComponents.Control\n        {...props}\n        innerProps={{\n          ...innerProps,\n          onKeyDown: (e) => {\n            if (disableKeyDown) {\n              e.stopPropagation()\n              // Create event for keydown listeners which specifically want to bypass this stopPropagation\n              const bypassEvent = new CustomEvent('bypassKeyDown', { detail: e })\n              document.dispatchEvent(bypassEvent)\n            }\n          },\n          // react-select has this typed incorrectly so we disable the linting rule\n          // we need to prevent react-select from hijacking the 'onKeyDown' event while modals are open (i.e. the 'Relationship' field component)\n          // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n          onMouseDown: (e) => {\n            // we need to prevent react-select from hijacking the 'onMouseDown' event while modals are open (i.e. the 'Relationship' field component)\n            if (!disableMouseDown) {\n              innerProps.onMouseDown(e)\n            }\n          },\n        }}\n      >\n        {children}\n      </SelectComponents.Control>\n    </React.Fragment>\n  )\n}\n"],"names":["React","components","SelectComponents","Control","props","children","innerProps","selectProps","customProps","disableKeyDown","disableMouseDown","Fragment","onKeyDown","e","stopPropagation","bypassEvent","CustomEvent","detail","document","dispatchEvent","onMouseDown"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";AAEA,OAAOA,WAAW,QAAO;AACzB,SAASC,cAAcC,gBAAgB,QAAQ,eAAc;AAI7D,OAAO,MAAMC,UAA+C,CAACC;IAC3D,MAAM,EACJC,QAAQ,EACRC,UAAU,EACV,8FAA8F;IAC9FC,aAAa,EAAEC,aAAa,EAAEC,cAAc,EAAEC,gBAAgB,EAAE,GAAG,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,EAC7E,GAAGN;IAEJ,qBACE,KAACJ,MAAMW,QAAQ;kBAEb,cAAA,KAACT,iBAAiBC,OAAO;YACtB,GAAGC,KAAK;YACTE,YAAY;gBACV,GAAGA,UAAU;gBACbM,WAAW,CAACC;oBACV,IAAIJ,gBAAgB;wBAClBI,EAAEC,eAAe;wBACjB,4FAA4F;wBAC5F,MAAMC,cAAc,IAAIC,YAAY,iBAAiB;4BAAEC,QAAQJ;wBAAE;wBACjEK,SAASC,aAAa,CAACJ;oBACzB;gBACF;gBACA,yEAAyE;gBACzE,uIAAuI;gBACvI,6DAA6D;gBAC7DK,aAAa,CAACP;oBACZ,yIAAyI;oBACzI,IAAI,CAACH,kBAAkB;wBACrBJ,WAAWc,WAAW,CAACP;oBACzB;gBACF;YACF;sBAECR;;;AAIT,EAAC"}
+{"version":3,"sources":["../../../../src/elements/ReactSelect/Control/index.tsx"],"sourcesContent":["'use client'\nimport type { ControlProps } from 'react-select'\n\nimport React from 'react'\nimport { components as SelectComponents } from 'react-select'\n\nimport type { Option } from '../types.js'\n\nexport const Control: React.FC<ControlProps<Option, any>> = (props) => {\n  const {\n    children,\n    innerProps,\n    // @ts-expect-error-next-line // TODO Fix this - moduleResolution 16 breaks our declare module\n    selectProps: { customProps: { disableKeyDown, disableMouseDown } = {} } = {},\n  } = props\n\n  return (\n    <React.Fragment>\n      {/* @ts-expect-error // TODO Fix this - Broke with React 19 types */}\n      <SelectComponents.Control\n        {...props}\n        innerProps={{\n          ...innerProps,\n          onKeyDown: (e) => {\n            if (disableKeyDown) {\n              e.stopPropagation()\n              // Create event for keydown listeners which specifically want to bypass this stopPropagation\n              const bypassEvent = new CustomEvent('bypassKeyDown', { detail: e })\n              document.dispatchEvent(bypassEvent)\n            }\n          },\n          // react-select has this typed incorrectly so we disable the linting rule\n          // we need to prevent react-select from hijacking the 'onKeyDown' event while modals are open (i.e. the 'Relationship' field component)\n          // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n          onMouseDown: (e) => {\n            // we need to prevent react-select from hijacking the 'onMouseDown' event while modals are open (i.e. the 'Relationship' field component)\n            if (!disableMouseDown) {\n              innerProps.onMouseDown(e)\n            }\n          },\n        }}\n      >\n        {children}\n      </SelectComponents.Control>\n    </React.Fragment>\n  )\n}\n"],"names":["React","components","SelectComponents","Control","props","children","innerProps","selectProps","customProps","disableKeyDown","disableMouseDown","Fragment","onKeyDown","e","stopPropagation","bypassEvent","CustomEvent","detail","document","dispatchEvent","onMouseDown"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,OAAOA,WAAW,QAAO;AACzB,SAASC,cAAcC,gBAAgB,QAAQ,eAAc;AAI7D,OAAO,MAAMC,UAA+C,CAACC;IAC3D,MAAM,EACJC,QAAQ,EACRC,UAAU,EACV,8FAA8F;IAC9FC,aAAa,EAAEC,aAAa,EAAEC,cAAc,EAAEC,gBAAgB,EAAE,GAAG,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,EAC7E,GAAGN;IAEJ,qBACE,KAACJ,MAAMW,QAAQ;kBAEb,cAAA,KAACT,iBAAiBC,OAAO;YACtB,GAAGC,KAAK;YACTE,YAAY;gBACV,GAAGA,UAAU;gBACbM,WAAW,CAACC;oBACV,IAAIJ,gBAAgB;wBAClBI,EAAEC,eAAe;wBACjB,4FAA4F;wBAC5F,MAAMC,cAAc,IAAIC,YAAY,iBAAiB;4BAAEC,QAAQJ;wBAAE;wBACjEK,SAASC,aAAa,CAACJ;oBACzB;gBACF;gBACA,yEAAyE;gBACzE,uIAAuI;gBACvI,6DAA6D;gBAC7DK,aAAa,CAACP;oBACZ,yIAAyI;oBACzI,IAAI,CAACH,kBAAkB;wBACrBJ,WAAWc,WAAW,CAACP;oBACzB;gBACF;YACF;sBAECR;;;AAIT,EAAC"}

package/dist/elements/ReactSelect/DropdownIndicator/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/ReactSelect/DropdownIndicator/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAA;AAG1D,OAAO,KAAK,EAAE,EAAE,KAAK,GAAG,EAAE,MAAM,OAAO,CAAA;AAEvC,OAAO,KAAK,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,aAAa,CAAA;AAEvD,OAAO,cAAc,CAAA;AAGrB,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CACtC,sBAAsB,CAAC,UAAU,EAAE,IAAI,CAAC,GAAG;IACzC,UAAU,EAAE,GAAG,CAAC,iBAAiB,CAAC,QAAQ,CAAC,CAAA;CAC5C,CAmBF,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/ReactSelect/DropdownIndicator/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAA;AAG1D,OAAO,KAAK,EAAE,EAAE,KAAK,GAAG,EAAE,MAAM,OAAO,CAAA;AAEvC,OAAO,KAAK,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,aAAa,CAAA;AAEvD,OAAO,cAAc,CAAA;AAGrB,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CACtC,sBAAsB,CAAC,UAAU,EAAE,IAAI,CAAC,GAAG;IACzC,UAAU,EAAE,GAAG,CAAC,iBAAiB,CAAC,QAAQ,CAAC,CAAA;CAC5C,CAmBF,CAAA"}

package/dist/elements/ReactSelect/DropdownIndicator/index.js

@@ -1,3 +1,4 @@
+'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Chevron } from '@payloadcms/ui/icons/Chevron';
 import React from 'react';

package/dist/elements/ReactSelect/DropdownIndicator/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/ReactSelect/DropdownIndicator/index.tsx"],"sourcesContent":["import type { DropdownIndicatorProps } from 'react-select'\n\nimport { Chevron } from '@payloadcms/ui/icons/Chevron'\nimport React, { type JSX } from 'react'\n\nimport type { Option as OptionType } from '../types.js'\n\nimport './index.scss'\n\nconst baseClass = 'dropdown-indicator'\nexport const DropdownIndicator: React.FC<\n  DropdownIndicatorProps<OptionType, true> & {\n    innerProps: JSX.IntrinsicElements['button']\n  }\n> = (props) => {\n  const {\n    innerProps: { ref, ...restInnerProps },\n  } = props\n\n  return (\n    <button\n      className={baseClass}\n      ref={ref}\n      {...restInnerProps}\n      onKeyDown={(e) => {\n        if (e.key === 'Enter') e.key = ' '\n      }}\n      type=\"button\"\n    >\n      <Chevron className={`${baseClass}__icon`} />\n    </button>\n  )\n}\n"],"names":["Chevron","React","baseClass","DropdownIndicator","props","innerProps","ref","restInnerProps","button","className","onKeyDown","e","key","type"],"rangeMappings":";;;;;;;;;;;;;;;;;;","mappings":";AAEA,SAASA,OAAO,QAAQ,+BAA8B;AACtD,OAAOC,WAAyB,QAAO;AAMvC,MAAMC,YAAY;AAClB,OAAO,MAAMC,oBAIT,CAACC;IACH,MAAM,EACJC,YAAY,EAAEC,GAAG,EAAE,GAAGC,gBAAgB,EACvC,GAAGH;IAEJ,qBACE,KAACI;QACCC,WAAWP;QACXI,KAAKA;QACJ,GAAGC,cAAc;QAClBG,WAAW,CAACC;YACV,IAAIA,EAAEC,GAAG,KAAK,SAASD,EAAEC,GAAG,GAAG;QACjC;QACAC,MAAK;kBAEL,cAAA,KAACb;YAAQS,WAAW,CAAC,EAAEP,UAAU,MAAM,CAAC;;;AAG9C,EAAC"}
+{"version":3,"sources":["../../../../src/elements/ReactSelect/DropdownIndicator/index.tsx"],"sourcesContent":["'use client'\nimport type { DropdownIndicatorProps } from 'react-select'\n\nimport { Chevron } from '@payloadcms/ui/icons/Chevron'\nimport React, { type JSX } from 'react'\n\nimport type { Option as OptionType } from '../types.js'\n\nimport './index.scss'\n\nconst baseClass = 'dropdown-indicator'\nexport const DropdownIndicator: React.FC<\n  DropdownIndicatorProps<OptionType, true> & {\n    innerProps: JSX.IntrinsicElements['button']\n  }\n> = (props) => {\n  const {\n    innerProps: { ref, ...restInnerProps },\n  } = props\n\n  return (\n    <button\n      className={baseClass}\n      ref={ref}\n      {...restInnerProps}\n      onKeyDown={(e) => {\n        if (e.key === 'Enter') e.key = ' '\n      }}\n      type=\"button\"\n    >\n      <Chevron className={`${baseClass}__icon`} />\n    </button>\n  )\n}\n"],"names":["Chevron","React","baseClass","DropdownIndicator","props","innerProps","ref","restInnerProps","button","className","onKeyDown","e","key","type"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,SAASA,OAAO,QAAQ,+BAA8B;AACtD,OAAOC,WAAyB,QAAO;AAMvC,MAAMC,YAAY;AAClB,OAAO,MAAMC,oBAIT,CAACC;IACH,MAAM,EACJC,YAAY,EAAEC,GAAG,EAAE,GAAGC,gBAAgB,EACvC,GAAGH;IAEJ,qBACE,KAACI;QACCC,WAAWP;QACXI,KAAKA;QACJ,GAAGC,cAAc;QAClBG,WAAW,CAACC;YACV,IAAIA,EAAEC,GAAG,KAAK,SAASD,EAAEC,GAAG,GAAG;QACjC;QACAC,MAAK;kBAEL,cAAA,KAACb;YAAQS,WAAW,CAAC,EAAEP,UAAU,MAAM,CAAC;;;AAG9C,EAAC"}

package/dist/elements/ReactSelect/Input/index.d.ts

@@ -0,0 +1,5 @@
+import type { ControlProps } from 'react-select';
+import React from 'react';
+import type { Option } from '../types.js';
+export declare const Input: React.FC<ControlProps<Option, any>>;
+//# sourceMappingURL=index.d.ts.map

package/dist/elements/ReactSelect/Input/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/ReactSelect/Input/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,cAAc,CAAA;AAEhD,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AAEzC,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAAC,MAAM,EAAE,GAAG,CAAC,CAcrD,CAAA"}

package/dist/elements/ReactSelect/Input/index.js

@@ -0,0 +1,17 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import { components as SelectComponents } from 'react-select';
+export const Input = (props)=>{
+    return /*#__PURE__*/ _jsx(React.Fragment, {
+        children: /*#__PURE__*/ _jsx(SelectComponents.Input, {
+            ...props,
+            /**
+         * Adding `aria-activedescendant` fixes hydration error
+         * source: https://github.com/JedWatson/react-select/issues/5459#issuecomment-1878037196
+         */ "aria-activedescendant": undefined
+        })
+    });
+};
+
+//# sourceMappingURL=index.js.map

package/dist/elements/ReactSelect/Input/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/elements/ReactSelect/Input/index.tsx"],"sourcesContent":["'use client'\nimport type { ControlProps } from 'react-select'\n\nimport React from 'react'\nimport { components as SelectComponents } from 'react-select'\n\nimport type { Option } from '../types.js'\n\nexport const Input: React.FC<ControlProps<Option, any>> = (props) => {\n  return (\n    <React.Fragment>\n      {/* @ts-expect-error // TODO Fix this - Broke with React 19 types */}\n      <SelectComponents.Input\n        {...props}\n        /**\n         * Adding `aria-activedescendant` fixes hydration error\n         * source: https://github.com/JedWatson/react-select/issues/5459#issuecomment-1878037196\n         */\n        aria-activedescendant={undefined}\n      />\n    </React.Fragment>\n  )\n}\n"],"names":["React","components","SelectComponents","Input","props","Fragment","aria-activedescendant","undefined"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,OAAOA,WAAW,QAAO;AACzB,SAASC,cAAcC,gBAAgB,QAAQ,eAAc;AAI7D,OAAO,MAAMC,QAA6C,CAACC;IACzD,qBACE,KAACJ,MAAMK,QAAQ;kBAEb,cAAA,KAACH,iBAAiBC,KAAK;YACpB,GAAGC,KAAK;YACT;;;SAGC,GACDE,yBAAuBC;;;AAI/B,EAAC"}

package/dist/elements/ReactSelect/MultiValue/index.d.ts

@@ -2,5 +2,6 @@ import type { MultiValueProps } from 'react-select';
 import React from 'react';
 import type { Option } from '../types.js';
 import './index.scss';
+export declare function generateMultiValueDraggableID(optionData: any, valueFunction: any): any;
 export declare const MultiValue: React.FC<MultiValueProps<Option>>;
 //# sourceMappingURL=index.d.ts.map

package/dist/elements/ReactSelect/MultiValue/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/ReactSelect/MultiValue/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAEnD,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AAGzC,OAAO,cAAc,CAAA;AAGrB,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAAC,MAAM,CAAC,CAiDxD,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/ReactSelect/MultiValue/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAEnD,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AAGzC,OAAO,cAAc,CAAA;AAIrB,wBAAgB,6BAA6B,CAAC,UAAU,KAAA,EAAE,aAAa,KAAA,OAEtE;AACD,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAAC,MAAM,CAAC,CAuDxD,CAAA"}

package/dist/elements/ReactSelect/MultiValue/index.js

@@ -1,19 +1,23 @@
+'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
 import { components as SelectComponents } from 'react-select';
 import { useDraggableSortable } from '../../DraggableSortable/useDraggableSortable/index.js';
 const baseClass = 'multi-value';
+export function generateMultiValueDraggableID(optionData, valueFunction) {
+    return typeof valueFunction === 'function' ? valueFunction(optionData) : optionData.value;
+}
 export const MultiValue = (props)=>{
-    const { className, data: { value }, innerProps, isDisabled, // @ts-expect-error // TODO Fix this - moduleResolution 16 breaks our declare module
-    selectProps: { customProps: { disableMouseDown } = {}, isSortable } = {} } = props;
+    const { className, data, innerProps, isDisabled, // @ts-expect-error // TODO Fix this - moduleResolution 16 breaks our declare module
+    selectProps: { customProps: { disableMouseDown } = {}, getOptionValue, isSortable } = {} } = props;
     const { attributes, isDragging, listeners, setNodeRef, transform } = useDraggableSortable({
-        id: typeof value === 'string' && value.toString(),
+        id: generateMultiValueDraggableID(data, getOptionValue),
         disabled: !isSortable
     });
     const classes = [
         baseClass,
         className,
-        !isDisabled && 'draggable',
+        !isDisabled && isSortable && 'draggable',
         isDragging && `${baseClass}--is-dragging`
     ].filter(Boolean).join(' ');
     return /*#__PURE__*/ _jsx(React.Fragment, {
@@ -21,9 +25,11 @@ export const MultiValue = (props)=>{
             ...props,
             className: classes,
             innerProps: {
+                ...isSortable ? {
+                    ...attributes,
+                    ...listeners
+                } : {},
                 ...innerProps,
-                ...attributes,
-                ...listeners,
                 onMouseDown: (e)=>{
                     if (!disableMouseDown) {
                         // we need to prevent the dropdown from opening when clicking on the drag handle, but not when a modal is open (i.e. the 'Relationship' field component)
@@ -31,10 +37,10 @@ export const MultiValue = (props)=>{
                     }
                 },
                 ref: setNodeRef,
-                style: {
+                style: isSortable ? {
                     transform,
                     ...attributes?.style
-                }
+                } : {}
             }
         })
     });