@ruya.sa/ui 3.71.3

package/dist/elements/BulkUpload/FileSidebar/index.scss

@@ -0,0 +1,337 @@
+@import '../../../scss/styles.scss';
+
+@layer payload-default {
+  .file-selections {
+    --file-gutter-h: calc(var(--gutter-h) / 4);
+    border-right: 1px solid var(--theme-border-color);
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    width: 300px;
+    overflow: visible;
+    max-height: 100%;
+
+    &__header {
+      position: sticky;
+      top: 0;
+      margin-top: var(--base);
+      z-index: 1;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      width: 100%;
+      background: var(--theme-bg);
+      flex-wrap: wrap;
+
+      p {
+        margin: 0;
+      }
+    }
+
+    &__collectionSelect {
+      width: 100%;
+
+      .react-select {
+        width: 100%;
+      }
+      .field-type__wrap {
+        width: 100%;
+        padding-block: var(--base);
+        padding-inline: var(--file-gutter-h);
+      }
+    }
+
+    &__headerTopRow {
+      display: flex;
+      align-items: flex-end;
+      justify-content: space-between;
+      gap: var(--base);
+      width: 100%;
+      padding-block: var(--base);
+      padding-inline: var(--file-gutter-h);
+    }
+
+    &__header__text {
+      display: flex;
+      flex-direction: column;
+      gap: calc(var(--base) / 4);
+
+      .error-pill {
+        align-self: flex-start;
+      }
+    }
+
+    &__filesContainer {
+      display: flex;
+      flex-direction: column;
+      gap: calc(var(--base) / 4);
+      margin-top: calc(var(--base) / 2);
+      width: 100%;
+      padding-inline: var(--file-gutter-h);
+
+      .shimmer-effect {
+        border-radius: var(--style-radius-m);
+      }
+    }
+
+    &__fileRowContainer {
+      --rowPadding: calc(var(--base) / 4);
+      position: relative;
+      &:last-child {
+        margin-bottom: calc(var(--base) / 4);
+      }
+    }
+
+    &__fileRow {
+      @include btn-reset;
+      display: flex;
+      padding: var(--rowPadding);
+      align-items: center;
+      gap: calc(var(--base) / 2);
+      border-radius: var(--style-radius-m);
+      max-width: 100%;
+      cursor: pointer;
+      width: 100%;
+
+      &:hover {
+        background-color: var(--theme-elevation-100);
+      }
+
+      .file-selections__thumbnail,
+      .file-selections__thumbnail-shimmer {
+        width: calc(var(--base) * 1.2);
+        height: calc(var(--base) * 1.2);
+        border-radius: var(--style-radius-s);
+        flex-shrink: 0;
+        object-fit: cover;
+      }
+
+      p {
+        margin: 0;
+      }
+    }
+
+    &__fileDetails {
+      display: flex;
+      flex-direction: column;
+      min-width: 0;
+    }
+
+    &__fileRowContainer--active {
+      .file-selections__fileRow {
+        background-color: var(--theme-elevation-100);
+      }
+
+      .file-selections__remove {
+        .icon--x {
+          opacity: 1;
+        }
+      }
+    }
+
+    &__fileRowContainer--error {
+      .file-selections__fileRow {
+        background-color: var(--theme-error-100);
+      }
+
+      &.file-selections__fileRowContainer--active .file-selections__fileRow,
+      .file-selections__fileRow:hover {
+        background-color: var(--theme-error-200);
+      }
+
+      .file-selections__remove--overlay:hover {
+        background-color: var(--theme-error-50);
+
+        .icon--x {
+          opacity: 1;
+        }
+      }
+    }
+
+    &__errorCount {
+      margin-left: auto;
+      position: absolute;
+      transform: translate(50%, -50%);
+      top: 0;
+      right: 0;
+    }
+
+    &__fileName {
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+
+    &__fileSize {
+      font-size: calc(var(--base) / 2);
+      color: var(--theme-elvation-400);
+      flex-shrink: 0;
+    }
+
+    &__remove {
+      @include btn-reset;
+      margin: 0;
+      margin-left: auto;
+
+      .icon--x {
+        opacity: 0.75;
+      }
+    }
+
+    &__remove--underlay {
+      pointer-events: none;
+      opacity: 0;
+    }
+
+    &__remove--overlay {
+      position: absolute;
+      transform: translateY(-50%);
+      top: 50%;
+      bottom: 50%;
+      right: var(--rowPadding);
+      height: 20px;
+      border-radius: var(--style-radius-m);
+      cursor: pointer;
+
+      &:hover {
+        background-color: var(--theme-elevation-200);
+      }
+    }
+
+    &__header__actions {
+      display: flex;
+      align-items: center;
+      gap: var(--base);
+    }
+
+    &__header__addFile {
+      height: fit-content;
+    }
+
+    &__toggler {
+      display: none;
+      margin: 0;
+      padding-block: 0;
+
+      &__text {
+        display: none;
+      }
+    }
+
+    &__header__mobileDocActions {
+      display: none;
+    }
+
+    &__animateWrapper {
+      overflow: auto;
+    }
+
+    &__mobileBlur {
+      @include blur-bg;
+      position: fixed;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      opacity: 0;
+      transition: opacity 100ms cubic-bezier(0, 0.2, 0.2, 1);
+    }
+
+    &__showingFiles {
+      .file-selections__mobileBlur {
+        opacity: 1;
+      }
+    }
+
+    @include mid-break {
+      --file-gutter-h: var(--gutter-h);
+      flex-direction: column-reverse;
+      width: 100%;
+      position: sticky;
+      bottom: 0;
+      flex-shrink: 0;
+
+      &__showingFiles {
+        z-index: 2;
+      }
+
+      &__filesContainer {
+        @include blur-bg;
+      }
+
+      &__fileRowContainer {
+        z-index: 1;
+      }
+
+      &__header {
+        margin-top: 0;
+      }
+
+      &__headerTopRow {
+        border-top: 1px solid var(--theme-border-color);
+        padding-block: 0 calc(var(--base) * 0.8) 0;
+      }
+
+      &__header__text {
+        display: none;
+      }
+
+      &__header__actions {
+        flex-grow: 2;
+        display: flex;
+        justify-content: flex-end;
+      }
+
+      &__header__mobileDocActions {
+        position: relative;
+        display: flex;
+        width: 100%;
+        padding-block: calc(var(--base) * 0.8);
+        padding-inline: var(--file-gutter-h);
+        border-top: 1px solid var(--theme-border-color);
+
+        > div {
+          display: flex;
+          justify-content: flex-end;
+          width: 100%;
+          button {
+            flex: 0.5;
+          }
+        }
+      }
+
+      &__toggler {
+        padding-right: 0;
+        padding-left: 0;
+        padding-top: calc(var(--base) * 0.8);
+        padding-bottom: calc(var(--base) * 0.8);
+        display: flex;
+        justify-content: flex-end;
+        flex-grow: 1;
+
+        .btn__label {
+          width: 100%;
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+        }
+
+        &__text {
+          display: flex;
+        }
+
+        svg {
+          max-width: 1.5rem;
+        }
+
+        .btn__content {
+          width: 100%;
+        }
+      }
+
+      .btn {
+        margin: 0;
+      }
+    }
+  }
+}

package/dist/elements/BulkUpload/FormsManager/createFormData.d.ts

@@ -0,0 +1,4 @@
+import type { CollectionSlug, FormState } from '@ruya.sa/payload';
+import type { UploadHandlersContext } from '../../../providers/UploadHandlers/index.js';
+export declare function createFormData(formState: FormState, overrides: Record<string, any>, collectionSlug: CollectionSlug, uploadHandler: ReturnType<UploadHandlersContext['getUploadHandler']>): Promise<FormData>;
+//# sourceMappingURL=createFormData.d.ts.map

package/dist/elements/BulkUpload/FormsManager/createFormData.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createFormData.d.ts","sourceRoot":"","sources":["../../../../src/elements/BulkUpload/FormsManager/createFormData.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAA;AAKjE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,4CAA4C,CAAA;AAEvF,wBAAsB,cAAc,CAClC,SAAS,EAAE,SAAc,EACzB,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAM,EACnC,cAAc,EAAE,cAAc,EAC9B,aAAa,EAAE,UAAU,CAAC,qBAAqB,CAAC,kBAAkB,CAAC,CAAC,qBAuCrE"}

package/dist/elements/BulkUpload/FormsManager/createFormData.js

@@ -0,0 +1,38 @@
+import { serialize } from 'object-to-formdata';
+import { reduceFieldsToValues } from '@ruya.sa/payload/shared';
+export async function createFormData(formState = {}, overrides = {}, collectionSlug, uploadHandler) {
+  const data = reduceFieldsToValues(formState, true);
+  let file = data?.file;
+  if (file) {
+    delete data.file;
+  }
+  if (file && typeof uploadHandler === 'function') {
+    let filename = file.name;
+    const clientUploadContext = await uploadHandler({
+      file,
+      updateFilename: value => {
+        filename = value;
+      }
+    });
+    file = JSON.stringify({
+      clientUploadContext,
+      collectionSlug,
+      filename,
+      mimeType: file.type,
+      size: file.size
+    });
+  }
+  const dataWithOverrides = {
+    ...data,
+    ...overrides
+  };
+  const dataToSerialize = {
+    _payload: JSON.stringify(dataWithOverrides),
+    file
+  };
+  return serialize(dataToSerialize, {
+    indices: true,
+    nullsAsUndefineds: false
+  });
+}
+//# sourceMappingURL=createFormData.js.map

package/dist/elements/BulkUpload/FormsManager/createFormData.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createFormData.js","names":["serialize","reduceFieldsToValues","createFormData","formState","overrides","collectionSlug","uploadHandler","data","file","filename","name","clientUploadContext","updateFilename","value","JSON","stringify","mimeType","type","size","dataWithOverrides","dataToSerialize","_payload","indices","nullsAsUndefineds"],"sources":["../../../../src/elements/BulkUpload/FormsManager/createFormData.ts"],"sourcesContent":["import type { CollectionSlug, FormState } from '@ruya.sa/payload'\n\nimport { serialize } from 'object-to-formdata'\nimport { reduceFieldsToValues } from '@ruya.sa/payload/shared'\n\nimport type { UploadHandlersContext } from '../../../providers/UploadHandlers/index.js'\n\nexport async function createFormData(\n  formState: FormState = {},\n  overrides: Record<string, any> = {},\n  collectionSlug: CollectionSlug,\n  uploadHandler: ReturnType<UploadHandlersContext['getUploadHandler']>,\n) {\n  const data = reduceFieldsToValues(formState, true)\n  let file = data?.file\n\n  if (file) {\n    delete data.file\n  }\n\n  if (file && typeof uploadHandler === 'function') {\n    let filename = file.name\n\n    const clientUploadContext = await uploadHandler({\n      file,\n      updateFilename: (value) => {\n        filename = value\n      },\n    })\n\n    file = JSON.stringify({\n      clientUploadContext,\n      collectionSlug,\n      filename,\n      mimeType: file.type,\n      size: file.size,\n    })\n  }\n\n  const dataWithOverrides = {\n    ...data,\n    ...overrides,\n  }\n\n  const dataToSerialize = {\n    _payload: JSON.stringify(dataWithOverrides),\n    file,\n  }\n\n  return serialize(dataToSerialize, { indices: true, nullsAsUndefineds: false })\n}\n"],"mappings":"AAEA,SAASA,SAAS,QAAQ;AAC1B,SAASC,oBAAoB,QAAQ;AAIrC,OAAO,eAAeC,eACpBC,SAAA,GAAuB,CAAC,CAAC,EACzBC,SAAA,GAAiC,CAAC,CAAC,EACnCC,cAA8B,EAC9BC,aAAoE;EAEpE,MAAMC,IAAA,GAAON,oBAAA,CAAqBE,SAAA,EAAW;EAC7C,IAAIK,IAAA,GAAOD,IAAA,EAAMC,IAAA;EAEjB,IAAIA,IAAA,EAAM;IACR,OAAOD,IAAA,CAAKC,IAAI;EAClB;EAEA,IAAIA,IAAA,IAAQ,OAAOF,aAAA,KAAkB,YAAY;IAC/C,IAAIG,QAAA,GAAWD,IAAA,CAAKE,IAAI;IAExB,MAAMC,mBAAA,GAAsB,MAAML,aAAA,CAAc;MAC9CE,IAAA;MACAI,cAAA,EAAiBC,KAAA;QACfJ,QAAA,GAAWI,KAAA;MACb;IACF;IAEAL,IAAA,GAAOM,IAAA,CAAKC,SAAS,CAAC;MACpBJ,mBAAA;MACAN,cAAA;MACAI,QAAA;MACAO,QAAA,EAAUR,IAAA,CAAKS,IAAI;MACnBC,IAAA,EAAMV,IAAA,CAAKU;IACb;EACF;EAEA,MAAMC,iBAAA,GAAoB;IACxB,GAAGZ,IAAI;IACP,GAAGH;EACL;EAEA,MAAMgB,eAAA,GAAkB;IACtBC,QAAA,EAAUP,IAAA,CAAKC,SAAS,CAACI,iBAAA;IACzBX;EACF;EAEA,OAAOR,SAAA,CAAUoB,eAAA,EAAiB;IAAEE,OAAA,EAAS;IAAMC,iBAAA,EAAmB;EAAM;AAC9E","ignoreList":[]}

package/dist/elements/BulkUpload/FormsManager/index.d.ts

@@ -0,0 +1,41 @@
+import type { Data, DocumentSlots, FormState, SanitizedDocumentPermissions, UploadEdits } from '@ruya.sa/payload';
+import React from 'react';
+import type { State } from './reducer.js';
+type FormsManagerContext = {
+    readonly activeIndex: State['activeIndex'];
+    readonly addFiles: (filelist: FileList) => Promise<void>;
+    readonly bulkUpdateForm: (updatedFields: Record<string, unknown>, afterStateUpdate?: () => void) => Promise<void>;
+    readonly collectionSlug: string;
+    readonly docPermissions?: SanitizedDocumentPermissions;
+    readonly documentSlots: DocumentSlots;
+    readonly forms: State['forms'];
+    getFormDataRef: React.RefObject<() => Data>;
+    readonly hasPublishPermission: boolean;
+    readonly hasSavePermission: boolean;
+    readonly hasSubmitted: boolean;
+    readonly isInitializing: boolean;
+    readonly removeFile: (index: number) => void;
+    readonly resetUploadEdits?: () => void;
+    readonly saveAllDocs: ({ overrides }?: {
+        overrides?: Record<string, unknown>;
+    }) => Promise<void>;
+    readonly setActiveIndex: (index: number) => void;
+    readonly setFormTotalErrorCount: ({ errorCount, index, }: {
+        errorCount: number;
+        index: number;
+    }) => void;
+    readonly totalErrorCount?: number;
+    readonly updateUploadEdits: (args: UploadEdits) => void;
+};
+export type InitialForms = Array<{
+    file: File;
+    formID?: string;
+    initialState?: FormState | null;
+}>;
+type FormsManagerProps = {
+    readonly children: React.ReactNode;
+};
+export declare function FormsManagerProvider({ children }: FormsManagerProps): React.JSX.Element;
+export declare function useFormsManager(): FormsManagerContext;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/elements/BulkUpload/FormsManager/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/BulkUpload/FormsManager/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAEV,IAAI,EACJ,aAAa,EACb,SAAS,EAET,4BAA4B,EAC5B,WAAW,EACZ,MAAM,kBAAkB,CAAA;AAKzB,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,cAAc,CAAA;AAgBzC,KAAK,mBAAmB,GAAG;IACzB,QAAQ,CAAC,WAAW,EAAE,KAAK,CAAC,aAAa,CAAC,CAAA;IAC1C,QAAQ,CAAC,QAAQ,EAAE,CAAC,QAAQ,EAAE,QAAQ,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IACxD,QAAQ,CAAC,cAAc,EAAE,CACvB,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACtC,gBAAgB,CAAC,EAAE,MAAM,IAAI,KAC1B,OAAO,CAAC,IAAI,CAAC,CAAA;IAClB,QAAQ,CAAC,cAAc,EAAE,MAAM,CAAA;IAC/B,QAAQ,CAAC,cAAc,CAAC,EAAE,4BAA4B,CAAA;IACtD,QAAQ,CAAC,aAAa,EAAE,aAAa,CAAA;IACrC,QAAQ,CAAC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,CAAA;IAC9B,cAAc,EAAE,KAAK,CAAC,SAAS,CAAC,MAAM,IAAI,CAAC,CAAA;IAC3C,QAAQ,CAAC,oBAAoB,EAAE,OAAO,CAAA;IACtC,QAAQ,CAAC,iBAAiB,EAAE,OAAO,CAAA;IACnC,QAAQ,CAAC,YAAY,EAAE,OAAO,CAAA;IAC9B,QAAQ,CAAC,cAAc,EAAE,OAAO,CAAA;IAChC,QAAQ,CAAC,UAAU,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAC5C,QAAQ,CAAC,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAA;IACtC,QAAQ,CAAC,WAAW,EAAE,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;KAAE,KAAK,OAAO,CAAC,IAAI,CAAC,CAAA;IAChG,QAAQ,CAAC,cAAc,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAChD,QAAQ,CAAC,sBAAsB,EAAE,CAAC,EAChC,UAAU,EACV,KAAK,GACN,EAAE;QACD,UAAU,EAAE,MAAM,CAAA;QAClB,KAAK,EAAE,MAAM,CAAA;KACd,KAAK,IAAI,CAAA;IACV,QAAQ,CAAC,eAAe,CAAC,EAAE,MAAM,CAAA;IACjC,QAAQ,CAAC,iBAAiB,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAA;CACxD,CAAA;AA6BD,MAAM,MAAM,YAAY,GAAG,KAAK,CAAC;IAC/B,IAAI,EAAE,IAAI,CAAA;IACV,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,YAAY,CAAC,EAAE,SAAS,GAAG,IAAI,CAAA;CAChC,CAAC,CAAA;AAEF,KAAK,iBAAiB,GAAG;IACvB,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CACnC,CAAA;AAED,wBAAgB,oBAAoB,CAAC,EAAE,QAAQ,EAAE,EAAE,iBAAiB,qBAyjBnE;AAED,wBAAgB,eAAe,wBAE9B"}