@equinor/apollo-utils 0.1.1 → 0.1.3-beta.0

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @equinor/apollo-utils
 
+## 0.1.3
+
+### Patch Changes
+
+- e1354f0: Move edit cells to apollo-utils
+- Updated dependencies [e1354f0]
+  - @equinor/apollo-components@3.1.2
+
+## 0.1.2
+
+### Patch Changes
+
+- 7fa24ff: Move cells to @equinor/apollo-utils and extract common functionality into separate package
+- Updated dependencies [07e344a]
+- Updated dependencies [7fa24ff]
+  - apollo-common@0.1.2
+
 ## 0.1.1
 
 ### Patch Changes

package/package.json

@@ -2,7 +2,7 @@
   "name": "@equinor/apollo-utils",
   "main": "src/index.ts",
   "types": "src/index.ts",
-  "version": "0.1.1",
+  "version": "0.1.3-beta.0",
   "license": "MIT",
   "scripts": {
     "build": "tsup src/index.ts --format esm,cjs --dts --external react",
@@ -22,7 +22,14 @@
     "typescript": "^4.9.5",
     "zod": "^3.20.6"
   },
+  "peerDependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-hook-form": "^7.43.8",
+    "@equinor/apollo-components": "^3.1.0"
+  },
   "devDependencies": {
+    "@equinor/apollo-components": "*",
     "@testing-library/react": "^13.4.0",
     "@testing-library/react-hooks": "^8.0.1",
     "@vitest/ui": "^0.28.5",
@@ -31,6 +38,7 @@
     "jsdom": "^21.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-hook-form": "^7.43.8",
     "vitest": "^0.28.5"
   }
 }

package/src/edit-cells/EditableCheckboxCell.tsx

@@ -0,0 +1,34 @@
+import { Checkbox, EdsProvider } from '@equinor/eds-core-react'
+import { CellContext } from '@tanstack/react-table'
+import { Controller, useFormContext } from 'react-hook-form'
+import { FormMeta, useEditMode } from '../form-meta'
+
+export function EditableCheckboxCell<T extends FormMeta>(context: CellContext<T, boolean>) {
+  const editMode = useEditMode()
+  const { control } = useFormContext()
+
+  if (!editMode)
+    return (
+      <EdsProvider density="compact">
+        <Checkbox
+          enterKeyHint="next"
+          aria-label="readonly"
+          readOnly={true}
+          checked={context.getValue()}
+          disabled={true}
+        />
+      </EdsProvider>
+    )
+
+  return (
+    <Controller
+      control={control}
+      name={context.column.id}
+      render={({ field: { value, ...field } }) => (
+        <EdsProvider density="compact">
+          <Checkbox enterKeyHint="send" aria-label="editable" checked={value} {...field} />
+        </EdsProvider>
+      )}
+    />
+  )
+}

package/src/edit-cells/EditableDateCell.tsx

@@ -0,0 +1,80 @@
+import { TypographyCustom } from '@equinor/apollo-components'
+import { TextField } from '@equinor/eds-core-react'
+import { CellContext } from '@tanstack/react-table'
+import { ChangeEvent, useMemo } from 'react'
+import { Controller, useFormContext } from 'react-hook-form'
+import styled from 'styled-components'
+import { FormMeta, useEditMode } from '../form-meta'
+import { getHelperTextProps } from './utils'
+
+export interface EditableDateCellProps<T extends FormMeta> extends CellContext<T, unknown> {
+  dateStringFormatter?: (date: string) => string
+}
+
+export function EditableDateCell<T extends FormMeta>(props: EditableDateCellProps<T>) {
+  const { dateStringFormatter, ...context } = props
+  const rawValue = context.getValue<string>()
+
+  const editMode = useEditMode()
+  const { control } = useFormContext()
+
+  const formattedValue = useMemo(
+    () => dateStringFormatter?.(rawValue) ?? rawValue,
+    [rawValue, dateStringFormatter]
+  )
+
+  if (!editMode) return <TypographyCustom truncate>{formattedValue}</TypographyCustom>
+
+  return (
+    <Controller
+      control={control}
+      name={context.column.id}
+      render={({ field: { value, onChange, ...field }, fieldState: { error } }) => (
+        <InlineTextField
+          id={context.column.id}
+          type="date"
+          autoComplete="none"
+          value={value ? parseISODate(value) : ''}
+          onChange={(e: ChangeEvent<HTMLInputElement>) =>
+            onChange(e.target.value ? parseISODate(e.target.value) : '')
+          }
+          {...getHelperTextProps({ error })}
+          {...field}
+        />
+      )}
+    />
+  )
+}
+
+/**
+ * Formats a date string into `yyyy-mm-dd` format.
+ */
+function parseISODate(dateString: string) {
+  const date = new Date(dateString)
+  const offset = date.getTimezoneOffset()
+  const dateWithoutOffset = new Date(date.getTime() - offset * 60 * 1000)
+  return dateWithoutOffset.toISOString().split('T')[0]
+}
+
+const InlineTextField = styled(TextField)`
+  /* 
+  TODO: Improve input based on feedback from UX
+  & > div {
+    background: transparent;
+    margin: 0 -0.5rem;
+    padding: 0 0.5rem;
+    box-shadow: none;
+    width: auto;
+  }
+
+  input {
+    padding: 0;
+    letter-spacing: 0;
+    font-weight: 400;
+    color: inherit;
+
+    ::placeholder {
+      color: red;
+    }
+  } */
+`

package/src/edit-cells/EditableDropdownCell.tsx

@@ -0,0 +1,68 @@
+import { TypographyCustom } from '@equinor/apollo-components'
+import { Autocomplete } from '@equinor/eds-core-react'
+import { CellContext } from '@tanstack/react-table'
+import { Controller, useFormContext } from 'react-hook-form'
+import styled from 'styled-components'
+import { FormMeta, useEditMode } from '../form-meta'
+
+export interface Option {
+  label: string
+  value: string
+}
+
+export interface EditableDropdownCellProps<T extends FormMeta> extends CellContext<T, unknown> {
+  /**
+   * `Option.value` is used internally to get and update selection state. `Option.label` is *only* for visual purposes.
+   */
+  options: Option[]
+}
+
+function buildEmptyOption(): Option {
+  return { label: '', value: '' }
+}
+
+export function EditableDropdownCell<T extends FormMeta>(props: EditableDropdownCellProps<T>) {
+  const { options, ...context } = props
+  const editMode = useEditMode()
+  const { control } = useFormContext()
+  if (!editMode) return <TypographyCustom truncate>{context.getValue() as any}</TypographyCustom>
+
+  return (
+    <Controller
+      control={control}
+      name={context.column.id}
+      render={({ field: { value, onChange, ...field } }) => {
+        const selectedOption = options.find((option) => option.value === value) ?? buildEmptyOption
+        return (
+          <AutocompleteCustom
+            label=""
+            // Casting is due to stying the Autocomplete, plain EDS Autocomplete works
+            // Fixed when workaround is not needed anymore
+            selectedOptions={selectedOption && ([selectedOption] as Option[])}
+            options={options}
+            optionLabel={(option) => (option as Option)?.label ?? ''}
+            aria-required
+            hideClearButton
+            aria-autocomplete="none"
+            onOptionsChange={(changes) => {
+              const [change] = changes.selectedItems
+              onChange((change as Option)?.value)
+            }}
+            {...field}
+          />
+        )
+      }}
+    />
+  )
+}
+
+// Requested in https://github.com/equinor/design-system/issues/2804
+export const AutocompleteCustom = styled(Autocomplete)`
+  input[type='text'] {
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    padding-right: ${({ hideClearButton }) =>
+      hideClearButton ? `calc(8px + (24px * 1))` : `calc(8px + (24px * 2))`};
+  }
+`

package/src/edit-cells/EditableNumberCell.tsx

@@ -0,0 +1,57 @@
+import { TypographyCustom } from '@equinor/apollo-components'
+import { TextField } from '@equinor/eds-core-react'
+import { CellContext } from '@tanstack/react-table'
+import { ChangeEvent } from 'react'
+import { Controller, useFormContext } from 'react-hook-form'
+import styled from 'styled-components'
+import { FormMeta, useEditMode } from '../form-meta'
+import { getHelperTextProps } from './utils'
+
+export function EditableNumberCell<T extends FormMeta>(context: CellContext<T, number>) {
+  const editMode = useEditMode()
+  const { control } = useFormContext()
+
+  if (!editMode) return <TypographyCustom truncate>{context.getValue()}</TypographyCustom>
+
+  return (
+    <Controller
+      control={control}
+      name={context.column.id}
+      render={({ field: { onChange, ...field }, fieldState: { error } }) => (
+        <>
+          <InlineTextField
+            id={context.column.id}
+            type="number"
+            autoComplete="none"
+            onChange={(e: ChangeEvent<HTMLInputElement>) => onChange(e.target.valueAsNumber)}
+            {...field}
+            {...getHelperTextProps({ error })}
+          />
+        </>
+      )}
+    />
+  )
+}
+
+const InlineTextField = styled(TextField)`
+  /* 
+  TODO: Improve input based on feedback from UX
+  & > div {
+    background: transparent;
+    margin: 0 -0.5rem;
+    padding: 0 0.5rem;
+    box-shadow: none;
+    width: auto;
+  }
+
+  input {
+    padding: 0;
+    letter-spacing: 0;
+    font-weight: 400;
+    color: inherit;
+
+    ::placeholder {
+      color: red;
+    }
+  } */
+`

package/src/edit-cells/EditableTextAreaCell.tsx

@@ -0,0 +1,126 @@
+import { PopoverCell, stopPropagation } from '@equinor/apollo-components'
+import { Button, Dialog as EDS, Icon, TextField } from '@equinor/eds-core-react'
+import { CellContext } from '@tanstack/react-table'
+import { ChangeEvent, useState } from 'react'
+import { Controller, useFormContext } from 'react-hook-form'
+import styled from 'styled-components'
+import { FormMeta, useEditMode } from '../form-meta'
+import { getHelperTextProps } from './utils'
+
+interface EdtiableTextAreaProps<T extends FormMeta> extends CellContext<T, string> {
+  title: string
+}
+
+export function EditableTextAreaCell<T extends FormMeta>(props: EdtiableTextAreaProps<T>) {
+  const { title, ...context } = props
+
+  const [textareaValue, setTextareaValue] = useState<string>(context.getValue())
+  const [open, setOpen] = useState(false)
+  const editMode = useEditMode()
+  const { control } = useFormContext()
+
+  const name = context.column.id
+
+  if (!editMode)
+    return <PopoverCell id={name + 'popover'} value={context.getValue()} title={title} />
+
+  const openDialog = () => setOpen(true)
+  const closeDialog = () => setOpen(false)
+
+  return (
+    <Controller
+      control={control}
+      name={name}
+      render={({ field: { onChange, ref, ...field }, fieldState: { error } }) => (
+        <>
+          {/* Inline input */}
+          <div
+            style={{
+              display: 'flex',
+              alignItems: 'center',
+              position: 'relative',
+            }}
+          >
+            <StyledTextField
+              id={field.name}
+              onChange={onChange}
+              ref={ref}
+              {...field}
+              {...getHelperTextProps({ error })}
+            />
+            <IconButton variant="ghost_icon" onClick={stopPropagation(openDialog)}>
+              <Icon name="arrow_up" size={24} style={{ transform: 'rotateZ(45deg)' }} />
+            </IconButton>
+          </div>
+
+          {/* Dialog */}
+          <EDS
+            open={open}
+            onClose={() => {
+              closeDialog()
+              onChange(textareaValue)
+            }}
+            isDismissable
+            style={{ width: 'min(50rem, calc(100vw - 4rem))' }}
+          >
+            <EDS.Header>
+              <EDS.Title>{title}</EDS.Title>
+            </EDS.Header>
+            <EDS.Content>
+              <TextField
+                style={{
+                  maxWidth: '100%',
+                  marginTop: '1rem',
+                }}
+                id={field.name + 'modal'}
+                multiline
+                rows={8}
+                name={field.name + 'modal'}
+                value={textareaValue}
+                onChange={(e: ChangeEvent<HTMLInputElement> | ChangeEvent<HTMLTextAreaElement>) => {
+                  setTextareaValue(e.target.value)
+                }}
+              />
+            </EDS.Content>
+            <EDS.Actions style={{ display: 'flex', gap: '1rem' }}>
+              <Button
+                onClick={() => {
+                  closeDialog()
+                  onChange(textareaValue)
+                }}
+              >
+                Submit
+              </Button>
+              <Button
+                variant="ghost"
+                onClick={() => {
+                  closeDialog()
+                  setTextareaValue(context.getValue())
+                }}
+              >
+                Cancel
+              </Button>
+            </EDS.Actions>
+          </EDS>
+        </>
+      )}
+    />
+  )
+}
+
+const StyledTextField = styled(TextField)`
+  & input {
+    padding-right: 40px;
+    letter-spacing: 0;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
+`
+
+const IconButton = styled(Button)`
+  position: absolute;
+  height: 32px;
+  width: 32px;
+  right: 4px;
+`

package/src/edit-cells/EditableTextFieldCell.tsx

@@ -0,0 +1,53 @@
+import { TypographyCustom } from '@equinor/apollo-components'
+import { TextField } from '@equinor/eds-core-react'
+import { CellContext } from '@tanstack/react-table'
+import { Controller, FieldPath, useFormContext } from 'react-hook-form'
+import styled from 'styled-components'
+import { FormMeta, useEditMode } from '../form-meta'
+import { getHelperTextProps } from './utils'
+
+export function EditableTextFieldCell<T extends FormMeta>(context: CellContext<T, unknown>) {
+  const { control } = useFormContext<T>()
+  const editMode = useEditMode()
+
+  if (!editMode) return <TypographyCustom truncate>{context.getValue() as any}</TypographyCustom>
+
+  return (
+    <Controller
+      control={control}
+      name={context.column.id as FieldPath<T>}
+      render={({ field: { value, ...field }, fieldState: { error } }) => (
+        <InlineTextField
+          id={context.column.id}
+          autoComplete="none"
+          value={String(value)}
+          {...field}
+          {...getHelperTextProps({ error })}
+        />
+      )}
+    />
+  )
+}
+
+const InlineTextField = styled(TextField)`
+  /* 
+  TODO: Improve input based on feedback from UX
+  & > div {
+    background: transparent;
+    margin: 0 -0.5rem;
+    padding: 0 0.5rem;
+    box-shadow: none;
+    width: auto;
+  }
+
+  input {
+    padding: 0;
+    letter-spacing: 0;
+    font-weight: 400;
+    color: inherit;
+
+    ::placeholder {
+      color: red;
+    }
+  } */
+`

package/src/edit-cells/index.ts

@@ -0,0 +1,6 @@
+export * from './EditableCheckboxCell'
+export * from './EditableDateCell'
+export * from './EditableDropdownCell'
+export * from './EditableNumberCell'
+export * from './EditableTextAreaCell'
+export * from './EditableTextFieldCell'

package/src/edit-cells/utils.tsx

@@ -0,0 +1,40 @@
+import { Icon } from '@equinor/eds-core-react'
+import { Variants } from '@equinor/eds-core-react/dist/types/components/types'
+import { error_filled, warning_filled } from '@equinor/eds-icons'
+
+interface GetHelperTextPropsProps {
+  error?: { message?: string }
+  warning?: { message: string }
+  helperText?: string
+}
+
+interface GetHelperTextProps {
+  variant?: Variants
+  helperText?: string
+  helperIcon: JSX.Element | null
+}
+
+export function getHelperTextProps({
+  error,
+  warning,
+  helperText,
+}: GetHelperTextPropsProps): GetHelperTextProps {
+  if (error)
+    return {
+      variant: 'error',
+      helperText: error.message,
+      helperIcon: <Icon data={error_filled} size={16} />,
+    }
+
+  if (warning)
+    return {
+      variant: 'warning',
+      helperText: warning.message,
+      helperIcon: <Icon data={warning_filled} size={16} />,
+    }
+
+  return {
+    helperText,
+    helperIcon: null,
+  }
+}

package/src/form-meta/index.ts

@@ -0,0 +1,2 @@
+export * from './types'
+export * from './utils'

package/src/form-meta/types.ts

@@ -0,0 +1,7 @@
+export type FormMeta = {
+  _isNew?: boolean;
+  _editMode?: boolean;
+  _hasRemoteChange?: boolean;
+};
+
+export type WithoutFormMeta<T extends FormMeta> = Omit<T, keyof FormMeta>;

package/src/form-meta/utils.tsx

@@ -0,0 +1,66 @@
+import { omit } from 'lodash'
+import { useFormContext } from 'react-hook-form'
+import { FormMeta } from './types'
+
+// This file contains methods related to the FormMeta type
+
+const formMeta: FormMeta = {
+  _editMode: false,
+  _isNew: false,
+  _hasRemoteChange: false,
+}
+
+/**
+ * Subscribes to the `_editMode` field in a `react-hook-form` context.
+ *
+ * @returns edit mode value
+ */
+export function useEditMode() {
+  const { watch } = useFormContext<FormMeta>()
+  return watch('_editMode') ?? false
+}
+
+/**
+ * Subscribes to the `_hasRemoteChange` field in a `react-hook-form` context.
+ *
+ * @returns edit mode value
+ */
+export function useHasRemoteChange() {
+  const { watch } = useFormContext<FormMeta>()
+  return watch('_hasRemoteChange') ?? false
+}
+
+/**
+ * @returns function getting is new meta
+ */
+export function useGetIsNew() {
+  const { getValues } = useFormContext<FormMeta>()
+  return () => getValues('_isNew') ?? false
+}
+
+export function useSetFormMeta<T extends FormMeta>() {
+  const { setValue } = useFormContext<T>()
+  return (newValues: Partial<T>) =>
+    objectKeys(newValues).forEach((key) => newValues[key] && setValue(key, newValues[key]))
+}
+
+/**
+ * ```
+ * Object.keys()
+ * ```
+ * With better typing. Same uses.
+ *
+ * @param obj
+ * @returns `Object.keys(obj)`
+ */
+function objectKeys<Obj>(obj: any): (keyof Obj)[] {
+  return Object.keys(obj) as (keyof Obj)[]
+}
+
+export function removeFormMeta<T extends FormMeta>(withFormMeta: T): Omit<T, keyof FormMeta> {
+  return omit(withFormMeta, Object.keys(formMeta)) as Omit<T, keyof FormMeta>
+}
+
+export function addFormMeta<T>(withoutFormMeta: T): T & FormMeta {
+  return { ...formMeta, ...withoutFormMeta }
+}

package/src/index.ts

@@ -1,2 +1,4 @@
+export * from './edit-cells'
+export * from './form-meta'
 export * from './jotai-form'
 export * from './zod-validation'

package/.turbo/turbo-build.log

@@ -1,14 +0,0 @@
-$ tsup src/index.ts --format esm,cjs --dts --external react
-CLI Building entry: src/index.ts
-CLI Using tsconfig: tsconfig.json
-CLI tsup v6.6.3
-CLI Target: es6
-ESM Build start
-CJS Build start
-ESM dist/index.mjs 3.48 KB
-ESM ⚡️ Build success in 85ms
-CJS dist/index.js 4.62 KB
-CJS ⚡️ Build success in 86ms
-DTS Build start
-DTS ⚡️ Build success in 4462ms
-DTS dist/index.d.ts 2.00 KB

package/dist/index.d.ts

@@ -1,46 +0,0 @@
-import { PrimitiveAtom } from 'jotai';
-import { AtomFamily } from 'jotai/vanilla/utils/atomFamily';
-import { z } from 'zod';
-
-type ValidationErrorMap<T> = Map<keyof T, {
-    message: string;
-    code: string;
-}>;
-
-declare function createValidator<S extends z.ZodTypeAny>(schema: S): {
-    validate: <E extends z.TypeOf<S>>(entity: E) => ValidationErrorMap<E> | undefined;
-    validateAsync: <E_1 extends z.TypeOf<S>>(entity: z.infer<typeof schema>) => Promise<ValidationErrorMap<E_1> | undefined>;
-    getSchema(): S;
-};
-
-type FormState<T> = {
-    status: 'editing' | 'pending';
-    values: T;
-    errors?: ValidationErrorMap<T>;
-    isValid?: boolean;
-};
-type FormFamilyParam = {
-    id: number | string;
-} & Record<string, unknown>;
-
-declare function createFormFamily<E extends Record<string, unknown>>(): AtomFamily<FormFamilyParam, PrimitiveAtom<FormState<E> | undefined> & {
-    init: FormState<E> | undefined;
-}>;
-type FormFamily<T> = AtomFamily<FormFamilyParam, PrimitiveAtom<FormState<T> | undefined>>;
-type FormValidator = ReturnType<typeof createValidator>;
-type UseFormFamilyUtilsOptions = {
-    validator?: FormValidator;
-};
-declare function useFormFamilyUtils<T>(family: FormFamily<T>, options?: UseFormFamilyUtilsOptions): {
-    useFormStateAtom: (param: FormFamilyParam) => [FormState<T> | undefined, (args_0: FormState<T> | ((prev: FormState<T> | undefined) => FormState<T> | undefined) | undefined) => void];
-    useFormState: (param: FormFamilyParam) => FormState<T> | undefined;
-    useUpdateFormMutation: (param: FormFamilyParam) => (update: Partial<T>) => void;
-    useFormMutations(param: FormFamilyParam): {
-        update: (update: Partial<T>) => void;
-        initializeForm: (entity: T) => void;
-        resetForm: () => void;
-    };
-};
-declare function useFormFamilyMutation<T>(family: FormFamily<T>, param: FormFamilyParam, validator?: FormValidator): (update: Partial<T>) => void;
-
-export { FormFamilyParam, FormState, ValidationErrorMap, createFormFamily, createValidator, useFormFamilyMutation, useFormFamilyUtils };

package/dist/index.js

@@ -1,147 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var __async = (__this, __arguments, generator) => {
-  return new Promise((resolve, reject) => {
-    var fulfilled = (value) => {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var rejected = (value) => {
-      try {
-        step(generator.throw(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
-    step((generator = generator.apply(__this, __arguments)).next());
-  });
-};
-
-// src/index.ts
-var src_exports = {};
-__export(src_exports, {
-  createFormFamily: () => createFormFamily,
-  createValidator: () => createValidator,
-  useFormFamilyMutation: () => useFormFamilyMutation,
-  useFormFamilyUtils: () => useFormFamilyUtils
-});
-module.exports = __toCommonJS(src_exports);
-
-// src/jotai-form/formUtils.ts
-var import_jotai = require("jotai");
-var import_utils = require("jotai/utils");
-function createFormFamily() {
-  return (0, import_utils.atomFamily)(
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    (_param) => (0, import_jotai.atom)(void 0),
-    (a, b) => a.id === b.id
-  );
-}
-function useFormFamilyUtils(family, options = {}) {
-  return {
-    useFormStateAtom: (param) => (0, import_jotai.useAtom)(family(param)),
-    useFormState: (param) => (0, import_jotai.useAtomValue)(family(param)),
-    useUpdateFormMutation: (param) => {
-      return useFormFamilyMutation(family, param, options.validator);
-    },
-    useFormMutations(param) {
-      const mutateAtom = (0, import_jotai.useSetAtom)(family(param));
-      return {
-        update: useFormFamilyMutation(family, param, options.validator),
-        initializeForm: (entity) => mutateAtom({
-          status: "editing",
-          values: entity,
-          isValid: true
-        }),
-        resetForm: () => mutateAtom(void 0)
-      };
-    }
-  };
-}
-function useFormFamilyMutation(family, param, validator) {
-  const mutate = (0, import_jotai.useSetAtom)(family(param));
-  return (update) => {
-    return mutate((previous) => {
-      if (!previous)
-        return;
-      const updatedValues = __spreadValues(__spreadValues({}, previous.values), update);
-      const errors = validator == null ? void 0 : validator.validate(updatedValues);
-      return {
-        status: "editing",
-        values: updatedValues,
-        errors,
-        isValid: !errors
-      };
-    });
-  };
-}
-
-// src/zod-validation/utils.ts
-function createValidator(schema) {
-  return {
-    validate: (entity) => {
-      const validation = schema.safeParse(entity);
-      if (validation.success)
-        return void 0;
-      return prepareErrors(validation);
-    },
-    validateAsync: (entity) => __async(this, null, function* () {
-      const validation = yield schema.safeParseAsync(entity);
-      if (validation.success)
-        return void 0;
-      return prepareErrors(validation);
-    }),
-    getSchema() {
-      return schema;
-    }
-  };
-}
-function prepareErrors(errorValidation) {
-  return new Map(
-    errorValidation.error.errors.map((error) => [
-      error.path[0],
-      { message: error.message, code: error.code }
-    ])
-  );
-}
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  createFormFamily,
-  createValidator,
-  useFormFamilyMutation,
-  useFormFamilyUtils
-});

package/dist/index.mjs

@@ -1,120 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __async = (__this, __arguments, generator) => {
-  return new Promise((resolve, reject) => {
-    var fulfilled = (value) => {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var rejected = (value) => {
-      try {
-        step(generator.throw(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
-    step((generator = generator.apply(__this, __arguments)).next());
-  });
-};
-
-// src/jotai-form/formUtils.ts
-import { atom, useAtom, useAtomValue, useSetAtom } from "jotai";
-import { atomFamily } from "jotai/utils";
-function createFormFamily() {
-  return atomFamily(
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    (_param) => atom(void 0),
-    (a, b) => a.id === b.id
-  );
-}
-function useFormFamilyUtils(family, options = {}) {
-  return {
-    useFormStateAtom: (param) => useAtom(family(param)),
-    useFormState: (param) => useAtomValue(family(param)),
-    useUpdateFormMutation: (param) => {
-      return useFormFamilyMutation(family, param, options.validator);
-    },
-    useFormMutations(param) {
-      const mutateAtom = useSetAtom(family(param));
-      return {
-        update: useFormFamilyMutation(family, param, options.validator),
-        initializeForm: (entity) => mutateAtom({
-          status: "editing",
-          values: entity,
-          isValid: true
-        }),
-        resetForm: () => mutateAtom(void 0)
-      };
-    }
-  };
-}
-function useFormFamilyMutation(family, param, validator) {
-  const mutate = useSetAtom(family(param));
-  return (update) => {
-    return mutate((previous) => {
-      if (!previous)
-        return;
-      const updatedValues = __spreadValues(__spreadValues({}, previous.values), update);
-      const errors = validator == null ? void 0 : validator.validate(updatedValues);
-      return {
-        status: "editing",
-        values: updatedValues,
-        errors,
-        isValid: !errors
-      };
-    });
-  };
-}
-
-// src/zod-validation/utils.ts
-function createValidator(schema) {
-  return {
-    validate: (entity) => {
-      const validation = schema.safeParse(entity);
-      if (validation.success)
-        return void 0;
-      return prepareErrors(validation);
-    },
-    validateAsync: (entity) => __async(this, null, function* () {
-      const validation = yield schema.safeParseAsync(entity);
-      if (validation.success)
-        return void 0;
-      return prepareErrors(validation);
-    }),
-    getSchema() {
-      return schema;
-    }
-  };
-}
-function prepareErrors(errorValidation) {
-  return new Map(
-    errorValidation.error.errors.map((error) => [
-      error.path[0],
-      { message: error.message, code: error.code }
-    ])
-  );
-}
-export {
-  createFormFamily,
-  createValidator,
-  useFormFamilyMutation,
-  useFormFamilyUtils
-};