@vuu-ui/vuu-table-extras 2.3.0 → 3.0.0-beta.2

package/esm/packages/vuu-table-extras/src/index.js

@@ -1,7 +1,7 @@
 export { CalculatedColumnPanel } from './calculated-column/CalculatedColumnPanel.js';
 export { CsvUpload } from './csv-upload/CsvUpload.js';
 export { useCsvUpload } from './csv-upload/useCsvUpload.js';
-export { useCsvUploadSessionPreview } from './csv-upload/useCsvUploadSessionPreview.js';
+export { DataUploadPreview } from './csv-upload/data-upload-preview/DataUploadPreview.js';
 export { validateCsvAgainstSchema } from './csv-upload/parse/csv-schema-validation.js';
 export { parseCsv } from './csv-upload/parse/csv-parse.js';
 export { CsvParseErrorEnum, CsvValidationErrorEnum } from './csv-upload/parse/csv-errors.js';
@@ -35,6 +35,8 @@ export { useColumnSettings } from './column-settings-panel/useColumnSettings.js'
 export { DataSourceStats } from './datasource-stats/DatasourceStats.js';
 export { FreezeControl } from './freeze-control/FreezeControl.js';
 export { FrozenBanner } from './freeze-control/FrozenBanner.js';
+export { InlineAddRow } from './inline-add-row/InlineAddRow.js';
+export { useInlineAddRow } from './inline-add-row/useInlineAddRow.js';
 export { TabbedTableConfigPanel } from './tabbed-table-config-panel/TabbedTableConfigPanel.js';
 export { TabbedTableSettingsAction } from './tabbed-table-config-panel/TabbedTableSettingsAction.js';
 export { TableFooter, TableFooterTray } from './table-footer/TableFooter.js';

package/esm/packages/vuu-table-extras/src/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/esm/packages/vuu-table-extras/src/inline-add-row/InlineAddRow.css.js

@@ -0,0 +1,4 @@
+var inlineAddRowCss = ".vuuInlineAddRow {\n  --row-borderColor: transparent;\n\n  display: flex;\n  height: var(--row-height, var(--salt-size-base));\n  padding: 0 var(--table-selection-bookend-width, 4px);\n  position: relative;\n\n  .vuuTableCell {\n    height: 100%;\n  }\n}\n";
+
+export { inlineAddRowCss as default };
+//# sourceMappingURL=InlineAddRow.css.js.map

package/esm/packages/vuu-table-extras/src/inline-add-row/InlineAddRow.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineAddRow.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/esm/packages/vuu-table-extras/src/inline-add-row/InlineAddRow.js

@@ -0,0 +1,42 @@
+import { jsx } from 'react/jsx-runtime';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
+import { Row } from '@vuu-ui/vuu-table';
+import cx from 'clsx';
+import { useInlineAddRow } from './useInlineAddRow.js';
+import inlineAddRowCss from './InlineAddRow.css.js';
+
+const classBase = "vuuInlineAddRow";
+const InlineAddRow = ({
+  ariaRowIndex,
+  className,
+  columns,
+  style
+}) => {
+  const targetWindow = useWindow();
+  useComponentCssInjection({
+    testId: "vuu-inline-add-row",
+    css: inlineAddRowCss,
+    window: targetWindow
+  });
+  const { containerRef, dataRow, draftRevision, inlineAddColumns } = useInlineAddRow({
+    columns
+  });
+  return /* @__PURE__ */ jsx("div", { className: cx(classBase, className), ref: containerRef, children: /* @__PURE__ */ jsx(
+    Row,
+    {
+      ariaRowIndex,
+      columns: inlineAddColumns,
+      dataRow,
+      offset: 0,
+      searchPattern: "",
+      showBookends: false,
+      style,
+      virtualColSpan: 0
+    },
+    draftRevision
+  ) });
+};
+
+export { InlineAddRow };
+//# sourceMappingURL=InlineAddRow.js.map

package/esm/packages/vuu-table-extras/src/inline-add-row/InlineAddRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineAddRow.js","sources":["../../../../../../../packages/vuu-table-extras/src/inline-add-row/InlineAddRow.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { Row } from \"@vuu-ui/vuu-table\";\nimport type { BaseRowProps } from \"@vuu-ui/vuu-table-types\";\nimport cx from \"clsx\";\nimport { useInlineAddRow } from \"./useInlineAddRow\";\n\nimport inlineAddRowCss from \"./InlineAddRow.css\";\n\nconst classBase = \"vuuInlineAddRow\";\n\nexport type InlineAddRowProps = BaseRowProps;\n\nexport const InlineAddRow = ({\n  ariaRowIndex,\n  className,\n  columns,\n  style,\n}: InlineAddRowProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-inline-add-row\",\n    css: inlineAddRowCss,\n    window: targetWindow,\n  });\n\n  const { containerRef, dataRow, draftRevision, inlineAddColumns } =\n    useInlineAddRow({\n      columns,\n    });\n\n  return (\n    <div className={cx(classBase, className)} ref={containerRef}>\n      <Row\n        ariaRowIndex={ariaRowIndex}\n        columns={inlineAddColumns}\n        dataRow={dataRow}\n        key={draftRevision}\n        offset={0}\n        searchPattern=\"\"\n        showBookends={false}\n        style={style}\n        virtualColSpan={0}\n      />\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AASA,MAAM,SAAY,GAAA,iBAAA;AAIX,MAAM,eAAe,CAAC;AAAA,EAC3B,YAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA;AACF,CAAyB,KAAA;AACvB,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,oBAAA;AAAA,IACR,GAAK,EAAA,eAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,EAAE,YAAc,EAAA,OAAA,EAAS,aAAe,EAAA,gBAAA,KAC5C,eAAgB,CAAA;AAAA,IACd;AAAA,GACD,CAAA;AAEH,EACE,uBAAA,GAAA,CAAC,SAAI,SAAW,EAAA,EAAA,CAAG,WAAW,SAAS,CAAA,EAAG,KAAK,YAC7C,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,YAAA;AAAA,MACA,OAAS,EAAA,gBAAA;AAAA,MACT,OAAA;AAAA,MAEA,MAAQ,EAAA,CAAA;AAAA,MACR,aAAc,EAAA,EAAA;AAAA,MACd,YAAc,EAAA,KAAA;AAAA,MACd,KAAA;AAAA,MACA,cAAgB,EAAA;AAAA,KAAA;AAAA,IALX;AAAA,GAOT,EAAA,CAAA;AAEJ;;;;"}

package/esm/packages/vuu-table-extras/src/inline-add-row/useInlineAddRow.js

@@ -0,0 +1,135 @@
+import { useEditSession, withDataRowEditErrors, EditSession } from '@vuu-ui/vuu-data-editing';
+import { isDataValueEditable, getCellRenderer, isNotHidden } from '@vuu-ui/vuu-utils';
+import { useRef, useMemo, useCallback, useSyncExternalStore, useEffect } from 'react';
+
+const createSyntheticDataRow = (newRowState, columns) => withDataRowEditErrors(
+  {
+    ...newRowState.values,
+    childCount: 0,
+    depth: 1,
+    hasColumn: (name) => columns.some((column) => column.name === name),
+    index: -1,
+    isExpanded: false,
+    isLeaf: true,
+    isSelected: false,
+    key: EditSession.newRowKey,
+    renderIndex: -1
+  },
+  newRowState.errors
+);
+const useInlineAddRow = ({ columns }) => {
+  const editSession = useEditSession(true);
+  const containerRef = useRef(null);
+  const inlineAddColumns = useMemo(
+    () => columns.map((column) => {
+      const editable = isDataValueEditable(column, "insert");
+      const inlineAddColumn = { ...column, editable };
+      return {
+        ...inlineAddColumn,
+        CellRenderer: editable ? getCellRenderer(inlineAddColumn) : void 0
+      };
+    }),
+    [columns]
+  );
+  const visibleColumns = useMemo(
+    () => inlineAddColumns.filter(isNotHidden),
+    [inlineAddColumns]
+  );
+  const visibleInsertColumns = useMemo(
+    () => visibleColumns.filter((column) => isDataValueEditable(column, "insert")),
+    [visibleColumns]
+  );
+  const subscribeToNewRow = useCallback(
+    (onStoreChange) => {
+      editSession.on("newRow", onStoreChange);
+      return () => editSession.removeListener("newRow", onStoreChange);
+    },
+    [editSession]
+  );
+  const newRowState = useSyncExternalStore(
+    subscribeToNewRow,
+    () => editSession.newRowState,
+    () => editSession.newRowState
+  );
+  const dataRow = useMemo(
+    () => createSyntheticDataRow(newRowState, inlineAddColumns),
+    [inlineAddColumns, newRowState]
+  );
+  const previousValuesRef = useRef(newRowState.values);
+  const focusEditor = useCallback((index) => {
+    const cell = containerRef.current?.querySelectorAll("[data-field]")[index];
+    cell?.querySelector("input, button, [tabindex]")?.focus();
+  }, []);
+  useEffect(() => {
+    editSession.configureNewRow(visibleInsertColumns.map(({ name }) => name));
+  }, [editSession, visibleInsertColumns]);
+  useEffect(() => {
+    visibleInsertColumns.filter(
+      (column) => column.serverDataType === "boolean" && newRowState.values[column.name] === void 0
+    ).forEach((column) => {
+      editSession.setNewRowValue(column.name, false);
+    });
+  }, [editSession, newRowState.values, visibleInsertColumns]);
+  useEffect(() => {
+    const firstInvalidIndex = visibleColumns.findIndex(
+      ({ name }) => newRowState.errors[name] !== void 0
+    );
+    if (firstInvalidIndex !== -1) {
+      focusEditor(firstInvalidIndex);
+    }
+  }, [focusEditor, newRowState.errors, visibleColumns]);
+  useEffect(() => {
+    const previousValues = previousValuesRef.current;
+    previousValuesRef.current = newRowState.values;
+    if (Object.keys(previousValues).length > 0 && Object.keys(newRowState.values).length === 0 && Object.keys(newRowState.errors).length === 0) {
+      const firstEditableIndex = visibleColumns.findIndex(
+        (column) => isDataValueEditable(column, "insert")
+      );
+      if (firstEditableIndex !== -1) {
+        requestAnimationFrame(() => focusEditor(firstEditableIndex));
+      }
+    }
+  }, [focusEditor, newRowState.errors, newRowState.values, visibleColumns]);
+  useEffect(() => {
+    const container = containerRef.current;
+    if (!container) {
+      return;
+    }
+    const handleCommit = (event) => {
+      const target = event.target;
+      if (!(target instanceof Element)) {
+        return;
+      }
+      const cell = target.closest("[data-field]");
+      const cells = container.querySelectorAll("[data-field]");
+      const currentIndex = Array.from(cells).indexOf(cell ?? container);
+      const firstInvalidIndex = visibleColumns.findIndex(
+        ({ name }) => editSession.newRowState.errors[name] !== void 0
+      );
+      const firstEditableIndex = visibleColumns.findIndex(
+        (column) => isDataValueEditable(column, "insert")
+      );
+      const nextEditableIndex = visibleColumns.findIndex(
+        (column, index) => index > currentIndex && isDataValueEditable(column, "insert")
+      );
+      if (firstInvalidIndex !== -1) {
+        requestAnimationFrame(() => focusEditor(firstInvalidIndex));
+      } else if (nextEditableIndex !== -1) {
+        focusEditor(nextEditableIndex);
+      } else if (firstEditableIndex !== -1) {
+        requestAnimationFrame(() => focusEditor(firstEditableIndex));
+      }
+    };
+    container.addEventListener("vuu-commit", handleCommit);
+    return () => container.removeEventListener("vuu-commit", handleCommit);
+  }, [editSession, focusEditor, visibleColumns]);
+  return {
+    containerRef,
+    dataRow,
+    draftRevision: newRowState.draftRevision,
+    inlineAddColumns
+  };
+};
+
+export { useInlineAddRow };
+//# sourceMappingURL=useInlineAddRow.js.map

package/esm/packages/vuu-table-extras/src/inline-add-row/useInlineAddRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useInlineAddRow.js","sources":["../../../../../../../packages/vuu-table-extras/src/inline-add-row/useInlineAddRow.ts"],"sourcesContent":["import {\n  EditSession,\n  useEditSession,\n  withDataRowEditErrors,\n  type NewRowState,\n} from \"@vuu-ui/vuu-data-editing\";\nimport type { DataRow, RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport {\n  getCellRenderer,\n  isDataValueEditable,\n  isNotHidden,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useSyncExternalStore,\n} from \"react\";\n\nconst createSyntheticDataRow = (\n  newRowState: NewRowState,\n  columns: RuntimeColumnDescriptor[],\n): DataRow =>\n  withDataRowEditErrors(\n    {\n      ...newRowState.values,\n      childCount: 0,\n      depth: 1,\n      hasColumn: (name: string) =>\n        columns.some((column) => column.name === name),\n      index: -1,\n      isExpanded: false,\n      isLeaf: true,\n      isSelected: false,\n      key: EditSession.newRowKey,\n      renderIndex: -1,\n    } as DataRow,\n    newRowState.errors,\n  );\n\nexport interface UseInlineAddRowProps {\n  columns: RuntimeColumnDescriptor[];\n}\n\nexport const useInlineAddRow = ({ columns }: UseInlineAddRowProps) => {\n  const editSession = useEditSession(true);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const inlineAddColumns = useMemo(\n    () =>\n      columns.map((column) => {\n        const editable = isDataValueEditable(column, \"insert\");\n        const inlineAddColumn = { ...column, editable };\n        return {\n          ...inlineAddColumn,\n          CellRenderer: editable ? getCellRenderer(inlineAddColumn) : undefined,\n        };\n      }),\n    [columns],\n  );\n  const visibleColumns = useMemo(\n    () => inlineAddColumns.filter(isNotHidden),\n    [inlineAddColumns],\n  );\n  const visibleInsertColumns = useMemo(\n    () =>\n      visibleColumns.filter((column) => isDataValueEditable(column, \"insert\")),\n    [visibleColumns],\n  );\n  const subscribeToNewRow = useCallback(\n    (onStoreChange: () => void) => {\n      editSession.on(\"newRow\", onStoreChange);\n      return () => editSession.removeListener(\"newRow\", onStoreChange);\n    },\n    [editSession],\n  );\n  const newRowState = useSyncExternalStore(\n    subscribeToNewRow,\n    () => editSession.newRowState,\n    () => editSession.newRowState,\n  );\n  const dataRow = useMemo(\n    () => createSyntheticDataRow(newRowState, inlineAddColumns),\n    [inlineAddColumns, newRowState],\n  );\n  const previousValuesRef = useRef(newRowState.values);\n\n  const focusEditor = useCallback((index: number) => {\n    const cell =\n      containerRef.current?.querySelectorAll<HTMLElement>(\"[data-field]\")[\n        index\n      ];\n    cell?.querySelector<HTMLElement>(\"input, button, [tabindex]\")?.focus();\n  }, []);\n\n  useEffect(() => {\n    editSession.configureNewRow(visibleInsertColumns.map(({ name }) => name));\n  }, [editSession, visibleInsertColumns]);\n\n  useEffect(() => {\n    visibleInsertColumns\n      .filter(\n        (column) =>\n          column.serverDataType === \"boolean\" &&\n          newRowState.values[column.name] === undefined,\n      )\n      .forEach((column) => {\n        editSession.setNewRowValue(column.name, false);\n      });\n  }, [editSession, newRowState.values, visibleInsertColumns]);\n\n  useEffect(() => {\n    const firstInvalidIndex = visibleColumns.findIndex(\n      ({ name }) => newRowState.errors[name] !== undefined,\n    );\n    if (firstInvalidIndex !== -1) {\n      focusEditor(firstInvalidIndex);\n    }\n  }, [focusEditor, newRowState.errors, visibleColumns]);\n\n  useEffect(() => {\n    const previousValues = previousValuesRef.current;\n    previousValuesRef.current = newRowState.values;\n    if (\n      Object.keys(previousValues).length > 0 &&\n      Object.keys(newRowState.values).length === 0 &&\n      Object.keys(newRowState.errors).length === 0\n    ) {\n      const firstEditableIndex = visibleColumns.findIndex((column) =>\n        isDataValueEditable(column, \"insert\"),\n      );\n      if (firstEditableIndex !== -1) {\n        requestAnimationFrame(() => focusEditor(firstEditableIndex));\n      }\n    }\n  }, [focusEditor, newRowState.errors, newRowState.values, visibleColumns]);\n\n  useEffect(() => {\n    const container = containerRef.current;\n    if (!container) {\n      return;\n    }\n\n    const handleCommit = (event: Event) => {\n      const target = event.target;\n      if (!(target instanceof Element)) {\n        return;\n      }\n      const cell = target.closest<HTMLElement>(\"[data-field]\");\n      const cells = container.querySelectorAll<HTMLElement>(\"[data-field]\");\n      const currentIndex = Array.from(cells).indexOf(cell ?? container);\n      const firstInvalidIndex = visibleColumns.findIndex(\n        ({ name }) => editSession.newRowState.errors[name] !== undefined,\n      );\n      const firstEditableIndex = visibleColumns.findIndex((column) =>\n        isDataValueEditable(column, \"insert\"),\n      );\n      const nextEditableIndex = visibleColumns.findIndex(\n        (column, index) =>\n          index > currentIndex && isDataValueEditable(column, \"insert\"),\n      );\n      if (firstInvalidIndex !== -1) {\n        requestAnimationFrame(() => focusEditor(firstInvalidIndex));\n      } else if (nextEditableIndex !== -1) {\n        focusEditor(nextEditableIndex);\n      } else if (firstEditableIndex !== -1) {\n        requestAnimationFrame(() => focusEditor(firstEditableIndex));\n      }\n    };\n\n    container.addEventListener(\"vuu-commit\", handleCommit);\n    return () => container.removeEventListener(\"vuu-commit\", handleCommit);\n  }, [editSession, focusEditor, visibleColumns]);\n\n  return {\n    containerRef,\n    dataRow,\n    draftRevision: newRowState.draftRevision,\n    inlineAddColumns,\n  };\n};\n"],"names":[],"mappings":"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"}

package/esm/packages/vuu-table-extras/src/table-footer/TableFooter.css.js

@@ -1,4 +1,4 @@
-var tableFooterCss = ".vuuTableFooter {\n    background-color: var(--salt-container-secondary-background);\n    display: grid;\n    --table-footer-height: var(--vuuTableFooter-height, 32px);\n    flex: 0 0 var(--table-footer-height);\n    grid-template-areas: \"panel-start panel-center panel-end\";\n    grid-template-columns: 1fr 1fr 1fr;\n    grid-template-rows: auto;\n\n    height: var(--table-footer-height);\n\n    .vuuTableFooterTray {\n        align-items: center;\n        display: flex;\n        justify-self: end;;\n        margin: 0 var(--salt-spacing-200);\n        grid-area: panel-end;\n  }\n\n}\n";
+var tableFooterCss = ".vuuTableFooter {\n  background-color: var(--salt-container-secondary-background);\n  display: grid;\n  --table-footer-height: var(--vuuTableFooter-height, 32px);\n  flex: 0 0 var(--table-footer-height);\n  grid-template-areas: \"panel-start panel-center panel-end\";\n  grid-template-columns: 1fr 1fr 1fr;\n  grid-template-rows: auto;\n\n  height: var(--table-footer-height);\n\n  .vuuTableFooterTray {\n    align-items: center;\n    display: flex;\n    gap: var(--salt-spacing-100);\n    margin: 0 var(--salt-spacing-200);\n\n    &.vuuTableFooterTray-center {\n      grid-area: panel-center;\n      justify-self: center;\n    }\n    &.vuuTableFooterTray-end {\n      grid-area: panel-end;\n      justify-self: end;\n    }\n  }\n}\n";
 
 export { tableFooterCss as default };
 //# sourceMappingURL=TableFooter.css.js.map

package/esm/packages/vuu-table-extras/src/table-footer/TableFooter.js

@@ -5,8 +5,11 @@ import { useWindow } from '@salt-ds/window';
 import tableFooterCss from './TableFooter.css.js';
 
 const classBase = "vuuTableFooter";
-const TableFooterTray = ({ children }) => {
-  return /* @__PURE__ */ jsx("div", { className: `${classBase}Tray`, children });
+const TableFooterTray = ({ children, position = "end" }) => {
+  return /* @__PURE__ */ jsx("div", { className: cx(`${classBase}Tray`, {
+    [`${classBase}Tray-center`]: position === "center",
+    [`${classBase}Tray-end`]: position === "end"
+  }), children });
 };
 const TableFooter = ({
   children,

package/esm/packages/vuu-table-extras/src/table-footer/TableFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableFooter.js","sources":["../../../../../../../packages/vuu-table-extras/src/table-footer/TableFooter.tsx"],"sourcesContent":["import cx from \"clsx\";\nimport { HTMLAttributes, ReactNode } from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport tableFooterCss from \"./TableFooter.css\";\n\nexport interface TableFooterProps extends HTMLAttributes<HTMLDivElement> {\n  onInvokeAction?: (action: string) => void;\n  tooltrayActions?: ReactNode;\n}\n\nconst classBase = \"vuuTableFooter\";\n\nexport const TableFooterTray = ({ children }: { children: ReactNode }) => {\n  return <div className={`${classBase}Tray`}>{children}</div>;\n};\n\nexport const TableFooter = ({\n  children,\n  className,\n  onInvokeAction,\n  tooltrayActions,\n  ...htmlAttributes\n}: TableFooterProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-table-footer\",\n    css: tableFooterCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div {...htmlAttributes} className={cx(classBase, className)}>\n      {children}\n      {tooltrayActions ? (\n        <div className={`${classBase}-tooltray`}>{tooltrayActions}</div>\n      ) : null}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAYA,MAAM,SAAY,GAAA,gBAAA;AAEX,MAAM,eAAkB,GAAA,CAAC,EAAE,QAAA,EAAwC,KAAA;AACxE,EAAA,2BAAQ,KAAI,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,QAAS,QAAS,EAAA,CAAA;AACvD;AAEO,MAAM,cAAc,CAAC;AAAA,EAC1B,QAAA;AAAA,EACA,SAAA;AAAA,EACA,cAAA;AAAA,EACA,eAAA;AAAA,EACA,GAAG;AACL,CAAwB,KAAA;AACtB,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAA,cAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EACE,uBAAA,IAAA,CAAC,SAAK,GAAG,cAAA,EAAgB,WAAW,EAAG,CAAA,SAAA,EAAW,SAAS,CACxD,EAAA,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,eAAA,uBACE,KAAI,EAAA,EAAA,SAAA,EAAW,GAAG,SAAS,CAAA,SAAA,CAAA,EAAc,2BAAgB,CACxD,GAAA;AAAA,GACN,EAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"TableFooter.js","sources":["../../../../../../../packages/vuu-table-extras/src/table-footer/TableFooter.tsx"],"sourcesContent":["import cx from \"clsx\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport tableFooterCss from \"./TableFooter.css\";\n\nexport interface TableFooterProps extends HTMLAttributes<HTMLDivElement> {\n  onInvokeAction?: (action: string) => void;\n  tooltrayActions?: ReactNode;\n}\n\nconst classBase = \"vuuTableFooter\";\n\nexport const TableFooterTray = ({ children, position = 'end' }: { children: ReactNode, position?: 'center' | 'end' }) => {\n  return <div className={cx(`${classBase}Tray`, {\n    [`${classBase}Tray-center`]: position === 'center',\n    [`${classBase}Tray-end`]: position === 'end'\n  })}>{children}</div>;\n};\n\nexport const TableFooter = ({\n  children,\n  className,\n  onInvokeAction,\n  tooltrayActions,\n  ...htmlAttributes\n}: TableFooterProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-table-footer\",\n    css: tableFooterCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div {...htmlAttributes} className={cx(classBase, className)}>\n      {children}\n      {tooltrayActions ? (\n        <div className={`${classBase}-tooltray`}>{tooltrayActions}</div>\n      ) : null}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAYA,MAAM,SAAY,GAAA,gBAAA;AAEX,MAAM,kBAAkB,CAAC,EAAE,QAAU,EAAA,QAAA,GAAW,OAAkE,KAAA;AACvH,EAAA,2BAAQ,KAAI,EAAA,EAAA,SAAA,EAAW,EAAG,CAAA,CAAA,EAAG,SAAS,CAAQ,IAAA,CAAA,EAAA;AAAA,IAC5C,CAAC,CAAA,EAAG,SAAS,CAAA,WAAA,CAAa,GAAG,QAAa,KAAA,QAAA;AAAA,IAC1C,CAAC,CAAA,EAAG,SAAS,CAAA,QAAA,CAAU,GAAG,QAAa,KAAA;AAAA,GACxC,GAAI,QAAS,EAAA,CAAA;AAChB;AAEO,MAAM,cAAc,CAAC;AAAA,EAC1B,QAAA;AAAA,EACA,SAAA;AAAA,EACA,cAAA;AAAA,EACA,eAAA;AAAA,EACA,GAAG;AACL,CAAwB,KAAA;AACtB,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAA,cAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EACE,uBAAA,IAAA,CAAC,SAAK,GAAG,cAAA,EAAgB,WAAW,EAAG,CAAA,SAAA,EAAW,SAAS,CACxD,EAAA,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,eAAA,uBACE,KAAI,EAAA,EAAA,SAAA,EAAW,GAAG,SAAS,CAAA,SAAA,CAAA,EAAc,2BAAgB,CACxD,GAAA;AAAA,GACN,EAAA,CAAA;AAEJ;;;;"}

package/package.json

@@ -1,20 +1,21 @@
 {
-  "version": "2.3.0",
+  "version": "3.0.0-beta.2",
   "author": "heswell",
   "license": "Apache-2.0",
   "devDependencies": {
-    "@vuu-ui/vuu-filter-types": "2.3.0",
-    "@vuu-ui/vuu-protocol-types": "2.3.0"
+    "@vuu-ui/vuu-filter-types": "3.0.0-beta.2",
+    "@vuu-ui/vuu-protocol-types": "3.0.0-beta.2"
   },
   "dependencies": {
-    "@vuu-ui/vuu-codemirror": "2.3.0",
-    "@vuu-ui/vuu-data-react": "2.3.0",
-    "@vuu-ui/vuu-data-types": "2.3.0",
-    "@vuu-ui/vuu-table-types": "2.3.0",
-    "@vuu-ui/vuu-popups": "2.3.0",
-    "@vuu-ui/vuu-table": "2.3.0",
-    "@vuu-ui/vuu-utils": "2.3.0",
-    "@vuu-ui/vuu-ui-controls": "2.3.0",
+    "@vuu-ui/vuu-codemirror": "3.0.0-beta.2",
+    "@vuu-ui/vuu-data-editing": "3.0.0-beta.2",
+    "@vuu-ui/vuu-data-react": "3.0.0-beta.2",
+    "@vuu-ui/vuu-data-types": "3.0.0-beta.2",
+    "@vuu-ui/vuu-table-types": "3.0.0-beta.2",
+    "@vuu-ui/vuu-popups": "3.0.0-beta.2",
+    "@vuu-ui/vuu-table": "3.0.0-beta.2",
+    "@vuu-ui/vuu-utils": "3.0.0-beta.2",
+    "@vuu-ui/vuu-ui-controls": "3.0.0-beta.2",
     "@lezer/lr": "1.4.2",
     "@salt-ds/core": "1.54.1",
     "@salt-ds/lab": "1.0.0-alpha.83",

package/types/csv-upload/CsvUpload.d.ts

@@ -1,11 +1,16 @@
 import { type ReactNode } from "react";
 import type { DataSource } from "@vuu-ui/vuu-data-types";
+import type { EditSession } from "@vuu-ui/vuu-data-editing";
 import type { VuuTable } from "@vuu-ui/vuu-protocol-types";
 import type { CsvParseError, CsvParseOptions } from "./parse/csv-parse";
 import type { CsvValidationStructuredError } from "./parse/csv-schema-validation";
 import type { CsvUploadTableData } from "./parse/csv-upload-utils";
 export type CsvUploadImportedResult = {
-    rpcResult: unknown;
+    tableData: CsvUploadTableData;
+};
+export type CsvUploadPreviewResult = {
+    dataSource: DataSource;
+    editSession: EditSession;
     tableData: CsvUploadTableData;
 };
 export type CsvUploadErrors = {
@@ -32,10 +37,12 @@ export type CsvUploadPhase = "idle" | "processing" | "preview-ready" | "importin
 export interface CsvUploadProps {
     children?: ReactNode;
     dataSource: DataSource;
+    embedded?: boolean;
     onImportSessionStarted?: (dataSource: DataSource) => void;
     onImportSessionEnded?: (result: CsvUploadSessionEndResult) => void;
     onError?: (result: CsvUploadErrorResult | undefined) => void;
     onImported?: (result: CsvUploadImportedResult) => void;
+    onPreview?: (result: CsvUploadPreviewResult) => void;
     onProcessingStarted?: () => void;
     dialogTitle?: string;
     maxRows?: number;
@@ -43,5 +50,6 @@ export interface CsvUploadProps {
     onClose?: () => void;
     open?: boolean;
     parseOptions?: CsvParseOptions;
+    importMode?: "direct" | "preview";
 }
 export declare const CsvUpload: (props: CsvUploadProps) => import("react/jsx-runtime").JSX.Element;

package/types/csv-upload/data-upload-preview/DataUploadPreview.d.ts

@@ -0,0 +1,10 @@
+import type { TableSchema } from "@vuu-ui/vuu-data-types";
+import { type EditSession } from "@vuu-ui/vuu-data-editing";
+import type { HTMLAttributes } from "react";
+export interface DataUploadPreviewProps extends Omit<HTMLAttributes<HTMLDivElement>, "onSelect"> {
+    editSession: EditSession;
+    onClose: () => void;
+    saveLabel?: string;
+    tableSchema: TableSchema;
+}
+export declare const DataUploadPreview: ({ className, editSession, onClose, saveLabel, tableSchema, ...htmlAttributes }: DataUploadPreviewProps) => import("react/jsx-runtime").JSX.Element;

package/types/csv-upload/data-upload-preview/useDataUploadPreview.d.ts

@@ -0,0 +1,17 @@
+import type { DataSource } from "@vuu-ui/vuu-data-types";
+import type { EditSession } from "@vuu-ui/vuu-data-editing";
+export interface UseDataUploadPreviewProps {
+    dataSource: DataSource;
+    editSession: EditSession;
+    onClose: () => void;
+}
+export declare const getSessionDataSource: (editSession: EditSession) => DataSource;
+export declare const useDataUploadPreview: ({ dataSource, editSession, onClose, }: UseDataUploadPreviewProps) => {
+    canCancel: boolean;
+    canSave: boolean;
+    hasSelection: boolean;
+    onCancel: () => Promise<void>;
+    onDelete: () => Promise<void>;
+    onSave: (force?: boolean) => Promise<void>;
+    sessionError: string | undefined;
+};

package/types/csv-upload/index.d.ts

@@ -1,6 +1,6 @@
-export { CsvUpload, type CsvUploadError, type CsvUploadProps, type CsvUploadErrorResult, type CsvUploadErrors, type CsvUploadPhase, type CsvUploadImportedResult, type CsvUploadSessionEndReason, type CsvUploadSessionEndResult, type CsvUploadSessionTable, } from "./CsvUpload";
+export { CsvUpload, type CsvUploadError, type CsvUploadProps, type CsvUploadErrorResult, type CsvUploadErrors, type CsvUploadPhase, type CsvUploadImportedResult, type CsvUploadPreviewResult, type CsvUploadSessionEndReason, type CsvUploadSessionEndResult, type CsvUploadSessionTable, } from "./CsvUpload";
 export { useCsvUpload, type CsvUploadHookProps, type UseCsvUploadReturn, } from "./useCsvUpload";
-export { useCsvUploadSessionPreview, type UseCsvUploadSessionPreviewReturn, } from "./useCsvUploadSessionPreview";
+export { DataUploadPreview, type DataUploadPreviewProps, } from "./data-upload-preview/DataUploadPreview";
 export { validateCsvAgainstSchema, type CsvValidationOptions, type CsvValidationResult, } from "./parse/csv-schema-validation";
 export { parseCsv, type CsvParseOptions, type CsvParseResult, } from "./parse/csv-parse";
 export { CsvValidationErrorEnum, CsvParseErrorEnum, type CsvError, type CsvErrorMap, type CsvStructuredError, type CsvValidationError, type CsvValidationErrorMap, type CsvValidationErrorType, type CsvValidationStructuredError, type CsvParseError, type CsvParseErrorMap, } from "./parse/csv-errors";

package/types/csv-upload/useCsvUpload.d.ts

@@ -1,20 +1,23 @@
 import type { DataSource, TableSchema } from "@vuu-ui/vuu-data-types";
 import { type CsvParseOptions } from "./parse/csv-parse";
 import { type CsvValidationResult } from "./parse/csv-schema-validation";
-import type { CsvUploadErrorResult, CsvUploadImportedResult, CsvUploadSessionEndResult, CsvUploadSessionTable } from "./CsvUpload";
+import type { CsvUploadErrorResult, CsvUploadImportedResult, CsvUploadPreviewResult, CsvUploadSessionEndResult, CsvUploadSessionTable } from "./CsvUpload";
 export interface CsvUploadHookProps {
     dataSource: DataSource;
+    importMode?: "direct" | "preview";
     maxRows?: number;
     onImportSessionEnded?: (result: CsvUploadSessionEndResult) => void;
     onImportSessionStarted?: (dataSource: DataSource) => void;
     onError?: (result: CsvUploadErrorResult | undefined) => void;
     onImported?: (result: CsvUploadImportedResult) => void;
+    onPreview?: (result: CsvUploadPreviewResult) => void;
     onProcessingStarted?: () => void;
     parseOptions?: CsvParseOptions;
 }
 export type UseCsvUploadReturn = {
     canImport: boolean;
-    importData: () => Promise<void>;
+    cancelImport: () => Promise<void>;
+    importData: () => Promise<boolean>;
     isImporting: boolean;
     isProcessingFile: boolean;
     onDrop: (_event: React.DragEvent<HTMLDivElement>, files: File[]) => void;
@@ -23,4 +26,4 @@ export type UseCsvUploadReturn = {
     schema: TableSchema | undefined;
     validation: CsvValidationResult | undefined;
 };
-export declare const useCsvUpload: ({ dataSource, onImportSessionEnded, onImportSessionStarted, onError, onImported, onProcessingStarted, maxRows, parseOptions, }: CsvUploadHookProps) => UseCsvUploadReturn;
+export declare const useCsvUpload: ({ dataSource, importMode, onImportSessionEnded, onImportSessionStarted, onError, onImported, onPreview, onProcessingStarted, maxRows, parseOptions, }: CsvUploadHookProps) => UseCsvUploadReturn;

package/types/index.d.ts

@@ -17,6 +17,7 @@ export { useColumnSettings } from "./column-settings-panel/useColumnSettings";
 export { DataSourceStats, type DataSourceStatsProps, } from "./datasource-stats/DatasourceStats";
 export { FreezeControl } from "./freeze-control/FreezeControl";
 export { FrozenBanner } from "./freeze-control/FrozenBanner";
+export * from "./inline-add-row";
 export { TabbedTableConfigPanel } from "./tabbed-table-config-panel/TabbedTableConfigPanel";
 export { TabbedTableSettingsAction } from "./tabbed-table-config-panel/TabbedTableSettingsAction";
 export { TableFooter, TableFooterTray } from "./table-footer/TableFooter";

package/types/inline-add-row/InlineAddRow.d.ts

@@ -0,0 +1,3 @@
+import type { BaseRowProps } from "@vuu-ui/vuu-table-types";
+export type InlineAddRowProps = BaseRowProps;
+export declare const InlineAddRow: ({ ariaRowIndex, className, columns, style, }: InlineAddRowProps) => import("react/jsx-runtime").JSX.Element;

package/types/inline-add-row/index.d.ts

@@ -0,0 +1,2 @@
+export { InlineAddRow, type InlineAddRowProps } from "./InlineAddRow";
+export { useInlineAddRow, type UseInlineAddRowProps } from "./useInlineAddRow";

package/types/inline-add-row/useInlineAddRow.d.ts

@@ -0,0 +1,57 @@
+import type { DataRow, RuntimeColumnDescriptor } from "@vuu-ui/vuu-table-types";
+export interface UseInlineAddRowProps {
+    columns: RuntimeColumnDescriptor[];
+}
+export declare const useInlineAddRow: ({ columns }: UseInlineAddRowProps) => {
+    containerRef: import("react").RefObject<HTMLDivElement | null>;
+    dataRow: DataRow;
+    draftRevision: number;
+    inlineAddColumns: {
+        CellRenderer: import("react").FunctionComponent<import("@vuu-ui/vuu-table-types").TableCellRendererProps> | undefined;
+        editable: boolean;
+        align?: "left" | "right";
+        ariaColIndex: number;
+        HeaderCellContentRenderer?: import("react").FunctionComponent<Omit<import("@vuu-ui/vuu-table-types").HeaderCellProps, "id" | "index">>;
+        HeaderCellLabelRenderer?: import("react").FunctionComponent<Omit<import("@vuu-ui/vuu-table-types").HeaderCellProps, "id" | "index">>;
+        canStretch?: boolean;
+        className?: string;
+        clientSideEditValidationCheck?: import("@vuu-ui/vuu-data-types").DataValueValidationChecker;
+        draggable?: boolean;
+        filter?: import("@vuu-ui/vuu-filter-types").Filter;
+        flex?: number;
+        heading?: [...string[]];
+        isGroup?: boolean;
+        isSystemColumn?: boolean;
+        label: string;
+        marginLeft?: number;
+        moving?: boolean;
+        originalIdx?: number;
+        pinnedOffset?: number;
+        pinnedWidth?: number;
+        resizeable?: boolean;
+        resizing?: boolean;
+        sortable?: boolean;
+        sorted?: import("@vuu-ui/vuu-table-types").ColumnSort;
+        valueFormatter: import("@vuu-ui/vuu-table-types").ValueFormatter;
+        width: number;
+        aggregate?: import("@vuu-ui/vuu-protocol-types").VuuAggType;
+        allowColumnHeaderMenu?: false;
+        colHeaderContentRenderer?: string;
+        colHeaderLabelRenderer?: string;
+        getIcon?: (row: DataRow) => string | undefined;
+        groupable?: boolean;
+        hidden?: boolean;
+        locked?: Exclude<import("@vuu-ui/vuu-table-types").PinLocation, "left"> | false;
+        maxWidth?: number;
+        minWidth?: number;
+        pin?: import("@vuu-ui/vuu-table-types").PinLocation | false;
+        removeable?: boolean;
+        selected?: boolean;
+        source?: "client" | "server";
+        status?: import("@salt-ds/core").ValidationStatus;
+        editableBulk?: import("@vuu-ui/vuu-data-types").BulkEdit;
+        name: string;
+        serverDataType?: import("@vuu-ui/vuu-protocol-types").VuuColumnDataType;
+        type?: import("@vuu-ui/vuu-data-types").DataValueType;
+    }[];
+};

package/types/table-footer/TableFooter.d.ts

@@ -1,9 +1,10 @@
-import { HTMLAttributes, ReactNode } from "react";
+import type { HTMLAttributes, ReactNode } from "react";
 export interface TableFooterProps extends HTMLAttributes<HTMLDivElement> {
     onInvokeAction?: (action: string) => void;
     tooltrayActions?: ReactNode;
 }
-export declare const TableFooterTray: ({ children }: {
+export declare const TableFooterTray: ({ children, position }: {
     children: ReactNode;
+    position?: "center" | "end";
 }) => import("react/jsx-runtime").JSX.Element;
 export declare const TableFooter: ({ children, className, onInvokeAction, tooltrayActions, ...htmlAttributes }: TableFooterProps) => import("react/jsx-runtime").JSX.Element;

package/cjs/packages/vuu-table-extras/src/csv-upload/useCsvUploadSessionPreview.js

@@ -1,73 +0,0 @@
-'use strict';
-
-var vuuUtils = require('@vuu-ui/vuu-utils');
-var react = require('react');
-
-const useCsvUploadSessionPreview = (sessionTable) => {
-  const { VuuDataSource, getServerAPI } = vuuUtils.useData();
-  const [previewConfig, setPreviewConfig] = react.useState();
-  const [previewDataSource, setPreviewDataSource] = react.useState();
-  const [previewError, setPreviewError] = react.useState();
-  const [isLoadingPreview, setIsLoadingPreview] = react.useState(false);
-  react.useEffect(() => {
-    let cancelled = false;
-    if (!sessionTable) {
-      setPreviewDataSource(void 0);
-      setPreviewConfig(void 0);
-      setPreviewError(void 0);
-      setIsLoadingPreview(false);
-      return;
-    }
-    const loadSessionTablePreview = async () => {
-      setIsLoadingPreview(true);
-      setPreviewError(void 0);
-      try {
-        const server = await getServerAPI();
-        const schema = await server.getTableSchema(sessionTable);
-        if (cancelled) {
-          return;
-        }
-        const columnDescriptors = schema.columns.map(
-          ({ name, serverDataType }) => name === "vuuMsg" ? { name, serverDataType, width: 300, label: "Error" } : { name, serverDataType }
-        );
-        setPreviewConfig({
-          columns: columnDescriptors,
-          zebraStripes: true,
-          rowSeparators: true,
-          columnSeparators: true
-        });
-        setPreviewDataSource(
-          new VuuDataSource({
-            columns: columnDescriptors.map(({ name }) => name),
-            table: sessionTable
-          })
-        );
-      } catch (error) {
-        if (!cancelled) {
-          setPreviewDataSource(void 0);
-          setPreviewConfig(void 0);
-          setPreviewError(
-            `Failed to load session table preview: ${String(error)}`
-          );
-        }
-      } finally {
-        if (!cancelled) {
-          setIsLoadingPreview(false);
-        }
-      }
-    };
-    loadSessionTablePreview();
-    return () => {
-      cancelled = true;
-    };
-  }, [VuuDataSource, getServerAPI, sessionTable]);
-  return {
-    isLoadingPreview,
-    previewConfig,
-    previewDataSource,
-    previewError
-  };
-};
-
-exports.useCsvUploadSessionPreview = useCsvUploadSessionPreview;
-//# sourceMappingURL=useCsvUploadSessionPreview.js.map

package/cjs/packages/vuu-table-extras/src/csv-upload/useCsvUploadSessionPreview.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useCsvUploadSessionPreview.js","sources":["../../../../../../../packages/vuu-table-extras/src/csv-upload/useCsvUploadSessionPreview.ts"],"sourcesContent":["import type { DataSource } from \"@vuu-ui/vuu-data-types\";\nimport { useData } from \"@vuu-ui/vuu-utils\";\nimport type { ColumnDescriptor, TableConfig } from \"@vuu-ui/vuu-table-types\";\nimport { useEffect, useState } from \"react\";\nimport type { CsvUploadSessionTable } from \"./CsvUpload\";\n\nexport type UseCsvUploadSessionPreviewReturn = {\n  isLoadingPreview: boolean;\n  previewConfig: TableConfig | undefined;\n  previewDataSource: DataSource | undefined;\n  previewError: string | undefined;\n};\n\nexport const useCsvUploadSessionPreview = (\n  sessionTable: CsvUploadSessionTable | undefined,\n): UseCsvUploadSessionPreviewReturn => {\n  const { VuuDataSource, getServerAPI } = useData();\n  const [previewConfig, setPreviewConfig] = useState<TableConfig | undefined>();\n  const [previewDataSource, setPreviewDataSource] = useState<\n    DataSource | undefined\n  >();\n  const [previewError, setPreviewError] = useState<string | undefined>();\n  const [isLoadingPreview, setIsLoadingPreview] = useState(false);\n\n  useEffect(() => {\n    let cancelled = false;\n\n    if (!sessionTable) {\n      setPreviewDataSource(undefined);\n      setPreviewConfig(undefined);\n      setPreviewError(undefined);\n      setIsLoadingPreview(false);\n      return;\n    }\n\n    const loadSessionTablePreview = async () => {\n      setIsLoadingPreview(true);\n      setPreviewError(undefined);\n\n      try {\n        const server = await getServerAPI();\n        const schema = await server.getTableSchema(sessionTable);\n\n        if (cancelled) {\n          return;\n        }\n\n        const columnDescriptors: ColumnDescriptor[] = schema.columns.map(\n          ({ name, serverDataType }) =>\n            name === \"vuuMsg\"\n              ? { name, serverDataType, width: 300, label: \"Error\" }\n              : { name, serverDataType },\n        );\n\n        setPreviewConfig({\n          columns: columnDescriptors,\n          zebraStripes: true,\n          rowSeparators: true,\n          columnSeparators: true,\n        });\n        setPreviewDataSource(\n          new VuuDataSource({\n            columns: columnDescriptors.map(({ name }) => name),\n            table: sessionTable,\n          }),\n        );\n      } catch (error) {\n        if (!cancelled) {\n          setPreviewDataSource(undefined);\n          setPreviewConfig(undefined);\n          setPreviewError(\n            `Failed to load session table preview: ${String(error)}`,\n          );\n        }\n      } finally {\n        if (!cancelled) {\n          setIsLoadingPreview(false);\n        }\n      }\n    };\n\n    loadSessionTablePreview();\n\n    return () => {\n      cancelled = true;\n    };\n  }, [VuuDataSource, getServerAPI, sessionTable]);\n\n  return {\n    isLoadingPreview,\n    previewConfig,\n    previewDataSource,\n    previewError,\n  };\n};\n"],"names":["useData","useState","useEffect"],"mappings":";;;;;AAaa,MAAA,0BAAA,GAA6B,CACxC,YACqC,KAAA;AACrC,EAAA,MAAM,EAAE,aAAA,EAAe,YAAa,EAAA,GAAIA,gBAAQ,EAAA;AAChD,EAAA,MAAM,CAAC,aAAA,EAAe,gBAAgB,CAAA,GAAIC,cAAkC,EAAA;AAC5E,EAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,GAAIA,cAEhD,EAAA;AACF,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAIA,cAA6B,EAAA;AACrE,EAAA,MAAM,CAAC,gBAAA,EAAkB,mBAAmB,CAAA,GAAIA,eAAS,KAAK,CAAA;AAE9D,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,IAAI,SAAY,GAAA,KAAA;AAEhB,IAAA,IAAI,CAAC,YAAc,EAAA;AACjB,MAAA,oBAAA,CAAqB,KAAS,CAAA,CAAA;AAC9B,MAAA,gBAAA,CAAiB,KAAS,CAAA,CAAA;AAC1B,MAAA,eAAA,CAAgB,KAAS,CAAA,CAAA;AACzB,MAAA,mBAAA,CAAoB,KAAK,CAAA;AACzB,MAAA;AAAA;AAGF,IAAA,MAAM,0BAA0B,YAAY;AAC1C,MAAA,mBAAA,CAAoB,IAAI,CAAA;AACxB,MAAA,eAAA,CAAgB,KAAS,CAAA,CAAA;AAEzB,MAAI,IAAA;AACF,QAAM,MAAA,MAAA,GAAS,MAAM,YAAa,EAAA;AAClC,QAAA,MAAM,MAAS,GAAA,MAAM,MAAO,CAAA,cAAA,CAAe,YAAY,CAAA;AAEvD,QAAA,IAAI,SAAW,EAAA;AACb,UAAA;AAAA;AAGF,QAAM,MAAA,iBAAA,GAAwC,OAAO,OAAQ,CAAA,GAAA;AAAA,UAC3D,CAAC,EAAE,IAAA,EAAM,cAAe,EAAA,KACtB,SAAS,QACL,GAAA,EAAE,IAAM,EAAA,cAAA,EAAgB,OAAO,GAAK,EAAA,KAAA,EAAO,SAC3C,GAAA,EAAE,MAAM,cAAe;AAAA,SAC/B;AAEA,QAAiB,gBAAA,CAAA;AAAA,UACf,OAAS,EAAA,iBAAA;AAAA,UACT,YAAc,EAAA,IAAA;AAAA,UACd,aAAe,EAAA,IAAA;AAAA,UACf,gBAAkB,EAAA;AAAA,SACnB,CAAA;AACD,QAAA,oBAAA;AAAA,UACE,IAAI,aAAc,CAAA;AAAA,YAChB,SAAS,iBAAkB,CAAA,GAAA,CAAI,CAAC,EAAE,IAAA,OAAW,IAAI,CAAA;AAAA,YACjD,KAAO,EAAA;AAAA,WACR;AAAA,SACH;AAAA,eACO,KAAO,EAAA;AACd,QAAA,IAAI,CAAC,SAAW,EAAA;AACd,UAAA,oBAAA,CAAqB,KAAS,CAAA,CAAA;AAC9B,UAAA,gBAAA,CAAiB,KAAS,CAAA,CAAA;AAC1B,UAAA,eAAA;AAAA,YACE,CAAA,sCAAA,EAAyC,MAAO,CAAA,KAAK,CAAC,CAAA;AAAA,WACxD;AAAA;AACF,OACA,SAAA;AACA,QAAA,IAAI,CAAC,SAAW,EAAA;AACd,UAAA,mBAAA,CAAoB,KAAK,CAAA;AAAA;AAC3B;AACF,KACF;AAEA,IAAwB,uBAAA,EAAA;AAExB,IAAA,OAAO,MAAM;AACX,MAAY,SAAA,GAAA,IAAA;AAAA,KACd;AAAA,GACC,EAAA,CAAC,aAAe,EAAA,YAAA,EAAc,YAAY,CAAC,CAAA;AAE9C,EAAO,OAAA;AAAA,IACL,gBAAA;AAAA,IACA,aAAA;AAAA,IACA,iBAAA;AAAA,IACA;AAAA,GACF;AACF;;;;"}