@ruya.sa/ui 3.71.3

package/dist/fields/Array/ArrayRow.js

@@ -0,0 +1,184 @@
+'use client';
+
+import { c as _c } from "react/compiler-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { getTranslation } from '@ruya.sa/translations';
+import React from 'react';
+import { ArrayAction } from '../../elements/ArrayAction/index.js';
+import { Collapsible } from '../../elements/Collapsible/index.js';
+import { ErrorPill } from '../../elements/ErrorPill/index.js';
+import { ShimmerEffect } from '../../elements/ShimmerEffect/index.js';
+import { useFormSubmitted } from '../../forms/Form/context.js';
+import { RenderFields } from '../../forms/RenderFields/index.js';
+import { RowLabel } from '../../forms/RowLabel/index.js';
+import { useThrottledValue } from '../../hooks/useThrottledValue.js';
+import { useTranslation } from '../../providers/Translation/index.js';
+import './index.scss';
+const baseClass = 'array-field';
+export const ArrayRow = t0 => {
+  const $ = _c(41);
+  const {
+    addRow,
+    attributes,
+    copyRow,
+    CustomRowLabel,
+    duplicateRow,
+    errorCount,
+    fields,
+    forceRender: t1,
+    hasMaxRows,
+    isDragging,
+    isLoading: isLoadingFromProps,
+    isSortable,
+    labels,
+    listeners,
+    moveRow,
+    parentPath,
+    pasteRow,
+    path,
+    permissions,
+    readOnly,
+    removeRow,
+    row,
+    rowCount,
+    rowIndex,
+    schemaPath,
+    scrollIdPrefix,
+    setCollapse,
+    setNodeRef,
+    transform,
+    transition
+  } = t0;
+  const forceRender = t1 === undefined ? false : t1;
+  const isLoading = useThrottledValue(isLoadingFromProps, 500);
+  const {
+    i18n
+  } = useTranslation();
+  const hasSubmitted = useFormSubmitted();
+  const fallbackLabel = `${getTranslation(labels.singular, i18n)} ${String(rowIndex + 1).padStart(2, "0")}`;
+  const fieldHasErrors = errorCount > 0 && hasSubmitted;
+  const t2 = fieldHasErrors ? `${baseClass}__row--has-errors` : `${baseClass}__row--no-errors`;
+  let t3;
+  if ($[0] !== t2) {
+    t3 = [`${baseClass}__row`, t2].filter(Boolean);
+    $[0] = t2;
+    $[1] = t3;
+  } else {
+    t3 = $[1];
+  }
+  const classNames = t3.join(" ");
+  const t4 = `${parentPath.split(".").join("-")}-row-${rowIndex}`;
+  const t5 = isDragging ? 1 : undefined;
+  let t6;
+  if ($[2] !== CustomRowLabel || $[3] !== addRow || $[4] !== attributes || $[5] !== classNames || $[6] !== copyRow || $[7] !== duplicateRow || $[8] !== errorCount || $[9] !== fallbackLabel || $[10] !== fieldHasErrors || $[11] !== fields || $[12] !== forceRender || $[13] !== hasMaxRows || $[14] !== i18n || $[15] !== isLoading || $[16] !== isSortable || $[17] !== listeners || $[18] !== moveRow || $[19] !== parentPath || $[20] !== pasteRow || $[21] !== path || $[22] !== permissions || $[23] !== readOnly || $[24] !== removeRow || $[25] !== row.collapsed || $[26] !== row.id || $[27] !== rowCount || $[28] !== rowIndex || $[29] !== schemaPath || $[30] !== scrollIdPrefix || $[31] !== setCollapse || $[32] !== setNodeRef || $[33] !== t4 || $[34] !== t5 || $[35] !== transform || $[36] !== transition) {
+    let t7;
+    if ($[38] !== row.id || $[39] !== setCollapse) {
+      t7 = collapsed => setCollapse(row.id, collapsed);
+      $[38] = row.id;
+      $[39] = setCollapse;
+      $[40] = t7;
+    } else {
+      t7 = $[40];
+    }
+    t6 = _jsx("div", {
+      id: t4,
+      ref: setNodeRef,
+      style: {
+        transform,
+        transition,
+        zIndex: t5
+      },
+      children: _jsx(Collapsible, {
+        actions: !readOnly ? _jsx(ArrayAction, {
+          addRow,
+          copyRow,
+          duplicateRow,
+          hasMaxRows,
+          index: rowIndex,
+          isSortable,
+          moveRow,
+          pasteRow,
+          removeRow,
+          rowCount
+        }) : undefined,
+        className: classNames,
+        collapsibleStyle: fieldHasErrors ? "error" : "default",
+        dragHandleProps: isSortable ? {
+          id: row.id,
+          attributes,
+          listeners
+        } : undefined,
+        header: _jsxs("div", {
+          className: `${baseClass}__row-header`,
+          id: `${scrollIdPrefix}-row-${rowIndex}`,
+          children: [isLoading ? _jsx(ShimmerEffect, {
+            height: "1rem",
+            width: "8rem"
+          }) : _jsx(RowLabel, {
+            CustomComponent: CustomRowLabel,
+            label: fallbackLabel,
+            path,
+            rowNumber: rowIndex
+          }), fieldHasErrors && _jsx(ErrorPill, {
+            count: errorCount,
+            i18n,
+            withMessage: true
+          })]
+        }),
+        isCollapsed: row.collapsed,
+        onToggle: t7,
+        children: isLoading ? _jsx(ShimmerEffect, {}) : _jsx(RenderFields, {
+          className: `${baseClass}__fields`,
+          fields,
+          forceRender,
+          margins: "small",
+          parentIndexPath: "",
+          parentPath: path,
+          parentSchemaPath: schemaPath,
+          permissions: permissions === true ? permissions : permissions?.fields,
+          readOnly
+        })
+      })
+    }, `${parentPath}-row-${row.id}`);
+    $[2] = CustomRowLabel;
+    $[3] = addRow;
+    $[4] = attributes;
+    $[5] = classNames;
+    $[6] = copyRow;
+    $[7] = duplicateRow;
+    $[8] = errorCount;
+    $[9] = fallbackLabel;
+    $[10] = fieldHasErrors;
+    $[11] = fields;
+    $[12] = forceRender;
+    $[13] = hasMaxRows;
+    $[14] = i18n;
+    $[15] = isLoading;
+    $[16] = isSortable;
+    $[17] = listeners;
+    $[18] = moveRow;
+    $[19] = parentPath;
+    $[20] = pasteRow;
+    $[21] = path;
+    $[22] = permissions;
+    $[23] = readOnly;
+    $[24] = removeRow;
+    $[25] = row.collapsed;
+    $[26] = row.id;
+    $[27] = rowCount;
+    $[28] = rowIndex;
+    $[29] = schemaPath;
+    $[30] = scrollIdPrefix;
+    $[31] = setCollapse;
+    $[32] = setNodeRef;
+    $[33] = t4;
+    $[34] = t5;
+    $[35] = transform;
+    $[36] = transition;
+    $[37] = t6;
+  } else {
+    t6 = $[37];
+  }
+  return t6;
+};
+//# sourceMappingURL=ArrayRow.js.map

package/dist/fields/Array/ArrayRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArrayRow.js","names":["c","_c","getTranslation","React","ArrayAction","Collapsible","ErrorPill","ShimmerEffect","useFormSubmitted","RenderFields","RowLabel","useThrottledValue","useTranslation","baseClass","ArrayRow","t0","$","addRow","attributes","copyRow","CustomRowLabel","duplicateRow","errorCount","fields","forceRender","t1","hasMaxRows","isDragging","isLoading","isLoadingFromProps","isSortable","labels","listeners","moveRow","parentPath","pasteRow","path","permissions","readOnly","removeRow","row","rowCount","rowIndex","schemaPath","scrollIdPrefix","setCollapse","setNodeRef","transform","transition","undefined","i18n","hasSubmitted","fallbackLabel","singular","String","padStart","fieldHasErrors","t2","t3","filter","Boolean","classNames","join","t4","split","t5","t6","collapsed","id","t7","_jsx","ref","style","zIndex","children","actions","index","className","collapsibleStyle","dragHandleProps","header","_jsxs","height","width","CustomComponent","label","rowNumber","count","withMessage","onToggle","margins","parentIndexPath","parentSchemaPath"],"sources":["../../../src/fields/Array/ArrayRow.tsx"],"sourcesContent":["'use client'\nimport type {\n  ArrayField,\n  ClientComponentProps,\n  ClientField,\n  Row,\n  SanitizedFieldPermissions,\n} from '@ruya.sa/payload'\n\nimport { getTranslation } from '@ruya.sa/translations'\nimport React from 'react'\n\nimport type { UseDraggableSortableReturn } from '../../elements/DraggableSortable/useDraggableSortable/types.js'\n\nimport { ArrayAction } from '../../elements/ArrayAction/index.js'\nimport { Collapsible } from '../../elements/Collapsible/index.js'\nimport { ErrorPill } from '../../elements/ErrorPill/index.js'\nimport { ShimmerEffect } from '../../elements/ShimmerEffect/index.js'\nimport { useFormSubmitted } from '../../forms/Form/context.js'\nimport { RenderFields } from '../../forms/RenderFields/index.js'\nimport { RowLabel } from '../../forms/RowLabel/index.js'\nimport { useThrottledValue } from '../../hooks/useThrottledValue.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport './index.scss'\n\nconst baseClass = 'array-field'\n\ntype ArrayRowProps = {\n  readonly addRow: (rowIndex: number) => Promise<void> | void\n  readonly copyRow: (rowIndex: number) => void\n  readonly CustomRowLabel?: React.ReactNode\n  readonly duplicateRow: (rowIndex: number) => void\n  readonly errorCount: number\n  readonly fields: ClientField[]\n  readonly hasMaxRows?: boolean\n  readonly isLoading?: boolean\n  readonly isSortable?: boolean\n  readonly labels: Partial<ArrayField['labels']>\n  readonly moveRow: (fromIndex: number, toIndex: number) => void\n  readonly parentPath: string\n  readonly pasteRow: (rowIndex: number) => void\n  readonly path: string\n  readonly permissions: SanitizedFieldPermissions\n  readonly readOnly?: boolean\n  readonly removeRow: (rowIndex: number) => void\n  readonly row: Row\n  readonly rowCount: number\n  readonly rowIndex: number\n  readonly schemaPath: string\n  readonly scrollIdPrefix: string\n  readonly setCollapse: (rowID: string, collapsed: boolean) => void\n} & Pick<ClientComponentProps, 'forceRender'> &\n  UseDraggableSortableReturn\n\nexport const ArrayRow: React.FC<ArrayRowProps> = ({\n  addRow,\n  attributes,\n  copyRow,\n  CustomRowLabel,\n  duplicateRow,\n  errorCount,\n  fields,\n  forceRender = false,\n  hasMaxRows,\n  isDragging,\n  isLoading: isLoadingFromProps,\n  isSortable,\n  labels,\n  listeners,\n  moveRow,\n  parentPath,\n  pasteRow,\n  path,\n  permissions,\n  readOnly,\n  removeRow,\n  row,\n  rowCount,\n  rowIndex,\n  schemaPath,\n  scrollIdPrefix,\n  setCollapse,\n  setNodeRef,\n  transform,\n  transition,\n}) => {\n  const isLoading = useThrottledValue(isLoadingFromProps, 500)\n\n  const { i18n } = useTranslation()\n  const hasSubmitted = useFormSubmitted()\n\n  const fallbackLabel = `${getTranslation(labels.singular, i18n)} ${String(rowIndex + 1).padStart(\n    2,\n    '0',\n  )}`\n\n  const fieldHasErrors = errorCount > 0 && hasSubmitted\n\n  const classNames = [\n    `${baseClass}__row`,\n    fieldHasErrors ? `${baseClass}__row--has-errors` : `${baseClass}__row--no-errors`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  return (\n    <div\n      id={`${parentPath.split('.').join('-')}-row-${rowIndex}`}\n      key={`${parentPath}-row-${row.id}`}\n      ref={setNodeRef}\n      style={{\n        transform,\n        transition,\n        zIndex: isDragging ? 1 : undefined,\n      }}\n    >\n      <Collapsible\n        actions={\n          !readOnly ? (\n            <ArrayAction\n              addRow={addRow}\n              copyRow={copyRow}\n              duplicateRow={duplicateRow}\n              hasMaxRows={hasMaxRows}\n              index={rowIndex}\n              isSortable={isSortable}\n              moveRow={moveRow}\n              pasteRow={pasteRow}\n              removeRow={removeRow}\n              rowCount={rowCount}\n            />\n          ) : undefined\n        }\n        className={classNames}\n        collapsibleStyle={fieldHasErrors ? 'error' : 'default'}\n        dragHandleProps={\n          isSortable\n            ? {\n                id: row.id,\n                attributes,\n                listeners,\n              }\n            : undefined\n        }\n        header={\n          <div className={`${baseClass}__row-header`} id={`${scrollIdPrefix}-row-${rowIndex}`}>\n            {isLoading ? (\n              <ShimmerEffect height=\"1rem\" width=\"8rem\" />\n            ) : (\n              <RowLabel\n                CustomComponent={CustomRowLabel}\n                label={fallbackLabel}\n                path={path}\n                rowNumber={rowIndex}\n              />\n            )}\n            {fieldHasErrors && <ErrorPill count={errorCount} i18n={i18n} withMessage />}\n          </div>\n        }\n        isCollapsed={row.collapsed}\n        onToggle={(collapsed) => setCollapse(row.id, collapsed)}\n      >\n        {isLoading ? (\n          <ShimmerEffect />\n        ) : (\n          <RenderFields\n            className={`${baseClass}__fields`}\n            fields={fields}\n            forceRender={forceRender}\n            margins=\"small\"\n            parentIndexPath=\"\"\n            parentPath={path}\n            parentSchemaPath={schemaPath}\n            permissions={permissions === true ? permissions : permissions?.fields}\n            readOnly={readOnly}\n          />\n        )}\n      </Collapsible>\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AASA,SAASC,cAAc,QAAQ;AAC/B,OAAOC,KAAA,MAAW;AAIlB,SAASC,WAAW,QAAQ;AAC5B,SAASC,WAAW,QAAQ;AAC5B,SAASC,SAAS,QAAQ;AAC1B,SAASC,aAAa,QAAQ;AAC9B,SAASC,gBAAgB,QAAQ;AACjC,SAASC,YAAY,QAAQ;AAC7B,SAASC,QAAQ,QAAQ;AACzB,SAASC,iBAAiB,QAAQ;AAClC,SAASC,cAAc,QAAQ;AAC/B,OAAO;AAEP,MAAMC,SAAA,GAAY;AA6BlB,OAAO,MAAMC,QAAA,GAAoCC,EAAA;EAAA,MAAAC,CAAA,GAAAf,EAAA;EAAC;IAAAgB,MAAA;IAAAC,UAAA;IAAAC,OAAA;IAAAC,cAAA;IAAAC,YAAA;IAAAC,UAAA;IAAAC,MAAA;IAAAC,WAAA,EAAAC,EAAA;IAAAC,UAAA;IAAAC,UAAA;IAAAC,SAAA,EAAAC,kBAAA;IAAAC,UAAA;IAAAC,MAAA;IAAAC,SAAA;IAAAC,OAAA;IAAAC,UAAA;IAAAC,QAAA;IAAAC,IAAA;IAAAC,WAAA;IAAAC,QAAA;IAAAC,SAAA;IAAAC,GAAA;IAAAC,QAAA;IAAAC,QAAA;IAAAC,UAAA;IAAAC,cAAA;IAAAC,WAAA;IAAAC,UAAA;IAAAC,SAAA;IAAAC;EAAA,IAAAjC,EA+BjD;EAvBC,MAAAS,WAAA,GAAAC,EAAmB,KAAAwB,SAAA,WAAnBxB,EAAmB;EAwBnB,MAAAG,SAAA,GAAkBjB,iBAAA,CAAkBkB,kBAAA,KAAoB;EAExD;IAAAqB;EAAA,IAAiBtC,cAAA;EACjB,MAAAuC,YAAA,GAAqB3C,gBAAA;EAErB,MAAA4C,aAAA,GAAsB,GAAGlD,cAAA,CAAe6B,MAAA,CAAAsB,QAAA,EAAiBH,IAAA,KAASI,MAAA,CAAOZ,QAAA,IAAW,EAAAa,QAAA,IAElF,MACC;EAEH,MAAAC,cAAA,GAAuBlC,UAAA,IAAa,IAAK6B,YAAA;EAIvC,MAAAM,EAAA,GAAAD,cAAA,GAAiB,GAAA3C,SAAA,mBAA+B,GAAG,GAAAA,SAAA,kBAA8B;EAAA,IAAA6C,EAAA;EAAA,IAAA1C,CAAA,QAAAyC,EAAA;IAFhEC,EAAA,IACjB,GAAA7C,SAAA,OAAmB,EACnB4C,EAAiF,EAAAE,MAAA,CAAAC,OAEzE;IAAA5C,CAAA,MAAAyC,EAAA;IAAAzC,CAAA,MAAA0C,EAAA;EAAA;IAAAA,EAAA,GAAA1C,CAAA;EAAA;EAJV,MAAA6C,UAAA,GAAmBH,EAIT,CAAAI,IAAA,CACF;EAIA,MAAAC,EAAA,MAAG7B,UAAA,CAAA8B,KAAA,CAAiB,KAAAF,IAAA,CAAU,YAAYpB,QAAA,EAAU;EAM9C,MAAAuB,EAAA,GAAAtC,UAAA,OAAAsB,SAAiB;EAAA,IAAAiB,EAAA;EAAA,IAAAlD,CAAA,QAAAI,cAAA,IAAAJ,CAAA,QAAAC,MAAA,IAAAD,CAAA,QAAAE,UAAA,IAAAF,CAAA,QAAA6C,UAAA,IAAA7C,CAAA,QAAAG,OAAA,IAAAH,CAAA,QAAAK,YAAA,IAAAL,CAAA,QAAAM,UAAA,IAAAN,CAAA,QAAAoC,aAAA,IAAApC,CAAA,SAAAwC,cAAA,IAAAxC,CAAA,SAAAO,MAAA,IAAAP,CAAA,SAAAQ,WAAA,IAAAR,CAAA,SAAAU,UAAA,IAAAV,CAAA,SAAAkC,IAAA,IAAAlC,CAAA,SAAAY,SAAA,IAAAZ,CAAA,SAAAc,UAAA,IAAAd,CAAA,SAAAgB,SAAA,IAAAhB,CAAA,SAAAiB,OAAA,IAAAjB,CAAA,SAAAkB,UAAA,IAAAlB,CAAA,SAAAmB,QAAA,IAAAnB,CAAA,SAAAoB,IAAA,IAAApB,CAAA,SAAAqB,WAAA,IAAArB,CAAA,SAAAsB,QAAA,IAAAtB,CAAA,SAAAuB,SAAA,IAAAvB,CAAA,SAAAwB,GAAA,CAAA2B,SAAA,IAAAnD,CAAA,SAAAwB,GAAA,CAAA4B,EAAA,IAAApD,CAAA,SAAAyB,QAAA,IAAAzB,CAAA,SAAA0B,QAAA,IAAA1B,CAAA,SAAA2B,UAAA,IAAA3B,CAAA,SAAA4B,cAAA,IAAA5B,CAAA,SAAA6B,WAAA,IAAA7B,CAAA,SAAA8B,UAAA,IAAA9B,CAAA,SAAA+C,EAAA,IAAA/C,CAAA,SAAAiD,EAAA,IAAAjD,CAAA,SAAA+B,SAAA,IAAA/B,CAAA,SAAAgC,UAAA;IAAA,IAAAqB,EAAA;IAAA,IAAArD,CAAA,SAAAwB,GAAA,CAAA4B,EAAA,IAAApD,CAAA,SAAA6B,WAAA;MA+CfwB,EAAA,GAAAF,SAAA,IAAetB,WAAA,CAAYL,GAAA,CAAA4B,EAAA,EAAQD,SAAA;MAAAnD,CAAA,OAAAwB,GAAA,CAAA4B,EAAA;MAAApD,CAAA,OAAA6B,WAAA;MAAA7B,CAAA,OAAAqD,EAAA;IAAA;MAAAA,EAAA,GAAArD,CAAA;IAAA;IAtDjDkD,EAAA,GAAAI,IAAA,CAAC;MAAAF,EAAA,EACKL,EAAoD;MAAAQ,GAAA,EAEnDzB,UAAA;MAAA0B,KAAA;QAAAzB,SAAA;QAAAC,UAAA;QAAAyB,MAAA,EAIKR;MAAiB;MAAAS,QAAA,EAG3BJ,IAAA,CAAAjE,WAAA;QAAAsE,OAAA,EAEI,CAACrC,QAAA,GACCgC,IAAA,CAAAlE,WAAA;UAAAa,MAAA;UAAAE,OAAA;UAAAE,YAAA;UAAAK,UAAA;UAAAkD,KAAA,EAKSlC,QAAA;UAAAZ,UAAA;UAAAG,OAAA;UAAAE,QAAA;UAAAI,SAAA;UAAAE;QAAA,C,aAOP;QAAAoC,SAAA,EAEKhB,UAAA;QAAAiB,gBAAA,EACOtB,cAAA,GAAiB,UAAU;QAAAuB,eAAA,EAE3CjD,UAAA;UAAAsC,EAAA,EAEU5B,GAAA,CAAA4B,EAAA;UAAAlD,UAAA;UAAAc;QAAA,IAAAiB,SAIN;QAAA+B,MAAA,EAGJC,KAAA,CAAC;UAAAJ,SAAA,EAAe,GAAAhE,SAAA,cAA0B;UAAAuD,EAAA,EAAM,GAAGxB,cAAA,QAAsBF,QAAA,EAAU;UAAAgC,QAAA,GAChF9C,SAAA,GACC0C,IAAA,CAAA/D,aAAA;YAAA2E,MAAA,EAAsB;YAAAC,KAAA,EAAa;UAAA,C,IAEnCb,IAAA,CAAA5D,QAAA;YAAA0E,eAAA,EACmBhE,cAAA;YAAAiE,KAAA,EACVjC,aAAA;YAAAhB,IAAA;YAAAkD,SAAA,EAEI5C;UAAA,C,GAGdc,cAAA,IAAkBc,IAAA,CAAAhE,SAAA;YAAAiF,KAAA,EAAkBjE,UAAA;YAAA4B,IAAA;YAAAsC,WAAA;UAAA,C;;qBAG5BhD,GAAA,CAAA2B,SAAA;QAAAsB,QAAA,EACHpB,EAAmC;QAAAK,QAAA,EAE5C9C,SAAA,GACC0C,IAAA,CAAA/D,aAAA,IAAC,IAED+D,IAAA,CAAA7D,YAAA;UAAAoE,SAAA,EACa,GAAAhE,SAAA,UAAsB;UAAAU,MAAA;UAAAC,WAAA;UAAAkE,OAAA,EAGzB;UAAAC,eAAA,EACQ;UAAAzD,UAAA,EACJE,IAAA;UAAAwD,gBAAA,EACMjD,UAAA;UAAAN,WAAA,EACLA,WAAA,SAAgB,GAAOA,WAAA,GAAcA,WAAA,EAAAd,MAAa;UAAAe;QAAA,C;;OAjEhE,GAAGJ,UAAA,QAAkBM,GAAA,CAAA4B,EAAA,EAAQ;IAAApD,CAAA,MAAAI,cAAA;IAAAJ,CAAA,MAAAC,MAAA;IAAAD,CAAA,MAAAE,UAAA;IAAAF,CAAA,MAAA6C,UAAA;IAAA7C,CAAA,MAAAG,OAAA;IAAAH,CAAA,MAAAK,YAAA;IAAAL,CAAA,MAAAM,UAAA;IAAAN,CAAA,MAAAoC,aAAA;IAAApC,CAAA,OAAAwC,cAAA;IAAAxC,CAAA,OAAAO,MAAA;IAAAP,CAAA,OAAAQ,WAAA;IAAAR,CAAA,OAAAU,UAAA;IAAAV,CAAA,OAAAkC,IAAA;IAAAlC,CAAA,OAAAY,SAAA;IAAAZ,CAAA,OAAAc,UAAA;IAAAd,CAAA,OAAAgB,SAAA;IAAAhB,CAAA,OAAAiB,OAAA;IAAAjB,CAAA,OAAAkB,UAAA;IAAAlB,CAAA,OAAAmB,QAAA;IAAAnB,CAAA,OAAAoB,IAAA;IAAApB,CAAA,OAAAqB,WAAA;IAAArB,CAAA,OAAAsB,QAAA;IAAAtB,CAAA,OAAAuB,SAAA;IAAAvB,CAAA,OAAAwB,GAAA,CAAA2B,SAAA;IAAAnD,CAAA,OAAAwB,GAAA,CAAA4B,EAAA;IAAApD,CAAA,OAAAyB,QAAA;IAAAzB,CAAA,OAAA0B,QAAA;IAAA1B,CAAA,OAAA2B,UAAA;IAAA3B,CAAA,OAAA4B,cAAA;IAAA5B,CAAA,OAAA6B,WAAA;IAAA7B,CAAA,OAAA8B,UAAA;IAAA9B,CAAA,OAAA+C,EAAA;IAAA/C,CAAA,OAAAiD,EAAA;IAAAjD,CAAA,OAAA+B,SAAA;IAAA/B,CAAA,OAAAgC,UAAA;IAAAhC,CAAA,OAAAkD,EAAA;EAAA;IAAAA,EAAA,GAAAlD,CAAA;EAAA;EAAA,OAFpCkD,EAEoC;AAAA,CAwExC","ignoreList":[]}

package/dist/fields/Array/index.d.ts

@@ -0,0 +1,10 @@
+import type { ArrayFieldClientComponent } from '@ruya.sa/payload';
+import React from 'react';
+import './index.scss';
+export declare const ArrayFieldComponent: ArrayFieldClientComponent;
+export declare const ArrayField: React.FC<{
+    readonly validate?: import("@ruya.sa/payload").ArrayFieldValidation;
+} & import("@ruya.sa/payload").FieldPaths & {
+    readonly field: Omit<import("@ruya.sa/payload").ArrayFieldClient, "type"> & Partial<Pick<import("@ruya.sa/payload").ArrayFieldClient, "type">>;
+} & Omit<import("@ruya.sa/payload").ClientComponentProps, "customComponents" | "field">>;
+//# sourceMappingURL=index.d.ts.map

package/dist/fields/Array/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/Array/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,yBAAyB,EAG1B,MAAM,kBAAkB,CAAA;AAGzB,OAAO,KAAgD,MAAM,OAAO,CAAA;AAiCpE,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,mBAAmB,EAAE,yBA6bjC,CAAA;AAED,eAAO,MAAM,UAAU;;;;wFAAqC,CAAA"}

package/dist/fields/Array/index.js

@@ -0,0 +1,443 @@
+'use client';
+
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { getTranslation } from '@ruya.sa/translations';
+import React, { Fragment, useCallback, useId, useMemo } from 'react';
+import { toast } from 'sonner';
+import { Banner } from '../../elements/Banner/index.js';
+import { Button } from '../../elements/Button/index.js';
+import { clipboardCopy, clipboardPaste } from '../../elements/ClipboardAction/clipboardUtilities.js';
+import { ClipboardAction } from '../../elements/ClipboardAction/index.js';
+import { mergeFormStateFromClipboard, reduceFormStateByPath } from '../../elements/ClipboardAction/mergeFormStateFromClipboard.js';
+import { DraggableSortableItem } from '../../elements/DraggableSortable/DraggableSortableItem/index.js';
+import { DraggableSortable } from '../../elements/DraggableSortable/index.js';
+import { ErrorPill } from '../../elements/ErrorPill/index.js';
+import { RenderCustomComponent } from '../../elements/RenderCustomComponent/index.js';
+import { FieldDescription } from '../../fields/FieldDescription/index.js';
+import { FieldError } from '../../fields/FieldError/index.js';
+import { FieldLabel } from '../../fields/FieldLabel/index.js';
+import { useForm, useFormSubmitted } from '../../forms/Form/context.js';
+import { extractRowsAndCollapsedIDs, toggleAllRows } from '../../forms/Form/rowHelpers.js';
+import { NullifyLocaleField } from '../../forms/NullifyField/index.js';
+import { useField } from '../../forms/useField/index.js';
+import { withCondition } from '../../forms/withCondition/index.js';
+import { useConfig } from '../../providers/Config/index.js';
+import { useDocumentInfo } from '../../providers/DocumentInfo/index.js';
+import { useLocale } from '../../providers/Locale/index.js';
+import { useTranslation } from '../../providers/Translation/index.js';
+import { scrollToID } from '../../utilities/scrollToID.js';
+import { mergeFieldStyles } from '../mergeFieldStyles.js';
+import { fieldBaseClass } from '../shared/index.js';
+import { ArrayRow } from './ArrayRow.js';
+import './index.scss';
+const baseClass = 'array-field';
+export const ArrayFieldComponent = props => {
+  const {
+    field,
+    field: {
+      name,
+      type,
+      admin: {
+        className,
+        description,
+        isSortable = true
+      } = {},
+      fields,
+      label,
+      localized,
+      maxRows,
+      minRows: minRowsProp,
+      required
+    },
+    forceRender = false,
+    path: pathFromProps,
+    permissions,
+    readOnly,
+    schemaPath: schemaPathFromProps,
+    validate
+  } = props;
+  const schemaPath = schemaPathFromProps ?? name;
+  const minRows = minRowsProp ?? (required ? 1 : 0);
+  const {
+    setDocFieldPreferences
+  } = useDocumentInfo();
+  const {
+    addFieldRow,
+    dispatchFields,
+    getFields,
+    moveFieldRow,
+    removeFieldRow,
+    replaceState,
+    setModified
+  } = useForm();
+  const submitted = useFormSubmitted();
+  const {
+    code: locale
+  } = useLocale();
+  const {
+    i18n,
+    t
+  } = useTranslation();
+  const {
+    config: {
+      localization
+    }
+  } = useConfig();
+  const editingDefaultLocale = (() => {
+    if (localization && localization.fallback) {
+      const defaultLocale = localization.defaultLocale;
+      return locale === defaultLocale;
+    }
+    return true;
+  })();
+  // Handle labeling for Arrays, Global Arrays, and Blocks
+  const getLabels = p => {
+    if ('labels' in p && p?.labels) {
+      return p.labels;
+    }
+    if ('labels' in p.field && p.field.labels) {
+      return {
+        plural: p.field.labels?.plural,
+        singular: p.field.labels?.singular
+      };
+    }
+    if ('label' in p.field && p.field.label) {
+      return {
+        plural: undefined,
+        singular: p.field.label
+      };
+    }
+    return {
+      plural: t('general:rows'),
+      singular: t('general:row')
+    };
+  };
+  const labels = getLabels(props);
+  const memoizedValidate = useCallback((value, options) => {
+    // alternative locales can be null
+    if (!editingDefaultLocale && value === null) {
+      return true;
+    }
+    if (typeof validate === 'function') {
+      return validate(value, {
+        ...options,
+        maxRows,
+        minRows,
+        required
+      });
+    }
+  }, [maxRows, minRows, required, validate, editingDefaultLocale]);
+  const {
+    customComponents: {
+      AfterInput,
+      BeforeInput,
+      Description,
+      Error,
+      Label
+    } = {},
+    disabled,
+    errorPaths,
+    path,
+    rows = [],
+    showError,
+    valid,
+    value: value_0
+  } = useField({
+    hasRows: true,
+    potentiallyStalePath: pathFromProps,
+    validate: memoizedValidate
+  });
+  const componentId = useId();
+  const scrollIdPrefix = useMemo(() => `scroll-${componentId}`, [componentId]);
+  const addRow = useCallback(rowIndex => {
+    addFieldRow({
+      path,
+      rowIndex,
+      schemaPath
+    });
+    setTimeout(() => {
+      scrollToID(`${scrollIdPrefix}-row-${rowIndex}`);
+    }, 0);
+  }, [addFieldRow, path, schemaPath, scrollIdPrefix]);
+  const duplicateRow = useCallback(rowIndex_0 => {
+    dispatchFields({
+      type: 'DUPLICATE_ROW',
+      path,
+      rowIndex: rowIndex_0
+    });
+    setModified(true);
+    setTimeout(() => {
+      scrollToID(`${scrollIdPrefix}-row-${rowIndex_0}`);
+    }, 0);
+  }, [dispatchFields, path, scrollIdPrefix, setModified]);
+  const removeRow = useCallback(rowIndex_1 => {
+    removeFieldRow({
+      path,
+      rowIndex: rowIndex_1
+    });
+  }, [removeFieldRow, path]);
+  const moveRow = useCallback((moveFromIndex, moveToIndex) => {
+    moveFieldRow({
+      moveFromIndex,
+      moveToIndex,
+      path
+    });
+  }, [path, moveFieldRow]);
+  const toggleCollapseAll = useCallback(collapsed => {
+    const {
+      collapsedIDs,
+      updatedRows
+    } = toggleAllRows({
+      collapsed,
+      rows
+    });
+    setDocFieldPreferences(path, {
+      collapsed: collapsedIDs
+    });
+    dispatchFields({
+      type: 'SET_ALL_ROWS_COLLAPSED',
+      path,
+      updatedRows
+    });
+  }, [dispatchFields, path, rows, setDocFieldPreferences]);
+  const setCollapse = useCallback((rowID, collapsed_0) => {
+    const {
+      collapsedIDs: collapsedIDs_0,
+      updatedRows: updatedRows_0
+    } = extractRowsAndCollapsedIDs({
+      collapsed: collapsed_0,
+      rowID,
+      rows
+    });
+    dispatchFields({
+      type: 'SET_ROW_COLLAPSED',
+      path,
+      updatedRows: updatedRows_0
+    });
+    setDocFieldPreferences(path, {
+      collapsed: collapsedIDs_0
+    });
+  }, [dispatchFields, path, rows, setDocFieldPreferences]);
+  const copyRow = useCallback(rowIndex_2 => {
+    const formState = {
+      ...getFields()
+    };
+    const clipboardResult = clipboardCopy({
+      type,
+      fields,
+      getDataToCopy: () => reduceFormStateByPath({
+        formState,
+        path,
+        rowIndex: rowIndex_2
+      }),
+      path,
+      rowIndex: rowIndex_2,
+      t
+    });
+    if (typeof clipboardResult === 'string') {
+      toast.error(clipboardResult);
+    } else {
+      toast.success(t('general:copied'));
+    }
+  }, [fields, getFields, path, t, type]);
+  const pasteRow = useCallback(rowIndex_3 => {
+    const formState_0 = {
+      ...getFields()
+    };
+    const pasteArgs = {
+      onPaste: dataFromClipboard => {
+        const newState = mergeFormStateFromClipboard({
+          dataFromClipboard,
+          formState: formState_0,
+          path,
+          rowIndex: rowIndex_3
+        });
+        replaceState(newState);
+        setModified(true);
+      },
+      path,
+      schemaFields: fields,
+      t
+    };
+    const clipboardResult_0 = clipboardPaste(pasteArgs);
+    if (typeof clipboardResult_0 === 'string') {
+      toast.error(clipboardResult_0);
+    }
+  }, [fields, getFields, path, replaceState, setModified, t]);
+  const pasteField = useCallback(dataFromClipboard_0 => {
+    const formState_1 = {
+      ...getFields()
+    };
+    const newState_0 = mergeFormStateFromClipboard({
+      dataFromClipboard: dataFromClipboard_0,
+      formState: formState_1,
+      path
+    });
+    replaceState(newState_0);
+    setModified(true);
+  }, [getFields, path, replaceState, setModified]);
+  const getDataToCopy = useCallback(() => reduceFormStateByPath({
+    formState: {
+      ...getFields()
+    },
+    path
+  }), [getFields, path]);
+  const hasMaxRows = maxRows && rows.length >= maxRows;
+  const fieldErrorCount = errorPaths.length;
+  const fieldHasErrors = submitted && errorPaths.length > 0;
+  const showRequired = (readOnly || disabled) && rows.length === 0;
+  const showMinRows = rows.length && rows.length < minRows || required && rows.length === 0;
+  const styles = useMemo(() => mergeFieldStyles(field), [field]);
+  return /*#__PURE__*/_jsxs("div", {
+    className: [fieldBaseClass, baseClass, className, fieldHasErrors ? `${baseClass}--has-error` : `${baseClass}--has-no-error`].filter(Boolean).join(' '),
+    id: `field-${path.replace(/\./g, '__')}`,
+    style: styles,
+    children: [showError && /*#__PURE__*/_jsx(RenderCustomComponent, {
+      CustomComponent: Error,
+      Fallback: /*#__PURE__*/_jsx(FieldError, {
+        path: path,
+        showError: showError
+      })
+    }), /*#__PURE__*/_jsxs("header", {
+      className: `${baseClass}__header`,
+      children: [/*#__PURE__*/_jsxs("div", {
+        className: `${baseClass}__header-wrap`,
+        children: [/*#__PURE__*/_jsxs("div", {
+          className: `${baseClass}__header-content`,
+          children: [/*#__PURE__*/_jsx("h3", {
+            className: `${baseClass}__title`,
+            children: /*#__PURE__*/_jsx(RenderCustomComponent, {
+              CustomComponent: Label,
+              Fallback: /*#__PURE__*/_jsx(FieldLabel, {
+                as: "span",
+                label: label,
+                localized: localized,
+                path: path,
+                required: required
+              })
+            })
+          }), fieldHasErrors && fieldErrorCount > 0 && /*#__PURE__*/_jsx(ErrorPill, {
+            count: fieldErrorCount,
+            i18n: i18n,
+            withMessage: true
+          })]
+        }), /*#__PURE__*/_jsxs("ul", {
+          className: `${baseClass}__header-actions`,
+          children: [rows?.length > 0 && /*#__PURE__*/_jsxs(Fragment, {
+            children: [/*#__PURE__*/_jsx("li", {
+              children: /*#__PURE__*/_jsx("button", {
+                className: `${baseClass}__header-action`,
+                onClick: () => toggleCollapseAll(true),
+                type: "button",
+                children: t('fields:collapseAll')
+              })
+            }), /*#__PURE__*/_jsx("li", {
+              children: /*#__PURE__*/_jsx("button", {
+                className: `${baseClass}__header-action`,
+                onClick: () => toggleCollapseAll(false),
+                type: "button",
+                children: t('fields:showAll')
+              })
+            })]
+          }), /*#__PURE__*/_jsx("li", {
+            children: /*#__PURE__*/_jsx(ClipboardAction, {
+              allowCopy: rows?.length > 0,
+              allowPaste: !readOnly,
+              className: `${baseClass}__header-action`,
+              disabled: disabled,
+              fields: fields,
+              getDataToCopy: getDataToCopy,
+              onPaste: pasteField,
+              path: path,
+              type: type
+            })
+          })]
+        })]
+      }), /*#__PURE__*/_jsx(RenderCustomComponent, {
+        CustomComponent: Description,
+        Fallback: /*#__PURE__*/_jsx(FieldDescription, {
+          description: description,
+          path: path
+        })
+      })]
+    }), /*#__PURE__*/_jsx(NullifyLocaleField, {
+      fieldValue: value_0,
+      localized: localized,
+      path: path,
+      readOnly: readOnly
+    }), BeforeInput, (rows?.length > 0 || !valid && (showRequired || showMinRows)) && /*#__PURE__*/_jsxs(DraggableSortable, {
+      className: `${baseClass}__draggable-rows`,
+      ids: rows.map(row => row.id),
+      onDragEnd: ({
+        moveFromIndex: moveFromIndex_0,
+        moveToIndex: moveToIndex_0
+      }) => moveRow(moveFromIndex_0, moveToIndex_0),
+      children: [rows.map((rowData, i) => {
+        const {
+          id: rowID_0,
+          isLoading
+        } = rowData;
+        const rowPath = `${path}.${i}`;
+        const rowErrorCount = errorPaths?.filter(errorPath => errorPath.startsWith(rowPath + '.')).length;
+        return /*#__PURE__*/_jsx(DraggableSortableItem, {
+          disabled: readOnly || disabled || !isSortable,
+          id: rowID_0,
+          children: draggableSortableItemProps => /*#__PURE__*/_jsx(ArrayRow, {
+            ...draggableSortableItemProps,
+            addRow: addRow,
+            copyRow: copyRow,
+            CustomRowLabel: rows?.[i]?.customComponents?.RowLabel,
+            duplicateRow: duplicateRow,
+            errorCount: rowErrorCount,
+            fields: fields,
+            forceRender: forceRender,
+            hasMaxRows: hasMaxRows,
+            isLoading: isLoading,
+            isSortable: isSortable,
+            labels: labels,
+            moveRow: moveRow,
+            parentPath: path,
+            pasteRow: pasteRow,
+            path: rowPath,
+            permissions: permissions,
+            readOnly: readOnly || disabled,
+            removeRow: removeRow,
+            row: rowData,
+            rowCount: rows?.length,
+            rowIndex: i,
+            schemaPath: schemaPath,
+            scrollIdPrefix: scrollIdPrefix,
+            setCollapse: setCollapse
+          })
+        }, rowID_0);
+      }), !valid && /*#__PURE__*/_jsxs(React.Fragment, {
+        children: [showRequired && /*#__PURE__*/_jsx(Banner, {
+          children: t('validation:fieldHasNo', {
+            label: getTranslation(labels.plural, i18n)
+          })
+        }), showMinRows && /*#__PURE__*/_jsx(Banner, {
+          type: "error",
+          children: t('validation:requiresAtLeast', {
+            count: minRows,
+            label: getTranslation(minRows > 1 ? labels.plural : labels.singular, i18n) || t(minRows > 1 ? 'general:rows' : 'general:row')
+          })
+        })]
+      })]
+    }), !hasMaxRows && !readOnly && /*#__PURE__*/_jsx(Button, {
+      buttonStyle: "icon-label",
+      className: `${baseClass}__add-row`,
+      disabled: disabled,
+      icon: "plus",
+      iconPosition: "left",
+      iconStyle: "with-border",
+      onClick: () => {
+        void addRow(value_0 || 0);
+      },
+      children: t('fields:addLabel', {
+        label: getTranslation(labels.singular, i18n)
+      })
+    }), AfterInput]
+  });
+};
+export const ArrayField = withCondition(ArrayFieldComponent);
+//# sourceMappingURL=index.js.map