@platforma-sdk/ui-vue 1.58.8 → 1.58.9

package/dist/components/PlAdvancedFilter/FilterEditor.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilterEditor.vue2.js","sources":["../../../src/components/PlAdvancedFilter/FilterEditor.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport {\n  PlAutocomplete,\n  PlAutocompleteMulti,\n  PlDropdown,\n  PlIcon16,\n  PlNumberField,\n  PlTextField,\n  PlToggleSwitch,\n  Slider,\n} from \"@milaboratories/uikit\";\nimport type {\n  AnchoredPColumnId,\n  AxisFilterByIdx,\n  AxisFilterValue,\n  SUniversalPColumnId,\n} from \"@platforma-sdk/model\";\nimport {\n  isFilteredPColumn,\n  parseColumnId,\n  stringifyColumnId,\n  type ListOptionBase,\n} from \"@platforma-sdk/model\";\nimport { computed } from \"vue\";\nimport type { SUPPORTED_FILTER_TYPES } from \"./constants\";\nimport { DEFAULT_FILTER_TYPE, DEFAULT_FILTERS } from \"./constants\";\nimport OperandButton from \"./OperandButton.vue\";\nimport type { EditableFilter, Operand, PlAdvancedFilterColumnId, SourceOptionInfo } from \"./types\";\nimport { getFilterInfo, getNormalizedSpec, isNumericFilter, isPositionFilter } from \"./utils\";\n\nconst filter = defineModel<EditableFilter>(\"filter\", { required: true });\n\nconst props = defineProps<{\n  isLast: boolean;\n  operand: Operand;\n  enableDnd: boolean;\n  columnOptions: SourceOptionInfo[];\n  supportedFilters: typeof SUPPORTED_FILTER_TYPES;\n  getSuggestOptions: (params: {\n    columnId: PlAdvancedFilterColumnId;\n    axisIdx?: number;\n    searchType: \"value\" | \"label\";\n    searchStr: string;\n  }) => ListOptionBase<string | number>[] | Promise<ListOptionBase<string | number>[]>;\n  onDelete: (columnId: PlAdvancedFilterColumnId) => void;\n  onChangeOperand: (op: Operand) => void;\n}>();\n\nasync function getSuggestOptionsFn(\n  id: PlAdvancedFilterColumnId,\n  type: \"value\" | \"label\",\n  str: string,\n  axisIdx?: number,\n): Promise<ListOptionBase<string>[]> {\n  return props.getSuggestOptions({\n    columnId: id,\n    axisIdx,\n    searchType: type,\n    searchStr: str,\n  }) as Promise<ListOptionBase<string>[]>;\n}\n\nasync function getMultiSuggestOptionsFn(\n  id: PlAdvancedFilterColumnId,\n  type: \"value\" | \"label\",\n  str: string | string[],\n  axisIdx?: number,\n): Promise<ListOptionBase<string>[]> {\n  if (type === \"label\" && typeof str === \"string\") {\n    return getSuggestOptionsFn(id, type, str, axisIdx);\n  }\n  if (type === \"value\" && Array.isArray(str)) {\n    const results = await Promise.all(str.map((s) => getSuggestOptionsFn(id, type, s, axisIdx)));\n    return results.map((x) => x[0]);\n  }\n  throw new Error(\"Invalid arguments combination\");\n}\n\ntype Entries<T> = { [K in keyof T]: [K, T[K]] }[keyof T][];\nfunction changeFilterType() {\n  const defaultFilter = DEFAULT_FILTERS[filter.value.type];\n\n  filter.value = (Object.entries(defaultFilter) as Entries<EditableFilter>).reduce(\n    (res, [key, val]) => {\n      res[key] = filter.value[key] ?? val;\n      return res;\n    },\n    {} as Record<keyof EditableFilter, EditableFilter[keyof EditableFilter]>,\n  ) as EditableFilter;\n}\n\nfunction changeSourceId(newSourceId?: PlAdvancedFilterColumnId) {\n  if (!newSourceId) {\n    return;\n  }\n  const newSourceInfo = props.columnOptions.find((v) => v.id === getSourceId(newSourceId));\n  if (!newSourceInfo) {\n    return;\n  }\n  const filterInfo = getFilterInfo(filter.value.type);\n  const newSourceSpec = getNormalizedSpec(newSourceInfo?.spec);\n  if (filterInfo.supportedFor(newSourceSpec)) {\n    // don't do anything except update source id\n    filter.value.column = newSourceId;\n  } else {\n    // reset to default filter which fits to any column\n    filter.value = {\n      ...DEFAULT_FILTERS[DEFAULT_FILTER_TYPE],\n      column: newSourceId,\n    };\n  }\n}\n\nconst inconsistentSourceSelected = computed(() => {\n  const selectedOption = props.columnOptions.find(\n    (op) => op.id === getSourceId(filter.value.column),\n  );\n  return selectedOption === undefined;\n});\nconst sourceOptions = computed(() => {\n  const options = props.columnOptions.map((v) => ({ value: v.id, label: v.label ?? v }));\n  if (inconsistentSourceSelected.value) {\n    options.unshift({ value: filter.value.column, label: \"Inconsistent value\" });\n  }\n  return options;\n});\n\nfunction getSourceId(column: PlAdvancedFilterColumnId): PlAdvancedFilterColumnId {\n  try {\n    const parsedColumnId = parseColumnId(column as SUniversalPColumnId);\n    if (isFilteredPColumn(parsedColumnId)) {\n      return stringifyColumnId(parsedColumnId.source);\n    } else {\n      return column;\n    }\n  } catch {\n    return column;\n  }\n}\n\n// similar to FilteredPColumnId but source is stringified and axis filters can be undefined\ntype ColumnAsSourceAndFixedAxes = {\n  source: PlAdvancedFilterColumnId;\n  axisFiltersByIndex: Record<number, AxisFilterValue | undefined>;\n};\nfunction getColumnAsSourceAndFixedAxes(\n  column: PlAdvancedFilterColumnId,\n): ColumnAsSourceAndFixedAxes {\n  const sourceId = getSourceId(column);\n  const option = props.columnOptions.find((op) => op.id === sourceId);\n  const axesToBeFixed = (option?.axesToBeFixed ?? []).reduce(\n    (res, item) => {\n      res[item.idx] = undefined;\n      return res;\n    },\n    {} as Record<number, AxisFilterValue | undefined>,\n  );\n  try {\n    const parsedColumnId = parseColumnId(column as SUniversalPColumnId);\n    if (isFilteredPColumn(parsedColumnId)) {\n      return {\n        source: sourceId,\n        axisFiltersByIndex: parsedColumnId.axisFilters.reduce((res, item) => {\n          res[item[0]] = item[1];\n          return res;\n        }, axesToBeFixed),\n      };\n    }\n  } catch {\n    return { source: column, axisFiltersByIndex: axesToBeFixed };\n  }\n  return { source: column, axisFiltersByIndex: axesToBeFixed };\n}\n\nfunction stringifyColumn(value: ColumnAsSourceAndFixedAxes): PlAdvancedFilterColumnId {\n  if (Object.keys(value.axisFiltersByIndex).length === 0) {\n    return value.source;\n  }\n  return stringifyColumnId({\n    source: parseColumnId(value.source as SUniversalPColumnId) as AnchoredPColumnId,\n    axisFilters: Object.entries(value.axisFiltersByIndex).map(\n      ([idx, value]) => [Number(idx), value] as AxisFilterByIdx,\n    ),\n  });\n}\n\nconst columnAsSourceAndFixedAxes = computed({\n  get: () => {\n    return getColumnAsSourceAndFixedAxes(filter.value.column);\n  },\n  set: (value) => {\n    filter.value.column = stringifyColumn(value);\n  },\n});\nfunction updateAxisFilterValue(idx: number, value: AxisFilterValue | undefined) {\n  columnAsSourceAndFixedAxes.value = {\n    ...columnAsSourceAndFixedAxes.value,\n    axisFiltersByIndex: { ...columnAsSourceAndFixedAxes.value.axisFiltersByIndex, [idx]: value },\n  };\n}\n\nconst currentOption = computed(() =>\n  props.columnOptions.find((op) => op.id === columnAsSourceAndFixedAxes.value.source),\n);\nconst currentSpec = computed(() =>\n  currentOption.value?.spec ? getNormalizedSpec(currentOption.value.spec) : null,\n);\nconst currentType = computed(() => currentSpec.value?.valueType);\nconst currentError = computed(\n  () => Boolean(currentOption.value?.error) || inconsistentSourceSelected.value,\n);\n\nconst filterTypesOptions = computed(() =>\n  props.supportedFilters\n    .filter(\n      (v) =>\n        filter.value.type === v ||\n        (currentSpec.value ? getFilterInfo(v).supportedFor(currentSpec.value) : true),\n    )\n    .map((v) => ({ value: v, label: getFilterInfo(v).label })),\n);\n\nconst wildcardOptions = computed(() => {\n  if (filter.value.type !== \"patternFuzzyContainSubsequence\") {\n    return [];\n  }\n  if (currentOption.value?.alphabet === \"nucleotide\") {\n    return [{ label: \"N\", value: \"N\" }];\n  }\n  if (currentOption.value?.alphabet === \"aminoacid\") {\n    return [{ label: \"X\", value: \"X\" }];\n  }\n  return [...new Set(filter.value.value.split(\"\"))].sort().map((v) => ({ value: v, label: v }));\n});\n\nconst stringMatchesError = computed(() => {\n  if (filter.value.type !== \"patternMatchesRegularExpression\") {\n    return false;\n  }\n  try {\n    new RegExp(filter.value.value);\n    return false;\n  } catch {\n    return true;\n  }\n});\n</script>\n<template>\n  <div :class=\"$style.filterWrapper\">\n    <!-- top element - column selector / column label - for all filter types-->\n    <div\n      v-if=\"enableDnd\"\n      :class=\"[$style.top, $style.columnChip, { [$style.error]: currentError }]\"\n    >\n      <div :class=\"[$style.typeIcon, { [$style.error]: currentError }]\">\n        <PlIcon16 v-if=\"currentError\" name=\"warning\" />\n        <PlIcon16\n          v-else\n          :name=\"\n            currentType === 'String' || currentType === undefined\n              ? 'cell-type-txt'\n              : 'cell-type-num'\n          \"\n        />\n      </div>\n      <div :class=\"$style.titleWrapper\" :title=\"currentOption?.label ?? ''\">\n        <div :class=\"$style.title\">\n          {{\n            inconsistentSourceSelected\n              ? \"Inconsistent value\"\n              : (currentOption?.label ?? filter.column)\n          }}\n        </div>\n      </div>\n      <div :class=\"$style.closeIcon\" @click=\"onDelete(filter.column)\">\n        <PlIcon16 name=\"close\" />\n      </div>\n    </div>\n    <div v-else :class=\"$style.top\">\n      <PlDropdown\n        v-model=\"columnAsSourceAndFixedAxes.source\"\n        :errorStatus=\"currentError\"\n        :options=\"sourceOptions\"\n        :style=\"{ width: '100%' }\"\n        group-position=\"top-left\"\n        @update:model-value=\"changeSourceId\"\n      />\n      <div :class=\"$style.closeButton\" @click=\"onDelete(filter.column)\">\n        <PlIcon16 name=\"close\" />\n      </div>\n    </div>\n\n    <div v-if=\"currentOption?.axesToBeFixed?.length\" :class=\"$style.fixedAxesBlock\">\n      <template v-for=\"value in currentOption?.axesToBeFixed\" :key=\"value.idx\">\n        <PlAutocomplete\n          v-model=\"columnAsSourceAndFixedAxes.axisFiltersByIndex[value.idx]\"\n          :label=\"value.label\"\n          :options-search=\"\n            (str, type) =>\n              getSuggestOptionsFn(columnAsSourceAndFixedAxes.source, type, str, value.idx)\n          \"\n          :disabled=\"inconsistentSourceSelected\"\n          :clearable=\"true\"\n          @update:model-value=\"(v) => updateAxisFilterValue(value.idx, v)\"\n        />\n      </template>\n    </div>\n\n    <!-- middle - filter type selector -  for all filter types -->\n    <div\n      :class=\"filter.type === 'isNA' || filter.type === 'isNotNA' ? $style.bottom : $style.middle\"\n    >\n      <PlDropdown\n        v-model=\"filter.type\"\n        :options=\"filterTypesOptions\"\n        :group-position=\"filter.type === 'isNA' || filter.type === 'isNotNA' ? 'bottom' : 'middle'\"\n        @update:model-value=\"changeFilterType\"\n      />\n    </div>\n\n    <!-- middle - for fuzzy contains filter -->\n    <template v-if=\"filter.type === 'patternFuzzyContainSubsequence'\">\n      <div :class=\"$style.middle\">\n        <PlTextField v-model=\"filter.value\" placeholder=\"Substring\" group-position=\"middle\" />\n      </div>\n      <div :class=\"$style.innerSection\">\n        <Slider\n          v-model=\"filter.maxEdits\"\n          :max=\"5\"\n          breakpoints\n          label=\"Maximum number of substitutions and indels\"\n        />\n        <PlToggleSwitch v-model=\"filter.substitutionsOnly\" label=\"Substitutions only\" />\n      </div>\n    </template>\n\n    <!-- bottom element - individual settings for every filter type -->\n    <div :class=\"$style.bottom\">\n      <template v-if=\"filter.type === 'patternEquals' || filter.type === 'patternNotEquals'\">\n        <PlAutocomplete\n          v-model=\"filter.value\"\n          :options-search=\"\n            (str, type) => getSuggestOptionsFn(columnAsSourceAndFixedAxes.source, type, str)\n          \"\n          :disabled=\"inconsistentSourceSelected\"\n          :clearable=\"true\"\n          group-position=\"bottom\"\n        />\n      </template>\n      <template v-if=\"filter.type === 'inSet' || filter.type === 'notInSet'\">\n        <PlAutocompleteMulti\n          v-model=\"filter.value\"\n          :options-search=\"\n            (str, type) => getMultiSuggestOptionsFn(columnAsSourceAndFixedAxes.source, type, str)\n          \"\n          :disabled=\"inconsistentSourceSelected\"\n          group-position=\"bottom\"\n        />\n      </template>\n      <PlNumberField v-if=\"isNumericFilter(filter)\" v-model=\"filter.x\" group-position=\"bottom\" />\n      <PlNumberField v-if=\"isPositionFilter(filter)\" v-model=\"filter.n\" group-position=\"bottom\" />\n      <PlTextField\n        v-if=\"\n          filter.type === 'patternContainSubsequence' ||\n          filter.type === 'patternNotContainSubsequence'\n        \"\n        v-model=\"filter.value\"\n        placeholder=\"Substring\"\n        group-position=\"bottom\"\n      />\n      <PlTextField\n        v-if=\"filter.type === 'patternMatchesRegularExpression'\"\n        v-model=\"filter.value\"\n        :error=\"stringMatchesError ? 'Regular expression is not valid' : undefined\"\n        placeholder=\"Regular expression\"\n        group-position=\"bottom\"\n      />\n      <PlDropdown\n        v-if=\"filter.type === 'patternFuzzyContainSubsequence'\"\n        v-model=\"filter.wildcard\"\n        clearable\n        placeholder=\"Wildcard value\"\n        :options=\"wildcardOptions\"\n        group-position=\"bottom\"\n      />\n    </div>\n  </div>\n  <OperandButton :active=\"operand\" :disabled=\"isLast\" :on-select=\"onChangeOperand\" />\n</template>\n\n<style module>\n.filterWrapper {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  cursor: default;\n}\n\n.typeIcon {\n  display: inline-flex;\n  margin-right: 8px;\n}\n\n.typeIcon.error {\n  --icon-color: var(--txt-error);\n}\n\n.closeIcon {\n  display: inline-flex;\n  margin-left: 12px;\n  cursor: pointer;\n}\n\n.titleWrapper {\n  flex-grow: 1;\n  overflow: hidden;\n}\n.title {\n  overflow: hidden;\n  color: var(--txt-01);\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  font-size: 14px;\n  font-weight: 500;\n  line-height: 20px;\n}\n\n.columnChip {\n  width: 100%;\n  display: flex;\n  padding: 10px 12px;\n  align-items: center;\n  border-radius: 6px;\n  border: 1px solid var(--txt-01);\n  border-bottom-right-radius: 0;\n  border-bottom-left-radius: 0;\n\n  &.error {\n    border-color: var(--txt-error);\n  }\n}\n\n.innerSection {\n  border: 1px solid var(--txt-01);\n  border-top: none;\n  padding: 16px 12px;\n}\n\n.closeButton {\n  border: 1px solid var(--txt-01);\n  border-top-right-radius: 6px;\n  border-left: none;\n  width: 40px;\n  height: 40px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-shrink: 0;\n  cursor: pointer;\n}\n\n.top {\n  position: relative;\n  display: flex;\n  width: 100%;\n  z-index: 1;\n  background: #fff;\n}\n\n.fixedAxesBlock {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  padding: 12px 8px;\n  gap: 12px;\n  border-left: 1px solid var(--txt-01);\n  border-right: 1px solid var(--txt-01);\n}\n\n.fixedAxesBlock > * {\n  background: #fff;\n}\n\n.middle,\n.bottom {\n  position: relative;\n  margin-top: -1px;\n  background: #fff;\n}\n</style>\n"],"names":["filter","_useModel","__props","props","getSuggestOptionsFn","id","type","str","axisIdx","getMultiSuggestOptionsFn","s","x","changeFilterType","defaultFilter","DEFAULT_FILTERS","res","key","val","changeSourceId","newSourceId","newSourceInfo","v","getSourceId","filterInfo","getFilterInfo","newSourceSpec","getNormalizedSpec","DEFAULT_FILTER_TYPE","inconsistentSourceSelected","computed","op","sourceOptions","options","column","parsedColumnId","parseColumnId","isFilteredPColumn","stringifyColumnId","getColumnAsSourceAndFixedAxes","sourceId","option","axesToBeFixed","item","stringifyColumn","value","idx","columnAsSourceAndFixedAxes","updateAxisFilterValue","currentOption","currentSpec","_a","currentType","currentError","filterTypesOptions","wildcardOptions","_b","stringMatchesError","_createElementVNode","_normalizeClass","$style","_createElementBlock","_createBlock","_unref","PlIcon16","_cache","$event","_createVNode","PlDropdown","_d","_c","_openBlock","_Fragment","_renderList","_e","PlAutocomplete","PlTextField","Slider","PlToggleSwitch","PlAutocompleteMulti","isNumericFilter","PlNumberField","isPositionFilter","OperandButton"],"mappings":"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"}
+{"version":3,"file":"FilterEditor.vue_vue_type_script_setup_true_lang.js","names":["$style"],"sources":["../../../src/components/PlAdvancedFilter/FilterEditor.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport {\n  PlAutocomplete,\n  PlAutocompleteMulti,\n  PlDropdown,\n  PlIcon16,\n  PlNumberField,\n  PlTextField,\n  PlToggleSwitch,\n  Slider,\n} from \"@milaboratories/uikit\";\nimport type {\n  AnchoredPColumnId,\n  AxisFilterByIdx,\n  AxisFilterValue,\n  SUniversalPColumnId,\n} from \"@platforma-sdk/model\";\nimport {\n  isFilteredPColumn,\n  parseColumnId,\n  stringifyColumnId,\n  type ListOptionBase,\n} from \"@platforma-sdk/model\";\nimport { computed } from \"vue\";\nimport type { SUPPORTED_FILTER_TYPES } from \"./constants\";\nimport { DEFAULT_FILTER_TYPE, DEFAULT_FILTERS } from \"./constants\";\nimport OperandButton from \"./OperandButton.vue\";\nimport type { EditableFilter, Operand, PlAdvancedFilterColumnId, SourceOptionInfo } from \"./types\";\nimport { getFilterInfo, getNormalizedSpec, isNumericFilter, isPositionFilter } from \"./utils\";\n\nconst filter = defineModel<EditableFilter>(\"filter\", { required: true });\n\nconst props = defineProps<{\n  isLast: boolean;\n  operand: Operand;\n  enableDnd: boolean;\n  columnOptions: SourceOptionInfo[];\n  supportedFilters: typeof SUPPORTED_FILTER_TYPES;\n  getSuggestOptions: (params: {\n    columnId: PlAdvancedFilterColumnId;\n    axisIdx?: number;\n    searchType: \"value\" | \"label\";\n    searchStr: string;\n  }) => ListOptionBase<string | number>[] | Promise<ListOptionBase<string | number>[]>;\n  onDelete: (columnId: PlAdvancedFilterColumnId) => void;\n  onChangeOperand: (op: Operand) => void;\n}>();\n\nasync function getSuggestOptionsFn(\n  id: PlAdvancedFilterColumnId,\n  type: \"value\" | \"label\",\n  str: string,\n  axisIdx?: number,\n): Promise<ListOptionBase<string>[]> {\n  return props.getSuggestOptions({\n    columnId: id,\n    axisIdx,\n    searchType: type,\n    searchStr: str,\n  }) as Promise<ListOptionBase<string>[]>;\n}\n\nasync function getMultiSuggestOptionsFn(\n  id: PlAdvancedFilterColumnId,\n  type: \"value\" | \"label\",\n  str: string | string[],\n  axisIdx?: number,\n): Promise<ListOptionBase<string>[]> {\n  if (type === \"label\" && typeof str === \"string\") {\n    return getSuggestOptionsFn(id, type, str, axisIdx);\n  }\n  if (type === \"value\" && Array.isArray(str)) {\n    const results = await Promise.all(str.map((s) => getSuggestOptionsFn(id, type, s, axisIdx)));\n    return results.map((x) => x[0]);\n  }\n  throw new Error(\"Invalid arguments combination\");\n}\n\ntype Entries<T> = { [K in keyof T]: [K, T[K]] }[keyof T][];\nfunction changeFilterType() {\n  const defaultFilter = DEFAULT_FILTERS[filter.value.type];\n\n  filter.value = (Object.entries(defaultFilter) as Entries<EditableFilter>).reduce(\n    (res, [key, val]) => {\n      res[key] = filter.value[key] ?? val;\n      return res;\n    },\n    {} as Record<keyof EditableFilter, EditableFilter[keyof EditableFilter]>,\n  ) as EditableFilter;\n}\n\nfunction changeSourceId(newSourceId?: PlAdvancedFilterColumnId) {\n  if (!newSourceId) {\n    return;\n  }\n  const newSourceInfo = props.columnOptions.find((v) => v.id === getSourceId(newSourceId));\n  if (!newSourceInfo) {\n    return;\n  }\n  const filterInfo = getFilterInfo(filter.value.type);\n  const newSourceSpec = getNormalizedSpec(newSourceInfo?.spec);\n  if (filterInfo.supportedFor(newSourceSpec)) {\n    // don't do anything except update source id\n    filter.value.column = newSourceId;\n  } else {\n    // reset to default filter which fits to any column\n    filter.value = {\n      ...DEFAULT_FILTERS[DEFAULT_FILTER_TYPE],\n      column: newSourceId,\n    };\n  }\n}\n\nconst inconsistentSourceSelected = computed(() => {\n  const selectedOption = props.columnOptions.find(\n    (op) => op.id === getSourceId(filter.value.column),\n  );\n  return selectedOption === undefined;\n});\nconst sourceOptions = computed(() => {\n  const options = props.columnOptions.map((v) => ({ value: v.id, label: v.label ?? v }));\n  if (inconsistentSourceSelected.value) {\n    options.unshift({ value: filter.value.column, label: \"Inconsistent value\" });\n  }\n  return options;\n});\n\nfunction getSourceId(column: PlAdvancedFilterColumnId): PlAdvancedFilterColumnId {\n  try {\n    const parsedColumnId = parseColumnId(column as SUniversalPColumnId);\n    if (isFilteredPColumn(parsedColumnId)) {\n      return stringifyColumnId(parsedColumnId.source);\n    } else {\n      return column;\n    }\n  } catch {\n    return column;\n  }\n}\n\n// similar to FilteredPColumnId but source is stringified and axis filters can be undefined\ntype ColumnAsSourceAndFixedAxes = {\n  source: PlAdvancedFilterColumnId;\n  axisFiltersByIndex: Record<number, AxisFilterValue | undefined>;\n};\nfunction getColumnAsSourceAndFixedAxes(\n  column: PlAdvancedFilterColumnId,\n): ColumnAsSourceAndFixedAxes {\n  const sourceId = getSourceId(column);\n  const option = props.columnOptions.find((op) => op.id === sourceId);\n  const axesToBeFixed = (option?.axesToBeFixed ?? []).reduce(\n    (res, item) => {\n      res[item.idx] = undefined;\n      return res;\n    },\n    {} as Record<number, AxisFilterValue | undefined>,\n  );\n  try {\n    const parsedColumnId = parseColumnId(column as SUniversalPColumnId);\n    if (isFilteredPColumn(parsedColumnId)) {\n      return {\n        source: sourceId,\n        axisFiltersByIndex: parsedColumnId.axisFilters.reduce((res, item) => {\n          res[item[0]] = item[1];\n          return res;\n        }, axesToBeFixed),\n      };\n    }\n  } catch {\n    return { source: column, axisFiltersByIndex: axesToBeFixed };\n  }\n  return { source: column, axisFiltersByIndex: axesToBeFixed };\n}\n\nfunction stringifyColumn(value: ColumnAsSourceAndFixedAxes): PlAdvancedFilterColumnId {\n  if (Object.keys(value.axisFiltersByIndex).length === 0) {\n    return value.source;\n  }\n  return stringifyColumnId({\n    source: parseColumnId(value.source as SUniversalPColumnId) as AnchoredPColumnId,\n    axisFilters: Object.entries(value.axisFiltersByIndex).map(\n      ([idx, value]) => [Number(idx), value] as AxisFilterByIdx,\n    ),\n  });\n}\n\nconst columnAsSourceAndFixedAxes = computed({\n  get: () => {\n    return getColumnAsSourceAndFixedAxes(filter.value.column);\n  },\n  set: (value) => {\n    filter.value.column = stringifyColumn(value);\n  },\n});\nfunction updateAxisFilterValue(idx: number, value: AxisFilterValue | undefined) {\n  columnAsSourceAndFixedAxes.value = {\n    ...columnAsSourceAndFixedAxes.value,\n    axisFiltersByIndex: { ...columnAsSourceAndFixedAxes.value.axisFiltersByIndex, [idx]: value },\n  };\n}\n\nconst currentOption = computed(() =>\n  props.columnOptions.find((op) => op.id === columnAsSourceAndFixedAxes.value.source),\n);\nconst currentSpec = computed(() =>\n  currentOption.value?.spec ? getNormalizedSpec(currentOption.value.spec) : null,\n);\nconst currentType = computed(() => currentSpec.value?.valueType);\nconst currentError = computed(\n  () => Boolean(currentOption.value?.error) || inconsistentSourceSelected.value,\n);\n\nconst filterTypesOptions = computed(() =>\n  props.supportedFilters\n    .filter(\n      (v) =>\n        filter.value.type === v ||\n        (currentSpec.value ? getFilterInfo(v).supportedFor(currentSpec.value) : true),\n    )\n    .map((v) => ({ value: v, label: getFilterInfo(v).label })),\n);\n\nconst wildcardOptions = computed(() => {\n  if (filter.value.type !== \"patternFuzzyContainSubsequence\") {\n    return [];\n  }\n  if (currentOption.value?.alphabet === \"nucleotide\") {\n    return [{ label: \"N\", value: \"N\" }];\n  }\n  if (currentOption.value?.alphabet === \"aminoacid\") {\n    return [{ label: \"X\", value: \"X\" }];\n  }\n  return [...new Set(filter.value.value.split(\"\"))].sort().map((v) => ({ value: v, label: v }));\n});\n\nconst stringMatchesError = computed(() => {\n  if (filter.value.type !== \"patternMatchesRegularExpression\") {\n    return false;\n  }\n  try {\n    new RegExp(filter.value.value);\n    return false;\n  } catch {\n    return true;\n  }\n});\n</script>\n<template>\n  <div :class=\"$style.filterWrapper\">\n    <!-- top element - column selector / column label - for all filter types-->\n    <div\n      v-if=\"enableDnd\"\n      :class=\"[$style.top, $style.columnChip, { [$style.error]: currentError }]\"\n    >\n      <div :class=\"[$style.typeIcon, { [$style.error]: currentError }]\">\n        <PlIcon16 v-if=\"currentError\" name=\"warning\" />\n        <PlIcon16\n          v-else\n          :name=\"\n            currentType === 'String' || currentType === undefined\n              ? 'cell-type-txt'\n              : 'cell-type-num'\n          \"\n        />\n      </div>\n      <div :class=\"$style.titleWrapper\" :title=\"currentOption?.label ?? ''\">\n        <div :class=\"$style.title\">\n          {{\n            inconsistentSourceSelected\n              ? \"Inconsistent value\"\n              : (currentOption?.label ?? filter.column)\n          }}\n        </div>\n      </div>\n      <div :class=\"$style.closeIcon\" @click=\"onDelete(filter.column)\">\n        <PlIcon16 name=\"close\" />\n      </div>\n    </div>\n    <div v-else :class=\"$style.top\">\n      <PlDropdown\n        v-model=\"columnAsSourceAndFixedAxes.source\"\n        :errorStatus=\"currentError\"\n        :options=\"sourceOptions\"\n        :style=\"{ width: '100%' }\"\n        group-position=\"top-left\"\n        @update:model-value=\"changeSourceId\"\n      />\n      <div :class=\"$style.closeButton\" @click=\"onDelete(filter.column)\">\n        <PlIcon16 name=\"close\" />\n      </div>\n    </div>\n\n    <div v-if=\"currentOption?.axesToBeFixed?.length\" :class=\"$style.fixedAxesBlock\">\n      <template v-for=\"value in currentOption?.axesToBeFixed\" :key=\"value.idx\">\n        <PlAutocomplete\n          v-model=\"columnAsSourceAndFixedAxes.axisFiltersByIndex[value.idx]\"\n          :label=\"value.label\"\n          :options-search=\"\n            (str, type) =>\n              getSuggestOptionsFn(columnAsSourceAndFixedAxes.source, type, str, value.idx)\n          \"\n          :disabled=\"inconsistentSourceSelected\"\n          :clearable=\"true\"\n          @update:model-value=\"(v) => updateAxisFilterValue(value.idx, v)\"\n        />\n      </template>\n    </div>\n\n    <!-- middle - filter type selector -  for all filter types -->\n    <div\n      :class=\"filter.type === 'isNA' || filter.type === 'isNotNA' ? $style.bottom : $style.middle\"\n    >\n      <PlDropdown\n        v-model=\"filter.type\"\n        :options=\"filterTypesOptions\"\n        :group-position=\"filter.type === 'isNA' || filter.type === 'isNotNA' ? 'bottom' : 'middle'\"\n        @update:model-value=\"changeFilterType\"\n      />\n    </div>\n\n    <!-- middle - for fuzzy contains filter -->\n    <template v-if=\"filter.type === 'patternFuzzyContainSubsequence'\">\n      <div :class=\"$style.middle\">\n        <PlTextField v-model=\"filter.value\" placeholder=\"Substring\" group-position=\"middle\" />\n      </div>\n      <div :class=\"$style.innerSection\">\n        <Slider\n          v-model=\"filter.maxEdits\"\n          :max=\"5\"\n          breakpoints\n          label=\"Maximum number of substitutions and indels\"\n        />\n        <PlToggleSwitch v-model=\"filter.substitutionsOnly\" label=\"Substitutions only\" />\n      </div>\n    </template>\n\n    <!-- bottom element - individual settings for every filter type -->\n    <div :class=\"$style.bottom\">\n      <template v-if=\"filter.type === 'patternEquals' || filter.type === 'patternNotEquals'\">\n        <PlAutocomplete\n          v-model=\"filter.value\"\n          :options-search=\"\n            (str, type) => getSuggestOptionsFn(columnAsSourceAndFixedAxes.source, type, str)\n          \"\n          :disabled=\"inconsistentSourceSelected\"\n          :clearable=\"true\"\n          group-position=\"bottom\"\n        />\n      </template>\n      <template v-if=\"filter.type === 'inSet' || filter.type === 'notInSet'\">\n        <PlAutocompleteMulti\n          v-model=\"filter.value\"\n          :options-search=\"\n            (str, type) => getMultiSuggestOptionsFn(columnAsSourceAndFixedAxes.source, type, str)\n          \"\n          :disabled=\"inconsistentSourceSelected\"\n          group-position=\"bottom\"\n        />\n      </template>\n      <PlNumberField v-if=\"isNumericFilter(filter)\" v-model=\"filter.x\" group-position=\"bottom\" />\n      <PlNumberField v-if=\"isPositionFilter(filter)\" v-model=\"filter.n\" group-position=\"bottom\" />\n      <PlTextField\n        v-if=\"\n          filter.type === 'patternContainSubsequence' ||\n          filter.type === 'patternNotContainSubsequence'\n        \"\n        v-model=\"filter.value\"\n        placeholder=\"Substring\"\n        group-position=\"bottom\"\n      />\n      <PlTextField\n        v-if=\"filter.type === 'patternMatchesRegularExpression'\"\n        v-model=\"filter.value\"\n        :error=\"stringMatchesError ? 'Regular expression is not valid' : undefined\"\n        placeholder=\"Regular expression\"\n        group-position=\"bottom\"\n      />\n      <PlDropdown\n        v-if=\"filter.type === 'patternFuzzyContainSubsequence'\"\n        v-model=\"filter.wildcard\"\n        clearable\n        placeholder=\"Wildcard value\"\n        :options=\"wildcardOptions\"\n        group-position=\"bottom\"\n      />\n    </div>\n  </div>\n  <OperandButton :active=\"operand\" :disabled=\"isLast\" :on-select=\"onChangeOperand\" />\n</template>\n\n<style module>\n.filterWrapper {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  cursor: default;\n}\n\n.typeIcon {\n  display: inline-flex;\n  margin-right: 8px;\n}\n\n.typeIcon.error {\n  --icon-color: var(--txt-error);\n}\n\n.closeIcon {\n  display: inline-flex;\n  margin-left: 12px;\n  cursor: pointer;\n}\n\n.titleWrapper {\n  flex-grow: 1;\n  overflow: hidden;\n}\n.title {\n  overflow: hidden;\n  color: var(--txt-01);\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  font-size: 14px;\n  font-weight: 500;\n  line-height: 20px;\n}\n\n.columnChip {\n  width: 100%;\n  display: flex;\n  padding: 10px 12px;\n  align-items: center;\n  border-radius: 6px;\n  border: 1px solid var(--txt-01);\n  border-bottom-right-radius: 0;\n  border-bottom-left-radius: 0;\n\n  &.error {\n    border-color: var(--txt-error);\n  }\n}\n\n.innerSection {\n  border: 1px solid var(--txt-01);\n  border-top: none;\n  padding: 16px 12px;\n}\n\n.closeButton {\n  border: 1px solid var(--txt-01);\n  border-top-right-radius: 6px;\n  border-left: none;\n  width: 40px;\n  height: 40px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-shrink: 0;\n  cursor: pointer;\n}\n\n.top {\n  position: relative;\n  display: flex;\n  width: 100%;\n  z-index: 1;\n  background: #fff;\n}\n\n.fixedAxesBlock {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  padding: 12px 8px;\n  gap: 12px;\n  border-left: 1px solid var(--txt-01);\n  border-right: 1px solid var(--txt-01);\n}\n\n.fixedAxesBlock > * {\n  background: #fff;\n}\n\n.middle,\n.bottom {\n  position: relative;\n  margin-top: -1px;\n  background: #fff;\n}\n</style>\n"],"mappings":"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"}

package/dist/components/PlAdvancedFilter/OperandButton.js

@@ -0,0 +1,7 @@
+import e from "../../_virtual/_plugin-vue_export-helper.js";
+import t from "./OperandButton.vue2.js";
+import n from "./OperandButton.style.js";
+var r = /* @__PURE__ */ e(t, [["__cssModules", { $style: n }]]);
+export { r as default };
+
+//# sourceMappingURL=OperandButton.js.map

package/dist/components/PlAdvancedFilter/OperandButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OperandButton.js","names":[],"sources":["../../../src/components/PlAdvancedFilter/OperandButton.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { Operand } from \"./types\";\n\nconst props = defineProps<{\n  active: Operand;\n  disabled: boolean;\n  onSelect: (op: Operand) => void;\n}>();\n\nconst OPTIONS: Operand[] = [\"and\", \"or\"];\n</script>\n<template>\n  <div v-bind=\"$attrs\" :class=\"$style.block\">\n    <div\n      v-for=\"op in OPTIONS\"\n      :key=\"op\"\n      :class=\"[$style.operand, { [$style.active]: op === props.active && !props.disabled }]\"\n      @click=\"!props.disabled && props.onSelect(op)\"\n    >\n      {{ op }}\n    </div>\n  </div>\n</template>\n<style module>\n.block {\n  width: 100%;\n  display: flex;\n  gap: 4px;\n  justify-content: center;\n  height: 30px;\n  align-items: center;\n}\n.operand {\n  border-radius: 16px;\n  width: 64px;\n  height: 32px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-transform: uppercase;\n  font-weight: 600;\n\n  color: var(--txt-03);\n  border: 1px solid var(--color-div-grey);\n  background: transparent;\n  cursor: pointer;\n}\n.operand.active {\n  color: var(--txt-01);\n  background: #fff;\n  border: 1px solid var(--txt-01);\n}\n</style>\n"],"mappings":""}

package/dist/components/PlAdvancedFilter/OperandButton.style.js

@@ -0,0 +1,8 @@
+import './OperandButton.vue.css';var e = {
+	block: "_block_efv0d_2",
+	operand: "_operand_efv0d_10",
+	active: "_active_efv0d_25"
+};
+export { e as default };
+
+//# sourceMappingURL=OperandButton.style.js.map

package/dist/components/PlAdvancedFilter/OperandButton.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OperandButton.vue_vue_type_style_index_0_lang.module.js","names":[],"sources":["../../../src/components/PlAdvancedFilter/OperandButton.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { Operand } from \"./types\";\n\nconst props = defineProps<{\n  active: Operand;\n  disabled: boolean;\n  onSelect: (op: Operand) => void;\n}>();\n\nconst OPTIONS: Operand[] = [\"and\", \"or\"];\n</script>\n<template>\n  <div v-bind=\"$attrs\" :class=\"$style.block\">\n    <div\n      v-for=\"op in OPTIONS\"\n      :key=\"op\"\n      :class=\"[$style.operand, { [$style.active]: op === props.active && !props.disabled }]\"\n      @click=\"!props.disabled && props.onSelect(op)\"\n    >\n      {{ op }}\n    </div>\n  </div>\n</template>\n<style module>\n.block {\n  width: 100%;\n  display: flex;\n  gap: 4px;\n  justify-content: center;\n  height: 30px;\n  align-items: center;\n}\n.operand {\n  border-radius: 16px;\n  width: 64px;\n  height: 32px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-transform: uppercase;\n  font-weight: 600;\n\n  color: var(--txt-03);\n  border: 1px solid var(--color-div-grey);\n  background: transparent;\n  cursor: pointer;\n}\n.operand.active {\n  color: var(--txt-01);\n  background: #fff;\n  border: 1px solid var(--txt-01);\n}\n</style>\n"],"mappings":""}

package/dist/components/PlAdvancedFilter/OperandButton.vue.css

@@ -0,0 +1 @@
+._block_efv0d_2{justify-content:center;align-items:center;gap:4px;width:100%;height:30px;display:flex}._operand_efv0d_10{text-transform:uppercase;width:64px;height:32px;color:var(--txt-03);border:1px solid var(--color-div-grey);cursor:pointer;background:0 0;border-radius:16px;justify-content:center;align-items:center;font-weight:600;display:flex}._operand_efv0d_10._active_efv0d_25{color:var(--txt-01);border:1px solid var(--txt-01);background:#fff}

package/dist/components/PlAdvancedFilter/OperandButton.vue2.js

@@ -1,25 +1,20 @@
-import { defineComponent as r, createElementBlock as o, openBlock as s, mergeProps as c, Fragment as i, renderList as d, createElementVNode as p, normalizeClass as m, toDisplayString as u } from "vue";
-const y = ["onClick"], b = /* @__PURE__ */ r({
-  __name: "OperandButton",
-  props: {
-    active: {},
-    disabled: { type: Boolean },
-    onSelect: { type: Function }
-  },
-  setup(a) {
-    const e = a, l = ["and", "or"];
-    return (t, k) => (s(), o("div", c(t.$attrs, {
-      class: t.$style.block
-    }), [
-      (s(), o(i, null, d(l, (n) => p("div", {
-        key: n,
-        class: m([t.$style.operand, { [t.$style.active]: n === e.active && !e.disabled }]),
-        onClick: (v) => !e.disabled && e.onSelect(n)
-      }, u(n), 11, y)), 64))
-    ], 16));
-  }
+import { Fragment as e, createElementBlock as t, createElementVNode as n, defineComponent as r, mergeProps as i, normalizeClass as a, openBlock as o, renderList as s, toDisplayString as c } from "vue";
+var l = ["onClick"], u = /* @__PURE__ */ r({
+	__name: "OperandButton",
+	props: {
+		active: {},
+		disabled: { type: Boolean },
+		onSelect: { type: Function }
+	},
+	setup(r) {
+		let u = r, d = ["and", "or"];
+		return (r, f) => (o(), t("div", i(r.$attrs, { class: r.$style.block }), [(o(), t(e, null, s(d, (e) => n("div", {
+			key: e,
+			class: a([r.$style.operand, { [r.$style.active]: e === u.active && !u.disabled }]),
+			onClick: (t) => !u.disabled && u.onSelect(e)
+		}, c(e), 11, l)), 64))], 16));
+	}
 });
-export {
-  b as default
-};
-//# sourceMappingURL=OperandButton.vue2.js.map
+export { u as default };
+
+//# sourceMappingURL=OperandButton.vue2.js.map

package/dist/components/PlAdvancedFilter/OperandButton.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"OperandButton.vue2.js","sources":["../../../src/components/PlAdvancedFilter/OperandButton.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { Operand } from \"./types\";\n\nconst props = defineProps<{\n  active: Operand;\n  disabled: boolean;\n  onSelect: (op: Operand) => void;\n}>();\n\nconst OPTIONS: Operand[] = [\"and\", \"or\"];\n</script>\n<template>\n  <div v-bind=\"$attrs\" :class=\"$style.block\">\n    <div\n      v-for=\"op in OPTIONS\"\n      :key=\"op\"\n      :class=\"[$style.operand, { [$style.active]: op === props.active && !props.disabled }]\"\n      @click=\"!props.disabled && props.onSelect(op)\"\n    >\n      {{ op }}\n    </div>\n  </div>\n</template>\n<style module>\n.block {\n  width: 100%;\n  display: flex;\n  gap: 4px;\n  justify-content: center;\n  height: 30px;\n  align-items: center;\n}\n.operand {\n  border-radius: 16px;\n  width: 64px;\n  height: 32px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-transform: uppercase;\n  font-weight: 600;\n\n  color: var(--txt-03);\n  border: 1px solid var(--color-div-grey);\n  background: transparent;\n  cursor: pointer;\n}\n.operand.active {\n  color: var(--txt-01);\n  background: #fff;\n  border: 1px solid var(--txt-01);\n}\n</style>\n"],"names":["props","__props","OPTIONS","_createElementBlock","_mergeProps","_ctx","$style","_Fragment","_renderList","op","_createElementVNode","$event","_hoisted_1"],"mappings":";;;;;;;;;AAGA,UAAMA,IAAQC,GAMRC,IAAqB,CAAC,OAAO,IAAI;2BAGrCC,EASM,OATNC,EASMC,EAAA,QATa;AAAA,MAAG,OAAOC,EAAAA,OAAO;AAAA,IAAA;YAClCH,EAOMI,GAAA,MAAAC,EANSN,GAAO,CAAbO,MADTC,EAOM,OAAA;AAAA,QALH,KAAKD;AAAA,QACL,UAAQH,EAAAA,OAAO,SAAO,EAAA,CAAKA,SAAO,MAAM,GAAGG,MAAOT,EAAM,UAAM,CAAKA,EAAM,SAAA,CAAQ,CAAA;AAAA,QACjF,SAAK,CAAAW,MAAA,CAAGX,EAAM,YAAYA,EAAM,SAASS,CAAE;AAAA,MAAA,KAEzCA,CAAE,GAAA,IAAAG,CAAA;;;;"}
+{"version":3,"file":"OperandButton.vue_vue_type_script_setup_true_lang.js","names":["$attrs","$style"],"sources":["../../../src/components/PlAdvancedFilter/OperandButton.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { Operand } from \"./types\";\n\nconst props = defineProps<{\n  active: Operand;\n  disabled: boolean;\n  onSelect: (op: Operand) => void;\n}>();\n\nconst OPTIONS: Operand[] = [\"and\", \"or\"];\n</script>\n<template>\n  <div v-bind=\"$attrs\" :class=\"$style.block\">\n    <div\n      v-for=\"op in OPTIONS\"\n      :key=\"op\"\n      :class=\"[$style.operand, { [$style.active]: op === props.active && !props.disabled }]\"\n      @click=\"!props.disabled && props.onSelect(op)\"\n    >\n      {{ op }}\n    </div>\n  </div>\n</template>\n<style module>\n.block {\n  width: 100%;\n  display: flex;\n  gap: 4px;\n  justify-content: center;\n  height: 30px;\n  align-items: center;\n}\n.operand {\n  border-radius: 16px;\n  width: 64px;\n  height: 32px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  text-transform: uppercase;\n  font-weight: 600;\n\n  color: var(--txt-03);\n  border: 1px solid var(--color-div-grey);\n  background: transparent;\n  cursor: pointer;\n}\n.operand.active {\n  color: var(--txt-01);\n  background: #fff;\n  border: 1px solid var(--txt-01);\n}\n</style>\n"],"mappings":";;;;;;;;;EAGA,IAAM,IAAQ,GAMR,IAAqB,CAAC,OAAO,KAAK;yBAGtC,EASM,OATN,EAAaA,EASP,QATa,EAAG,OAAOC,EAAAA,OAAO,OAAA,CAAA,EAAA,EAAA,GAAA,EAClC,EAOM,GAAA,MAAA,EANS,IAAN,MADT,EAOM,OAAA;GALH,KAAK;GACL,OAAK,EAAA,CAAGA,EAAAA,OAAO,SAAO,GAAKA,EAAAA,OAAO,SAAS,MAAO,EAAM,UAAM,CAAK,EAAM,UAAQ,CAAA,CAAA;GACjF,UAAK,MAAA,CAAG,EAAM,YAAY,EAAM,SAAS,EAAE;OAEzC,EAAE,EAAA,IAAA,EAAA"}

package/dist/components/PlAdvancedFilter/PlAdvancedFilter.js

@@ -0,0 +1,7 @@
+import e from "../../_virtual/_plugin-vue_export-helper.js";
+import t from "./PlAdvancedFilter.vue2.js";
+import n from "./PlAdvancedFilter.style.js";
+var r = /* @__PURE__ */ e(t, [["__cssModules", { $style: n }]]);
+export { r as default };
+
+//# sourceMappingURL=PlAdvancedFilter.js.map

package/dist/components/PlAdvancedFilter/PlAdvancedFilter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlAdvancedFilter.js","names":[],"sources":["../../../src/components/PlAdvancedFilter/PlAdvancedFilter.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends RootFilter\">\nimport { PlBtnSecondary, PlCheckbox, PlElementList } from \"@milaboratories/uikit\";\nimport type { ListOptionBase } from \"@platforma-sdk/model\";\nimport { computed, toRaw } from \"vue\";\nimport FilterEditor from \"./FilterEditor.vue\";\nimport OperandButton from \"./OperandButton.vue\";\nimport { DEFAULT_FILTER_TYPE, DEFAULT_FILTERS, SUPPORTED_FILTER_TYPES } from \"./constants\";\nimport type {\n  CommonFilter,\n  EditableFilter,\n  NodeFilter,\n  PlAdvancedFilterColumnId,\n  RootFilter,\n  SourceOptionInfo,\n} from \"./types\";\nimport { createNewGroup, getNewId, isValidColumnId } from \"./utils\";\n\nconst model = defineModel<T>(\"filters\", { required: true });\n\nconst props = withDefaults(\n  defineProps<{\n    /** List of ids of sources (columns, axes) that can be selected in filters */\n    items: SourceOptionInfo[];\n    /** List of supported filter types */\n    supportedFilters?: typeof SUPPORTED_FILTER_TYPES;\n    /** If true - new filter can be added by droppind element into filter group; else new column is added by button click */\n    enableDnd?: boolean;\n    /** If true - \"Add group\" button is shown below the filter groups */\n    enableAddGroupButton?: boolean;\n    /** Loading function for unique values for Equal/InSet filters and fixed axes options. */\n    getSuggestOptions: (params: {\n      columnId: PlAdvancedFilterColumnId;\n      axisIdx?: number;\n      searchStr: string;\n      searchType: \"value\" | \"label\";\n    }) => ListOptionBase<string | number>[] | Promise<ListOptionBase<string | number>[]>;\n  }>(),\n  {\n    supportedFilters: () => SUPPORTED_FILTER_TYPES,\n    getSuggestModel: undefined,\n\n    enableDnd: false,\n    enableAddGroupButton: false,\n  },\n);\n\nconst firstColumnId = computed(() => props.items[0]?.id);\nconst emptyGroup: NodeFilter[] = [\n  {\n    id: -1,\n    type: \"and\",\n    filters: [],\n    isExpanded: true,\n  },\n];\n\nfunction getRootGroups() {\n  if (model.value.type !== \"or\" && model.value.type !== \"and\") {\n    throw new Error('Invalid model structure, expected root to be \"or\" or \"and\" group');\n  }\n  return model.value.filters;\n}\n\nfunction getRootGroup(idx: number): NodeFilter {\n  const groups = getRootGroups();\n  const group = groups[idx];\n  if (group.type !== \"and\" && group.type !== \"or\" && group.type !== \"not\") {\n    throw new Error('Invalid group structure, expected \"and\", \"or\" or \"not\" group');\n  }\n  return group;\n}\n\nfunction getRootGroupContent(idx: number): Exclude<NodeFilter, { type: \"not\" }> {\n  const group = getRootGroup(idx);\n\n  if (group.type !== \"not\") {\n    return group;\n  }\n\n  if (group.filter.type !== \"and\" && group.filter.type !== \"or\") {\n    throw new Error('Invalid group structure, expected \"and\" or \"or\" group inside \"not\"');\n  }\n\n  return group.filter;\n}\n\nfunction addColumnToGroup(groupIdx: number, selectedSourceId: PlAdvancedFilterColumnId) {\n  const group = getRootGroupContent(groupIdx);\n\n  group.filters.push({\n    ...DEFAULT_FILTERS[DEFAULT_FILTER_TYPE],\n    column: selectedSourceId,\n    id: getNewId(),\n    isExpanded: true,\n  } as CommonFilter);\n}\n\nfunction removeFilterFromGroup(groupIdx: number, filterIdx: number) {\n  const group = getRootGroupContent(groupIdx);\n\n  if (group.filters.length === 1 && filterIdx === 0) {\n    removeGroup(groupIdx);\n  } else {\n    group.filters.splice(filterIdx, 1);\n  }\n}\nfunction inverseRootNode(groupIdx: number) {\n  const groups = getRootGroups();\n  const group = groups[groupIdx];\n  if (group.type === \"not\") {\n    if (group.filter.type !== \"and\" && group.filter.type !== \"or\") {\n      throw new Error('Invalid group structure, expected \"and\" or \"or\" group inside \"not\"');\n    }\n    groups[groupIdx] = group.filter;\n  } else {\n    const type = groups[groupIdx].type;\n    if (type !== \"and\" && type !== \"or\" && type !== \"not\") {\n      throw new Error('Invalid group structure, expected \"and\", \"or\" or \"not\" group');\n    }\n\n    groups[groupIdx] = {\n      id: getNewId(),\n      isExpanded: true,\n      type: \"not\",\n      filter: groups[groupIdx],\n    };\n  }\n}\n\nfunction getNotContent<T extends CommonFilter>(item: T): Exclude<T, { type: \"not\" }> {\n  return item.type === \"not\"\n    ? (item.filter as Exclude<T, { type: \"not\" }>)\n    : (item as Exclude<T, { type: \"not\" }>);\n}\n\nfunction removeGroup(groupIdx: number) {\n  const groups = getRootGroups();\n  groups.splice(groupIdx, 1);\n}\nfunction addGroup(selectedSourceId: PlAdvancedFilterColumnId) {\n  const newGroup = createNewGroup(selectedSourceId);\n  const groups = getRootGroups();\n  groups.push(newGroup);\n}\n\nfunction handleDropToExistingGroup(groupIdx: number, event: DragEvent) {\n  const dataTransfer = event.dataTransfer;\n  if (dataTransfer?.getData(\"text/plain\")) {\n    const draggedId = dataTransfer.getData(\"text/plain\");\n    if (isValidColumnId(draggedId)) {\n      addColumnToGroup(groupIdx, draggedId);\n    }\n  }\n}\nfunction handleDropToNewGroup(event: DragEvent) {\n  const dataTransfer = event.dataTransfer;\n  if (dataTransfer?.getData(\"text/plain\")) {\n    const draggedId = dataTransfer.getData(\"text/plain\");\n    if (isValidColumnId(draggedId)) {\n      addGroup(draggedId);\n    }\n  }\n}\nfunction dragOver(event: DragEvent) {\n  event.preventDefault();\n}\n\nfunction validateFilter<T extends CommonFilter>(item: T): EditableFilter {\n  if (item.type === \"and\" || item.type === \"or\" || item.type === \"not\") {\n    throw new Error(\"Invalid filter structure, expected leaf filter\");\n  }\n\n  return item as EditableFilter;\n}\n\nfunction updateFilter(filters: CommonFilter[], idx: number, updatedFilter: EditableFilter) {\n  filters[idx] = toRaw(updatedFilter as CommonFilter);\n}\n</script>\n<template>\n  <div>\n    <PlElementList\n      v-model:items=\"model.filters\"\n      :get-item-key=\"(filter) => filter.id\"\n      :item-class=\"$style.filterGroup\"\n      :item-class-content=\"$style.filterGroupContent\"\n      :item-class-title=\"$style.filterGroupTitle\"\n      :is-expanded=\"(filter) => filter.isExpanded === true\"\n      :on-expand=\"\n        (group) => {\n          group.isExpanded = !group.isExpanded;\n        }\n      \"\n      :disableDragging=\"false\"\n      :disableRemoving=\"false\"\n      :disableToggling=\"true\"\n      :disablePinning=\"true\"\n    >\n      <template #item-title> Filter group </template>\n      <template #item-content=\"{ item, index }\">\n        <div\n          :class=\"$style.groupContent\"\n          dropzone=\"true\"\n          @drop=\"(event) => handleDropToExistingGroup(index, event)\"\n          @dragover=\"dragOver\"\n        >\n          <PlCheckbox\n            :model-value=\"item.type === 'not'\"\n            :class=\"$style.notCheckbox\"\n            @update:model-value=\"inverseRootNode(index)\"\n          >\n            Filter Out\n          </PlCheckbox>\n          <template v-for=\"(_, filterIdx) in getNotContent(item).filters\" :key=\"filterIdx\">\n            <FilterEditor\n              :filter=\"validateFilter(getNotContent(item).filters[filterIdx])\"\n              :operand=\"getNotContent(item).type\"\n              :column-options=\"items\"\n              :supported-filters=\"props.supportedFilters\"\n              :get-suggest-options=\"props.getSuggestOptions\"\n              :enable-dnd=\"Boolean(props.enableDnd)\"\n              :is-last=\"filterIdx === getNotContent(item).filters.length - 1\"\n              :on-change-operand=\"(v) => (getNotContent(item).type = v)\"\n              :on-delete=\"() => removeFilterFromGroup(index, filterIdx)\"\n              @update:filter=\"\n                (value) => updateFilter(getNotContent(item).filters, filterIdx, value)\n              \"\n            />\n          </template>\n          <div v-if=\"props.enableDnd\" :class=\"$style.dropzone\">\n            <div>Drop dimensions here</div>\n          </div>\n          <PlBtnSecondary v-else icon=\"add\" @click=\"addColumnToGroup(index, firstColumnId)\">\n            Add filter\n          </PlBtnSecondary>\n        </div>\n      </template>\n      <template #item-after=\"{ index }\">\n        <OperandButton\n          v-if=\"props.enableAddGroupButton || index < getRootGroups().length - 1\"\n          :class=\"$style.buttonWrapper\"\n          :active=\"model.type\"\n          :disabled=\"index === getRootGroups().length - 1\"\n          :on-select=\"(v) => (model.type = v)\"\n        />\n      </template>\n    </PlElementList>\n\n    <!-- Last group - always empty, just for adding new groups -->\n    <PlElementList\n      v-if=\"props.enableAddGroupButton\"\n      :items=\"emptyGroup\"\n      :get-item-key=\"(group) => group.id\"\n      :item-class=\"$style.filterGroup\"\n      :item-class-content=\"$style.filterGroupContent\"\n      :item-class-title=\"$style.filterGroupTitle\"\n      :is-expanded=\"() => true\"\n      :disableDragging=\"true\"\n      :disableRemoving=\"true\"\n      :disableToggling=\"true\"\n      :disablePinning=\"true\"\n      dropzone=\"true\"\n      @drop=\"handleDropToNewGroup\"\n      @dragover=\"dragOver\"\n    >\n      <template #item-title>Filter group</template>\n      <template #item-content>\n        <div v-if=\"enableDnd\" :class=\"$style.dropzone\">\n          <div>Drop dimensions here</div>\n        </div>\n        <slot v-else name=\"add-group-buttons\">\n          <PlBtnSecondary icon=\"add\" @click=\"addGroup(firstColumnId)\"> Add filter </PlBtnSecondary>\n        </slot>\n      </template>\n    </PlElementList>\n  </div>\n</template>\n<style module>\n.filterGroup {\n  background: var(--bg-base-light);\n}\n.filterGroup:hover {\n  background: rgba(99, 224, 36, 0.12);\n}\n.filterGroupTitle {\n  background: none;\n}\n.filterGroupContent {\n  padding: 4px 24px 24px 24px;\n}\n.groupContent {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n.notCheckbox {\n  margin: 4px 0;\n}\n.dropzone {\n  border-radius: 6px;\n  border: 1.5px dashed var(--color-div-grey);\n  color: var(--txt-03);\n  font-family: Manrope;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 500;\n  height: 40px;\n  cursor: default;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.buttonWrapper {\n  margin-top: 8px;\n  height: 56px;\n  display: flex;\n  align-items: center;\n}\n:global(.sortable-chosen) .buttonWrapper {\n  visibility: hidden;\n}\n</style>\n"],"mappings":""}

package/dist/components/PlAdvancedFilter/PlAdvancedFilter.style.js

@@ -0,0 +1,12 @@
+import './PlAdvancedFilter.vue.css';var e = {
+	filterGroup: "_filterGroup_hlpl5_2",
+	filterGroupTitle: "_filterGroupTitle_hlpl5_8",
+	filterGroupContent: "_filterGroupContent_hlpl5_11",
+	groupContent: "_groupContent_hlpl5_14",
+	notCheckbox: "_notCheckbox_hlpl5_19",
+	dropzone: "_dropzone_hlpl5_22",
+	buttonWrapper: "_buttonWrapper_hlpl5_36"
+};
+export { e as default };
+
+//# sourceMappingURL=PlAdvancedFilter.style.js.map

package/dist/components/PlAdvancedFilter/PlAdvancedFilter.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlAdvancedFilter.vue_vue_type_style_index_0_lang.module.js","names":[],"sources":["../../../src/components/PlAdvancedFilter/PlAdvancedFilter.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends RootFilter\">\nimport { PlBtnSecondary, PlCheckbox, PlElementList } from \"@milaboratories/uikit\";\nimport type { ListOptionBase } from \"@platforma-sdk/model\";\nimport { computed, toRaw } from \"vue\";\nimport FilterEditor from \"./FilterEditor.vue\";\nimport OperandButton from \"./OperandButton.vue\";\nimport { DEFAULT_FILTER_TYPE, DEFAULT_FILTERS, SUPPORTED_FILTER_TYPES } from \"./constants\";\nimport type {\n  CommonFilter,\n  EditableFilter,\n  NodeFilter,\n  PlAdvancedFilterColumnId,\n  RootFilter,\n  SourceOptionInfo,\n} from \"./types\";\nimport { createNewGroup, getNewId, isValidColumnId } from \"./utils\";\n\nconst model = defineModel<T>(\"filters\", { required: true });\n\nconst props = withDefaults(\n  defineProps<{\n    /** List of ids of sources (columns, axes) that can be selected in filters */\n    items: SourceOptionInfo[];\n    /** List of supported filter types */\n    supportedFilters?: typeof SUPPORTED_FILTER_TYPES;\n    /** If true - new filter can be added by droppind element into filter group; else new column is added by button click */\n    enableDnd?: boolean;\n    /** If true - \"Add group\" button is shown below the filter groups */\n    enableAddGroupButton?: boolean;\n    /** Loading function for unique values for Equal/InSet filters and fixed axes options. */\n    getSuggestOptions: (params: {\n      columnId: PlAdvancedFilterColumnId;\n      axisIdx?: number;\n      searchStr: string;\n      searchType: \"value\" | \"label\";\n    }) => ListOptionBase<string | number>[] | Promise<ListOptionBase<string | number>[]>;\n  }>(),\n  {\n    supportedFilters: () => SUPPORTED_FILTER_TYPES,\n    getSuggestModel: undefined,\n\n    enableDnd: false,\n    enableAddGroupButton: false,\n  },\n);\n\nconst firstColumnId = computed(() => props.items[0]?.id);\nconst emptyGroup: NodeFilter[] = [\n  {\n    id: -1,\n    type: \"and\",\n    filters: [],\n    isExpanded: true,\n  },\n];\n\nfunction getRootGroups() {\n  if (model.value.type !== \"or\" && model.value.type !== \"and\") {\n    throw new Error('Invalid model structure, expected root to be \"or\" or \"and\" group');\n  }\n  return model.value.filters;\n}\n\nfunction getRootGroup(idx: number): NodeFilter {\n  const groups = getRootGroups();\n  const group = groups[idx];\n  if (group.type !== \"and\" && group.type !== \"or\" && group.type !== \"not\") {\n    throw new Error('Invalid group structure, expected \"and\", \"or\" or \"not\" group');\n  }\n  return group;\n}\n\nfunction getRootGroupContent(idx: number): Exclude<NodeFilter, { type: \"not\" }> {\n  const group = getRootGroup(idx);\n\n  if (group.type !== \"not\") {\n    return group;\n  }\n\n  if (group.filter.type !== \"and\" && group.filter.type !== \"or\") {\n    throw new Error('Invalid group structure, expected \"and\" or \"or\" group inside \"not\"');\n  }\n\n  return group.filter;\n}\n\nfunction addColumnToGroup(groupIdx: number, selectedSourceId: PlAdvancedFilterColumnId) {\n  const group = getRootGroupContent(groupIdx);\n\n  group.filters.push({\n    ...DEFAULT_FILTERS[DEFAULT_FILTER_TYPE],\n    column: selectedSourceId,\n    id: getNewId(),\n    isExpanded: true,\n  } as CommonFilter);\n}\n\nfunction removeFilterFromGroup(groupIdx: number, filterIdx: number) {\n  const group = getRootGroupContent(groupIdx);\n\n  if (group.filters.length === 1 && filterIdx === 0) {\n    removeGroup(groupIdx);\n  } else {\n    group.filters.splice(filterIdx, 1);\n  }\n}\nfunction inverseRootNode(groupIdx: number) {\n  const groups = getRootGroups();\n  const group = groups[groupIdx];\n  if (group.type === \"not\") {\n    if (group.filter.type !== \"and\" && group.filter.type !== \"or\") {\n      throw new Error('Invalid group structure, expected \"and\" or \"or\" group inside \"not\"');\n    }\n    groups[groupIdx] = group.filter;\n  } else {\n    const type = groups[groupIdx].type;\n    if (type !== \"and\" && type !== \"or\" && type !== \"not\") {\n      throw new Error('Invalid group structure, expected \"and\", \"or\" or \"not\" group');\n    }\n\n    groups[groupIdx] = {\n      id: getNewId(),\n      isExpanded: true,\n      type: \"not\",\n      filter: groups[groupIdx],\n    };\n  }\n}\n\nfunction getNotContent<T extends CommonFilter>(item: T): Exclude<T, { type: \"not\" }> {\n  return item.type === \"not\"\n    ? (item.filter as Exclude<T, { type: \"not\" }>)\n    : (item as Exclude<T, { type: \"not\" }>);\n}\n\nfunction removeGroup(groupIdx: number) {\n  const groups = getRootGroups();\n  groups.splice(groupIdx, 1);\n}\nfunction addGroup(selectedSourceId: PlAdvancedFilterColumnId) {\n  const newGroup = createNewGroup(selectedSourceId);\n  const groups = getRootGroups();\n  groups.push(newGroup);\n}\n\nfunction handleDropToExistingGroup(groupIdx: number, event: DragEvent) {\n  const dataTransfer = event.dataTransfer;\n  if (dataTransfer?.getData(\"text/plain\")) {\n    const draggedId = dataTransfer.getData(\"text/plain\");\n    if (isValidColumnId(draggedId)) {\n      addColumnToGroup(groupIdx, draggedId);\n    }\n  }\n}\nfunction handleDropToNewGroup(event: DragEvent) {\n  const dataTransfer = event.dataTransfer;\n  if (dataTransfer?.getData(\"text/plain\")) {\n    const draggedId = dataTransfer.getData(\"text/plain\");\n    if (isValidColumnId(draggedId)) {\n      addGroup(draggedId);\n    }\n  }\n}\nfunction dragOver(event: DragEvent) {\n  event.preventDefault();\n}\n\nfunction validateFilter<T extends CommonFilter>(item: T): EditableFilter {\n  if (item.type === \"and\" || item.type === \"or\" || item.type === \"not\") {\n    throw new Error(\"Invalid filter structure, expected leaf filter\");\n  }\n\n  return item as EditableFilter;\n}\n\nfunction updateFilter(filters: CommonFilter[], idx: number, updatedFilter: EditableFilter) {\n  filters[idx] = toRaw(updatedFilter as CommonFilter);\n}\n</script>\n<template>\n  <div>\n    <PlElementList\n      v-model:items=\"model.filters\"\n      :get-item-key=\"(filter) => filter.id\"\n      :item-class=\"$style.filterGroup\"\n      :item-class-content=\"$style.filterGroupContent\"\n      :item-class-title=\"$style.filterGroupTitle\"\n      :is-expanded=\"(filter) => filter.isExpanded === true\"\n      :on-expand=\"\n        (group) => {\n          group.isExpanded = !group.isExpanded;\n        }\n      \"\n      :disableDragging=\"false\"\n      :disableRemoving=\"false\"\n      :disableToggling=\"true\"\n      :disablePinning=\"true\"\n    >\n      <template #item-title> Filter group </template>\n      <template #item-content=\"{ item, index }\">\n        <div\n          :class=\"$style.groupContent\"\n          dropzone=\"true\"\n          @drop=\"(event) => handleDropToExistingGroup(index, event)\"\n          @dragover=\"dragOver\"\n        >\n          <PlCheckbox\n            :model-value=\"item.type === 'not'\"\n            :class=\"$style.notCheckbox\"\n            @update:model-value=\"inverseRootNode(index)\"\n          >\n            Filter Out\n          </PlCheckbox>\n          <template v-for=\"(_, filterIdx) in getNotContent(item).filters\" :key=\"filterIdx\">\n            <FilterEditor\n              :filter=\"validateFilter(getNotContent(item).filters[filterIdx])\"\n              :operand=\"getNotContent(item).type\"\n              :column-options=\"items\"\n              :supported-filters=\"props.supportedFilters\"\n              :get-suggest-options=\"props.getSuggestOptions\"\n              :enable-dnd=\"Boolean(props.enableDnd)\"\n              :is-last=\"filterIdx === getNotContent(item).filters.length - 1\"\n              :on-change-operand=\"(v) => (getNotContent(item).type = v)\"\n              :on-delete=\"() => removeFilterFromGroup(index, filterIdx)\"\n              @update:filter=\"\n                (value) => updateFilter(getNotContent(item).filters, filterIdx, value)\n              \"\n            />\n          </template>\n          <div v-if=\"props.enableDnd\" :class=\"$style.dropzone\">\n            <div>Drop dimensions here</div>\n          </div>\n          <PlBtnSecondary v-else icon=\"add\" @click=\"addColumnToGroup(index, firstColumnId)\">\n            Add filter\n          </PlBtnSecondary>\n        </div>\n      </template>\n      <template #item-after=\"{ index }\">\n        <OperandButton\n          v-if=\"props.enableAddGroupButton || index < getRootGroups().length - 1\"\n          :class=\"$style.buttonWrapper\"\n          :active=\"model.type\"\n          :disabled=\"index === getRootGroups().length - 1\"\n          :on-select=\"(v) => (model.type = v)\"\n        />\n      </template>\n    </PlElementList>\n\n    <!-- Last group - always empty, just for adding new groups -->\n    <PlElementList\n      v-if=\"props.enableAddGroupButton\"\n      :items=\"emptyGroup\"\n      :get-item-key=\"(group) => group.id\"\n      :item-class=\"$style.filterGroup\"\n      :item-class-content=\"$style.filterGroupContent\"\n      :item-class-title=\"$style.filterGroupTitle\"\n      :is-expanded=\"() => true\"\n      :disableDragging=\"true\"\n      :disableRemoving=\"true\"\n      :disableToggling=\"true\"\n      :disablePinning=\"true\"\n      dropzone=\"true\"\n      @drop=\"handleDropToNewGroup\"\n      @dragover=\"dragOver\"\n    >\n      <template #item-title>Filter group</template>\n      <template #item-content>\n        <div v-if=\"enableDnd\" :class=\"$style.dropzone\">\n          <div>Drop dimensions here</div>\n        </div>\n        <slot v-else name=\"add-group-buttons\">\n          <PlBtnSecondary icon=\"add\" @click=\"addGroup(firstColumnId)\"> Add filter </PlBtnSecondary>\n        </slot>\n      </template>\n    </PlElementList>\n  </div>\n</template>\n<style module>\n.filterGroup {\n  background: var(--bg-base-light);\n}\n.filterGroup:hover {\n  background: rgba(99, 224, 36, 0.12);\n}\n.filterGroupTitle {\n  background: none;\n}\n.filterGroupContent {\n  padding: 4px 24px 24px 24px;\n}\n.groupContent {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n.notCheckbox {\n  margin: 4px 0;\n}\n.dropzone {\n  border-radius: 6px;\n  border: 1.5px dashed var(--color-div-grey);\n  color: var(--txt-03);\n  font-family: Manrope;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 500;\n  height: 40px;\n  cursor: default;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.buttonWrapper {\n  margin-top: 8px;\n  height: 56px;\n  display: flex;\n  align-items: center;\n}\n:global(.sortable-chosen) .buttonWrapper {\n  visibility: hidden;\n}\n</style>\n"],"mappings":""}

package/dist/components/PlAdvancedFilter/PlAdvancedFilter.vue.css

@@ -0,0 +1 @@
+._filterGroup_hlpl5_2{background:var(--bg-base-light)}._filterGroup_hlpl5_2:hover{background:#63e0241f}._filterGroupTitle_hlpl5_8{background:0 0}._filterGroupContent_hlpl5_11{padding:4px 24px 24px}._groupContent_hlpl5_14{flex-direction:column;gap:12px;display:flex}._notCheckbox_hlpl5_19{margin:4px 0}._dropzone_hlpl5_22{border:1.5px dashed var(--color-div-grey);color:var(--txt-03);cursor:default;border-radius:6px;justify-content:center;align-items:center;height:40px;font-family:Manrope;font-size:14px;font-style:normal;font-weight:500;display:flex}._buttonWrapper_hlpl5_36{align-items:center;height:56px;margin-top:8px;display:flex}.sortable-chosen ._buttonWrapper_hlpl5_36{visibility:hidden}

package/dist/components/PlAdvancedFilter/PlAdvancedFilter.vue.d.ts

@@ -29,9 +29,7 @@ declare const _default: <T extends RootFilter>(__VLS_props: NonNullable<Awaited<
         'add-group-buttons'?(_: {}): any;
     };
     emit: (evt: "update:filters", value: T) => void;
-}>) => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
-    [key: string]: any;
-}> & {
+}>) => import('vue').VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };
 export default _default;

package/dist/components/PlAdvancedFilter/PlAdvancedFilter.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PlAdvancedFilter.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PlAdvancedFilter/PlAdvancedFilter.vue"],"names":[],"mappings":"AAqUA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAI3D,OAAO,EAAwC,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAC3F,OAAO,KAAK,EAIV,wBAAwB,EACxB,UAAU,EACV,gBAAgB,EACjB,MAAM,SAAS,CAAC;yBAGA,CAAC,SAAS,UAAU,eACvB,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,cAClD,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,iBAC5F,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC;WAsf1D,mBAAmB,CAAC;;;iBAjUjB,CAAC;;QAhLR,6EAA6E;eACtE,gBAAgB,EAAE;QACzB,qCAAqC;2BAClB,OAAO,sBAAsB;QAChD,wHAAwH;oBAC5G,OAAO;QACnB,oEAAoE;+BAC7C,OAAO;QAC9B,yFAAyF;2BACtE,CAAC,MAAM,EAAE;YAC1B,QAAQ,EAAE,wBAAwB,CAAC;YACnC,OAAO,CAAC,EAAE,MAAM,CAAC;YACjB,SAAS,EAAE,MAAM,CAAC;YAClB,UAAU,EAAE,OAAO,GAAG,OAAO,CAAC;SAC/B,KAAK,cAAc,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,GAAG,OAAO,CAAC,cAAc,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;oBAmeM,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB,CAAC,EAAE,CAAC,GAAG,IAAI;WAClD,GAAG;;qCAhD+B,GAAG;;;;;;YAqDD,OAAO,CAAC,OAAO,WAAW,CAAC;;AAhgBvE,wBAggB4E;AAc5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}
+{"version":3,"file":"PlAdvancedFilter.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PlAdvancedFilter/PlAdvancedFilter.vue"],"names":[],"mappings":"AAqUA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAI3D,OAAO,EAAwC,sBAAsB,EAAE,MAAM,aAAa,CAAC;AAC3F,OAAO,KAAK,EAIV,wBAAwB,EACxB,UAAU,EACV,gBAAgB,EACjB,MAAM,SAAS,CAAC;yBAGA,CAAC,SAAS,UAAU,EACpC,aAAa,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,EAC9D,YAAY,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,EAC3G,eAAe,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,EACjE;WAqfO,mBAAmB,CAAC;;;iBAjUjB,CAAC;;QAhLR,6EAA6E;eACtE,gBAAgB,EAAE;QACzB,qCAAqC;2BAClB,OAAO,sBAAsB;QAChD,wHAAwH;oBAC5G,OAAO;QACnB,oEAAoE;+BAC7C,OAAO;QAC9B,yFAAyF;2BACtE,CAAC,MAAM,EAAE;YAC1B,QAAQ,EAAE,wBAAwB,CAAC;YACnC,OAAO,CAAC,EAAE,MAAM,CAAC;YACjB,SAAS,EAAE,MAAM,CAAC;YAClB,UAAU,EAAE,OAAO,GAAG,OAAO,CAAC;SAC/B,KAAK,cAAc,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,GAAG,OAAO,CAAC,cAAc,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;oBAmeM,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB,CAAC,EAAE,CAAC,GAAG,IAAI;WAClD,GAAG;;qCAhD+B,GAAG;;;EAoDzC,KACQ,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,OAAO,CAAC,OAAO,WAAW,CAAC,CAAA;CAAE;AAhgBzE,wBAggB4E;AAc5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}