@platforma-sdk/ui-vue 1.63.12 → 1.65.0

package/dist/lib/util/helpers/dist/objects.js

@@ -32,7 +32,10 @@ function o(e) {
 		}), t;
 	} else return e;
 }
+function s(e, t) {
+	return e[t];
+}
 //#endregion
-export { o as deepClone, e as isArray, a as isJsonEqual, t as isNonPrimitive, n as isObject, r as isPlainObject };
+export { o as deepClone, s as getField, e as isArray, a as isJsonEqual, t as isNonPrimitive, n as isObject, r as isPlainObject };
 
 //# sourceMappingURL=objects.js.map

package/dist/lib/util/helpers/dist/objects.js.map

@@ -1 +1 @@
-{"version":3,"file":"objects.js","names":[],"sources":["../../../../../../../lib/util/helpers/src/objects.ts"],"sourcesContent":["/**/\n\nimport type { PartialBy, PlainObject } from \"./types\";\nimport { isNil } from \"./utils\";\n\n/**\n * Alias to Array.isArray\n */\nexport const isArray = Array.isArray;\n\n//\nexport function isNonPrimitive<V, T extends PlainObject<V> | V[]>(obj: T | unknown): obj is T {\n  return obj !== null && typeof obj === \"object\";\n}\n\nexport function isObject(value: unknown): value is object {\n  return typeof value === \"object\" && value !== null;\n}\n\n/**\n * Checks if the given value is a plain object.\n *\n * A plain object is defined as an object created by the `{}` literal,\n * an object created with `Object.create(null)`, or an object with a\n * prototype that resolves to `Object.prototype`.\n *\n * @param value - The value to check.\n * @returns `true` if the value is a plain object, otherwise `false`.\n *\n * @example\n * ```typescript\n * isPlainObject({}); // true\n * isPlainObject(Object.create(null)); // true\n * isPlainObject(new Date()); // false\n * isPlainObject(null); // false\n * isPlainObject([]); // false\n * ```\n */\nexport function isPlainObject(value: unknown): value is PlainObject {\n  if (!isObject(value)) {\n    return false;\n  }\n\n  const prototype: unknown = Object.getPrototypeOf(value);\n\n  return (\n    prototype === null ||\n    prototype === Object.prototype ||\n    Object.getPrototypeOf(prototype) === null\n  );\n}\n\nexport function map<U, T extends Record<string, unknown>>(\n  obj: T,\n  callback: (curr: T[keyof T], key: keyof T) => U,\n) {\n  const keys = Object.keys(obj) as Array<keyof T>;\n\n  return keys.map((key: keyof T) => {\n    return callback(obj[key], key);\n  });\n}\n\nfunction definedKeysSize(obj: PlainObject) {\n  return Object.values(obj).reduce((length: number, v) => {\n    return v !== undefined ? length + 1 : length;\n  }, 0);\n}\n\n/**\n * Performs a deep equality check between two values, `a` and `b`, to determine if they are JSON-equivalent.\n *\n * JSON equivalence means that the two values are strictly equal in structure and content, including arrays and plain objects.\n * Non-primitive values that are neither arrays nor plain objects will throw an error.\n *\n * @param a - The first value to compare.\n * @param b - The second value to compare.\n * @returns `true` if the values are JSON-equivalent, otherwise `false`.\n *\n * @throws If the values are non-primitive and not arrays or plain objects.\n *\n * @example\n * ```typescript\n * isJsonEqual(1, 1); // true\n * isJsonEqual({ a: 1 }, { a: 1 }); // true\n * isJsonEqual([1, 2], [1, 2]); // true\n * isJsonEqual({ a: 1 }, { a: 2 }); // false\n * isJsonEqual([1, 2], [2, 1]); // false\n * isJsonEqual(new Date(), new Date()); // Error\n * ```\n */\nexport function isJsonEqual(a: unknown, b: unknown): boolean {\n  if (!(isNonPrimitive(a) && isNonPrimitive(b))) {\n    return a === b;\n  }\n\n  if (isArray(a) && isArray(b)) {\n    if (a.length !== b.length) {\n      return false;\n    } else {\n      return [...a.keys()].every((k) => isJsonEqual(a[k], b[k]));\n    }\n  }\n\n  if (isPlainObject(a) && isPlainObject(b)) {\n    if (definedKeysSize(a) !== definedKeysSize(b)) {\n      return false;\n    }\n\n    return Object.keys(a).every((k) => isJsonEqual(a[k], b[k]));\n  }\n\n  throw Error(`Cannot compare a ${String(a)} and b ${String(b)}`);\n}\n\n/**\n * Alias to isJsonEqual function\n * @deprecated change to isJsonEqual\n */\nexport const deepEqual = isJsonEqual;\n\nexport function deepClone<T>(obj: T): T {\n  if (Array.isArray(obj)) {\n    const copy: any[] = [];\n    for (let i = 0; i < obj.length; i++) {\n      copy[i] = deepClone(obj[i]) as unknown;\n    }\n    return copy as T;\n  } else if (isPlainObject(obj)) {\n    const copy: Record<string, any> = {};\n    Object.keys(obj).forEach((k) => {\n      copy[k] = deepClone(obj[k]);\n    });\n    return copy as T;\n  } else {\n    return obj;\n  }\n}\n\nexport function shallowClone<T>(obj: T): T {\n  if (isNil(obj)) return obj;\n  if (Array.isArray(obj)) return obj.slice() as T;\n  if (isPlainObject(obj)) return Object.assign({}, obj) as T;\n  if (obj instanceof Map) return new Map(obj) as T;\n  if (obj instanceof Set) return new Set(obj) as T;\n  throw Error(`Not implemented clone strategy for ${JSON.stringify(obj)}`);\n}\n\nexport function shallowDiff<T>(to: T, from: T): Partial<T> {\n  const diff: Partial<T> = {};\n\n  for (const key in from) {\n    if (from[key] !== to[key]) {\n      diff[key] = to[key];\n    }\n  }\n\n  return diff;\n}\n\nexport function bindMethods<O extends Record<string, unknown>>(obj: O) {\n  Object.entries(obj).forEach(([key, m]) => {\n    if (m instanceof Function) {\n      //\n      obj[key as keyof O] = m.bind(obj);\n    }\n  });\n\n  return obj;\n}\n\nexport function setProp<O, K extends keyof O>(obj: O, key: K, value: O[K]) {\n  obj[key] = value;\n  return obj;\n}\n\nexport function getProp<O, K extends keyof O>(obj: O, key: K): O[K] {\n  return obj[key];\n}\n\nexport function shiftProp<O, K extends keyof O>(obj: O, key: K): [O[K], Omit<O, K>] {\n  obj = { ...obj };\n  const val = obj[key];\n  delete obj[key];\n  return [val, obj];\n}\n\nexport function pick<T, K extends keyof T>(obj: T, ...keys: K[]): Pick<T, K> {\n  return Object.assign({}, ...keys.map((k) => ({ [k]: obj[k] }))) as Pick<T, K>;\n}\n\nexport function pickValues<T, K extends keyof T>(obj: T, ...keys: K[]) {\n  return keys.map((k) => obj[k]);\n}\n\nexport function omit<T, K extends keyof T>(obj: T, ...keys: K[]): Omit<T, K> {\n  const o = Object.assign({}, obj) as PartialBy<T, K>;\n  keys.forEach((k) => delete o[k]);\n  return o;\n}\n\n/**\n * Performs a deep patch of the target object or array using the source object or array.\n *\n * This function recursively merges properties of the source into the target:\n * - If a property in both target and source is a plain object, they are recursively merged.\n * - If a property in both target and source is an array of the same length, the arrays are recursively patched element by element.\n * - Otherwise, the property value in the target is replaced by the corresponding value from the source.\n *\n * The patch is applied in-place to the target object or array, which is also returned for convenience.\n *\n * @typeParam T - The type of the target and source, which must be either a plain object or an array.\n * @param target - The target object or array to be patched. This object/array is modified in-place.\n * @param source - The source object or array providing the new values for the patch.\n * @returns The modified target object or array.\n *\n * @example\n * ```typescript\n * const target = { a: { b: 1 }, c: [1, 2] };\n * const source = { a: { b: 2 }, c: [3, 4], d: 5 };\n * const result = deepPatch(target, source);\n * // target is now: { a: { b: 2 }, c: [3, 4], d: 5 }\n * // result is the same reference as target.\n *\n * const targetArray = [{ a: 1 }, { b: 2 }];\n * const sourceArray = [{ a: 2 }, { b: 3 }];\n * const resultArray = deepPatch(targetArray, sourceArray);\n * // targetArray is now: [{ a: 2 }, { b: 3 }]\n * ```\n */\nexport function deepPatch<T extends PlainObject | unknown[]>(target: T, source: T) {\n  const sk = new Set<keyof T>([\n    ...(Object.keys(target) as (keyof T)[]),\n    ...(Object.keys(source) as (keyof T)[]),\n  ]);\n\n  sk.forEach((key) => {\n    const t = target[key];\n    const s = source[key];\n    if (isPlainObject(t) && isPlainObject(s)) {\n      deepPatch(t, s);\n    } else if (isArray(t) && isArray(s) && t.length === s.length) {\n      deepPatch(t, s);\n    } else {\n      target[key] = s;\n    }\n  });\n\n  return target;\n}\n"],"mappings":";AAQA,IAAa,IAAU,MAAM;AAG7B,SAAgB,EAAkD,GAA4B;AAC5F,QAAuB,OAAO,KAAQ,cAA/B;;AAGT,SAAgB,EAAS,GAAiC;AACxD,QAAO,OAAO,KAAU,cAAY;;AAsBtC,SAAgB,EAAc,GAAsC;AAClE,KAAI,CAAC,EAAS,EAAM,CAClB,QAAO;CAGT,IAAM,IAAqB,OAAO,eAAe,EAAM;AAEvD,QACE,MAAc,QACd,MAAc,OAAO,aACrB,OAAO,eAAe,EAAU,KAAK;;AAezC,SAAS,EAAgB,GAAkB;AACzC,QAAO,OAAO,OAAO,EAAI,CAAC,QAAQ,GAAgB,MACzC,MAAM,KAAA,IAAyB,IAAb,IAAS,GACjC,EAAE;;AAyBP,SAAgB,EAAY,GAAY,GAAqB;AAC3D,KAAI,EAAE,EAAe,EAAE,IAAI,EAAe,EAAE,EAC1C,QAAO,MAAM;AAGf,KAAI,EAAQ,EAAE,IAAI,EAAQ,EAAE,CAIxB,QAHE,EAAE,WAAW,EAAE,SAGV,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC,OAAO,MAAM,EAAY,EAAE,IAAI,EAAE,GAAG,CAAC,GAFnD;AAMX,KAAI,EAAc,EAAE,IAAI,EAAc,EAAE,CAKtC,QAJI,EAAgB,EAAE,KAAK,EAAgB,EAAE,GAItC,OAAO,KAAK,EAAE,CAAC,OAAO,MAAM,EAAY,EAAE,IAAI,EAAE,GAAG,CAAC,GAHlD;AAMX,OAAM,MAAM,oBAAoB,OAAO,EAAE,CAAC,SAAS,OAAO,EAAE,GAAG;;AASjE,SAAgB,EAAa,GAAW;AACtC,KAAI,MAAM,QAAQ,EAAI,EAAE;EACtB,IAAM,IAAc,EAAE;AACtB,OAAK,IAAI,IAAI,GAAG,IAAI,EAAI,QAAQ,IAC9B,GAAK,KAAK,EAAU,EAAI,GAAG;AAE7B,SAAO;YACE,EAAc,EAAI,EAAE;EAC7B,IAAM,IAA4B,EAAE;AAIpC,SAHA,OAAO,KAAK,EAAI,CAAC,SAAS,MAAM;AAC9B,KAAK,KAAK,EAAU,EAAI,GAAG;IAC3B,EACK;OAEP,QAAO"}
+{"version":3,"file":"objects.js","names":[],"sources":["../../../../../../../lib/util/helpers/src/objects.ts"],"sourcesContent":["/**/\n\nimport type { PartialBy, PlainObject, UnionToIntersection } from \"./types\";\nimport { isNil } from \"./utils\";\n\n/**\n * Alias to Array.isArray\n */\nexport const isArray = Array.isArray;\n\n//\nexport function isNonPrimitive<V, T extends PlainObject<V> | V[]>(obj: T | unknown): obj is T {\n  return obj !== null && typeof obj === \"object\";\n}\n\nexport function isObject(value: unknown): value is object {\n  return typeof value === \"object\" && value !== null;\n}\n\n/**\n * Checks if the given value is a plain object.\n *\n * A plain object is defined as an object created by the `{}` literal,\n * an object created with `Object.create(null)`, or an object with a\n * prototype that resolves to `Object.prototype`.\n *\n * @param value - The value to check.\n * @returns `true` if the value is a plain object, otherwise `false`.\n *\n * @example\n * ```typescript\n * isPlainObject({}); // true\n * isPlainObject(Object.create(null)); // true\n * isPlainObject(new Date()); // false\n * isPlainObject(null); // false\n * isPlainObject([]); // false\n * ```\n */\nexport function isPlainObject(value: unknown): value is PlainObject {\n  if (!isObject(value)) {\n    return false;\n  }\n\n  const prototype: unknown = Object.getPrototypeOf(value);\n\n  return (\n    prototype === null ||\n    prototype === Object.prototype ||\n    Object.getPrototypeOf(prototype) === null\n  );\n}\n\nexport function map<U, T extends Record<string, unknown>>(\n  obj: T,\n  callback: (curr: T[keyof T], key: keyof T) => U,\n) {\n  const keys = Object.keys(obj) as Array<keyof T>;\n\n  return keys.map((key: keyof T) => {\n    return callback(obj[key], key);\n  });\n}\n\nfunction definedKeysSize(obj: PlainObject) {\n  return Object.values(obj).reduce((length: number, v) => {\n    return v !== undefined ? length + 1 : length;\n  }, 0);\n}\n\n/**\n * Performs a deep equality check between two values, `a` and `b`, to determine if they are JSON-equivalent.\n *\n * JSON equivalence means that the two values are strictly equal in structure and content, including arrays and plain objects.\n * Non-primitive values that are neither arrays nor plain objects will throw an error.\n *\n * @param a - The first value to compare.\n * @param b - The second value to compare.\n * @returns `true` if the values are JSON-equivalent, otherwise `false`.\n *\n * @throws If the values are non-primitive and not arrays or plain objects.\n *\n * @example\n * ```typescript\n * isJsonEqual(1, 1); // true\n * isJsonEqual({ a: 1 }, { a: 1 }); // true\n * isJsonEqual([1, 2], [1, 2]); // true\n * isJsonEqual({ a: 1 }, { a: 2 }); // false\n * isJsonEqual([1, 2], [2, 1]); // false\n * isJsonEqual(new Date(), new Date()); // Error\n * ```\n */\nexport function isJsonEqual(a: unknown, b: unknown): boolean {\n  if (!(isNonPrimitive(a) && isNonPrimitive(b))) {\n    return a === b;\n  }\n\n  if (isArray(a) && isArray(b)) {\n    if (a.length !== b.length) {\n      return false;\n    } else {\n      return [...a.keys()].every((k) => isJsonEqual(a[k], b[k]));\n    }\n  }\n\n  if (isPlainObject(a) && isPlainObject(b)) {\n    if (definedKeysSize(a) !== definedKeysSize(b)) {\n      return false;\n    }\n\n    return Object.keys(a).every((k) => isJsonEqual(a[k], b[k]));\n  }\n\n  throw Error(`Cannot compare a ${String(a)} and b ${String(b)}`);\n}\n\n/**\n * Alias to isJsonEqual function\n * @deprecated change to isJsonEqual\n */\nexport const deepEqual = isJsonEqual;\n\nexport function deepClone<T>(obj: T): T {\n  if (Array.isArray(obj)) {\n    const copy: any[] = [];\n    for (let i = 0; i < obj.length; i++) {\n      copy[i] = deepClone(obj[i]) as unknown;\n    }\n    return copy as T;\n  } else if (isPlainObject(obj)) {\n    const copy: Record<string, any> = {};\n    Object.keys(obj).forEach((k) => {\n      copy[k] = deepClone(obj[k]);\n    });\n    return copy as T;\n  } else {\n    return obj;\n  }\n}\n\nexport function shallowClone<T>(obj: T): T {\n  if (isNil(obj)) return obj;\n  if (Array.isArray(obj)) return obj.slice() as T;\n  if (isPlainObject(obj)) return Object.assign({}, obj) as T;\n  if (obj instanceof Map) return new Map(obj) as T;\n  if (obj instanceof Set) return new Set(obj) as T;\n  throw Error(`Not implemented clone strategy for ${JSON.stringify(obj)}`);\n}\n\nexport function shallowDiff<T>(to: T, from: T): Partial<T> {\n  const diff: Partial<T> = {};\n\n  for (const key in from) {\n    if (from[key] !== to[key]) {\n      diff[key] = to[key];\n    }\n  }\n\n  return diff;\n}\n\nexport function bindMethods<O extends Record<string, unknown>>(obj: O) {\n  Object.entries(obj).forEach(([key, m]) => {\n    if (m instanceof Function) {\n      //\n      obj[key as keyof O] = m.bind(obj);\n    }\n  });\n\n  return obj;\n}\n\nexport function setProp<O, K extends keyof O>(obj: O, key: K, value: O[K]) {\n  obj[key] = value;\n  return obj;\n}\n\nexport function getProp<O, K extends keyof O>(obj: O, key: K): O[K] {\n  return obj[key];\n}\n\nexport function shiftProp<O, K extends keyof O>(obj: O, key: K): [O[K], Omit<O, K>] {\n  obj = { ...obj };\n  const val = obj[key];\n  delete obj[key];\n  return [val, obj];\n}\n\nexport function pick<T, K extends keyof T>(obj: T, ...keys: K[]): Pick<T, K> {\n  return Object.assign({}, ...keys.map((k) => ({ [k]: obj[k] }))) as Pick<T, K>;\n}\n\nexport function pickValues<T, K extends keyof T>(obj: T, ...keys: K[]) {\n  return keys.map((k) => obj[k]);\n}\n\nexport function omit<T, K extends keyof T>(obj: T, ...keys: K[]): Omit<T, K> {\n  const o = Object.assign({}, obj) as PartialBy<T, K>;\n  keys.forEach((k) => delete o[k]);\n  return o;\n}\n\n/**\n * Performs a deep patch of the target object or array using the source object or array.\n *\n * This function recursively merges properties of the source into the target:\n * - If a property in both target and source is a plain object, they are recursively merged.\n * - If a property in both target and source is an array of the same length, the arrays are recursively patched element by element.\n * - Otherwise, the property value in the target is replaced by the corresponding value from the source.\n *\n * The patch is applied in-place to the target object or array, which is also returned for convenience.\n *\n * @typeParam T - The type of the target and source, which must be either a plain object or an array.\n * @param target - The target object or array to be patched. This object/array is modified in-place.\n * @param source - The source object or array providing the new values for the patch.\n * @returns The modified target object or array.\n *\n * @example\n * ```typescript\n * const target = { a: { b: 1 }, c: [1, 2] };\n * const source = { a: { b: 2 }, c: [3, 4], d: 5 };\n * const result = deepPatch(target, source);\n * // target is now: { a: { b: 2 }, c: [3, 4], d: 5 }\n * // result is the same reference as target.\n *\n * const targetArray = [{ a: 1 }, { b: 2 }];\n * const sourceArray = [{ a: 2 }, { b: 3 }];\n * const resultArray = deepPatch(targetArray, sourceArray);\n * // targetArray is now: [{ a: 2 }, { b: 3 }]\n * ```\n */\nexport function deepPatch<T extends PlainObject | unknown[]>(target: T, source: T) {\n  const sk = new Set<keyof T>([\n    ...(Object.keys(target) as (keyof T)[]),\n    ...(Object.keys(source) as (keyof T)[]),\n  ]);\n\n  sk.forEach((key) => {\n    const t = target[key];\n    const s = source[key];\n    if (isPlainObject(t) && isPlainObject(s)) {\n      deepPatch(t, s);\n    } else if (isArray(t) && isArray(s) && t.length === s.length) {\n      deepPatch(t, s);\n    } else {\n      target[key] = s;\n    }\n  });\n\n  return target;\n}\n\n/**\n * Reads a property from a union-typed object where the key may exist only on some members of the union.\n *\n * `K` is constrained to keys of the union's intersection, so any key present on at least one union\n * member is accepted. The return type resolves to `T[K]` when `K` is a key of `T`, otherwise `undefined`\n * — matching the runtime behavior of reading a missing property.\n *\n * @param obj - source object (may be a union of shapes)\n * @param prop - property name, must be a key of at least one union member\n * @returns the property value if present, otherwise `undefined`\n */\nexport function getField<T extends object, K extends keyof UnionToIntersection<T>>(\n  obj: T,\n  prop: K,\n): K extends keyof T ? T[K] : undefined {\n  // @ts-expect-error - we want this to be a compile-time error when prop is not in T, but at runtime we just return undefined\n  return obj[prop];\n}\n"],"mappings":";AAQA,IAAa,IAAU,MAAM;AAG7B,SAAgB,EAAkD,GAA4B;AAC5F,QAAuB,OAAO,KAAQ,cAA/B;;AAGT,SAAgB,EAAS,GAAiC;AACxD,QAAO,OAAO,KAAU,cAAY;;AAsBtC,SAAgB,EAAc,GAAsC;AAClE,KAAI,CAAC,EAAS,EAAM,CAClB,QAAO;CAGT,IAAM,IAAqB,OAAO,eAAe,EAAM;AAEvD,QACE,MAAc,QACd,MAAc,OAAO,aACrB,OAAO,eAAe,EAAU,KAAK;;AAezC,SAAS,EAAgB,GAAkB;AACzC,QAAO,OAAO,OAAO,EAAI,CAAC,QAAQ,GAAgB,MACzC,MAAM,KAAA,IAAyB,IAAb,IAAS,GACjC,EAAE;;AAyBP,SAAgB,EAAY,GAAY,GAAqB;AAC3D,KAAI,EAAE,EAAe,EAAE,IAAI,EAAe,EAAE,EAC1C,QAAO,MAAM;AAGf,KAAI,EAAQ,EAAE,IAAI,EAAQ,EAAE,CAIxB,QAHE,EAAE,WAAW,EAAE,SAGV,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC,OAAO,MAAM,EAAY,EAAE,IAAI,EAAE,GAAG,CAAC,GAFnD;AAMX,KAAI,EAAc,EAAE,IAAI,EAAc,EAAE,CAKtC,QAJI,EAAgB,EAAE,KAAK,EAAgB,EAAE,GAItC,OAAO,KAAK,EAAE,CAAC,OAAO,MAAM,EAAY,EAAE,IAAI,EAAE,GAAG,CAAC,GAHlD;AAMX,OAAM,MAAM,oBAAoB,OAAO,EAAE,CAAC,SAAS,OAAO,EAAE,GAAG;;AASjE,SAAgB,EAAa,GAAW;AACtC,KAAI,MAAM,QAAQ,EAAI,EAAE;EACtB,IAAM,IAAc,EAAE;AACtB,OAAK,IAAI,IAAI,GAAG,IAAI,EAAI,QAAQ,IAC9B,GAAK,KAAK,EAAU,EAAI,GAAG;AAE7B,SAAO;YACE,EAAc,EAAI,EAAE;EAC7B,IAAM,IAA4B,EAAE;AAIpC,SAHA,OAAO,KAAK,EAAI,CAAC,SAAS,MAAM;AAC9B,KAAK,KAAK,EAAU,EAAI,GAAG;IAC3B,EACK;OAEP,QAAO;;AA+HX,SAAgB,EACd,GACA,GACsC;AAEtC,QAAO,EAAI"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@platforma-sdk/ui-vue",
-  "version": "1.63.12",
+  "version": "1.65.0",
   "type": "module",
   "main": "dist/index.js",
   "exports": {
@@ -22,13 +22,14 @@
     "d3-format": "^3.1.0",
     "es-toolkit": "^1.39.10",
     "fast-json-patch": "^3.1.1",
+    "immer": "11.1.4",
     "lru-cache": "^11.2.2",
     "vue": "^3.5.24",
     "zod": "~3.25.76",
     "@milaboratories/pf-spec-driver": "1.2.5",
-    "@milaboratories/pl-model-common": "1.31.2",
-    "@platforma-sdk/model": "1.63.12",
-    "@milaboratories/uikit": "2.11.8"
+    "@platforma-sdk/model": "1.65.0",
+    "@milaboratories/uikit": "2.12.0",
+    "@milaboratories/pl-model-common": "1.31.2"
   },
   "devDependencies": {
     "@faker-js/faker": "^9.2.0",
@@ -42,10 +43,10 @@
     "typescript": "~5.9.3",
     "vite": "^8.0.6",
     "vitest": "^4.1.3",
-    "@milaboratories/build-configs": "2.0.0",
+    "@milaboratories/helpers": "1.14.1",
     "@milaboratories/ts-builder": "1.3.1",
-    "@milaboratories/ts-configs": "1.2.3",
-    "@milaboratories/helpers": "1.14.1"
+    "@milaboratories/build-configs": "2.0.0",
+    "@milaboratories/ts-configs": "1.2.3"
   },
   "scripts": {
     "dev": "ts-builder serve --target browser-lib",

package/src/components/PlAdvancedFilter/FilterEditor.vue

@@ -27,10 +27,10 @@ import { DEFAULT_FILTER_TYPE, DEFAULT_FILTERS } from "./constants";
 import OperandButton from "./OperandButton.vue";
 import type { EditableFilter, Operand, PlAdvancedFilterColumnId, SourceOptionInfo } from "./types";
 import { getFilterInfo, getNormalizedSpec, isNumericFilter, isPositionFilter } from "./utils";
-
-const filter = defineModel<EditableFilter>("filter", { required: true });
+import { Entries } from "@milaboratories/helpers";
 
 const props = defineProps<{
+  filter: EditableFilter;
   isLast: boolean;
   operand: Operand;
   enableDnd: boolean;
@@ -43,9 +43,20 @@ const props = defineProps<{
     searchStr: string;
   }) => ListOptionBase<string | number>[] | Promise<ListOptionBase<string | number>[]>;
   onDelete: (columnId: PlAdvancedFilterColumnId) => void;
+  onUpdateFilter: (filter: EditableFilter) => void;
   onChangeOperand: (op: Operand) => void;
 }>();
 
+type AllKeys<U> = U extends unknown ? keyof U : never;
+type ValueOf<U, K extends string> = U extends unknown ? (K extends keyof U ? U[K] : never) : never;
+
+function updateFilterProp<K extends AllKeys<EditableFilter> & string>(
+  key: K,
+  v: ValueOf<EditableFilter, K>,
+) {
+  props.onUpdateFilter({ ...props.filter, [key]: v } as EditableFilter);
+}
+
 async function getSuggestOptionsFn(
   id: PlAdvancedFilterColumnId,
   type: "value" | "label",
@@ -76,17 +87,21 @@ async function getMultiSuggestOptionsFn(
   throw new Error("Invalid arguments combination");
 }
 
-type Entries<T> = { [K in keyof T]: [K, T[K]] }[keyof T][];
-function changeFilterType() {
-  const defaultFilter = DEFAULT_FILTERS[filter.value.type];
-
-  filter.value = (Object.entries(defaultFilter) as Entries<EditableFilter>).reduce(
-    (res, [key, val]) => {
-      res[key] = filter.value[key] ?? val;
-      return res;
-    },
-    {} as Record<keyof EditableFilter, EditableFilter[keyof EditableFilter]>,
-  ) as EditableFilter;
+function changeFilterType(newType: EditableFilter["type"]) {
+  const defaultFilter = DEFAULT_FILTERS[newType];
+
+  props.onUpdateFilter(
+    (Object.entries(defaultFilter) as Entries<EditableFilter>).reduce(
+      (res, [key, val]) => {
+        res[key] = props.filter[key] ?? val;
+        return res;
+      },
+      { ...props.filter, type: newType } as Record<
+        keyof EditableFilter,
+        EditableFilter[keyof EditableFilter]
+      >,
+    ) as EditableFilter,
+  );
 }
 
 function changeSourceId(newSourceId?: PlAdvancedFilterColumnId) {
@@ -97,30 +112,28 @@ function changeSourceId(newSourceId?: PlAdvancedFilterColumnId) {
   if (!newSourceInfo) {
     return;
   }
-  const filterInfo = getFilterInfo(filter.value.type);
+  const filterInfo = getFilterInfo(props.filter.type);
   const newSourceSpec = getNormalizedSpec(newSourceInfo?.spec);
   if (filterInfo.supportedFor(newSourceSpec)) {
-    // don't do anything except update source id
-    filter.value.column = newSourceId;
+    props.onUpdateFilter({ ...props.filter, column: newSourceId });
   } else {
-    // reset to default filter which fits to any column
-    filter.value = {
+    props.onUpdateFilter({
       ...DEFAULT_FILTERS[DEFAULT_FILTER_TYPE],
       column: newSourceId,
-    };
+    });
   }
 }
 
 const inconsistentSourceSelected = computed(() => {
   const selectedOption = props.columnOptions.find(
-    (op) => op.id === getSourceId(filter.value.column),
+    (op) => op.id === getSourceId(props.filter.column),
   );
   return selectedOption === undefined;
 });
 const sourceOptions = computed(() => {
   const options = props.columnOptions.map((v) => ({ value: v.id, label: v.label ?? v }));
   if (inconsistentSourceSelected.value) {
-    options.unshift({ value: filter.value.column, label: "Inconsistent value" });
+    options.unshift({ value: props.filter.column, label: "Inconsistent value" });
   }
   return options;
 });
@@ -186,10 +199,10 @@ function stringifyColumn(value: ColumnAsSourceAndFixedAxes): PlAdvancedFilterCol
 
 const columnAsSourceAndFixedAxes = computed({
   get: () => {
-    return getColumnAsSourceAndFixedAxes(filter.value.column);
+    return getColumnAsSourceAndFixedAxes(props.filter.column);
   },
   set: (value) => {
-    filter.value.column = stringifyColumn(value);
+    props.onUpdateFilter({ ...props.filter, column: stringifyColumn(value) });
   },
 });
 function updateAxisFilterValue(idx: number, value: AxisFilterValue | undefined) {
@@ -214,14 +227,14 @@ const filterTypesOptions = computed(() =>
   props.supportedFilters
     .filter(
       (v) =>
-        filter.value.type === v ||
+        props.filter.type === v ||
         (currentSpec.value ? getFilterInfo(v).supportedFor(currentSpec.value) : true),
     )
     .map((v) => ({ value: v, label: getFilterInfo(v).label })),
 );
 
 const wildcardOptions = computed(() => {
-  if (filter.value.type !== "patternFuzzyContainSubsequence") {
+  if (props.filter.type !== "patternFuzzyContainSubsequence") {
     return [];
   }
   if (currentOption.value?.alphabet === "nucleotide") {
@@ -230,15 +243,15 @@ const wildcardOptions = computed(() => {
   if (currentOption.value?.alphabet === "aminoacid") {
     return [{ label: "X", value: "X" }];
   }
-  return [...new Set(filter.value.value.split(""))].sort().map((v) => ({ value: v, label: v }));
+  return [...new Set(props.filter.value.split(""))].sort().map((v) => ({ value: v, label: v }));
 });
 
 const stringMatchesError = computed(() => {
-  if (filter.value.type !== "patternMatchesRegularExpression") {
+  if (props.filter.type !== "patternMatchesRegularExpression") {
     return false;
   }
   try {
-    new RegExp(filter.value.value);
+    new RegExp(props.filter.value);
     return false;
   } catch {
     return true;
@@ -268,24 +281,24 @@ const stringMatchesError = computed(() => {
           {{
             inconsistentSourceSelected
               ? "Inconsistent value"
-              : (currentOption?.label ?? filter.column)
+              : (currentOption?.label ?? props.filter.column)
           }}
         </div>
       </div>
-      <div :class="$style.closeIcon" @click="onDelete(filter.column)">
+      <div :class="$style.closeIcon" @click="onDelete(props.filter.column)">
         <PlIcon16 name="close" />
       </div>
     </div>
     <div v-else :class="$style.top">
       <PlDropdown
-        v-model="columnAsSourceAndFixedAxes.source"
+        :model-value="columnAsSourceAndFixedAxes.source"
         :errorStatus="currentError"
         :options="sourceOptions"
         :style="{ width: '100%' }"
         group-position="top-left"
         @update:model-value="changeSourceId"
       />
-      <div :class="$style.closeButton" @click="onDelete(filter.column)">
+      <div :class="$style.closeButton" @click="onDelete(props.filter.column)">
         <PlIcon16 name="close" />
       </div>
     </div>
@@ -293,7 +306,7 @@ const stringMatchesError = computed(() => {
     <div v-if="currentOption?.axesToBeFixed?.length" :class="$style.fixedAxesBlock">
       <template v-for="value in currentOption?.axesToBeFixed" :key="value.idx">
         <PlAutocomplete
-          v-model="columnAsSourceAndFixedAxes.axisFiltersByIndex[value.idx]"
+          :model-value="columnAsSourceAndFixedAxes.axisFiltersByIndex[value.idx]"
           :label="value.label"
           :options-search="
             (str, type) =>
@@ -308,81 +321,112 @@ const stringMatchesError = computed(() => {
 
     <!-- middle - filter type selector -  for all filter types -->
     <div
-      :class="filter.type === 'isNA' || filter.type === 'isNotNA' ? $style.bottom : $style.middle"
+      :class="
+        props.filter.type === 'isNA' || props.filter.type === 'isNotNA'
+          ? $style.bottom
+          : $style.middle
+      "
     >
       <PlDropdown
-        v-model="filter.type"
+        :model-value="props.filter.type"
         :options="filterTypesOptions"
-        :group-position="filter.type === 'isNA' || filter.type === 'isNotNA' ? 'bottom' : 'middle'"
-        @update:model-value="changeFilterType"
+        :group-position="
+          props.filter.type === 'isNA' || props.filter.type === 'isNotNA' ? 'bottom' : 'middle'
+        "
+        @update:model-value="(v) => changeFilterType(v!)"
       />
     </div>
 
     <!-- middle - for fuzzy contains filter -->
-    <template v-if="filter.type === 'patternFuzzyContainSubsequence'">
+    <template v-if="props.filter.type === 'patternFuzzyContainSubsequence'">
       <div :class="$style.middle">
-        <PlTextField v-model="filter.value" placeholder="Substring" group-position="middle" />
+        <PlTextField
+          :model-value="props.filter.value"
+          placeholder="Substring"
+          group-position="middle"
+          @update:model-value="(v) => updateFilterProp('value', v)"
+        />
       </div>
       <div :class="$style.innerSection">
         <Slider
-          v-model="filter.maxEdits"
+          :model-value="props.filter.maxEdits"
           :max="5"
           breakpoints
           label="Maximum number of substitutions and indels"
+          @update:model-value="(v) => updateFilterProp('maxEdits', v)"
+        />
+        <PlToggleSwitch
+          :model-value="props.filter.substitutionsOnly"
+          label="Substitutions only"
+          @update:model-value="(v) => updateFilterProp('substitutionsOnly', v)"
         />
-        <PlToggleSwitch v-model="filter.substitutionsOnly" label="Substitutions only" />
       </div>
     </template>
 
     <!-- bottom element - individual settings for every filter type -->
     <div :class="$style.bottom">
       <PlAutocomplete
-        v-if="filter.type === 'patternEquals' || filter.type === 'patternNotEquals'"
-        v-model="filter.value"
+        v-if="props.filter.type === 'patternEquals' || props.filter.type === 'patternNotEquals'"
+        :model-value="props.filter.value"
         :options-search="
           (str, type) => getSuggestOptionsFn(columnAsSourceAndFixedAxes.source, type, str)
         "
         :clearable="true"
         group-position="bottom"
+        @update:model-value="(v) => updateFilterProp('value', v)"
       />
       <PlAutocompleteMulti
-        v-if="filter.type === 'inSet' || filter.type === 'notInSet'"
-        v-model="filter.value"
+        v-if="props.filter.type === 'inSet' || props.filter.type === 'notInSet'"
+        :model-value="props.filter.value"
         :options-search="
           (str, type) => getMultiSuggestOptionsFn(columnAsSourceAndFixedAxes.source, type, str)
         "
         :disabled="inconsistentSourceSelected"
         group-position="bottom"
+        @update:model-value="(v) => updateFilterProp('value', v)"
+      />
+      <PlNumberField
+        v-if="isNumericFilter(props.filter)"
+        :model-value="props.filter.x"
+        group-position="bottom"
+        @update:model-value="(v) => updateFilterProp('x', v)"
+      />
+      <PlNumberField
+        v-if="isPositionFilter(props.filter)"
+        :model-value="props.filter.n"
+        group-position="bottom"
+        @update:model-value="(v) => updateFilterProp('n', v)"
       />
-      <PlNumberField v-if="isNumericFilter(filter)" v-model="filter.x" group-position="bottom" />
-      <PlNumberField v-if="isPositionFilter(filter)" v-model="filter.n" group-position="bottom" />
       <PlTextField
         v-if="
-          filter.type === 'patternContainSubsequence' ||
-          filter.type === 'patternNotContainSubsequence'
+          props.filter.type === 'patternContainSubsequence' ||
+          props.filter.type === 'patternNotContainSubsequence'
         "
-        v-model="filter.value"
+        :model-value="props.filter.value"
         placeholder="Substring"
         group-position="bottom"
+        @update:model-value="(v) => updateFilterProp('value', v)"
       />
       <PlTextField
-        v-if="filter.type === 'patternMatchesRegularExpression'"
-        v-model="filter.value"
+        v-if="props.filter.type === 'patternMatchesRegularExpression'"
+        :model-value="props.filter.value"
         :error="stringMatchesError ? 'Regular expression is not valid' : undefined"
         placeholder="Regular expression"
         group-position="bottom"
+        @update:model-value="(v) => updateFilterProp('value', v)"
       />
       <PlDropdown
-        v-if="filter.type === 'patternFuzzyContainSubsequence'"
-        v-model="filter.wildcard"
+        v-if="props.filter.type === 'patternFuzzyContainSubsequence'"
+        :model-value="props.filter.wildcard"
         clearable
         placeholder="Wildcard value"
         :options="wildcardOptions"
         group-position="bottom"
+        @update:model-value="(v) => updateFilterProp('wildcard', v)"
       />
     </div>
   </div>
-  <OperandButton :active="operand" :disabled="isLast" :on-select="onChangeOperand" />
+  <OperandButton :active="operand" :disabled="isLast" @select="onChangeOperand" />
 </template>
 
 <style module>