@vuu-ui/vuu-data-react 0.9.3 → 0.10.1

package/cjs/data-editing/get-data-item-edit-control.js.map

@@ -1 +1 @@
-{"version":3,"file":"get-data-item-edit-control.js","sources":["../../src/data-editing/get-data-item-edit-control.tsx"],"sourcesContent":["import type {\n  DataValueDescriptor,\n  TableSchemaTable,\n} from \"@vuu-ui/vuu-data-types\";\nimport {\n  VuuDatePicker,\n  VuuInput,\n  VuuTypeaheadInput,\n  VuuTypeaheadInputProps,\n} from \"@vuu-ui/vuu-ui-controls\";\nimport { CommitHandler, isDateTimeDataValue } from \"@vuu-ui/vuu-utils\";\nimport { InputProps } from \"@salt-ds/core\";\n\nexport interface DataItemEditControlProps {\n  InputProps?: Partial<InputProps>;\n  TypeaheadProps?: Pick<VuuTypeaheadInputProps, \"highlightFirstSuggestion\">;\n  commitWhenCleared?: boolean;\n  /**\n   * A table column or form field Descriptor.\n   */\n  dataDescriptor: DataValueDescriptor;\n  errorMessage?: string;\n  onCommit: CommitHandler<HTMLElement, string | undefined>;\n  table?: TableSchemaTable;\n}\n\nexport type ValidationStatus = \"initial\" | true | string;\n\nexport const getDataItemEditControl = ({\n  InputProps,\n  TypeaheadProps,\n  commitWhenCleared,\n  dataDescriptor,\n  errorMessage,\n  onCommit,\n  table,\n}: DataItemEditControlProps) => {\n  const handleCommitNumber: CommitHandler<HTMLElement, number> = (\n    evt,\n    value,\n  ) => {\n    onCommit(evt, value.toString());\n  };\n\n  if (dataDescriptor.editable === false) {\n    return (\n      <VuuInput\n        variant=\"secondary\"\n        {...InputProps}\n        onCommit={onCommit}\n        readOnly\n      />\n    );\n  } else if (isDateTimeDataValue(dataDescriptor)) {\n    return <VuuDatePicker onCommit={handleCommitNumber} />;\n  } else if (dataDescriptor.serverDataType === \"string\" && table) {\n    return (\n      <VuuTypeaheadInput\n        {...InputProps}\n        {...TypeaheadProps}\n        column={dataDescriptor.name}\n        onCommit={onCommit}\n        table={table}\n      />\n    );\n  }\n  return (\n    <VuuInput\n      variant=\"secondary\"\n      {...InputProps}\n      commitWhenCleared={commitWhenCleared}\n      onCommit={onCommit}\n      errorMessage={errorMessage}\n    />\n  );\n};\n"],"names":["InputProps","jsx","VuuInput","isDateTimeDataValue","VuuDatePicker","VuuTypeaheadInput"],"mappings":";;;;;;AA4BO,MAAM,yBAAyB,CAAC;AAAA,EACrC,UAAAA,EAAAA,WAAAA;AAAA,EACA,cAAA;AAAA,EACA,iBAAA;AAAA,EACA,cAAA;AAAA,EACA,YAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAAgC,KAAA;AAC9B,EAAM,MAAA,kBAAA,GAAyD,CAC7D,GAAA,EACA,KACG,KAAA;AACH,IAAS,QAAA,CAAA,GAAA,EAAK,KAAM,CAAA,QAAA,EAAU,CAAA;AAAA,GAChC;AAEA,EAAI,IAAA,cAAA,CAAe,aAAa,KAAO,EAAA;AACrC,IACE,uBAAAC,cAAA;AAAA,MAACC,sBAAA;AAAA,MAAA;AAAA,QACC,OAAQ,EAAA,WAAA;AAAA,QACP,GAAGF,WAAAA;AAAA,QACJ,QAAA;AAAA,QACA,QAAQ,EAAA;AAAA;AAAA,KACV;AAAA,GAEJ,MAAA,IAAWG,4BAAoB,CAAA,cAAc,CAAG,EAAA;AAC9C,IAAO,uBAAAF,cAAA,CAACG,2BAAc,EAAA,EAAA,QAAA,EAAU,kBAAoB,EAAA,CAAA;AAAA,GAC3C,MAAA,IAAA,cAAA,CAAe,cAAmB,KAAA,QAAA,IAAY,KAAO,EAAA;AAC9D,IACE,uBAAAH,cAAA;AAAA,MAACI,+BAAA;AAAA,MAAA;AAAA,QACE,GAAGL,WAAAA;AAAA,QACH,GAAG,cAAA;AAAA,QACJ,QAAQ,cAAe,CAAA,IAAA;AAAA,QACvB,QAAA;AAAA,QACA;AAAA;AAAA,KACF;AAAA;AAGJ,EACE,uBAAAC,cAAA;AAAA,IAACC,sBAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,WAAA;AAAA,MACP,GAAGF,WAAAA;AAAA,MACJ,iBAAA;AAAA,MACA,QAAA;AAAA,MACA;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"get-data-item-edit-control.js","sources":["../../src/data-editing/get-data-item-edit-control.tsx"],"sourcesContent":["import type {\n  DataValueDescriptor,\n  TableSchemaTable,\n} from \"@vuu-ui/vuu-data-types\";\nimport {\n  VuuDatePicker,\n  VuuInput,\n  VuuTypeaheadInput,\n  VuuTypeaheadInputProps,\n} from \"@vuu-ui/vuu-ui-controls\";\nimport { CommitHandler, isDateTimeDataValue } from \"@vuu-ui/vuu-utils\";\nimport { InputProps } from \"@salt-ds/core\";\n\nexport interface DataItemEditControlProps {\n  InputProps?: Partial<InputProps>;\n  TypeaheadProps?: Pick<VuuTypeaheadInputProps, \"highlightFirstSuggestion\">;\n  commitWhenCleared?: boolean;\n  /**\n   * A table column or form field Descriptor.\n   */\n  dataDescriptor: DataValueDescriptor;\n  errorMessage?: string;\n  onCommit: CommitHandler<HTMLElement>;\n  table?: TableSchemaTable;\n}\n\nexport type ValidationStatus = \"initial\" | true | string;\n\nexport const getDataItemEditControl = ({\n  InputProps,\n  TypeaheadProps,\n  commitWhenCleared,\n  dataDescriptor,\n  errorMessage,\n  onCommit,\n  table,\n}: DataItemEditControlProps) => {\n  const handleCommitNumber: CommitHandler<HTMLElement, number> = (\n    evt,\n    value,\n  ) => {\n    onCommit(evt, value.toString());\n  };\n\n  if (dataDescriptor.editable === false) {\n    return (\n      <VuuInput\n        variant=\"secondary\"\n        {...InputProps}\n        onCommit={onCommit}\n        readOnly\n      />\n    );\n  } else if (isDateTimeDataValue(dataDescriptor)) {\n    return <VuuDatePicker onCommit={handleCommitNumber} />;\n  } else if (dataDescriptor.serverDataType === \"string\" && table) {\n    return (\n      <VuuTypeaheadInput\n        {...InputProps}\n        {...TypeaheadProps}\n        column={dataDescriptor.name}\n        onCommit={onCommit}\n        table={table}\n      />\n    );\n  }\n  return (\n    <VuuInput\n      variant=\"secondary\"\n      {...InputProps}\n      commitWhenCleared={commitWhenCleared}\n      onCommit={onCommit}\n      errorMessage={errorMessage}\n    />\n  );\n};\n"],"names":["InputProps","jsx","VuuInput","isDateTimeDataValue","VuuDatePicker","VuuTypeaheadInput"],"mappings":";;;;;;AA4BO,MAAM,yBAAyB,CAAC;AAAA,EACrC,UAAAA,EAAAA,WAAAA;AAAA,EACA,cAAA;AAAA,EACA,iBAAA;AAAA,EACA,cAAA;AAAA,EACA,YAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAAgC,KAAA;AAC9B,EAAM,MAAA,kBAAA,GAAyD,CAC7D,GAAA,EACA,KACG,KAAA;AACH,IAAS,QAAA,CAAA,GAAA,EAAK,KAAM,CAAA,QAAA,EAAU,CAAA;AAAA,GAChC;AAEA,EAAI,IAAA,cAAA,CAAe,aAAa,KAAO,EAAA;AACrC,IACE,uBAAAC,cAAA;AAAA,MAACC,sBAAA;AAAA,MAAA;AAAA,QACC,OAAQ,EAAA,WAAA;AAAA,QACP,GAAGF,WAAAA;AAAA,QACJ,QAAA;AAAA,QACA,QAAQ,EAAA;AAAA;AAAA,KACV;AAAA,GAEJ,MAAA,IAAWG,4BAAoB,CAAA,cAAc,CAAG,EAAA;AAC9C,IAAO,uBAAAF,cAAA,CAACG,2BAAc,EAAA,EAAA,QAAA,EAAU,kBAAoB,EAAA,CAAA;AAAA,GAC3C,MAAA,IAAA,cAAA,CAAe,cAAmB,KAAA,QAAA,IAAY,KAAO,EAAA;AAC9D,IACE,uBAAAH,cAAA;AAAA,MAACI,+BAAA;AAAA,MAAA;AAAA,QACE,GAAGL,WAAAA;AAAA,QACH,GAAG,cAAA;AAAA,QACJ,QAAQ,cAAe,CAAA,IAAA;AAAA,QACvB,QAAA;AAAA,QACA;AAAA;AAAA,KACF;AAAA;AAGJ,EACE,uBAAAC,cAAA;AAAA,IAACC,sBAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,WAAA;AAAA,MACP,GAAGF,WAAAA;AAAA,MACJ,iBAAA;AAAA,MACA,QAAA;AAAA,MACA;AAAA;AAAA,GACF;AAEJ;;;;"}

package/cjs/data-editing/useEditForm.js

@@ -167,7 +167,7 @@ const useEditForm = ({
     forceUpdate({});
   }, []);
   const handleFieldCommit = react.useCallback(
-    (evt, value) => {
+    (_, value) => {
       const { current: fieldName } = focusedFieldRef;
       const dataDescriptor = find(formFieldDescriptors, fieldName);
       const { current: state } = validationStateRef;

package/cjs/data-editing/useEditForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"useEditForm.js","sources":["../../src/data-editing/useEditForm.tsx"],"sourcesContent":["import type { DataSource, DataValueDescriptor } from \"@vuu-ui/vuu-data-types\";\nimport { useDialogContext } from \"@vuu-ui/vuu-popups\";\nimport type { VuuRowDataItemType } from \"@vuu-ui/vuu-protocol-types\";\nimport {\n  Entity,\n  buildColumnMap,\n  dataSourceRowToEntity,\n  messageHasDataRows,\n  queryClosest,\n  viewportRpcRequest,\n} from \"@vuu-ui/vuu-utils\";\nimport { Button } from \"@salt-ds/core\";\nimport {\n  FocusEventHandler,\n  SyntheticEvent,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { UnsavedChangesReport } from \"./UnsavedChangesReport\";\nimport {\n  buildValidationChecker,\n  getEditValidationRules,\n} from \"./edit-rule-validation-checker\";\nimport {\n  CLEAN_FORM,\n  FormEditState,\n  buildFormEditState,\n} from \"./form-edit-state\";\n\nexport interface EditFormHookProps {\n  dataSource?: DataSource;\n  formFieldDescriptors: DataValueDescriptor[];\n  onSubmit?: () => void;\n}\n\ntype ValidationState = {\n  ok: boolean;\n  messages: Record<string, string>;\n};\n\nconst CLEAN_VALIDATION: ValidationState = {\n  ok: true,\n  messages: {},\n};\n\nconst getValidationChecker = (\n  descriptor: DataValueDescriptor,\n  editPhase: \"change\" | \"commit\",\n) => {\n  const rules = getEditValidationRules(descriptor, editPhase) ?? [];\n  return buildValidationChecker(rules);\n};\n\nconst nextValidationState = (\n  state: ValidationState,\n  dataDescriptor: DataValueDescriptor,\n  value: VuuRowDataItemType,\n): ValidationState => {\n  const check = getValidationChecker(dataDescriptor, \"change\");\n  const result = check(value, \"change\");\n  const { name } = dataDescriptor;\n\n  const { ok: wasOk, messages: existingMessages } = state;\n\n  if (result.ok) {\n    if (!wasOk) {\n      // if this field was the only one in error, the overall state\n      // will now be ok, but not if there is still one or more other\n      // field still in error.\n      const fieldsInError = Object.keys(existingMessages);\n      if (fieldsInError.includes(name)) {\n        if (fieldsInError.length === 1) {\n          return { ok: true, messages: {} };\n        } else {\n          const messages = { ...existingMessages };\n          delete messages[name];\n          return { ok: false, messages };\n        }\n      }\n    }\n  } else {\n    return {\n      ok: false,\n      messages: {\n        ...existingMessages,\n        [name]: result.messages.join(\"\\n\"),\n      },\n    };\n  }\n\n  return state;\n};\n\nfunction find(descriptors: DataValueDescriptor[], fieldname: string) {\n  const d = descriptors.find(({ name }) => name === fieldname);\n  if (d) {\n    return d;\n  }\n  throw Error(`DataValueDescriptor not found for field ${fieldname}`);\n}\n\nconst getField = (target: EventTarget | HTMLElement) => {\n  const fieldElement = queryClosest(target, \"[data-field]\");\n  if (fieldElement) {\n    return fieldElement.dataset.field as string;\n  } else {\n    throw Error(\"no field \");\n  }\n};\n\ntype Resolver = (value: unknown) => void;\n\nexport const useEditForm = ({\n  dataSource,\n  formFieldDescriptors,\n  onSubmit,\n}: EditFormHookProps) => {\n  const { showDialog, closeDialog } = useDialogContext();\n\n  const currentDataSource = useRef<DataSource>();\n  const formFieldsContainerRef = useRef<HTMLDivElement>(null);\n  const entityRef = useRef<Entity>();\n  const focusedFieldRef = useRef(\"\");\n  const originalEntityRef = useRef<Entity>();\n  const formEditStateRef = useRef<FormEditState>(CLEAN_FORM);\n  const validationStateRef = useRef<ValidationState>({\n    ok: true,\n    messages: {},\n  });\n\n  const [entity, _setEntity] = useState<Entity>();\n  const [, forceUpdate] = useState({});\n\n  const setFormEditState = useCallback((newState: FormEditState) => {\n    formEditStateRef.current = newState;\n  }, []);\n\n  const setEntity = useCallback(\n    (newEntity: Entity) => {\n      setFormEditState(\n        buildFormEditState(originalEntityRef.current, newEntity),\n      );\n      entityRef.current = newEntity;\n      _setEntity(newEntity);\n    },\n    [setFormEditState],\n  );\n\n  const submitChanges = useCallback(async () => {\n    const rpcResponse = await currentDataSource.current?.rpcCall?.(\n      viewportRpcRequest(\"VP_BULK_EDIT_SUBMIT_RPC\"),\n    );\n    console.log({ rpcResponse });\n  }, []);\n\n  const showSaveOrDiscardPrompt = useCallback(async () => {\n    const { current: currentEntity } = entityRef;\n    const { current: originalEntity } = originalEntityRef;\n    let resolver: Resolver | undefined = undefined;\n    const save = async () => {\n      await submitChanges();\n      closeDialog();\n      resolver?.(\"saved\");\n    };\n\n    const discard = () => {\n      closeDialog();\n      resolver?.(\"discarded\");\n    };\n\n    requestAnimationFrame(() => {\n      showDialog(\n        <UnsavedChangesReport\n          entity={originalEntity as Entity}\n          editedEntity={currentEntity as Entity}\n        />,\n        \"Unsaved Changes\",\n        [\n          <Button key=\"cancel\" onClick={discard}>\n            Discard Changes\n          </Button>,\n          <Button key=\"submit\" onClick={save}>\n            Save Changes\n          </Button>,\n        ],\n        true, // hideCloseButton\n      );\n    });\n\n    return new Promise((resolve) => {\n      resolver = resolve;\n    });\n  }, [closeDialog, showDialog, submitChanges]);\n\n  useMemo(async () => {\n    if (dataSource) {\n      if (formEditStateRef.current.isClean === false) {\n        await showSaveOrDiscardPrompt();\n      }\n\n      currentDataSource.current = dataSource;\n\n      originalEntityRef.current = undefined;\n\n      const columnMap = buildColumnMap(dataSource.columns);\n\n      dataSource?.subscribe({ range: { from: 0, to: 1 } }, (message) => {\n        if (messageHasDataRows(message)) {\n          const [row] = message.rows;\n          if (row) {\n            const entity = dataSourceRowToEntity(row, columnMap);\n            if (originalEntityRef.current === undefined) {\n              originalEntityRef.current = entity;\n              setEntity(entity);\n            }\n\n            const { editedFields } = buildFormEditState(\n              entityRef.current,\n              entity,\n            );\n\n            // for controls which do not yield incremental changes, e.g dropdown, calendar\n            // we apply the server update to our entity.\n            if (editedFields.length === 1) {\n              setEntity(entity);\n            }\n\n            // Do not overwrite entity here, just check that values returned by server\n            // match whats expected\n          }\n        }\n      });\n    }\n  }, [dataSource, setEntity, showSaveOrDiscardPrompt]);\n\n  const setValidationState = useCallback((state: ValidationState) => {\n    validationStateRef.current = state;\n    forceUpdate({});\n  }, []);\n\n  const handleFieldCommit = useCallback(\n    (evt, value) => {\n      const { current: fieldName } = focusedFieldRef;\n      const dataDescriptor = find(formFieldDescriptors, fieldName);\n\n      const { current: state } = validationStateRef;\n      const newState = nextValidationState(state, dataDescriptor, value);\n      if (newState !== state) {\n        setValidationState(newState);\n      }\n\n      if (newState.ok && dataSource?.tableSchema) {\n        const { key } = dataSource.tableSchema;\n        const keyValue = entity?.[key] as string;\n        dataSource\n          ?.applyEdit(keyValue, fieldName, value)\n          .then((rpcResponse) => {\n            console.log({ rpcResponse });\n          });\n      }\n    },\n    [dataSource, entity, formFieldDescriptors, setValidationState],\n  );\n\n  const handleFieldChange = useCallback(\n    (evt: SyntheticEvent<HTMLInputElement>) => {\n      const { current: fieldName } = focusedFieldRef;\n      if (fieldName) {\n        const input = queryClosest<HTMLInputElement>(evt.target, \"input\", true);\n        const dataDescriptor = find(formFieldDescriptors, fieldName);\n        const value = input.value as string;\n        const { current: state } = validationStateRef;\n        const newState = nextValidationState(state, dataDescriptor, value);\n        if (newState !== state) {\n          setValidationState(newState);\n        }\n\n        setEntity({ ...entity, [fieldName]: value });\n      }\n    },\n    [entity, formFieldDescriptors, setEntity, setValidationState],\n  );\n\n  const handleFormSubmit = useCallback(async () => {\n    submitChanges();\n    setFormEditState(CLEAN_FORM);\n    originalEntityRef.current = entity;\n    onSubmit?.();\n    forceUpdate({});\n  }, [entity, onSubmit, setFormEditState, submitChanges]);\n\n  const handleFormCancel = useCallback(async () => {\n    // const rpcResponse = await dataSource?.rpcCall?.(\n    //   viewportRpcRequest(\"VP_BULK_EDIT_CANCEL_RPC\"),\n    // );\n    setFormEditState(CLEAN_FORM);\n    setValidationState(CLEAN_VALIDATION);\n    // console.log({ rpcResponse });\n    setEntity(originalEntityRef.current as Entity);\n  }, [setEntity, setFormEditState, setValidationState]);\n\n  const handleFocus = useCallback<FocusEventHandler>((evt) => {\n    // Ignore focus on popup Calendars, Lists etc\n    if (formFieldsContainerRef.current?.contains(evt.target)) {\n      const fieldName = getField(evt.target);\n      if (fieldName) {\n        if (fieldName) {\n          focusedFieldRef.current = fieldName;\n        }\n      }\n    }\n  }, []);\n\n  const {\n    current: { ok, messages: errorMessages },\n  } = validationStateRef;\n\n  const {\n    current: { isClean, editedFields },\n  } = formEditStateRef;\n\n  return {\n    editedFields,\n    editEntity: entity,\n    errorMessages,\n    formFieldsContainerRef,\n    isClean,\n    ok,\n    onCancel: handleFormCancel,\n    onChange: handleFieldChange,\n    onCommit: handleFieldCommit,\n    onFocus: handleFocus,\n    onSubmit: handleFormSubmit,\n  };\n};\n"],"names":["getEditValidationRules","buildValidationChecker","queryClosest","useDialogContext","useRef","CLEAN_FORM","useState","useCallback","buildFormEditState","viewportRpcRequest","jsx","UnsavedChangesReport","Button","useMemo","buildColumnMap","messageHasDataRows","entity","dataSourceRowToEntity","editedFields"],"mappings":"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"}
+{"version":3,"file":"useEditForm.js","sources":["../../src/data-editing/useEditForm.tsx"],"sourcesContent":["import type { DataSource, DataValueDescriptor } from \"@vuu-ui/vuu-data-types\";\nimport { useDialogContext } from \"@vuu-ui/vuu-popups\";\nimport type { VuuRowDataItemType } from \"@vuu-ui/vuu-protocol-types\";\nimport {\n  CommitHandler,\n  Entity,\n  buildColumnMap,\n  dataSourceRowToEntity,\n  messageHasDataRows,\n  queryClosest,\n  viewportRpcRequest,\n} from \"@vuu-ui/vuu-utils\";\nimport { Button } from \"@salt-ds/core\";\nimport {\n  FocusEventHandler,\n  SyntheticEvent,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { UnsavedChangesReport } from \"./UnsavedChangesReport\";\nimport {\n  buildValidationChecker,\n  getEditValidationRules,\n} from \"./edit-rule-validation-checker\";\nimport {\n  CLEAN_FORM,\n  FormEditState,\n  buildFormEditState,\n} from \"./form-edit-state\";\n\nexport interface EditFormHookProps {\n  dataSource?: DataSource;\n  formFieldDescriptors: DataValueDescriptor[];\n  onSubmit?: () => void;\n}\n\ntype ValidationState = {\n  ok: boolean;\n  messages: Record<string, string>;\n};\n\nconst CLEAN_VALIDATION: ValidationState = {\n  ok: true,\n  messages: {},\n};\n\nconst getValidationChecker = (\n  descriptor: DataValueDescriptor,\n  editPhase: \"change\" | \"commit\",\n) => {\n  const rules = getEditValidationRules(descriptor, editPhase) ?? [];\n  return buildValidationChecker(rules);\n};\n\nconst nextValidationState = (\n  state: ValidationState,\n  dataDescriptor: DataValueDescriptor,\n  value: VuuRowDataItemType,\n): ValidationState => {\n  const check = getValidationChecker(dataDescriptor, \"change\");\n  const result = check(value, \"change\");\n  const { name } = dataDescriptor;\n\n  const { ok: wasOk, messages: existingMessages } = state;\n\n  if (result.ok) {\n    if (!wasOk) {\n      // if this field was the only one in error, the overall state\n      // will now be ok, but not if there is still one or more other\n      // field still in error.\n      const fieldsInError = Object.keys(existingMessages);\n      if (fieldsInError.includes(name)) {\n        if (fieldsInError.length === 1) {\n          return { ok: true, messages: {} };\n        } else {\n          const messages = { ...existingMessages };\n          delete messages[name];\n          return { ok: false, messages };\n        }\n      }\n    }\n  } else {\n    return {\n      ok: false,\n      messages: {\n        ...existingMessages,\n        [name]: result.messages.join(\"\\n\"),\n      },\n    };\n  }\n\n  return state;\n};\n\nfunction find(descriptors: DataValueDescriptor[], fieldname: string) {\n  const d = descriptors.find(({ name }) => name === fieldname);\n  if (d) {\n    return d;\n  }\n  throw Error(`DataValueDescriptor not found for field ${fieldname}`);\n}\n\nconst getField = (target: EventTarget | HTMLElement) => {\n  const fieldElement = queryClosest(target, \"[data-field]\");\n  if (fieldElement) {\n    return fieldElement.dataset.field as string;\n  } else {\n    throw Error(\"no field \");\n  }\n};\n\ntype Resolver = (value: unknown) => void;\n\nexport const useEditForm = ({\n  dataSource,\n  formFieldDescriptors,\n  onSubmit,\n}: EditFormHookProps) => {\n  const { showDialog, closeDialog } = useDialogContext();\n\n  const currentDataSource = useRef<DataSource>();\n  const formFieldsContainerRef = useRef<HTMLDivElement>(null);\n  const entityRef = useRef<Entity>();\n  const focusedFieldRef = useRef(\"\");\n  const originalEntityRef = useRef<Entity>();\n  const formEditStateRef = useRef<FormEditState>(CLEAN_FORM);\n  const validationStateRef = useRef<ValidationState>({\n    ok: true,\n    messages: {},\n  });\n\n  const [entity, _setEntity] = useState<Entity>();\n  const [, forceUpdate] = useState({});\n\n  const setFormEditState = useCallback((newState: FormEditState) => {\n    formEditStateRef.current = newState;\n  }, []);\n\n  const setEntity = useCallback(\n    (newEntity: Entity) => {\n      setFormEditState(\n        buildFormEditState(originalEntityRef.current, newEntity),\n      );\n      entityRef.current = newEntity;\n      _setEntity(newEntity);\n    },\n    [setFormEditState],\n  );\n\n  const submitChanges = useCallback(async () => {\n    const rpcResponse = await currentDataSource.current?.rpcCall?.(\n      viewportRpcRequest(\"VP_BULK_EDIT_SUBMIT_RPC\"),\n    );\n    console.log({ rpcResponse });\n  }, []);\n\n  const showSaveOrDiscardPrompt = useCallback(async () => {\n    const { current: currentEntity } = entityRef;\n    const { current: originalEntity } = originalEntityRef;\n    let resolver: Resolver | undefined = undefined;\n    const save = async () => {\n      await submitChanges();\n      closeDialog();\n      resolver?.(\"saved\");\n    };\n\n    const discard = () => {\n      closeDialog();\n      resolver?.(\"discarded\");\n    };\n\n    requestAnimationFrame(() => {\n      showDialog(\n        <UnsavedChangesReport\n          entity={originalEntity as Entity}\n          editedEntity={currentEntity as Entity}\n        />,\n        \"Unsaved Changes\",\n        [\n          <Button key=\"cancel\" onClick={discard}>\n            Discard Changes\n          </Button>,\n          <Button key=\"submit\" onClick={save}>\n            Save Changes\n          </Button>,\n        ],\n        true, // hideCloseButton\n      );\n    });\n\n    return new Promise((resolve) => {\n      resolver = resolve;\n    });\n  }, [closeDialog, showDialog, submitChanges]);\n\n  useMemo(async () => {\n    if (dataSource) {\n      if (formEditStateRef.current.isClean === false) {\n        await showSaveOrDiscardPrompt();\n      }\n\n      currentDataSource.current = dataSource;\n\n      originalEntityRef.current = undefined;\n\n      const columnMap = buildColumnMap(dataSource.columns);\n\n      dataSource?.subscribe({ range: { from: 0, to: 1 } }, (message) => {\n        if (messageHasDataRows(message)) {\n          const [row] = message.rows;\n          if (row) {\n            const entity = dataSourceRowToEntity(row, columnMap);\n            if (originalEntityRef.current === undefined) {\n              originalEntityRef.current = entity;\n              setEntity(entity);\n            }\n\n            const { editedFields } = buildFormEditState(\n              entityRef.current,\n              entity,\n            );\n\n            // for controls which do not yield incremental changes, e.g dropdown, calendar\n            // we apply the server update to our entity.\n            if (editedFields.length === 1) {\n              setEntity(entity);\n            }\n\n            // Do not overwrite entity here, just check that values returned by server\n            // match whats expected\n          }\n        }\n      });\n    }\n  }, [dataSource, setEntity, showSaveOrDiscardPrompt]);\n\n  const setValidationState = useCallback((state: ValidationState) => {\n    validationStateRef.current = state;\n    forceUpdate({});\n  }, []);\n\n  const handleFieldCommit = useCallback<CommitHandler<HTMLElement>>(\n    (_, value) => {\n      const { current: fieldName } = focusedFieldRef;\n      const dataDescriptor = find(formFieldDescriptors, fieldName);\n\n      const { current: state } = validationStateRef;\n      const newState = nextValidationState(state, dataDescriptor, value);\n      if (newState !== state) {\n        setValidationState(newState);\n      }\n\n      if (newState.ok && dataSource?.tableSchema) {\n        const { key } = dataSource.tableSchema;\n        const keyValue = entity?.[key] as string;\n        dataSource\n          ?.applyEdit(keyValue, fieldName, value)\n          .then((rpcResponse) => {\n            console.log({ rpcResponse });\n          });\n      }\n    },\n    [dataSource, entity, formFieldDescriptors, setValidationState],\n  );\n\n  const handleFieldChange = useCallback(\n    (evt: SyntheticEvent<HTMLInputElement>) => {\n      const { current: fieldName } = focusedFieldRef;\n      if (fieldName) {\n        const input = queryClosest<HTMLInputElement>(evt.target, \"input\", true);\n        const dataDescriptor = find(formFieldDescriptors, fieldName);\n        const value = input.value as string;\n        const { current: state } = validationStateRef;\n        const newState = nextValidationState(state, dataDescriptor, value);\n        if (newState !== state) {\n          setValidationState(newState);\n        }\n\n        setEntity({ ...entity, [fieldName]: value });\n      }\n    },\n    [entity, formFieldDescriptors, setEntity, setValidationState],\n  );\n\n  const handleFormSubmit = useCallback(async () => {\n    submitChanges();\n    setFormEditState(CLEAN_FORM);\n    originalEntityRef.current = entity;\n    onSubmit?.();\n    forceUpdate({});\n  }, [entity, onSubmit, setFormEditState, submitChanges]);\n\n  const handleFormCancel = useCallback(async () => {\n    // const rpcResponse = await dataSource?.rpcCall?.(\n    //   viewportRpcRequest(\"VP_BULK_EDIT_CANCEL_RPC\"),\n    // );\n    setFormEditState(CLEAN_FORM);\n    setValidationState(CLEAN_VALIDATION);\n    // console.log({ rpcResponse });\n    setEntity(originalEntityRef.current as Entity);\n  }, [setEntity, setFormEditState, setValidationState]);\n\n  const handleFocus = useCallback<FocusEventHandler>((evt) => {\n    // Ignore focus on popup Calendars, Lists etc\n    if (formFieldsContainerRef.current?.contains(evt.target)) {\n      const fieldName = getField(evt.target);\n      if (fieldName) {\n        if (fieldName) {\n          focusedFieldRef.current = fieldName;\n        }\n      }\n    }\n  }, []);\n\n  const {\n    current: { ok, messages: errorMessages },\n  } = validationStateRef;\n\n  const {\n    current: { isClean, editedFields },\n  } = formEditStateRef;\n\n  return {\n    editedFields,\n    editEntity: entity,\n    errorMessages,\n    formFieldsContainerRef,\n    isClean,\n    ok,\n    onCancel: handleFormCancel,\n    onChange: handleFieldChange,\n    onCommit: handleFieldCommit,\n    onFocus: handleFocus,\n    onSubmit: handleFormSubmit,\n  };\n};\n"],"names":["getEditValidationRules","buildValidationChecker","queryClosest","useDialogContext","useRef","CLEAN_FORM","useState","useCallback","buildFormEditState","viewportRpcRequest","jsx","UnsavedChangesReport","Button","useMemo","buildColumnMap","messageHasDataRows","entity","dataSourceRowToEntity","editedFields"],"mappings":"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"}

package/cjs/hooks/useVuuTables.js

@@ -4,12 +4,13 @@ var vuuUtils = require('@vuu-ui/vuu-utils');
 var react = require('react');
 
 const useVuuTables = () => {
-  const [tables, setTables] = react.useState();
+  const [tableSchemas, setTableSchemas] = react.useState();
   const { getServerAPI } = vuuUtils.useDataSource();
   const buildTables = react.useCallback((schemas) => {
     const vuuTables = /* @__PURE__ */ new Map();
     schemas.forEach((schema) => {
-      vuuTables.set(schema.table.table, schema);
+      const { module, table } = schema.table;
+      vuuTables.set(`${module}:${table}`, schema);
     });
     return vuuTables;
   }, []);
@@ -17,13 +18,11 @@ const useVuuTables = () => {
     async function fetchTableMetadata() {
       try {
         const server = await getServerAPI();
-        const { tables: tables2 } = await server.getTableList();
-        const tableSchemas = buildTables(
-          await Promise.all(
-            tables2.map((vuuTable) => server.getTableSchema(vuuTable))
-          )
+        const { tables } = await server.getTableList();
+        const tableSchemas2 = await Promise.all(
+          tables.map((vuuTable) => server.getTableSchema(vuuTable))
         );
-        setTables(tableSchemas);
+        setTableSchemas(tableSchemas2);
       } catch (err) {
         console.warn(
           `useVuuTables: error fetching table metadata ${String(err)}`
@@ -32,7 +31,7 @@ const useVuuTables = () => {
     }
     fetchTableMetadata();
   }, [buildTables, getServerAPI]);
-  return tables;
+  return tableSchemas;
 };
 
 exports.useVuuTables = useVuuTables;

package/cjs/hooks/useVuuTables.js.map

@@ -1 +1 @@
-{"version":3,"file":"useVuuTables.js","sources":["../../src/hooks/useVuuTables.ts"],"sourcesContent":["import type { TableSchema } from \"@vuu-ui/vuu-data-types\";\nimport { useDataSource } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useEffect, useState } from \"react\";\n\nexport const useVuuTables = () => {\n  const [tables, setTables] = useState<Map<string, TableSchema> | undefined>();\n\n  const { getServerAPI } = useDataSource();\n\n  const buildTables = useCallback((schemas: TableSchema[]) => {\n    const vuuTables = new Map<string, TableSchema>();\n    schemas.forEach((schema) => {\n      vuuTables.set(schema.table.table, schema);\n    });\n    return vuuTables;\n  }, []);\n\n  useEffect(() => {\n    async function fetchTableMetadata() {\n      try {\n        const server = await getServerAPI();\n        const { tables } = await server.getTableList();\n        const tableSchemas = buildTables(\n          await Promise.all(\n            tables.map((vuuTable) => server.getTableSchema(vuuTable)),\n          ),\n        );\n        setTables(tableSchemas);\n      } catch (err) {\n        console.warn(\n          `useVuuTables: error fetching table metadata ${String(err)}`,\n        );\n      }\n    }\n\n    fetchTableMetadata();\n  }, [buildTables, getServerAPI]);\n\n  return tables;\n};\n"],"names":["useState","useDataSource","useCallback","useEffect","tables"],"mappings":";;;;;AAIO,MAAM,eAAe,MAAM;AAChC,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAIA,cAA+C,EAAA;AAE3E,EAAM,MAAA,EAAE,YAAa,EAAA,GAAIC,sBAAc,EAAA;AAEvC,EAAM,MAAA,WAAA,GAAcC,iBAAY,CAAA,CAAC,OAA2B,KAAA;AAC1D,IAAM,MAAA,SAAA,uBAAgB,GAAyB,EAAA;AAC/C,IAAQ,OAAA,CAAA,OAAA,CAAQ,CAAC,MAAW,KAAA;AAC1B,MAAA,SAAA,CAAU,GAAI,CAAA,MAAA,CAAO,KAAM,CAAA,KAAA,EAAO,MAAM,CAAA;AAAA,KACzC,CAAA;AACD,IAAO,OAAA,SAAA;AAAA,GACT,EAAG,EAAE,CAAA;AAEL,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,eAAe,kBAAqB,GAAA;AAClC,MAAI,IAAA;AACF,QAAM,MAAA,MAAA,GAAS,MAAM,YAAa,EAAA;AAClC,QAAA,MAAM,EAAE,MAAAC,EAAAA,OAAAA,EAAW,GAAA,MAAM,OAAO,YAAa,EAAA;AAC7C,QAAA,MAAM,YAAe,GAAA,WAAA;AAAA,UACnB,MAAM,OAAQ,CAAA,GAAA;AAAA,YACZA,QAAO,GAAI,CAAA,CAAC,aAAa,MAAO,CAAA,cAAA,CAAe,QAAQ,CAAC;AAAA;AAC1D,SACF;AACA,QAAA,SAAA,CAAU,YAAY,CAAA;AAAA,eACf,GAAK,EAAA;AACZ,QAAQ,OAAA,CAAA,IAAA;AAAA,UACN,CAAA,4CAAA,EAA+C,MAAO,CAAA,GAAG,CAAC,CAAA;AAAA,SAC5D;AAAA;AACF;AAGF,IAAmB,kBAAA,EAAA;AAAA,GAClB,EAAA,CAAC,WAAa,EAAA,YAAY,CAAC,CAAA;AAE9B,EAAO,OAAA,MAAA;AACT;;;;"}
+{"version":3,"file":"useVuuTables.js","sources":["../../src/hooks/useVuuTables.ts"],"sourcesContent":["import type { TableSchema } from \"@vuu-ui/vuu-data-types\";\nimport { useDataSource } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useEffect, useState } from \"react\";\n\nexport const useVuuTables = () => {\n  const [tableSchemas, setTableSchemas] = useState<TableSchema[] | undefined>();\n\n  const { getServerAPI } = useDataSource();\n\n  const buildTables = useCallback((schemas: TableSchema[]) => {\n    const vuuTables = new Map<string, TableSchema>();\n    schemas.forEach((schema) => {\n      const { module, table } = schema.table;\n      vuuTables.set(`${module}:${table}`, schema);\n    });\n    return vuuTables;\n  }, []);\n\n  useEffect(() => {\n    async function fetchTableMetadata() {\n      try {\n        const server = await getServerAPI();\n        const { tables } = await server.getTableList();\n        const tableSchemas = await Promise.all(\n          tables.map((vuuTable) => server.getTableSchema(vuuTable)),\n        );\n        setTableSchemas(tableSchemas);\n      } catch (err) {\n        console.warn(\n          `useVuuTables: error fetching table metadata ${String(err)}`,\n        );\n      }\n    }\n\n    fetchTableMetadata();\n  }, [buildTables, getServerAPI]);\n\n  return tableSchemas;\n};\n"],"names":["useState","useDataSource","useCallback","useEffect","tableSchemas"],"mappings":";;;;;AAIO,MAAM,eAAe,MAAM;AAChC,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAIA,cAAoC,EAAA;AAE5E,EAAM,MAAA,EAAE,YAAa,EAAA,GAAIC,sBAAc,EAAA;AAEvC,EAAM,MAAA,WAAA,GAAcC,iBAAY,CAAA,CAAC,OAA2B,KAAA;AAC1D,IAAM,MAAA,SAAA,uBAAgB,GAAyB,EAAA;AAC/C,IAAQ,OAAA,CAAA,OAAA,CAAQ,CAAC,MAAW,KAAA;AAC1B,MAAA,MAAM,EAAE,MAAA,EAAQ,KAAM,EAAA,GAAI,MAAO,CAAA,KAAA;AACjC,MAAA,SAAA,CAAU,IAAI,CAAG,EAAA,MAAM,CAAI,CAAA,EAAA,KAAK,IAAI,MAAM,CAAA;AAAA,KAC3C,CAAA;AACD,IAAO,OAAA,SAAA;AAAA,GACT,EAAG,EAAE,CAAA;AAEL,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,eAAe,kBAAqB,GAAA;AAClC,MAAI,IAAA;AACF,QAAM,MAAA,MAAA,GAAS,MAAM,YAAa,EAAA;AAClC,QAAA,MAAM,EAAE,MAAA,EAAW,GAAA,MAAM,OAAO,YAAa,EAAA;AAC7C,QAAMC,MAAAA,aAAAA,GAAe,MAAM,OAAQ,CAAA,GAAA;AAAA,UACjC,OAAO,GAAI,CAAA,CAAC,aAAa,MAAO,CAAA,cAAA,CAAe,QAAQ,CAAC;AAAA,SAC1D;AACA,QAAA,eAAA,CAAgBA,aAAY,CAAA;AAAA,eACrB,GAAK,EAAA;AACZ,QAAQ,OAAA,CAAA,IAAA;AAAA,UACN,CAAA,4CAAA,EAA+C,MAAO,CAAA,GAAG,CAAC,CAAA;AAAA,SAC5D;AAAA;AACF;AAGF,IAAmB,kBAAA,EAAA;AAAA,GAClB,EAAA,CAAC,WAAa,EAAA,YAAY,CAAC,CAAA;AAE9B,EAAO,OAAA,YAAA;AACT;;;;"}

package/cjs/session-editing-form/SessionEditingForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SessionEditingForm.js","sources":["../../src/session-editing-form/SessionEditingForm.tsx"],"sourcesContent":["import { VuuDataSource } from \"@vuu-ui/vuu-data-remote\";\nimport { DataSource, TableSchema } from \"@vuu-ui/vuu-data-types\";\nimport {\n  VuuColumnDataType,\n  VuuDataRow,\n  VuuRowDataItemType,\n  VuuRpcAction,\n} from \"@vuu-ui/vuu-protocol-types\";\nimport {\n  buildColumnMap,\n  getTypedValue,\n  isActionMessage,\n  isErrorResponse,\n  queryClosest,\n  shallowEquals,\n  vuuEditCellRequest,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n  Button,\n  FormField,\n  FormFieldHelperText,\n  FormFieldLabel,\n  Input,\n  useIdMemo,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n  ChangeEvent,\n  ChangeEventHandler,\n  FocusEvent,\n  FocusEventHandler,\n  HTMLAttributes,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\n\nimport sessionEditingFormCss from \"./SessionEditingForm.css\";\n\nexport type FormFieldDescriptor = {\n  isKeyField?: boolean;\n  label?: string;\n  name: string;\n  type: VuuColumnDataType;\n  description: string;\n  readonly?: boolean;\n  required?: boolean;\n};\n\nexport type FormConfig = {\n  title: string;\n  key: string;\n  fields: FormFieldDescriptor[];\n};\n\nexport interface SessionEditingFormProps\n  extends HTMLAttributes<HTMLDivElement> {\n  config: FormConfig;\n  onClose?: () => void;\n  dataSource?: DataSource;\n  schema?: TableSchema;\n}\n\nconst classBase = \"vuuSessionEditingForm\";\n\nconst getField = (\n  fields: FormFieldDescriptor[],\n  name: string,\n): FormFieldDescriptor => {\n  const field = fields.find((f) => f.name === name);\n  if (field) {\n    return field;\n  } else {\n    throw Error(`SessionEditingForm, no field '${name}' found`);\n  }\n};\n\nconst getFieldNameAndValue = ({\n  target,\n}: ChangeEvent<HTMLInputElement> | FocusEvent<HTMLInputElement>): [\n  string,\n  string,\n] => {\n  const formField = queryClosest(target, \".saltFormField\");\n  if (formField) {\n    const {\n      dataset: { field },\n    } = formField;\n    if (field === undefined) {\n      throw Error(\"SessionEditingForm, form field has no field data attribute\");\n    }\n    return [field, target.value];\n  } else {\n    throw Error(\"Form control is not enclosed in FormField\");\n  }\n};\n\nconst Status = {\n  uninitialised: 0,\n  unchanged: 1,\n  changed: 2,\n  invalid: 3,\n};\n\nconst getDataSource = (\n  dataSource?: DataSource,\n  schema?: TableSchema,\n): DataSource => {\n  if (dataSource) {\n    return dataSource;\n  } else if (schema) {\n    return new VuuDataSource({\n      bufferSize: 0,\n      table: schema.table,\n      columns: schema.columns.map((col) => col.name),\n    }) as DataSource;\n  } else {\n    throw Error(\n      \"SessionEditingForm: either a DataSource or a TableSchema must be provided\",\n    );\n  }\n};\n\ntype FormValues = { [key: string]: VuuRowDataItemType | undefined };\n\nexport const SessionEditingForm = ({\n  className,\n  config: { fields, key: keyField },\n  dataSource: dataSourceProp,\n  id: idProp,\n  onClose,\n  schema,\n  ...htmlAttributes\n}: SessionEditingFormProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-session-editing-form\",\n    css: sessionEditingFormCss,\n    window: targetWindow,\n  });\n\n  const [fieldStatusValues, setFieldStatusValues] = useState<\n    Record<string, string | undefined>\n  >({});\n  const [values, setValues] = useState<FormValues>();\n  const [errorMessage, setErrorMessage] = useState(\"\");\n  const formContentRef = useRef<HTMLDivElement>(null);\n  const initialDataRef = useRef<FormValues>();\n  const dataStatusRef = useRef(Status.uninitialised);\n\n  const dataSource = useMemo(() => {\n    const ds = getDataSource(dataSourceProp, schema);\n    const { columns } = ds;\n    const columnMap = buildColumnMap(ds.columns);\n\n    const applyServerData = (data: VuuDataRow) => {\n      if (columnMap) {\n        const values: { [key: string]: VuuRowDataItemType } = {};\n        for (const column of columns) {\n          values[column] = data[columnMap[column]];\n        }\n        if (dataStatusRef.current === Status.uninitialised) {\n          dataStatusRef.current = Status.unchanged;\n          initialDataRef.current = values;\n        }\n        setValues(values);\n      }\n    };\n\n    ds.subscribe({ range: { from: 0, to: 5 } }, (message) => {\n      if (message.type === \"viewport-update\" && message.rows) {\n        if (dataStatusRef.current === Status.uninitialised) {\n          applyServerData(message.rows[0]);\n        } else {\n          console.log(\"what do we do with server updates\");\n        }\n      }\n    });\n    return ds;\n  }, [dataSourceProp, schema]);\n\n  const id = useIdMemo(idProp);\n\n  const handleChange = useCallback<ChangeEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const [field, value] = getFieldNameAndValue(evt);\n      const { type } = getField(fields, field);\n      const typedValue = getTypedValue(value, type);\n      setValues((values = {}) => {\n        const newValues = {\n          ...values,\n          [field]: typedValue,\n        };\n        const notUpdated = shallowEquals(newValues, initialDataRef.current);\n        dataStatusRef.current = notUpdated\n          ? Status.unchanged\n          : typedValue !== undefined\n            ? Status.changed\n            : Status.invalid;\n        return newValues;\n      });\n    },\n    [fields],\n  );\n\n  const handleBlur = useCallback<FocusEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const [field, value] = getFieldNameAndValue(evt);\n      const rowKey = values?.[keyField];\n      // TODO link this with client side validation if we're going to use it\n      const { type } = getField(fields, field);\n      const typedValue = getTypedValue(value, type, true);\n      if (typeof rowKey === \"string\") {\n        dataSource\n          .menuRpcCall(vuuEditCellRequest(rowKey, field, typedValue))\n          .then((response) => {\n            if (isErrorResponse(response)) {\n              console.log(`edit rejected ${response.error}`);\n              setFieldStatusValues((map) => ({\n                ...map,\n                [field]: response.error,\n              }));\n            } else {\n              setFieldStatusValues((map) => ({\n                ...map,\n                [field]: undefined,\n              }));\n            }\n          });\n      }\n    },\n    [dataSource, fields, keyField, values],\n  );\n\n  const applyAction = useCallback(\n    (action: VuuRpcAction) => {\n      if (action.type === \"CLOSE_DIALOG_ACTION\") {\n        onClose?.();\n      }\n    },\n    [onClose],\n  );\n\n  const handleSubmit = useCallback(async () => {\n    const rpcResponse = await dataSource.menuRpcCall({\n      type: \"VP_EDIT_SUBMIT_FORM_RPC\",\n    });\n    if (isErrorResponse(rpcResponse)) {\n      setErrorMessage(rpcResponse.error);\n    } else if (isActionMessage(rpcResponse)) {\n      applyAction(rpcResponse.action);\n    }\n  }, [applyAction, dataSource]);\n\n  const handleKeyDown = useCallback(\n    (evt) => {\n      if (evt.key === \"Enter\" && dataStatusRef.current === Status.changed) {\n        handleSubmit();\n      }\n    },\n    [handleSubmit],\n  );\n\n  const handleCancel = useCallback(() => {\n    onClose?.();\n  }, [onClose]);\n\n  const getFormControl = (field: FormFieldDescriptor) => {\n    const value = String(values?.[field.name] ?? \"\");\n    if (field.readonly || field.name === keyField) {\n      return (\n        <div className={`${classBase}-fieldValue vuuReadOnly`}>{value}</div>\n      );\n    } else {\n      return (\n        <Input\n          className={`${classBase}-fieldValue`}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          value={value}\n          id={`${id}-input-${field.name}`}\n        />\n      );\n    }\n  };\n\n  useEffect(() => {\n    if (formContentRef.current) {\n      const firstInput = formContentRef.current.querySelector(\n        \"input\",\n      ) as HTMLInputElement;\n      if (firstInput) {\n        setTimeout(() => {\n          firstInput.focus();\n          firstInput.select();\n        }, 100);\n      }\n    }\n  }, []);\n\n  useEffect(() => {\n    return () => {\n      if (dataSource) {\n        dataSource.unsubscribe();\n      }\n    };\n  }, [dataSource]);\n\n  const isDirty = dataStatusRef.current === Status.changed;\n  return (\n    <div {...htmlAttributes} className={cx(classBase, className)}>\n      {errorMessage ? (\n        <div\n          className={`${classBase}-errorBanner`}\n          data-icon=\"error\"\n          title={errorMessage}\n        >\n          Error, edit(s) not saved\n        </div>\n      ) : undefined}\n      <div\n        className={`${classBase}-content`}\n        ref={formContentRef}\n        onKeyDown={handleKeyDown}\n      >\n        {fields.map((field) => (\n          <FormField\n            className={`${classBase}-field`}\n            data-field={field.name}\n            key={field.name}\n            necessity={field.required ? \"required\" : \"optional\"}\n            readOnly={field.readonly}\n            validationStatus={\n              fieldStatusValues[field.name] ? \"error\" : undefined\n            }\n          >\n            <FormFieldLabel>{field?.label ?? field.description}</FormFieldLabel>\n            {getFormControl(field)}\n            <FormFieldHelperText>\n              {fieldStatusValues[field.name] ?? \"\"}\n            </FormFieldHelperText>\n          </FormField>\n        ))}\n      </div>\n      <div className={`${classBase}-buttonbar salt-theme salt-density-high`}>\n        <Button\n          type=\"submit\"\n          variant=\"cta\"\n          disabled={!isDirty}\n          onClick={handleSubmit}\n        >\n          Submit\n        </Button>\n        <Button variant=\"secondary\" onClick={handleCancel}>\n          Cancel\n        </Button>\n      </div>\n    </div>\n  );\n};\n"],"names":["queryClosest","VuuDataSource","useWindow","useComponentCssInjection","sessionEditingFormCss","useState","useRef","useMemo","buildColumnMap","values","useIdMemo","useCallback","getTypedValue","shallowEquals","vuuEditCellRequest","isErrorResponse","isActionMessage","jsx","Input","useEffect","jsxs","FormField","FormFieldLabel","FormFieldHelperText","Button"],"mappings":"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"}
+{"version":3,"file":"SessionEditingForm.js","sources":["../../src/session-editing-form/SessionEditingForm.tsx"],"sourcesContent":["import { VuuDataSource } from \"@vuu-ui/vuu-data-remote\";\nimport { DataSource, TableSchema } from \"@vuu-ui/vuu-data-types\";\nimport {\n  VuuColumnDataType,\n  VuuDataRow,\n  VuuRowDataItemType,\n  VuuRpcAction,\n} from \"@vuu-ui/vuu-protocol-types\";\nimport {\n  buildColumnMap,\n  getTypedValue,\n  isActionMessage,\n  isErrorResponse,\n  queryClosest,\n  shallowEquals,\n  vuuEditCellRequest,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n  Button,\n  FormField,\n  FormFieldHelperText,\n  FormFieldLabel,\n  Input,\n  useIdMemo,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n  ChangeEvent,\n  ChangeEventHandler,\n  FocusEvent,\n  FocusEventHandler,\n  HTMLAttributes,\n  KeyboardEventHandler,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\n\nimport sessionEditingFormCss from \"./SessionEditingForm.css\";\n\nexport type FormFieldDescriptor = {\n  isKeyField?: boolean;\n  label?: string;\n  name: string;\n  type: VuuColumnDataType;\n  description: string;\n  readonly?: boolean;\n  required?: boolean;\n};\n\nexport type FormConfig = {\n  title: string;\n  key: string;\n  fields: FormFieldDescriptor[];\n};\n\nexport interface SessionEditingFormProps\n  extends HTMLAttributes<HTMLDivElement> {\n  config: FormConfig;\n  onClose?: () => void;\n  dataSource?: DataSource;\n  schema?: TableSchema;\n}\n\nconst classBase = \"vuuSessionEditingForm\";\n\nconst getField = (\n  fields: FormFieldDescriptor[],\n  name: string,\n): FormFieldDescriptor => {\n  const field = fields.find((f) => f.name === name);\n  if (field) {\n    return field;\n  } else {\n    throw Error(`SessionEditingForm, no field '${name}' found`);\n  }\n};\n\nconst getFieldNameAndValue = ({\n  target,\n}: ChangeEvent<HTMLInputElement> | FocusEvent<HTMLInputElement>): [\n  string,\n  string,\n] => {\n  const formField = queryClosest(target, \".saltFormField\");\n  if (formField) {\n    const {\n      dataset: { field },\n    } = formField;\n    if (field === undefined) {\n      throw Error(\"SessionEditingForm, form field has no field data attribute\");\n    }\n    return [field, target.value];\n  } else {\n    throw Error(\"Form control is not enclosed in FormField\");\n  }\n};\n\nconst Status = {\n  uninitialised: 0,\n  unchanged: 1,\n  changed: 2,\n  invalid: 3,\n};\n\nconst getDataSource = (\n  dataSource?: DataSource,\n  schema?: TableSchema,\n): DataSource => {\n  if (dataSource) {\n    return dataSource;\n  } else if (schema) {\n    return new VuuDataSource({\n      bufferSize: 0,\n      table: schema.table,\n      columns: schema.columns.map((col) => col.name),\n    }) as DataSource;\n  } else {\n    throw Error(\n      \"SessionEditingForm: either a DataSource or a TableSchema must be provided\",\n    );\n  }\n};\n\ntype FormValues = { [key: string]: VuuRowDataItemType | undefined };\n\nexport const SessionEditingForm = ({\n  className,\n  config: { fields, key: keyField },\n  dataSource: dataSourceProp,\n  id: idProp,\n  onClose,\n  schema,\n  ...htmlAttributes\n}: SessionEditingFormProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-session-editing-form\",\n    css: sessionEditingFormCss,\n    window: targetWindow,\n  });\n\n  const [fieldStatusValues, setFieldStatusValues] = useState<\n    Record<string, string | undefined>\n  >({});\n  const [values, setValues] = useState<FormValues>();\n  const [errorMessage, setErrorMessage] = useState(\"\");\n  const formContentRef = useRef<HTMLDivElement>(null);\n  const initialDataRef = useRef<FormValues>();\n  const dataStatusRef = useRef(Status.uninitialised);\n\n  const dataSource = useMemo(() => {\n    const ds = getDataSource(dataSourceProp, schema);\n    const { columns } = ds;\n    const columnMap = buildColumnMap(ds.columns);\n\n    const applyServerData = (data: VuuDataRow) => {\n      if (columnMap) {\n        const values: { [key: string]: VuuRowDataItemType } = {};\n        for (const column of columns) {\n          values[column] = data[columnMap[column]];\n        }\n        if (dataStatusRef.current === Status.uninitialised) {\n          dataStatusRef.current = Status.unchanged;\n          initialDataRef.current = values;\n        }\n        setValues(values);\n      }\n    };\n\n    ds.subscribe({ range: { from: 0, to: 5 } }, (message) => {\n      if (message.type === \"viewport-update\" && message.rows) {\n        if (dataStatusRef.current === Status.uninitialised) {\n          applyServerData(message.rows[0]);\n        } else {\n          console.log(\"what do we do with server updates\");\n        }\n      }\n    });\n    return ds;\n  }, [dataSourceProp, schema]);\n\n  const id = useIdMemo(idProp);\n\n  const handleChange = useCallback<ChangeEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const [field, value] = getFieldNameAndValue(evt);\n      const { type } = getField(fields, field);\n      const typedValue = getTypedValue(value, type);\n      setValues((values = {}) => {\n        const newValues = {\n          ...values,\n          [field]: typedValue,\n        };\n        const notUpdated = shallowEquals(newValues, initialDataRef.current);\n        dataStatusRef.current = notUpdated\n          ? Status.unchanged\n          : typedValue !== undefined\n            ? Status.changed\n            : Status.invalid;\n        return newValues;\n      });\n    },\n    [fields],\n  );\n\n  const handleBlur = useCallback<FocusEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const [field, value] = getFieldNameAndValue(evt);\n      const rowKey = values?.[keyField];\n      // TODO link this with client side validation if we're going to use it\n      const { type } = getField(fields, field);\n      const typedValue = getTypedValue(value, type, true);\n      if (typeof rowKey === \"string\") {\n        dataSource\n          .menuRpcCall(vuuEditCellRequest(rowKey, field, typedValue))\n          .then((response) => {\n            if (isErrorResponse(response)) {\n              console.log(`edit rejected ${response.error}`);\n              setFieldStatusValues((map) => ({\n                ...map,\n                [field]: response.error,\n              }));\n            } else {\n              setFieldStatusValues((map) => ({\n                ...map,\n                [field]: undefined,\n              }));\n            }\n          });\n      }\n    },\n    [dataSource, fields, keyField, values],\n  );\n\n  const applyAction = useCallback(\n    (action: VuuRpcAction) => {\n      if (action.type === \"CLOSE_DIALOG_ACTION\") {\n        onClose?.();\n      }\n    },\n    [onClose],\n  );\n\n  const handleSubmit = useCallback(async () => {\n    const rpcResponse = await dataSource.menuRpcCall({\n      type: \"VP_EDIT_SUBMIT_FORM_RPC\",\n    });\n    if (isErrorResponse(rpcResponse)) {\n      setErrorMessage(rpcResponse.error);\n    } else if (isActionMessage(rpcResponse)) {\n      applyAction(rpcResponse.action);\n    }\n  }, [applyAction, dataSource]);\n\n  const handleKeyDown = useCallback<KeyboardEventHandler>(\n    (evt) => {\n      if (evt.key === \"Enter\" && dataStatusRef.current === Status.changed) {\n        handleSubmit();\n      }\n    },\n    [handleSubmit],\n  );\n\n  const handleCancel = useCallback(() => {\n    onClose?.();\n  }, [onClose]);\n\n  const getFormControl = (field: FormFieldDescriptor) => {\n    const value = String(values?.[field.name] ?? \"\");\n    if (field.readonly || field.name === keyField) {\n      return (\n        <div className={`${classBase}-fieldValue vuuReadOnly`}>{value}</div>\n      );\n    } else {\n      return (\n        <Input\n          className={`${classBase}-fieldValue`}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          value={value}\n          id={`${id}-input-${field.name}`}\n        />\n      );\n    }\n  };\n\n  useEffect(() => {\n    if (formContentRef.current) {\n      const firstInput = formContentRef.current.querySelector(\n        \"input\",\n      ) as HTMLInputElement;\n      if (firstInput) {\n        setTimeout(() => {\n          firstInput.focus();\n          firstInput.select();\n        }, 100);\n      }\n    }\n  }, []);\n\n  useEffect(() => {\n    return () => {\n      if (dataSource) {\n        dataSource.unsubscribe();\n      }\n    };\n  }, [dataSource]);\n\n  const isDirty = dataStatusRef.current === Status.changed;\n  return (\n    <div {...htmlAttributes} className={cx(classBase, className)}>\n      {errorMessage ? (\n        <div\n          className={`${classBase}-errorBanner`}\n          data-icon=\"error\"\n          title={errorMessage}\n        >\n          Error, edit(s) not saved\n        </div>\n      ) : undefined}\n      <div\n        className={`${classBase}-content`}\n        ref={formContentRef}\n        onKeyDown={handleKeyDown}\n      >\n        {fields.map((field) => (\n          <FormField\n            className={`${classBase}-field`}\n            data-field={field.name}\n            key={field.name}\n            necessity={field.required ? \"required\" : \"optional\"}\n            readOnly={field.readonly}\n            validationStatus={\n              fieldStatusValues[field.name] ? \"error\" : undefined\n            }\n          >\n            <FormFieldLabel>{field?.label ?? field.description}</FormFieldLabel>\n            {getFormControl(field)}\n            <FormFieldHelperText>\n              {fieldStatusValues[field.name] ?? \"\"}\n            </FormFieldHelperText>\n          </FormField>\n        ))}\n      </div>\n      <div className={`${classBase}-buttonbar salt-theme salt-density-high`}>\n        <Button\n          type=\"submit\"\n          variant=\"cta\"\n          disabled={!isDirty}\n          onClick={handleSubmit}\n        >\n          Submit\n        </Button>\n        <Button variant=\"secondary\" onClick={handleCancel}>\n          Cancel\n        </Button>\n      </div>\n    </div>\n  );\n};\n"],"names":["queryClosest","VuuDataSource","useWindow","useComponentCssInjection","sessionEditingFormCss","useState","useRef","useMemo","buildColumnMap","values","useIdMemo","useCallback","getTypedValue","shallowEquals","vuuEditCellRequest","isErrorResponse","isActionMessage","jsx","Input","useEffect","jsxs","FormField","FormFieldLabel","FormFieldHelperText","Button"],"mappings":"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"}

package/esm/data-editing/get-data-item-edit-control.js.map

@@ -1 +1 @@
-{"version":3,"file":"get-data-item-edit-control.js","sources":["../../src/data-editing/get-data-item-edit-control.tsx"],"sourcesContent":["import type {\n  DataValueDescriptor,\n  TableSchemaTable,\n} from \"@vuu-ui/vuu-data-types\";\nimport {\n  VuuDatePicker,\n  VuuInput,\n  VuuTypeaheadInput,\n  VuuTypeaheadInputProps,\n} from \"@vuu-ui/vuu-ui-controls\";\nimport { CommitHandler, isDateTimeDataValue } from \"@vuu-ui/vuu-utils\";\nimport { InputProps } from \"@salt-ds/core\";\n\nexport interface DataItemEditControlProps {\n  InputProps?: Partial<InputProps>;\n  TypeaheadProps?: Pick<VuuTypeaheadInputProps, \"highlightFirstSuggestion\">;\n  commitWhenCleared?: boolean;\n  /**\n   * A table column or form field Descriptor.\n   */\n  dataDescriptor: DataValueDescriptor;\n  errorMessage?: string;\n  onCommit: CommitHandler<HTMLElement, string | undefined>;\n  table?: TableSchemaTable;\n}\n\nexport type ValidationStatus = \"initial\" | true | string;\n\nexport const getDataItemEditControl = ({\n  InputProps,\n  TypeaheadProps,\n  commitWhenCleared,\n  dataDescriptor,\n  errorMessage,\n  onCommit,\n  table,\n}: DataItemEditControlProps) => {\n  const handleCommitNumber: CommitHandler<HTMLElement, number> = (\n    evt,\n    value,\n  ) => {\n    onCommit(evt, value.toString());\n  };\n\n  if (dataDescriptor.editable === false) {\n    return (\n      <VuuInput\n        variant=\"secondary\"\n        {...InputProps}\n        onCommit={onCommit}\n        readOnly\n      />\n    );\n  } else if (isDateTimeDataValue(dataDescriptor)) {\n    return <VuuDatePicker onCommit={handleCommitNumber} />;\n  } else if (dataDescriptor.serverDataType === \"string\" && table) {\n    return (\n      <VuuTypeaheadInput\n        {...InputProps}\n        {...TypeaheadProps}\n        column={dataDescriptor.name}\n        onCommit={onCommit}\n        table={table}\n      />\n    );\n  }\n  return (\n    <VuuInput\n      variant=\"secondary\"\n      {...InputProps}\n      commitWhenCleared={commitWhenCleared}\n      onCommit={onCommit}\n      errorMessage={errorMessage}\n    />\n  );\n};\n"],"names":["InputProps"],"mappings":";;;;AA4BO,MAAM,yBAAyB,CAAC;AAAA,EACrC,UAAAA,EAAAA,WAAAA;AAAA,EACA,cAAA;AAAA,EACA,iBAAA;AAAA,EACA,cAAA;AAAA,EACA,YAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAAgC,KAAA;AAC9B,EAAM,MAAA,kBAAA,GAAyD,CAC7D,GAAA,EACA,KACG,KAAA;AACH,IAAS,QAAA,CAAA,GAAA,EAAK,KAAM,CAAA,QAAA,EAAU,CAAA;AAAA,GAChC;AAEA,EAAI,IAAA,cAAA,CAAe,aAAa,KAAO,EAAA;AACrC,IACE,uBAAA,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,OAAQ,EAAA,WAAA;AAAA,QACP,GAAGA,WAAAA;AAAA,QACJ,QAAA;AAAA,QACA,QAAQ,EAAA;AAAA;AAAA,KACV;AAAA,GAEJ,MAAA,IAAW,mBAAoB,CAAA,cAAc,CAAG,EAAA;AAC9C,IAAO,uBAAA,GAAA,CAAC,aAAc,EAAA,EAAA,QAAA,EAAU,kBAAoB,EAAA,CAAA;AAAA,GAC3C,MAAA,IAAA,cAAA,CAAe,cAAmB,KAAA,QAAA,IAAY,KAAO,EAAA;AAC9D,IACE,uBAAA,GAAA;AAAA,MAAC,iBAAA;AAAA,MAAA;AAAA,QACE,GAAGA,WAAAA;AAAA,QACH,GAAG,cAAA;AAAA,QACJ,QAAQ,cAAe,CAAA,IAAA;AAAA,QACvB,QAAA;AAAA,QACA;AAAA;AAAA,KACF;AAAA;AAGJ,EACE,uBAAA,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,WAAA;AAAA,MACP,GAAGA,WAAAA;AAAA,MACJ,iBAAA;AAAA,MACA,QAAA;AAAA,MACA;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"get-data-item-edit-control.js","sources":["../../src/data-editing/get-data-item-edit-control.tsx"],"sourcesContent":["import type {\n  DataValueDescriptor,\n  TableSchemaTable,\n} from \"@vuu-ui/vuu-data-types\";\nimport {\n  VuuDatePicker,\n  VuuInput,\n  VuuTypeaheadInput,\n  VuuTypeaheadInputProps,\n} from \"@vuu-ui/vuu-ui-controls\";\nimport { CommitHandler, isDateTimeDataValue } from \"@vuu-ui/vuu-utils\";\nimport { InputProps } from \"@salt-ds/core\";\n\nexport interface DataItemEditControlProps {\n  InputProps?: Partial<InputProps>;\n  TypeaheadProps?: Pick<VuuTypeaheadInputProps, \"highlightFirstSuggestion\">;\n  commitWhenCleared?: boolean;\n  /**\n   * A table column or form field Descriptor.\n   */\n  dataDescriptor: DataValueDescriptor;\n  errorMessage?: string;\n  onCommit: CommitHandler<HTMLElement>;\n  table?: TableSchemaTable;\n}\n\nexport type ValidationStatus = \"initial\" | true | string;\n\nexport const getDataItemEditControl = ({\n  InputProps,\n  TypeaheadProps,\n  commitWhenCleared,\n  dataDescriptor,\n  errorMessage,\n  onCommit,\n  table,\n}: DataItemEditControlProps) => {\n  const handleCommitNumber: CommitHandler<HTMLElement, number> = (\n    evt,\n    value,\n  ) => {\n    onCommit(evt, value.toString());\n  };\n\n  if (dataDescriptor.editable === false) {\n    return (\n      <VuuInput\n        variant=\"secondary\"\n        {...InputProps}\n        onCommit={onCommit}\n        readOnly\n      />\n    );\n  } else if (isDateTimeDataValue(dataDescriptor)) {\n    return <VuuDatePicker onCommit={handleCommitNumber} />;\n  } else if (dataDescriptor.serverDataType === \"string\" && table) {\n    return (\n      <VuuTypeaheadInput\n        {...InputProps}\n        {...TypeaheadProps}\n        column={dataDescriptor.name}\n        onCommit={onCommit}\n        table={table}\n      />\n    );\n  }\n  return (\n    <VuuInput\n      variant=\"secondary\"\n      {...InputProps}\n      commitWhenCleared={commitWhenCleared}\n      onCommit={onCommit}\n      errorMessage={errorMessage}\n    />\n  );\n};\n"],"names":["InputProps"],"mappings":";;;;AA4BO,MAAM,yBAAyB,CAAC;AAAA,EACrC,UAAAA,EAAAA,WAAAA;AAAA,EACA,cAAA;AAAA,EACA,iBAAA;AAAA,EACA,cAAA;AAAA,EACA,YAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAAgC,KAAA;AAC9B,EAAM,MAAA,kBAAA,GAAyD,CAC7D,GAAA,EACA,KACG,KAAA;AACH,IAAS,QAAA,CAAA,GAAA,EAAK,KAAM,CAAA,QAAA,EAAU,CAAA;AAAA,GAChC;AAEA,EAAI,IAAA,cAAA,CAAe,aAAa,KAAO,EAAA;AACrC,IACE,uBAAA,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,OAAQ,EAAA,WAAA;AAAA,QACP,GAAGA,WAAAA;AAAA,QACJ,QAAA;AAAA,QACA,QAAQ,EAAA;AAAA;AAAA,KACV;AAAA,GAEJ,MAAA,IAAW,mBAAoB,CAAA,cAAc,CAAG,EAAA;AAC9C,IAAO,uBAAA,GAAA,CAAC,aAAc,EAAA,EAAA,QAAA,EAAU,kBAAoB,EAAA,CAAA;AAAA,GAC3C,MAAA,IAAA,cAAA,CAAe,cAAmB,KAAA,QAAA,IAAY,KAAO,EAAA;AAC9D,IACE,uBAAA,GAAA;AAAA,MAAC,iBAAA;AAAA,MAAA;AAAA,QACE,GAAGA,WAAAA;AAAA,QACH,GAAG,cAAA;AAAA,QACJ,QAAQ,cAAe,CAAA,IAAA;AAAA,QACvB,QAAA;AAAA,QACA;AAAA;AAAA,KACF;AAAA;AAGJ,EACE,uBAAA,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,WAAA;AAAA,MACP,GAAGA,WAAAA;AAAA,MACJ,iBAAA;AAAA,MACA,QAAA;AAAA,MACA;AAAA;AAAA,GACF;AAEJ;;;;"}

package/esm/data-editing/useEditForm.js

@@ -165,7 +165,7 @@ const useEditForm = ({
     forceUpdate({});
   }, []);
   const handleFieldCommit = useCallback(
-    (evt, value) => {
+    (_, value) => {
       const { current: fieldName } = focusedFieldRef;
       const dataDescriptor = find(formFieldDescriptors, fieldName);
       const { current: state } = validationStateRef;

package/esm/data-editing/useEditForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"useEditForm.js","sources":["../../src/data-editing/useEditForm.tsx"],"sourcesContent":["import type { DataSource, DataValueDescriptor } from \"@vuu-ui/vuu-data-types\";\nimport { useDialogContext } from \"@vuu-ui/vuu-popups\";\nimport type { VuuRowDataItemType } from \"@vuu-ui/vuu-protocol-types\";\nimport {\n  Entity,\n  buildColumnMap,\n  dataSourceRowToEntity,\n  messageHasDataRows,\n  queryClosest,\n  viewportRpcRequest,\n} from \"@vuu-ui/vuu-utils\";\nimport { Button } from \"@salt-ds/core\";\nimport {\n  FocusEventHandler,\n  SyntheticEvent,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { UnsavedChangesReport } from \"./UnsavedChangesReport\";\nimport {\n  buildValidationChecker,\n  getEditValidationRules,\n} from \"./edit-rule-validation-checker\";\nimport {\n  CLEAN_FORM,\n  FormEditState,\n  buildFormEditState,\n} from \"./form-edit-state\";\n\nexport interface EditFormHookProps {\n  dataSource?: DataSource;\n  formFieldDescriptors: DataValueDescriptor[];\n  onSubmit?: () => void;\n}\n\ntype ValidationState = {\n  ok: boolean;\n  messages: Record<string, string>;\n};\n\nconst CLEAN_VALIDATION: ValidationState = {\n  ok: true,\n  messages: {},\n};\n\nconst getValidationChecker = (\n  descriptor: DataValueDescriptor,\n  editPhase: \"change\" | \"commit\",\n) => {\n  const rules = getEditValidationRules(descriptor, editPhase) ?? [];\n  return buildValidationChecker(rules);\n};\n\nconst nextValidationState = (\n  state: ValidationState,\n  dataDescriptor: DataValueDescriptor,\n  value: VuuRowDataItemType,\n): ValidationState => {\n  const check = getValidationChecker(dataDescriptor, \"change\");\n  const result = check(value, \"change\");\n  const { name } = dataDescriptor;\n\n  const { ok: wasOk, messages: existingMessages } = state;\n\n  if (result.ok) {\n    if (!wasOk) {\n      // if this field was the only one in error, the overall state\n      // will now be ok, but not if there is still one or more other\n      // field still in error.\n      const fieldsInError = Object.keys(existingMessages);\n      if (fieldsInError.includes(name)) {\n        if (fieldsInError.length === 1) {\n          return { ok: true, messages: {} };\n        } else {\n          const messages = { ...existingMessages };\n          delete messages[name];\n          return { ok: false, messages };\n        }\n      }\n    }\n  } else {\n    return {\n      ok: false,\n      messages: {\n        ...existingMessages,\n        [name]: result.messages.join(\"\\n\"),\n      },\n    };\n  }\n\n  return state;\n};\n\nfunction find(descriptors: DataValueDescriptor[], fieldname: string) {\n  const d = descriptors.find(({ name }) => name === fieldname);\n  if (d) {\n    return d;\n  }\n  throw Error(`DataValueDescriptor not found for field ${fieldname}`);\n}\n\nconst getField = (target: EventTarget | HTMLElement) => {\n  const fieldElement = queryClosest(target, \"[data-field]\");\n  if (fieldElement) {\n    return fieldElement.dataset.field as string;\n  } else {\n    throw Error(\"no field \");\n  }\n};\n\ntype Resolver = (value: unknown) => void;\n\nexport const useEditForm = ({\n  dataSource,\n  formFieldDescriptors,\n  onSubmit,\n}: EditFormHookProps) => {\n  const { showDialog, closeDialog } = useDialogContext();\n\n  const currentDataSource = useRef<DataSource>();\n  const formFieldsContainerRef = useRef<HTMLDivElement>(null);\n  const entityRef = useRef<Entity>();\n  const focusedFieldRef = useRef(\"\");\n  const originalEntityRef = useRef<Entity>();\n  const formEditStateRef = useRef<FormEditState>(CLEAN_FORM);\n  const validationStateRef = useRef<ValidationState>({\n    ok: true,\n    messages: {},\n  });\n\n  const [entity, _setEntity] = useState<Entity>();\n  const [, forceUpdate] = useState({});\n\n  const setFormEditState = useCallback((newState: FormEditState) => {\n    formEditStateRef.current = newState;\n  }, []);\n\n  const setEntity = useCallback(\n    (newEntity: Entity) => {\n      setFormEditState(\n        buildFormEditState(originalEntityRef.current, newEntity),\n      );\n      entityRef.current = newEntity;\n      _setEntity(newEntity);\n    },\n    [setFormEditState],\n  );\n\n  const submitChanges = useCallback(async () => {\n    const rpcResponse = await currentDataSource.current?.rpcCall?.(\n      viewportRpcRequest(\"VP_BULK_EDIT_SUBMIT_RPC\"),\n    );\n    console.log({ rpcResponse });\n  }, []);\n\n  const showSaveOrDiscardPrompt = useCallback(async () => {\n    const { current: currentEntity } = entityRef;\n    const { current: originalEntity } = originalEntityRef;\n    let resolver: Resolver | undefined = undefined;\n    const save = async () => {\n      await submitChanges();\n      closeDialog();\n      resolver?.(\"saved\");\n    };\n\n    const discard = () => {\n      closeDialog();\n      resolver?.(\"discarded\");\n    };\n\n    requestAnimationFrame(() => {\n      showDialog(\n        <UnsavedChangesReport\n          entity={originalEntity as Entity}\n          editedEntity={currentEntity as Entity}\n        />,\n        \"Unsaved Changes\",\n        [\n          <Button key=\"cancel\" onClick={discard}>\n            Discard Changes\n          </Button>,\n          <Button key=\"submit\" onClick={save}>\n            Save Changes\n          </Button>,\n        ],\n        true, // hideCloseButton\n      );\n    });\n\n    return new Promise((resolve) => {\n      resolver = resolve;\n    });\n  }, [closeDialog, showDialog, submitChanges]);\n\n  useMemo(async () => {\n    if (dataSource) {\n      if (formEditStateRef.current.isClean === false) {\n        await showSaveOrDiscardPrompt();\n      }\n\n      currentDataSource.current = dataSource;\n\n      originalEntityRef.current = undefined;\n\n      const columnMap = buildColumnMap(dataSource.columns);\n\n      dataSource?.subscribe({ range: { from: 0, to: 1 } }, (message) => {\n        if (messageHasDataRows(message)) {\n          const [row] = message.rows;\n          if (row) {\n            const entity = dataSourceRowToEntity(row, columnMap);\n            if (originalEntityRef.current === undefined) {\n              originalEntityRef.current = entity;\n              setEntity(entity);\n            }\n\n            const { editedFields } = buildFormEditState(\n              entityRef.current,\n              entity,\n            );\n\n            // for controls which do not yield incremental changes, e.g dropdown, calendar\n            // we apply the server update to our entity.\n            if (editedFields.length === 1) {\n              setEntity(entity);\n            }\n\n            // Do not overwrite entity here, just check that values returned by server\n            // match whats expected\n          }\n        }\n      });\n    }\n  }, [dataSource, setEntity, showSaveOrDiscardPrompt]);\n\n  const setValidationState = useCallback((state: ValidationState) => {\n    validationStateRef.current = state;\n    forceUpdate({});\n  }, []);\n\n  const handleFieldCommit = useCallback(\n    (evt, value) => {\n      const { current: fieldName } = focusedFieldRef;\n      const dataDescriptor = find(formFieldDescriptors, fieldName);\n\n      const { current: state } = validationStateRef;\n      const newState = nextValidationState(state, dataDescriptor, value);\n      if (newState !== state) {\n        setValidationState(newState);\n      }\n\n      if (newState.ok && dataSource?.tableSchema) {\n        const { key } = dataSource.tableSchema;\n        const keyValue = entity?.[key] as string;\n        dataSource\n          ?.applyEdit(keyValue, fieldName, value)\n          .then((rpcResponse) => {\n            console.log({ rpcResponse });\n          });\n      }\n    },\n    [dataSource, entity, formFieldDescriptors, setValidationState],\n  );\n\n  const handleFieldChange = useCallback(\n    (evt: SyntheticEvent<HTMLInputElement>) => {\n      const { current: fieldName } = focusedFieldRef;\n      if (fieldName) {\n        const input = queryClosest<HTMLInputElement>(evt.target, \"input\", true);\n        const dataDescriptor = find(formFieldDescriptors, fieldName);\n        const value = input.value as string;\n        const { current: state } = validationStateRef;\n        const newState = nextValidationState(state, dataDescriptor, value);\n        if (newState !== state) {\n          setValidationState(newState);\n        }\n\n        setEntity({ ...entity, [fieldName]: value });\n      }\n    },\n    [entity, formFieldDescriptors, setEntity, setValidationState],\n  );\n\n  const handleFormSubmit = useCallback(async () => {\n    submitChanges();\n    setFormEditState(CLEAN_FORM);\n    originalEntityRef.current = entity;\n    onSubmit?.();\n    forceUpdate({});\n  }, [entity, onSubmit, setFormEditState, submitChanges]);\n\n  const handleFormCancel = useCallback(async () => {\n    // const rpcResponse = await dataSource?.rpcCall?.(\n    //   viewportRpcRequest(\"VP_BULK_EDIT_CANCEL_RPC\"),\n    // );\n    setFormEditState(CLEAN_FORM);\n    setValidationState(CLEAN_VALIDATION);\n    // console.log({ rpcResponse });\n    setEntity(originalEntityRef.current as Entity);\n  }, [setEntity, setFormEditState, setValidationState]);\n\n  const handleFocus = useCallback<FocusEventHandler>((evt) => {\n    // Ignore focus on popup Calendars, Lists etc\n    if (formFieldsContainerRef.current?.contains(evt.target)) {\n      const fieldName = getField(evt.target);\n      if (fieldName) {\n        if (fieldName) {\n          focusedFieldRef.current = fieldName;\n        }\n      }\n    }\n  }, []);\n\n  const {\n    current: { ok, messages: errorMessages },\n  } = validationStateRef;\n\n  const {\n    current: { isClean, editedFields },\n  } = formEditStateRef;\n\n  return {\n    editedFields,\n    editEntity: entity,\n    errorMessages,\n    formFieldsContainerRef,\n    isClean,\n    ok,\n    onCancel: handleFormCancel,\n    onChange: handleFieldChange,\n    onCommit: handleFieldCommit,\n    onFocus: handleFocus,\n    onSubmit: handleFormSubmit,\n  };\n};\n"],"names":["entity","editedFields"],"mappings":"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"}
+{"version":3,"file":"useEditForm.js","sources":["../../src/data-editing/useEditForm.tsx"],"sourcesContent":["import type { DataSource, DataValueDescriptor } from \"@vuu-ui/vuu-data-types\";\nimport { useDialogContext } from \"@vuu-ui/vuu-popups\";\nimport type { VuuRowDataItemType } from \"@vuu-ui/vuu-protocol-types\";\nimport {\n  CommitHandler,\n  Entity,\n  buildColumnMap,\n  dataSourceRowToEntity,\n  messageHasDataRows,\n  queryClosest,\n  viewportRpcRequest,\n} from \"@vuu-ui/vuu-utils\";\nimport { Button } from \"@salt-ds/core\";\nimport {\n  FocusEventHandler,\n  SyntheticEvent,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { UnsavedChangesReport } from \"./UnsavedChangesReport\";\nimport {\n  buildValidationChecker,\n  getEditValidationRules,\n} from \"./edit-rule-validation-checker\";\nimport {\n  CLEAN_FORM,\n  FormEditState,\n  buildFormEditState,\n} from \"./form-edit-state\";\n\nexport interface EditFormHookProps {\n  dataSource?: DataSource;\n  formFieldDescriptors: DataValueDescriptor[];\n  onSubmit?: () => void;\n}\n\ntype ValidationState = {\n  ok: boolean;\n  messages: Record<string, string>;\n};\n\nconst CLEAN_VALIDATION: ValidationState = {\n  ok: true,\n  messages: {},\n};\n\nconst getValidationChecker = (\n  descriptor: DataValueDescriptor,\n  editPhase: \"change\" | \"commit\",\n) => {\n  const rules = getEditValidationRules(descriptor, editPhase) ?? [];\n  return buildValidationChecker(rules);\n};\n\nconst nextValidationState = (\n  state: ValidationState,\n  dataDescriptor: DataValueDescriptor,\n  value: VuuRowDataItemType,\n): ValidationState => {\n  const check = getValidationChecker(dataDescriptor, \"change\");\n  const result = check(value, \"change\");\n  const { name } = dataDescriptor;\n\n  const { ok: wasOk, messages: existingMessages } = state;\n\n  if (result.ok) {\n    if (!wasOk) {\n      // if this field was the only one in error, the overall state\n      // will now be ok, but not if there is still one or more other\n      // field still in error.\n      const fieldsInError = Object.keys(existingMessages);\n      if (fieldsInError.includes(name)) {\n        if (fieldsInError.length === 1) {\n          return { ok: true, messages: {} };\n        } else {\n          const messages = { ...existingMessages };\n          delete messages[name];\n          return { ok: false, messages };\n        }\n      }\n    }\n  } else {\n    return {\n      ok: false,\n      messages: {\n        ...existingMessages,\n        [name]: result.messages.join(\"\\n\"),\n      },\n    };\n  }\n\n  return state;\n};\n\nfunction find(descriptors: DataValueDescriptor[], fieldname: string) {\n  const d = descriptors.find(({ name }) => name === fieldname);\n  if (d) {\n    return d;\n  }\n  throw Error(`DataValueDescriptor not found for field ${fieldname}`);\n}\n\nconst getField = (target: EventTarget | HTMLElement) => {\n  const fieldElement = queryClosest(target, \"[data-field]\");\n  if (fieldElement) {\n    return fieldElement.dataset.field as string;\n  } else {\n    throw Error(\"no field \");\n  }\n};\n\ntype Resolver = (value: unknown) => void;\n\nexport const useEditForm = ({\n  dataSource,\n  formFieldDescriptors,\n  onSubmit,\n}: EditFormHookProps) => {\n  const { showDialog, closeDialog } = useDialogContext();\n\n  const currentDataSource = useRef<DataSource>();\n  const formFieldsContainerRef = useRef<HTMLDivElement>(null);\n  const entityRef = useRef<Entity>();\n  const focusedFieldRef = useRef(\"\");\n  const originalEntityRef = useRef<Entity>();\n  const formEditStateRef = useRef<FormEditState>(CLEAN_FORM);\n  const validationStateRef = useRef<ValidationState>({\n    ok: true,\n    messages: {},\n  });\n\n  const [entity, _setEntity] = useState<Entity>();\n  const [, forceUpdate] = useState({});\n\n  const setFormEditState = useCallback((newState: FormEditState) => {\n    formEditStateRef.current = newState;\n  }, []);\n\n  const setEntity = useCallback(\n    (newEntity: Entity) => {\n      setFormEditState(\n        buildFormEditState(originalEntityRef.current, newEntity),\n      );\n      entityRef.current = newEntity;\n      _setEntity(newEntity);\n    },\n    [setFormEditState],\n  );\n\n  const submitChanges = useCallback(async () => {\n    const rpcResponse = await currentDataSource.current?.rpcCall?.(\n      viewportRpcRequest(\"VP_BULK_EDIT_SUBMIT_RPC\"),\n    );\n    console.log({ rpcResponse });\n  }, []);\n\n  const showSaveOrDiscardPrompt = useCallback(async () => {\n    const { current: currentEntity } = entityRef;\n    const { current: originalEntity } = originalEntityRef;\n    let resolver: Resolver | undefined = undefined;\n    const save = async () => {\n      await submitChanges();\n      closeDialog();\n      resolver?.(\"saved\");\n    };\n\n    const discard = () => {\n      closeDialog();\n      resolver?.(\"discarded\");\n    };\n\n    requestAnimationFrame(() => {\n      showDialog(\n        <UnsavedChangesReport\n          entity={originalEntity as Entity}\n          editedEntity={currentEntity as Entity}\n        />,\n        \"Unsaved Changes\",\n        [\n          <Button key=\"cancel\" onClick={discard}>\n            Discard Changes\n          </Button>,\n          <Button key=\"submit\" onClick={save}>\n            Save Changes\n          </Button>,\n        ],\n        true, // hideCloseButton\n      );\n    });\n\n    return new Promise((resolve) => {\n      resolver = resolve;\n    });\n  }, [closeDialog, showDialog, submitChanges]);\n\n  useMemo(async () => {\n    if (dataSource) {\n      if (formEditStateRef.current.isClean === false) {\n        await showSaveOrDiscardPrompt();\n      }\n\n      currentDataSource.current = dataSource;\n\n      originalEntityRef.current = undefined;\n\n      const columnMap = buildColumnMap(dataSource.columns);\n\n      dataSource?.subscribe({ range: { from: 0, to: 1 } }, (message) => {\n        if (messageHasDataRows(message)) {\n          const [row] = message.rows;\n          if (row) {\n            const entity = dataSourceRowToEntity(row, columnMap);\n            if (originalEntityRef.current === undefined) {\n              originalEntityRef.current = entity;\n              setEntity(entity);\n            }\n\n            const { editedFields } = buildFormEditState(\n              entityRef.current,\n              entity,\n            );\n\n            // for controls which do not yield incremental changes, e.g dropdown, calendar\n            // we apply the server update to our entity.\n            if (editedFields.length === 1) {\n              setEntity(entity);\n            }\n\n            // Do not overwrite entity here, just check that values returned by server\n            // match whats expected\n          }\n        }\n      });\n    }\n  }, [dataSource, setEntity, showSaveOrDiscardPrompt]);\n\n  const setValidationState = useCallback((state: ValidationState) => {\n    validationStateRef.current = state;\n    forceUpdate({});\n  }, []);\n\n  const handleFieldCommit = useCallback<CommitHandler<HTMLElement>>(\n    (_, value) => {\n      const { current: fieldName } = focusedFieldRef;\n      const dataDescriptor = find(formFieldDescriptors, fieldName);\n\n      const { current: state } = validationStateRef;\n      const newState = nextValidationState(state, dataDescriptor, value);\n      if (newState !== state) {\n        setValidationState(newState);\n      }\n\n      if (newState.ok && dataSource?.tableSchema) {\n        const { key } = dataSource.tableSchema;\n        const keyValue = entity?.[key] as string;\n        dataSource\n          ?.applyEdit(keyValue, fieldName, value)\n          .then((rpcResponse) => {\n            console.log({ rpcResponse });\n          });\n      }\n    },\n    [dataSource, entity, formFieldDescriptors, setValidationState],\n  );\n\n  const handleFieldChange = useCallback(\n    (evt: SyntheticEvent<HTMLInputElement>) => {\n      const { current: fieldName } = focusedFieldRef;\n      if (fieldName) {\n        const input = queryClosest<HTMLInputElement>(evt.target, \"input\", true);\n        const dataDescriptor = find(formFieldDescriptors, fieldName);\n        const value = input.value as string;\n        const { current: state } = validationStateRef;\n        const newState = nextValidationState(state, dataDescriptor, value);\n        if (newState !== state) {\n          setValidationState(newState);\n        }\n\n        setEntity({ ...entity, [fieldName]: value });\n      }\n    },\n    [entity, formFieldDescriptors, setEntity, setValidationState],\n  );\n\n  const handleFormSubmit = useCallback(async () => {\n    submitChanges();\n    setFormEditState(CLEAN_FORM);\n    originalEntityRef.current = entity;\n    onSubmit?.();\n    forceUpdate({});\n  }, [entity, onSubmit, setFormEditState, submitChanges]);\n\n  const handleFormCancel = useCallback(async () => {\n    // const rpcResponse = await dataSource?.rpcCall?.(\n    //   viewportRpcRequest(\"VP_BULK_EDIT_CANCEL_RPC\"),\n    // );\n    setFormEditState(CLEAN_FORM);\n    setValidationState(CLEAN_VALIDATION);\n    // console.log({ rpcResponse });\n    setEntity(originalEntityRef.current as Entity);\n  }, [setEntity, setFormEditState, setValidationState]);\n\n  const handleFocus = useCallback<FocusEventHandler>((evt) => {\n    // Ignore focus on popup Calendars, Lists etc\n    if (formFieldsContainerRef.current?.contains(evt.target)) {\n      const fieldName = getField(evt.target);\n      if (fieldName) {\n        if (fieldName) {\n          focusedFieldRef.current = fieldName;\n        }\n      }\n    }\n  }, []);\n\n  const {\n    current: { ok, messages: errorMessages },\n  } = validationStateRef;\n\n  const {\n    current: { isClean, editedFields },\n  } = formEditStateRef;\n\n  return {\n    editedFields,\n    editEntity: entity,\n    errorMessages,\n    formFieldsContainerRef,\n    isClean,\n    ok,\n    onCancel: handleFormCancel,\n    onChange: handleFieldChange,\n    onCommit: handleFieldCommit,\n    onFocus: handleFocus,\n    onSubmit: handleFormSubmit,\n  };\n};\n"],"names":["entity","editedFields"],"mappings":"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"}

package/esm/hooks/useVuuTables.js

@@ -2,12 +2,13 @@ import { useDataSource } from '@vuu-ui/vuu-utils';
 import { useState, useCallback, useEffect } from 'react';
 
 const useVuuTables = () => {
-  const [tables, setTables] = useState();
+  const [tableSchemas, setTableSchemas] = useState();
   const { getServerAPI } = useDataSource();
   const buildTables = useCallback((schemas) => {
     const vuuTables = /* @__PURE__ */ new Map();
     schemas.forEach((schema) => {
-      vuuTables.set(schema.table.table, schema);
+      const { module, table } = schema.table;
+      vuuTables.set(`${module}:${table}`, schema);
     });
     return vuuTables;
   }, []);
@@ -15,13 +16,11 @@ const useVuuTables = () => {
     async function fetchTableMetadata() {
       try {
         const server = await getServerAPI();
-        const { tables: tables2 } = await server.getTableList();
-        const tableSchemas = buildTables(
-          await Promise.all(
-            tables2.map((vuuTable) => server.getTableSchema(vuuTable))
-          )
+        const { tables } = await server.getTableList();
+        const tableSchemas2 = await Promise.all(
+          tables.map((vuuTable) => server.getTableSchema(vuuTable))
         );
-        setTables(tableSchemas);
+        setTableSchemas(tableSchemas2);
       } catch (err) {
         console.warn(
           `useVuuTables: error fetching table metadata ${String(err)}`
@@ -30,7 +29,7 @@ const useVuuTables = () => {
     }
     fetchTableMetadata();
   }, [buildTables, getServerAPI]);
-  return tables;
+  return tableSchemas;
 };
 
 export { useVuuTables };

package/esm/hooks/useVuuTables.js.map

@@ -1 +1 @@
-{"version":3,"file":"useVuuTables.js","sources":["../../src/hooks/useVuuTables.ts"],"sourcesContent":["import type { TableSchema } from \"@vuu-ui/vuu-data-types\";\nimport { useDataSource } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useEffect, useState } from \"react\";\n\nexport const useVuuTables = () => {\n  const [tables, setTables] = useState<Map<string, TableSchema> | undefined>();\n\n  const { getServerAPI } = useDataSource();\n\n  const buildTables = useCallback((schemas: TableSchema[]) => {\n    const vuuTables = new Map<string, TableSchema>();\n    schemas.forEach((schema) => {\n      vuuTables.set(schema.table.table, schema);\n    });\n    return vuuTables;\n  }, []);\n\n  useEffect(() => {\n    async function fetchTableMetadata() {\n      try {\n        const server = await getServerAPI();\n        const { tables } = await server.getTableList();\n        const tableSchemas = buildTables(\n          await Promise.all(\n            tables.map((vuuTable) => server.getTableSchema(vuuTable)),\n          ),\n        );\n        setTables(tableSchemas);\n      } catch (err) {\n        console.warn(\n          `useVuuTables: error fetching table metadata ${String(err)}`,\n        );\n      }\n    }\n\n    fetchTableMetadata();\n  }, [buildTables, getServerAPI]);\n\n  return tables;\n};\n"],"names":["tables"],"mappings":";;;AAIO,MAAM,eAAe,MAAM;AAChC,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,QAA+C,EAAA;AAE3E,EAAM,MAAA,EAAE,YAAa,EAAA,GAAI,aAAc,EAAA;AAEvC,EAAM,MAAA,WAAA,GAAc,WAAY,CAAA,CAAC,OAA2B,KAAA;AAC1D,IAAM,MAAA,SAAA,uBAAgB,GAAyB,EAAA;AAC/C,IAAQ,OAAA,CAAA,OAAA,CAAQ,CAAC,MAAW,KAAA;AAC1B,MAAA,SAAA,CAAU,GAAI,CAAA,MAAA,CAAO,KAAM,CAAA,KAAA,EAAO,MAAM,CAAA;AAAA,KACzC,CAAA;AACD,IAAO,OAAA,SAAA;AAAA,GACT,EAAG,EAAE,CAAA;AAEL,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,eAAe,kBAAqB,GAAA;AAClC,MAAI,IAAA;AACF,QAAM,MAAA,MAAA,GAAS,MAAM,YAAa,EAAA;AAClC,QAAA,MAAM,EAAE,MAAAA,EAAAA,OAAAA,EAAW,GAAA,MAAM,OAAO,YAAa,EAAA;AAC7C,QAAA,MAAM,YAAe,GAAA,WAAA;AAAA,UACnB,MAAM,OAAQ,CAAA,GAAA;AAAA,YACZA,QAAO,GAAI,CAAA,CAAC,aAAa,MAAO,CAAA,cAAA,CAAe,QAAQ,CAAC;AAAA;AAC1D,SACF;AACA,QAAA,SAAA,CAAU,YAAY,CAAA;AAAA,eACf,GAAK,EAAA;AACZ,QAAQ,OAAA,CAAA,IAAA;AAAA,UACN,CAAA,4CAAA,EAA+C,MAAO,CAAA,GAAG,CAAC,CAAA;AAAA,SAC5D;AAAA;AACF;AAGF,IAAmB,kBAAA,EAAA;AAAA,GAClB,EAAA,CAAC,WAAa,EAAA,YAAY,CAAC,CAAA;AAE9B,EAAO,OAAA,MAAA;AACT;;;;"}
+{"version":3,"file":"useVuuTables.js","sources":["../../src/hooks/useVuuTables.ts"],"sourcesContent":["import type { TableSchema } from \"@vuu-ui/vuu-data-types\";\nimport { useDataSource } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useEffect, useState } from \"react\";\n\nexport const useVuuTables = () => {\n  const [tableSchemas, setTableSchemas] = useState<TableSchema[] | undefined>();\n\n  const { getServerAPI } = useDataSource();\n\n  const buildTables = useCallback((schemas: TableSchema[]) => {\n    const vuuTables = new Map<string, TableSchema>();\n    schemas.forEach((schema) => {\n      const { module, table } = schema.table;\n      vuuTables.set(`${module}:${table}`, schema);\n    });\n    return vuuTables;\n  }, []);\n\n  useEffect(() => {\n    async function fetchTableMetadata() {\n      try {\n        const server = await getServerAPI();\n        const { tables } = await server.getTableList();\n        const tableSchemas = await Promise.all(\n          tables.map((vuuTable) => server.getTableSchema(vuuTable)),\n        );\n        setTableSchemas(tableSchemas);\n      } catch (err) {\n        console.warn(\n          `useVuuTables: error fetching table metadata ${String(err)}`,\n        );\n      }\n    }\n\n    fetchTableMetadata();\n  }, [buildTables, getServerAPI]);\n\n  return tableSchemas;\n};\n"],"names":["tableSchemas"],"mappings":";;;AAIO,MAAM,eAAe,MAAM;AAChC,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAI,QAAoC,EAAA;AAE5E,EAAM,MAAA,EAAE,YAAa,EAAA,GAAI,aAAc,EAAA;AAEvC,EAAM,MAAA,WAAA,GAAc,WAAY,CAAA,CAAC,OAA2B,KAAA;AAC1D,IAAM,MAAA,SAAA,uBAAgB,GAAyB,EAAA;AAC/C,IAAQ,OAAA,CAAA,OAAA,CAAQ,CAAC,MAAW,KAAA;AAC1B,MAAA,MAAM,EAAE,MAAA,EAAQ,KAAM,EAAA,GAAI,MAAO,CAAA,KAAA;AACjC,MAAA,SAAA,CAAU,IAAI,CAAG,EAAA,MAAM,CAAI,CAAA,EAAA,KAAK,IAAI,MAAM,CAAA;AAAA,KAC3C,CAAA;AACD,IAAO,OAAA,SAAA;AAAA,GACT,EAAG,EAAE,CAAA;AAEL,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,eAAe,kBAAqB,GAAA;AAClC,MAAI,IAAA;AACF,QAAM,MAAA,MAAA,GAAS,MAAM,YAAa,EAAA;AAClC,QAAA,MAAM,EAAE,MAAA,EAAW,GAAA,MAAM,OAAO,YAAa,EAAA;AAC7C,QAAMA,MAAAA,aAAAA,GAAe,MAAM,OAAQ,CAAA,GAAA;AAAA,UACjC,OAAO,GAAI,CAAA,CAAC,aAAa,MAAO,CAAA,cAAA,CAAe,QAAQ,CAAC;AAAA,SAC1D;AACA,QAAA,eAAA,CAAgBA,aAAY,CAAA;AAAA,eACrB,GAAK,EAAA;AACZ,QAAQ,OAAA,CAAA,IAAA;AAAA,UACN,CAAA,4CAAA,EAA+C,MAAO,CAAA,GAAG,CAAC,CAAA;AAAA,SAC5D;AAAA;AACF;AAGF,IAAmB,kBAAA,EAAA;AAAA,GAClB,EAAA,CAAC,WAAa,EAAA,YAAY,CAAC,CAAA;AAE9B,EAAO,OAAA,YAAA;AACT;;;;"}

package/esm/session-editing-form/SessionEditingForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SessionEditingForm.js","sources":["../../src/session-editing-form/SessionEditingForm.tsx"],"sourcesContent":["import { VuuDataSource } from \"@vuu-ui/vuu-data-remote\";\nimport { DataSource, TableSchema } from \"@vuu-ui/vuu-data-types\";\nimport {\n  VuuColumnDataType,\n  VuuDataRow,\n  VuuRowDataItemType,\n  VuuRpcAction,\n} from \"@vuu-ui/vuu-protocol-types\";\nimport {\n  buildColumnMap,\n  getTypedValue,\n  isActionMessage,\n  isErrorResponse,\n  queryClosest,\n  shallowEquals,\n  vuuEditCellRequest,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n  Button,\n  FormField,\n  FormFieldHelperText,\n  FormFieldLabel,\n  Input,\n  useIdMemo,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n  ChangeEvent,\n  ChangeEventHandler,\n  FocusEvent,\n  FocusEventHandler,\n  HTMLAttributes,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\n\nimport sessionEditingFormCss from \"./SessionEditingForm.css\";\n\nexport type FormFieldDescriptor = {\n  isKeyField?: boolean;\n  label?: string;\n  name: string;\n  type: VuuColumnDataType;\n  description: string;\n  readonly?: boolean;\n  required?: boolean;\n};\n\nexport type FormConfig = {\n  title: string;\n  key: string;\n  fields: FormFieldDescriptor[];\n};\n\nexport interface SessionEditingFormProps\n  extends HTMLAttributes<HTMLDivElement> {\n  config: FormConfig;\n  onClose?: () => void;\n  dataSource?: DataSource;\n  schema?: TableSchema;\n}\n\nconst classBase = \"vuuSessionEditingForm\";\n\nconst getField = (\n  fields: FormFieldDescriptor[],\n  name: string,\n): FormFieldDescriptor => {\n  const field = fields.find((f) => f.name === name);\n  if (field) {\n    return field;\n  } else {\n    throw Error(`SessionEditingForm, no field '${name}' found`);\n  }\n};\n\nconst getFieldNameAndValue = ({\n  target,\n}: ChangeEvent<HTMLInputElement> | FocusEvent<HTMLInputElement>): [\n  string,\n  string,\n] => {\n  const formField = queryClosest(target, \".saltFormField\");\n  if (formField) {\n    const {\n      dataset: { field },\n    } = formField;\n    if (field === undefined) {\n      throw Error(\"SessionEditingForm, form field has no field data attribute\");\n    }\n    return [field, target.value];\n  } else {\n    throw Error(\"Form control is not enclosed in FormField\");\n  }\n};\n\nconst Status = {\n  uninitialised: 0,\n  unchanged: 1,\n  changed: 2,\n  invalid: 3,\n};\n\nconst getDataSource = (\n  dataSource?: DataSource,\n  schema?: TableSchema,\n): DataSource => {\n  if (dataSource) {\n    return dataSource;\n  } else if (schema) {\n    return new VuuDataSource({\n      bufferSize: 0,\n      table: schema.table,\n      columns: schema.columns.map((col) => col.name),\n    }) as DataSource;\n  } else {\n    throw Error(\n      \"SessionEditingForm: either a DataSource or a TableSchema must be provided\",\n    );\n  }\n};\n\ntype FormValues = { [key: string]: VuuRowDataItemType | undefined };\n\nexport const SessionEditingForm = ({\n  className,\n  config: { fields, key: keyField },\n  dataSource: dataSourceProp,\n  id: idProp,\n  onClose,\n  schema,\n  ...htmlAttributes\n}: SessionEditingFormProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-session-editing-form\",\n    css: sessionEditingFormCss,\n    window: targetWindow,\n  });\n\n  const [fieldStatusValues, setFieldStatusValues] = useState<\n    Record<string, string | undefined>\n  >({});\n  const [values, setValues] = useState<FormValues>();\n  const [errorMessage, setErrorMessage] = useState(\"\");\n  const formContentRef = useRef<HTMLDivElement>(null);\n  const initialDataRef = useRef<FormValues>();\n  const dataStatusRef = useRef(Status.uninitialised);\n\n  const dataSource = useMemo(() => {\n    const ds = getDataSource(dataSourceProp, schema);\n    const { columns } = ds;\n    const columnMap = buildColumnMap(ds.columns);\n\n    const applyServerData = (data: VuuDataRow) => {\n      if (columnMap) {\n        const values: { [key: string]: VuuRowDataItemType } = {};\n        for (const column of columns) {\n          values[column] = data[columnMap[column]];\n        }\n        if (dataStatusRef.current === Status.uninitialised) {\n          dataStatusRef.current = Status.unchanged;\n          initialDataRef.current = values;\n        }\n        setValues(values);\n      }\n    };\n\n    ds.subscribe({ range: { from: 0, to: 5 } }, (message) => {\n      if (message.type === \"viewport-update\" && message.rows) {\n        if (dataStatusRef.current === Status.uninitialised) {\n          applyServerData(message.rows[0]);\n        } else {\n          console.log(\"what do we do with server updates\");\n        }\n      }\n    });\n    return ds;\n  }, [dataSourceProp, schema]);\n\n  const id = useIdMemo(idProp);\n\n  const handleChange = useCallback<ChangeEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const [field, value] = getFieldNameAndValue(evt);\n      const { type } = getField(fields, field);\n      const typedValue = getTypedValue(value, type);\n      setValues((values = {}) => {\n        const newValues = {\n          ...values,\n          [field]: typedValue,\n        };\n        const notUpdated = shallowEquals(newValues, initialDataRef.current);\n        dataStatusRef.current = notUpdated\n          ? Status.unchanged\n          : typedValue !== undefined\n            ? Status.changed\n            : Status.invalid;\n        return newValues;\n      });\n    },\n    [fields],\n  );\n\n  const handleBlur = useCallback<FocusEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const [field, value] = getFieldNameAndValue(evt);\n      const rowKey = values?.[keyField];\n      // TODO link this with client side validation if we're going to use it\n      const { type } = getField(fields, field);\n      const typedValue = getTypedValue(value, type, true);\n      if (typeof rowKey === \"string\") {\n        dataSource\n          .menuRpcCall(vuuEditCellRequest(rowKey, field, typedValue))\n          .then((response) => {\n            if (isErrorResponse(response)) {\n              console.log(`edit rejected ${response.error}`);\n              setFieldStatusValues((map) => ({\n                ...map,\n                [field]: response.error,\n              }));\n            } else {\n              setFieldStatusValues((map) => ({\n                ...map,\n                [field]: undefined,\n              }));\n            }\n          });\n      }\n    },\n    [dataSource, fields, keyField, values],\n  );\n\n  const applyAction = useCallback(\n    (action: VuuRpcAction) => {\n      if (action.type === \"CLOSE_DIALOG_ACTION\") {\n        onClose?.();\n      }\n    },\n    [onClose],\n  );\n\n  const handleSubmit = useCallback(async () => {\n    const rpcResponse = await dataSource.menuRpcCall({\n      type: \"VP_EDIT_SUBMIT_FORM_RPC\",\n    });\n    if (isErrorResponse(rpcResponse)) {\n      setErrorMessage(rpcResponse.error);\n    } else if (isActionMessage(rpcResponse)) {\n      applyAction(rpcResponse.action);\n    }\n  }, [applyAction, dataSource]);\n\n  const handleKeyDown = useCallback(\n    (evt) => {\n      if (evt.key === \"Enter\" && dataStatusRef.current === Status.changed) {\n        handleSubmit();\n      }\n    },\n    [handleSubmit],\n  );\n\n  const handleCancel = useCallback(() => {\n    onClose?.();\n  }, [onClose]);\n\n  const getFormControl = (field: FormFieldDescriptor) => {\n    const value = String(values?.[field.name] ?? \"\");\n    if (field.readonly || field.name === keyField) {\n      return (\n        <div className={`${classBase}-fieldValue vuuReadOnly`}>{value}</div>\n      );\n    } else {\n      return (\n        <Input\n          className={`${classBase}-fieldValue`}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          value={value}\n          id={`${id}-input-${field.name}`}\n        />\n      );\n    }\n  };\n\n  useEffect(() => {\n    if (formContentRef.current) {\n      const firstInput = formContentRef.current.querySelector(\n        \"input\",\n      ) as HTMLInputElement;\n      if (firstInput) {\n        setTimeout(() => {\n          firstInput.focus();\n          firstInput.select();\n        }, 100);\n      }\n    }\n  }, []);\n\n  useEffect(() => {\n    return () => {\n      if (dataSource) {\n        dataSource.unsubscribe();\n      }\n    };\n  }, [dataSource]);\n\n  const isDirty = dataStatusRef.current === Status.changed;\n  return (\n    <div {...htmlAttributes} className={cx(classBase, className)}>\n      {errorMessage ? (\n        <div\n          className={`${classBase}-errorBanner`}\n          data-icon=\"error\"\n          title={errorMessage}\n        >\n          Error, edit(s) not saved\n        </div>\n      ) : undefined}\n      <div\n        className={`${classBase}-content`}\n        ref={formContentRef}\n        onKeyDown={handleKeyDown}\n      >\n        {fields.map((field) => (\n          <FormField\n            className={`${classBase}-field`}\n            data-field={field.name}\n            key={field.name}\n            necessity={field.required ? \"required\" : \"optional\"}\n            readOnly={field.readonly}\n            validationStatus={\n              fieldStatusValues[field.name] ? \"error\" : undefined\n            }\n          >\n            <FormFieldLabel>{field?.label ?? field.description}</FormFieldLabel>\n            {getFormControl(field)}\n            <FormFieldHelperText>\n              {fieldStatusValues[field.name] ?? \"\"}\n            </FormFieldHelperText>\n          </FormField>\n        ))}\n      </div>\n      <div className={`${classBase}-buttonbar salt-theme salt-density-high`}>\n        <Button\n          type=\"submit\"\n          variant=\"cta\"\n          disabled={!isDirty}\n          onClick={handleSubmit}\n        >\n          Submit\n        </Button>\n        <Button variant=\"secondary\" onClick={handleCancel}>\n          Cancel\n        </Button>\n      </div>\n    </div>\n  );\n};\n"],"names":["values"],"mappings":"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"}
+{"version":3,"file":"SessionEditingForm.js","sources":["../../src/session-editing-form/SessionEditingForm.tsx"],"sourcesContent":["import { VuuDataSource } from \"@vuu-ui/vuu-data-remote\";\nimport { DataSource, TableSchema } from \"@vuu-ui/vuu-data-types\";\nimport {\n  VuuColumnDataType,\n  VuuDataRow,\n  VuuRowDataItemType,\n  VuuRpcAction,\n} from \"@vuu-ui/vuu-protocol-types\";\nimport {\n  buildColumnMap,\n  getTypedValue,\n  isActionMessage,\n  isErrorResponse,\n  queryClosest,\n  shallowEquals,\n  vuuEditCellRequest,\n} from \"@vuu-ui/vuu-utils\";\nimport {\n  Button,\n  FormField,\n  FormFieldHelperText,\n  FormFieldLabel,\n  Input,\n  useIdMemo,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n  ChangeEvent,\n  ChangeEventHandler,\n  FocusEvent,\n  FocusEventHandler,\n  HTMLAttributes,\n  KeyboardEventHandler,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\n\nimport sessionEditingFormCss from \"./SessionEditingForm.css\";\n\nexport type FormFieldDescriptor = {\n  isKeyField?: boolean;\n  label?: string;\n  name: string;\n  type: VuuColumnDataType;\n  description: string;\n  readonly?: boolean;\n  required?: boolean;\n};\n\nexport type FormConfig = {\n  title: string;\n  key: string;\n  fields: FormFieldDescriptor[];\n};\n\nexport interface SessionEditingFormProps\n  extends HTMLAttributes<HTMLDivElement> {\n  config: FormConfig;\n  onClose?: () => void;\n  dataSource?: DataSource;\n  schema?: TableSchema;\n}\n\nconst classBase = \"vuuSessionEditingForm\";\n\nconst getField = (\n  fields: FormFieldDescriptor[],\n  name: string,\n): FormFieldDescriptor => {\n  const field = fields.find((f) => f.name === name);\n  if (field) {\n    return field;\n  } else {\n    throw Error(`SessionEditingForm, no field '${name}' found`);\n  }\n};\n\nconst getFieldNameAndValue = ({\n  target,\n}: ChangeEvent<HTMLInputElement> | FocusEvent<HTMLInputElement>): [\n  string,\n  string,\n] => {\n  const formField = queryClosest(target, \".saltFormField\");\n  if (formField) {\n    const {\n      dataset: { field },\n    } = formField;\n    if (field === undefined) {\n      throw Error(\"SessionEditingForm, form field has no field data attribute\");\n    }\n    return [field, target.value];\n  } else {\n    throw Error(\"Form control is not enclosed in FormField\");\n  }\n};\n\nconst Status = {\n  uninitialised: 0,\n  unchanged: 1,\n  changed: 2,\n  invalid: 3,\n};\n\nconst getDataSource = (\n  dataSource?: DataSource,\n  schema?: TableSchema,\n): DataSource => {\n  if (dataSource) {\n    return dataSource;\n  } else if (schema) {\n    return new VuuDataSource({\n      bufferSize: 0,\n      table: schema.table,\n      columns: schema.columns.map((col) => col.name),\n    }) as DataSource;\n  } else {\n    throw Error(\n      \"SessionEditingForm: either a DataSource or a TableSchema must be provided\",\n    );\n  }\n};\n\ntype FormValues = { [key: string]: VuuRowDataItemType | undefined };\n\nexport const SessionEditingForm = ({\n  className,\n  config: { fields, key: keyField },\n  dataSource: dataSourceProp,\n  id: idProp,\n  onClose,\n  schema,\n  ...htmlAttributes\n}: SessionEditingFormProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-session-editing-form\",\n    css: sessionEditingFormCss,\n    window: targetWindow,\n  });\n\n  const [fieldStatusValues, setFieldStatusValues] = useState<\n    Record<string, string | undefined>\n  >({});\n  const [values, setValues] = useState<FormValues>();\n  const [errorMessage, setErrorMessage] = useState(\"\");\n  const formContentRef = useRef<HTMLDivElement>(null);\n  const initialDataRef = useRef<FormValues>();\n  const dataStatusRef = useRef(Status.uninitialised);\n\n  const dataSource = useMemo(() => {\n    const ds = getDataSource(dataSourceProp, schema);\n    const { columns } = ds;\n    const columnMap = buildColumnMap(ds.columns);\n\n    const applyServerData = (data: VuuDataRow) => {\n      if (columnMap) {\n        const values: { [key: string]: VuuRowDataItemType } = {};\n        for (const column of columns) {\n          values[column] = data[columnMap[column]];\n        }\n        if (dataStatusRef.current === Status.uninitialised) {\n          dataStatusRef.current = Status.unchanged;\n          initialDataRef.current = values;\n        }\n        setValues(values);\n      }\n    };\n\n    ds.subscribe({ range: { from: 0, to: 5 } }, (message) => {\n      if (message.type === \"viewport-update\" && message.rows) {\n        if (dataStatusRef.current === Status.uninitialised) {\n          applyServerData(message.rows[0]);\n        } else {\n          console.log(\"what do we do with server updates\");\n        }\n      }\n    });\n    return ds;\n  }, [dataSourceProp, schema]);\n\n  const id = useIdMemo(idProp);\n\n  const handleChange = useCallback<ChangeEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const [field, value] = getFieldNameAndValue(evt);\n      const { type } = getField(fields, field);\n      const typedValue = getTypedValue(value, type);\n      setValues((values = {}) => {\n        const newValues = {\n          ...values,\n          [field]: typedValue,\n        };\n        const notUpdated = shallowEquals(newValues, initialDataRef.current);\n        dataStatusRef.current = notUpdated\n          ? Status.unchanged\n          : typedValue !== undefined\n            ? Status.changed\n            : Status.invalid;\n        return newValues;\n      });\n    },\n    [fields],\n  );\n\n  const handleBlur = useCallback<FocusEventHandler<HTMLInputElement>>(\n    (evt) => {\n      const [field, value] = getFieldNameAndValue(evt);\n      const rowKey = values?.[keyField];\n      // TODO link this with client side validation if we're going to use it\n      const { type } = getField(fields, field);\n      const typedValue = getTypedValue(value, type, true);\n      if (typeof rowKey === \"string\") {\n        dataSource\n          .menuRpcCall(vuuEditCellRequest(rowKey, field, typedValue))\n          .then((response) => {\n            if (isErrorResponse(response)) {\n              console.log(`edit rejected ${response.error}`);\n              setFieldStatusValues((map) => ({\n                ...map,\n                [field]: response.error,\n              }));\n            } else {\n              setFieldStatusValues((map) => ({\n                ...map,\n                [field]: undefined,\n              }));\n            }\n          });\n      }\n    },\n    [dataSource, fields, keyField, values],\n  );\n\n  const applyAction = useCallback(\n    (action: VuuRpcAction) => {\n      if (action.type === \"CLOSE_DIALOG_ACTION\") {\n        onClose?.();\n      }\n    },\n    [onClose],\n  );\n\n  const handleSubmit = useCallback(async () => {\n    const rpcResponse = await dataSource.menuRpcCall({\n      type: \"VP_EDIT_SUBMIT_FORM_RPC\",\n    });\n    if (isErrorResponse(rpcResponse)) {\n      setErrorMessage(rpcResponse.error);\n    } else if (isActionMessage(rpcResponse)) {\n      applyAction(rpcResponse.action);\n    }\n  }, [applyAction, dataSource]);\n\n  const handleKeyDown = useCallback<KeyboardEventHandler>(\n    (evt) => {\n      if (evt.key === \"Enter\" && dataStatusRef.current === Status.changed) {\n        handleSubmit();\n      }\n    },\n    [handleSubmit],\n  );\n\n  const handleCancel = useCallback(() => {\n    onClose?.();\n  }, [onClose]);\n\n  const getFormControl = (field: FormFieldDescriptor) => {\n    const value = String(values?.[field.name] ?? \"\");\n    if (field.readonly || field.name === keyField) {\n      return (\n        <div className={`${classBase}-fieldValue vuuReadOnly`}>{value}</div>\n      );\n    } else {\n      return (\n        <Input\n          className={`${classBase}-fieldValue`}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          value={value}\n          id={`${id}-input-${field.name}`}\n        />\n      );\n    }\n  };\n\n  useEffect(() => {\n    if (formContentRef.current) {\n      const firstInput = formContentRef.current.querySelector(\n        \"input\",\n      ) as HTMLInputElement;\n      if (firstInput) {\n        setTimeout(() => {\n          firstInput.focus();\n          firstInput.select();\n        }, 100);\n      }\n    }\n  }, []);\n\n  useEffect(() => {\n    return () => {\n      if (dataSource) {\n        dataSource.unsubscribe();\n      }\n    };\n  }, [dataSource]);\n\n  const isDirty = dataStatusRef.current === Status.changed;\n  return (\n    <div {...htmlAttributes} className={cx(classBase, className)}>\n      {errorMessage ? (\n        <div\n          className={`${classBase}-errorBanner`}\n          data-icon=\"error\"\n          title={errorMessage}\n        >\n          Error, edit(s) not saved\n        </div>\n      ) : undefined}\n      <div\n        className={`${classBase}-content`}\n        ref={formContentRef}\n        onKeyDown={handleKeyDown}\n      >\n        {fields.map((field) => (\n          <FormField\n            className={`${classBase}-field`}\n            data-field={field.name}\n            key={field.name}\n            necessity={field.required ? \"required\" : \"optional\"}\n            readOnly={field.readonly}\n            validationStatus={\n              fieldStatusValues[field.name] ? \"error\" : undefined\n            }\n          >\n            <FormFieldLabel>{field?.label ?? field.description}</FormFieldLabel>\n            {getFormControl(field)}\n            <FormFieldHelperText>\n              {fieldStatusValues[field.name] ?? \"\"}\n            </FormFieldHelperText>\n          </FormField>\n        ))}\n      </div>\n      <div className={`${classBase}-buttonbar salt-theme salt-density-high`}>\n        <Button\n          type=\"submit\"\n          variant=\"cta\"\n          disabled={!isDirty}\n          onClick={handleSubmit}\n        >\n          Submit\n        </Button>\n        <Button variant=\"secondary\" onClick={handleCancel}>\n          Cancel\n        </Button>\n      </div>\n    </div>\n  );\n};\n"],"names":["values"],"mappings":"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"}

package/package.json

@@ -1,30 +1,30 @@
 {
-  "version": "0.9.3",
+  "version": "0.10.1",
   "author": "heswell",
   "license": "Apache-2.0",
   "devDependencies": {
-    "@vuu-ui/vuu-data-types": "0.9.3",
-    "@vuu-ui/vuu-filter-types": "0.9.3",
-    "@vuu-ui/vuu-popups": "0.9.3",
-    "@vuu-ui/vuu-protocol-types": "0.9.3",
-    "@vuu-ui/vuu-table-types": "0.9.3"
+    "@vuu-ui/vuu-data-types": "0.10.1",
+    "@vuu-ui/vuu-filter-types": "0.10.1",
+    "@vuu-ui/vuu-popups": "0.10.1",
+    "@vuu-ui/vuu-protocol-types": "0.10.1",
+    "@vuu-ui/vuu-table-types": "0.10.1"
   },
   "dependencies": {
-    "@vuu-ui/vuu-data-remote": "0.9.3",
-    "@vuu-ui/vuu-filter-parser": "0.9.3",
-    "@vuu-ui/vuu-layout": "0.9.3",
-    "@vuu-ui/vuu-popups": "0.9.3",
-    "@vuu-ui/vuu-ui-controls": "0.9.3",
-    "@vuu-ui/vuu-utils": "0.9.3",
-    "@vuu-ui/vuu-table": "0.9.3",
-    "@salt-ds/core": "1.37.1",
+    "@vuu-ui/vuu-data-remote": "0.10.1",
+    "@vuu-ui/vuu-filter-parser": "0.10.1",
+    "@vuu-ui/vuu-layout": "0.10.1",
+    "@vuu-ui/vuu-popups": "0.10.1",
+    "@vuu-ui/vuu-ui-controls": "0.10.1",
+    "@vuu-ui/vuu-utils": "0.10.1",
+    "@vuu-ui/vuu-table": "0.10.1",
+    "@salt-ds/core": "1.43.0",
     "@salt-ds/styles": "0.2.1",
     "@salt-ds/window": "0.1.1"
   },
   "peerDependencies": {
     "clsx": "^2.0.0",
-    "react": ">=17.0.2",
-    "react-dom": ">=17.0.2"
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
   },
   "files": [
     "README.md",

package/types/data-editing/get-data-item-edit-control.d.ts

@@ -11,7 +11,7 @@ export interface DataItemEditControlProps {
      */
     dataDescriptor: DataValueDescriptor;
     errorMessage?: string;
-    onCommit: CommitHandler<HTMLElement, string | undefined>;
+    onCommit: CommitHandler<HTMLElement>;
     table?: TableSchemaTable;
 }
 export type ValidationStatus = "initial" | true | string;

package/types/data-editing/useEditForm.d.ts

@@ -1,5 +1,5 @@
 import type { DataSource, DataValueDescriptor } from "@vuu-ui/vuu-data-types";
-import { Entity } from "@vuu-ui/vuu-utils";
+import { CommitHandler, Entity } from "@vuu-ui/vuu-utils";
 import { FocusEventHandler, SyntheticEvent } from "react";
 export interface EditFormHookProps {
     dataSource?: DataSource;
@@ -15,7 +15,7 @@ export declare const useEditForm: ({ dataSource, formFieldDescriptors, onSubmit,
     ok: boolean;
     onCancel: () => Promise<void>;
     onChange: (evt: SyntheticEvent<HTMLInputElement>) => void;
-    onCommit: (evt: any, value: any) => void;
+    onCommit: CommitHandler<HTMLElement>;
     onFocus: FocusEventHandler;
     onSubmit: () => Promise<void>;
 };

package/types/hooks/useVuuTables.d.ts

@@ -1,2 +1,2 @@
 import type { TableSchema } from "@vuu-ui/vuu-data-types";
-export declare const useVuuTables: () => Map<string, TableSchema> | undefined;
+export declare const useVuuTables: () => TableSchema[] | undefined;