@vuu-ui/vuu-filters 0.0.26

package/cjs/filter-input/useFilterSuggestionProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFilterSuggestionProvider.js","sources":["../../src/filter-input/useFilterSuggestionProvider.ts"],"sourcesContent":["import {\n  asNameSuggestion,\n  booleanJoinSuggestions,\n  Completion,\n  getNamePrompt,\n  numericOperators,\n  stringOperators,\n  toSuggestions,\n} from \"@vuu-ui/vuu-codemirror\";\nimport {\n  getTypeaheadParams,\n  useTypeaheadSuggestions,\n} from \"@vuu-ui/vuu-data-react\";\nimport type { SuggestionFetcher } from \"@vuu-ui/vuu-data-types\";\nimport type { Filter } from \"@vuu-ui/vuu-filter-types\";\nimport type { VuuTable } from \"@vuu-ui/vuu-protocol-types\";\nimport { ColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { useCallback, useRef } from \"react\";\nimport { filterInfo } from \"./filterInfo\";\nimport {\n  IFilterSuggestionProvider,\n  SuggestionType,\n} from \"./useCodeMirrorEditor\";\nimport { ApplyCompletion } from \"./useFilterAutoComplete\";\n\nconst NO_NAMED_FILTERS = [] as Completion[];\nconst NONE = {};\n\nconst saveAsTab = (onSubmit: ApplyCompletion) => [\n  {\n    label: \"Press ENTER to create TAB\",\n    apply: () => onSubmit(\"tab\"),\n    boost: 6,\n  },\n];\n\nconst makeSaveOrExtendSuggestions = (\n  onSubmit: ApplyCompletion,\n  existingFilter?: Filter,\n  withJoinSuggestions = true\n) => {\n  const result = existingFilter\n    ? ([\n        {\n          label: \"REPLACE existing filter\",\n          apply: () => onSubmit(\"replace\"),\n          boost: 8,\n        },\n        {\n          label: \"AND existing filter\",\n          apply: () => onSubmit(\"and\"),\n          boost: 7,\n        },\n        {\n          label: \"OR existing filter\",\n          apply: () => onSubmit(\"or\"),\n          boost: 7,\n        },\n      ] as Completion[])\n    : ([\n        {\n          label: \"Press ENTER to submit\",\n          apply: () => onSubmit(),\n          boost: 6,\n        },\n      ] as Completion[]);\n\n  return withJoinSuggestions\n    ? result.concat(booleanJoinSuggestions).concat(asNameSuggestion)\n    : result;\n};\n\nconst promptToSaveOrExtend = (\n  onSubmit: ApplyCompletion,\n  existingFilter?: Filter\n) => makeSaveOrExtendSuggestions(onSubmit, existingFilter, true);\n\nconst promptToSave = (onSubmit: ApplyCompletion) =>\n  makeSaveOrExtendSuggestions(onSubmit, undefined);\n\nconst getSaveSuggestions = ({\n  existingFilter,\n  filterName,\n  onSubmit,\n  saveOptions,\n}: {\n  existingFilter?: Filter;\n  filterName?: string;\n  onSubmit: () => void;\n  saveOptions: FilterSaveOptions;\n}) => {\n  const includeTabSuggestion = filterName && saveOptions.allowSaveAsTab;\n  const result = existingFilter\n    ? promptToSaveOrExtend(onSubmit, existingFilter)\n    : promptToSave(onSubmit);\n\n  if (includeTabSuggestion) {\n    return result.concat(saveAsTab(onSubmit));\n  } else {\n    return result;\n  }\n};\n\nconst suggestColumns = (columns: ColumnDescriptor[]) =>\n  columns.map((column) => ({\n    boost: 5,\n    label: column.name,\n  }));\n\nconst suggestNamedFilters = (namedFilters?: Map<string, string>) =>\n  namedFilters\n    ? (Array.from(namedFilters.entries()).map(([filterName, filterQuery]) => ({\n        info: () => filterInfo(filterName, filterQuery),\n        label: filterName,\n        type: \"filter\",\n      })) as Completion[])\n    : NO_NAMED_FILTERS;\n\nconst doneCommand: Completion = {\n  label: \"Done\",\n  apply: \"] \",\n  type: \"keyword\",\n  boost: 10,\n};\n\nconst withApplySpace = (\n  suggestions: Completion[],\n  startsWith = \"\"\n): Completion[] =>\n  suggestions\n    .filter((sugg) => startsWith === \"\" || sugg.label.startsWith(startsWith))\n    .map((suggestion) => ({\n      ...suggestion,\n      apply: suggestion.label + \" \",\n    }));\n\nexport type FilterSaveOptions = {\n  allowSaveAsTab?: boolean;\n  allowReplace?: boolean;\n};\nexport interface SuggestionProviderHookProps {\n  columns: ColumnDescriptor[];\n  namedFilters?: Map<string, string>;\n  saveOptions?: FilterSaveOptions;\n  table: VuuTable;\n  typeaheadHook?: () => SuggestionFetcher;\n}\n\nconst defaultSaveOptions = {\n  allowReplace: true,\n};\n\nexport const useFilterSuggestionProvider = ({\n  columns,\n  namedFilters,\n  saveOptions = defaultSaveOptions,\n  table,\n  typeaheadHook: useTypeahead = useTypeaheadSuggestions,\n}: SuggestionProviderHookProps): IFilterSuggestionProvider => {\n  const latestSuggestionsRef = useRef<Completion[]>();\n  const getTypeaheadSuggestions = useTypeahead();\n  const getSuggestions: IFilterSuggestionProvider[\"getSuggestions\"] =\n    useCallback(\n      async (suggestionType, options = NONE): Promise<Completion[]> => {\n        const {\n          columnName,\n          existingFilter,\n          filterName,\n          operator,\n          quoted: autoQuoted,\n          onSubmit,\n          startsWith,\n          selection,\n        } = options;\n\n        switch (suggestionType) {\n          case \"operator\":\n            {\n              const column = columns.find((col) => col.name === columnName);\n              if (column) {\n                switch (column.serverDataType) {\n                  case \"string\":\n                  case \"char\":\n                    return withApplySpace(stringOperators, startsWith);\n                  case \"int\":\n                  case \"long\":\n                  case \"double\":\n                    return withApplySpace(numericOperators);\n                }\n              } else {\n                console.warn(`'${columnName}' does not match any column name`);\n              }\n            }\n            break;\n          case \"column\": {\n            const columnSuggestions = await suggestColumns(columns);\n            const filterSuggestions = await suggestNamedFilters(namedFilters);\n            return (latestSuggestionsRef.current =\n              withApplySpace(columnSuggestions)).concat(\n              withApplySpace(filterSuggestions)\n            );\n          }\n          case \"columnValue\":\n            {\n              if (columnName) {\n                const column = columns.find((col) => col.name === columnName);\n                if (!column) {\n                  throw Error(\n                    `useFilterSUggestionProvider no column ${columnName}`\n                  );\n                }\n                const prefix = Array.isArray(selection)\n                  ? selection.length === 0\n                    ? \"[\"\n                    : \",\"\n                  : \"\";\n                const params = getTypeaheadParams(\n                  table,\n                  columnName,\n                  startsWith\n                );\n                const suggestions = await getTypeaheadSuggestions(params);\n                // const { type } = column;\n                // if (\n                //   isTypeDescriptor(type) &&\n                //   isMappedValueTypeRenderer(type?.renderer)\n                // ) {\n                //   const { map } = type.renderer;\n                //   suggestions = suggestions.map((value) => map[value] ?? value);\n                // }\n\n                // prob don't want to save the prefix\n                const isIllustration = operator === \"starts\";\n                latestSuggestionsRef.current = toSuggestions(suggestions, {\n                  moveCursorToEnd: autoQuoted,\n                  quoted: column?.serverDataType === \"string\" && !autoQuoted,\n                  suffix: autoQuoted ? \"\" : \" \",\n                  prefix: isIllustration ? startsWith : prefix,\n                  isIllustration,\n                });\n                if (Array.isArray(selection) && selection?.length > 1) {\n                  return [doneCommand, ...latestSuggestionsRef.current];\n                }\n                return latestSuggestionsRef.current;\n              }\n            }\n            break;\n          case \"save\": {\n            if (typeof onSubmit !== \"function\") {\n              throw Error(\n                \"useFilterSuggestionProvider, onSubmit must be supplied for 'save' suggestions\"\n              );\n            }\n            return await getSaveSuggestions({\n              existingFilter,\n              filterName,\n              onSubmit,\n              saveOptions,\n            });\n          }\n          case \"name\":\n            return await getNamePrompt(\"filter\");\n          default:\n        }\n\n        return [];\n      },\n      [columns, getTypeaheadSuggestions, namedFilters, saveOptions, table]\n    );\n\n  const isPartialMatch = useCallback(\n    async (\n      valueType: SuggestionType,\n      columnName?: string,\n      pattern?: string\n    ) => {\n      // const { current: latestSuggestions } = latestSuggestionsRef;\n      const suggestions =\n        // latestSuggestions && latestSuggestions.length > 0\n        //   ? latestSuggestions\n        await getSuggestions(valueType, { columnName });\n\n      if (pattern && suggestions) {\n        for (const option of suggestions) {\n          if (option.label === pattern) {\n            return false;\n          } else if (option.label.startsWith(pattern)) {\n            return true;\n          }\n        }\n      }\n      return false;\n    },\n    [getSuggestions]\n  );\n\n  return {\n    getSuggestions,\n    isPartialMatch,\n  };\n};\n"],"names":["booleanJoinSuggestions","asNameSuggestion","filterInfo","useTypeaheadSuggestions","useRef","useCallback","stringOperators","numericOperators","getTypeaheadParams","toSuggestions","getNamePrompt"],"mappings":"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"}

package/cjs/filter-pill/FilterPill.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var filterPillCss = ".vuuFilterPill {\n    --saltButton-textTransform: none;\n    max-width: var(--vuuFilterPill-maxWidth, 200px);\n}\n\n.vuuFilterPill-tooltip {\n    ul {\n        padding-left: var(--salt-spacing-400);\n    }    \n}\n\n";
+
+module.exports = filterPillCss;
+//# sourceMappingURL=FilterPill.css.js.map

package/cjs/filter-pill/FilterPill.css.js.map

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

package/cjs/filter-pill/FilterPill.js

@@ -0,0 +1,147 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var vuuPopups = require('@vuu-ui/vuu-popups');
+var vuuUiControls = require('@vuu-ui/vuu-ui-controls');
+var vuuUtils = require('@vuu-ui/vuu-utils');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var cx = require('clsx');
+var react = require('react');
+var filterAsReactNode = require('./filterAsReactNode.js');
+var FilterPillMenuOptions = require('./FilterPillMenuOptions.js');
+var getFilterLabel = require('./getFilterLabel.js');
+var getFilterTooltipText = require('./getFilterTooltipText.js');
+var FilterPill$1 = require('./FilterPill.css.js');
+
+const classBase = "vuuFilterPill";
+const FilterPill = ({
+  allowClose = true,
+  allowDelete = true,
+  allowEdit = true,
+  allowRename = true,
+  className: classNameProp,
+  columnsByName,
+  editable = true,
+  editing = false,
+  editLabelApiRef,
+  filter,
+  id: idProp,
+  onBeginEdit,
+  onExitEditMode,
+  onMenuAction,
+  ...htmlAttributes
+}) => {
+  const targetWindow = window.useWindow();
+  styles.useComponentCssInjection({
+    testId: "vuu-filter-pill",
+    css: FilterPill$1,
+    window: targetWindow
+  });
+  const rootRef = react.useRef(null);
+  const handleEnterEditMode = react.useCallback(() => {
+    onBeginEdit?.(filter);
+  }, [filter, onBeginEdit]);
+  const getLabel = getFilterLabel.getFilterLabel(columnsByName);
+  const label = react.useMemo(
+    () => filter.name ?? getLabel(filter),
+    [getLabel, filter]
+  );
+  const getTooltipTextl = getFilterTooltipText.getFilterTooltipText(columnsByName);
+  const id = vuuUtils.useId(idProp);
+  const handleMenuClose = react.useCallback((reason) => {
+    if (reason?.type === "escape") {
+      requestAnimationFrame(() => {
+        if (rootRef.current) {
+          rootRef.current.focus();
+        }
+      });
+    }
+  }, []);
+  const popupMenuProps = react.useMemo(
+    () => ({
+      icon: "more-vert",
+      menuBuilder: (_location, options) => {
+        const menuItems = [];
+        if (allowRename) {
+          menuItems.push(FilterPillMenuOptions.renameCommand(options));
+        }
+        if (allowEdit) {
+          menuItems.push(FilterPillMenuOptions.editCommand(options));
+        }
+        if (allowClose) {
+          menuItems.push(FilterPillMenuOptions.closeCommand(options));
+        }
+        if (allowDelete) {
+          menuItems.push(FilterPillMenuOptions.deleteCommand(options));
+        }
+        return menuItems;
+      },
+      menuActionHandler: onMenuAction,
+      menuLocation: "filter-pill-menu",
+      menuOptions: {
+        filter
+      },
+      onMenuClose: handleMenuClose
+    }),
+    [
+      allowClose,
+      allowDelete,
+      allowEdit,
+      allowRename,
+      filter,
+      handleMenuClose,
+      onMenuAction
+    ]
+  );
+  const handleExitEditMode = react.useCallback(
+    (originalValue, newValue) => {
+      onExitEditMode?.(originalValue, newValue);
+      requestAnimationFrame(() => {
+        rootRef.current?.querySelector("button")?.focus();
+      });
+    },
+    [onExitEditMode]
+  );
+  const { anchorProps, hideTooltip, showTooltip, tooltipProps } = vuuPopups.useTooltip({
+    anchorQuery: ".vuuFilterPill",
+    id,
+    placement: ["above", "below"],
+    tooltipContent: filterAsReactNode.filterAsReactNode(filter, getTooltipTextl)
+  });
+  const buttonProps = {
+    onBlur: hideTooltip,
+    onFocus: react.useCallback(() => {
+      showTooltip(rootRef);
+    }, [showTooltip])
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    vuuUiControls.SplitStateButton,
+    {
+      ...anchorProps,
+      ...htmlAttributes,
+      ButtonProps: buttonProps,
+      PopupMenuProps: popupMenuProps,
+      className: cx(classBase, classNameProp),
+      "data-text": label,
+      ref: rootRef,
+      children: [
+        editable && onExitEditMode ? /* @__PURE__ */ jsxRuntime.jsx(
+          vuuUiControls.EditableLabel,
+          {
+            defaultValue: label,
+            editing,
+            editLabelApiRef,
+            onEnterEditMode: handleEnterEditMode,
+            onExitEditMode: handleExitEditMode
+          },
+          label
+        ) : label,
+        tooltipProps && /* @__PURE__ */ jsxRuntime.jsx(vuuPopups.Tooltip, { className: `${classBase}-tooltip`, ...tooltipProps })
+      ]
+    }
+  );
+};
+
+exports.FilterPill = FilterPill;
+//# sourceMappingURL=FilterPill.js.map

package/cjs/filter-pill/FilterPill.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterPill.js","sources":["../../src/filter-pill/FilterPill.tsx"],"sourcesContent":["import {\n  ContextMenuItemDescriptor,\n  MenuActionHandler,\n} from \"@vuu-ui/vuu-data-types\";\nimport { ColumnDescriptorsByName, Filter } from \"@vuu-ui/vuu-filter-types\";\nimport {\n  PopupCloseCallback,\n  PopupMenuProps,\n  Tooltip,\n  useTooltip,\n} from \"@vuu-ui/vuu-popups\";\nimport {\n  EditableLabel,\n  EditableLabelProps,\n  ExitEditModeHandler,\n  SplitStateButton,\n  SplitStateButtonProps,\n} from \"@vuu-ui/vuu-ui-controls\";\nimport { useId } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport { FocusEventHandler, useCallback, useMemo, useRef } from \"react\";\nimport { filterAsReactNode } from \"./filterAsReactNode\";\nimport {\n  closeCommand,\n  deleteCommand,\n  editCommand,\n  MenuOptions,\n  renameCommand,\n} from \"./FilterPillMenuOptions\";\nimport { getFilterLabel } from \"./getFilterLabel\";\nimport { getFilterTooltipText } from \"./getFilterTooltipText\";\n\nimport filterPillCss from \"./FilterPill.css\";\n\nconst classBase = \"vuuFilterPill\";\n\nexport interface FilterPillProps\n  extends SplitStateButtonProps,\n    Pick<\n      Partial<EditableLabelProps>,\n      \"editing\" | \"editLabelApiRef\" | \"onExitEditMode\"\n    > {\n  allowClose?: boolean;\n  allowDelete?: boolean;\n  allowEdit?: boolean;\n  allowRename?: boolean;\n\n  columnsByName?: ColumnDescriptorsByName;\n  editable?: boolean;\n  filter: Filter;\n  index?: number;\n  onBeginEdit?: (filter: Filter) => void;\n  onMenuAction?: MenuActionHandler;\n}\n\nexport const FilterPill = ({\n  allowClose = true,\n  allowDelete = true,\n  allowEdit = true,\n  allowRename = true,\n  className: classNameProp,\n  columnsByName,\n  editable = true,\n  editing = false,\n  editLabelApiRef,\n  filter,\n  id: idProp,\n  onBeginEdit,\n  onExitEditMode,\n  onMenuAction,\n  ...htmlAttributes\n}: FilterPillProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-filter-pill\",\n    css: filterPillCss,\n    window: targetWindow,\n  });\n\n  const rootRef = useRef<HTMLDivElement>(null);\n  const handleEnterEditMode: EditableLabelProps[\"onEnterEditMode\"] =\n    useCallback(() => {\n      onBeginEdit?.(filter);\n    }, [filter, onBeginEdit]);\n\n  const getLabel = getFilterLabel(columnsByName);\n  const label = useMemo(\n    () => filter.name ?? getLabel(filter),\n    [getLabel, filter]\n  );\n\n  const getTooltipTextl = getFilterTooltipText(columnsByName);\n\n  const id = useId(idProp);\n\n  const handleMenuClose = useCallback<PopupCloseCallback>((reason) => {\n    if (reason?.type === \"escape\") {\n      requestAnimationFrame(() => {\n        if (rootRef.current) {\n          rootRef.current.focus();\n        }\n      });\n    }\n  }, []);\n\n  const popupMenuProps = useMemo<\n    Pick<\n      PopupMenuProps,\n      \"menuBuilder\" | \"menuActionHandler\" | \"menuOptions\" | \"onMenuClose\"\n    >\n  >(\n    () => ({\n      icon: \"more-vert\",\n      menuBuilder: (_location, options) => {\n        const menuItems: ContextMenuItemDescriptor[] = [];\n        if (allowRename) {\n          menuItems.push(renameCommand(options as MenuOptions));\n        }\n        if (allowEdit) {\n          menuItems.push(editCommand(options as MenuOptions));\n        }\n        if (allowClose) {\n          menuItems.push(closeCommand(options as MenuOptions));\n        }\n        if (allowDelete) {\n          menuItems.push(deleteCommand(options as MenuOptions));\n        }\n        return menuItems;\n      },\n\n      menuActionHandler: onMenuAction,\n      menuLocation: \"filter-pill-menu\",\n      menuOptions: {\n        filter,\n      },\n\n      onMenuClose: handleMenuClose,\n    }),\n    [\n      allowClose,\n      allowDelete,\n      allowEdit,\n      allowRename,\n      filter,\n      handleMenuClose,\n      onMenuAction,\n    ]\n  );\n\n  const handleExitEditMode = useCallback<ExitEditModeHandler>(\n    (originalValue, newValue) => {\n      onExitEditMode?.(originalValue, newValue);\n      requestAnimationFrame(() => {\n        rootRef.current?.querySelector(\"button\")?.focus();\n      });\n    },\n    [onExitEditMode]\n  );\n\n  const { anchorProps, hideTooltip, showTooltip, tooltipProps } = useTooltip({\n    anchorQuery: \".vuuFilterPill\",\n    id,\n    placement: [\"above\", \"below\"],\n    tooltipContent: filterAsReactNode(filter, getTooltipTextl),\n  });\n\n  const buttonProps = {\n    onBlur: hideTooltip,\n    onFocus: useCallback<FocusEventHandler>(() => {\n      showTooltip(rootRef);\n    }, [showTooltip]),\n  };\n\n  return (\n    <SplitStateButton\n      {...anchorProps}\n      {...htmlAttributes}\n      ButtonProps={buttonProps}\n      PopupMenuProps={popupMenuProps}\n      className={cx(classBase, classNameProp)}\n      data-text={label}\n      ref={rootRef}\n    >\n      {editable && onExitEditMode ? (\n        <EditableLabel\n          defaultValue={label}\n          editing={editing}\n          editLabelApiRef={editLabelApiRef}\n          key={label}\n          onEnterEditMode={handleEnterEditMode}\n          onExitEditMode={handleExitEditMode}\n        />\n      ) : (\n        label\n      )}\n      {tooltipProps && (\n        <Tooltip className={`${classBase}-tooltip`} {...tooltipProps} />\n      )}\n    </SplitStateButton>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","filterPillCss","useRef","useCallback","getFilterLabel","useMemo","getFilterTooltipText","useId","renameCommand","editCommand","closeCommand","deleteCommand","useTooltip","filterAsReactNode","jsxs","SplitStateButton","jsx","EditableLabel","Tooltip"],"mappings":"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"}

package/cjs/filter-pill/FilterPillMenuOptions.js

@@ -0,0 +1,32 @@
+'use strict';
+
+const closeCommand = (options) => ({
+  label: `Close`,
+  location: "filter",
+  action: `close-filter`,
+  options
+});
+const deleteCommand = (options) => ({
+  label: `Delete`,
+  location: "filter",
+  action: `delete-filter`,
+  options
+});
+const renameCommand = (options) => ({
+  label: `Rename`,
+  location: "filter",
+  action: `rename-filter`,
+  options
+});
+const editCommand = (options) => ({
+  label: `Edit`,
+  location: "filter",
+  action: "edit-filter",
+  options
+});
+
+exports.closeCommand = closeCommand;
+exports.deleteCommand = deleteCommand;
+exports.editCommand = editCommand;
+exports.renameCommand = renameCommand;
+//# sourceMappingURL=FilterPillMenuOptions.js.map

package/cjs/filter-pill/FilterPillMenuOptions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterPillMenuOptions.js","sources":["../../src/filter-pill/FilterPillMenuOptions.ts"],"sourcesContent":["import { ContextMenuItemDescriptor } from \"@vuu-ui/vuu-data-types\";\n\nexport type MenuOptions = { [key: string]: unknown };\n\nexport interface FilterPillMenuOptions {\n  tabIndex: number;\n}\n\nexport const isFilterPillMenuOptions = (\n  options: unknown\n): options is FilterPillMenuOptions =>\n  typeof options === \"object\" && options !== null && \"filter\" in options;\n\nexport const closeCommand = (options?: MenuOptions) =>\n  ({\n    label: `Close`,\n    location: \"filter\",\n    action: `close-filter`,\n    options,\n  } as ContextMenuItemDescriptor);\n\nexport const deleteCommand = (options?: MenuOptions) =>\n  ({\n    label: `Delete`,\n    location: \"filter\",\n    action: `delete-filter`,\n    options,\n  } as ContextMenuItemDescriptor);\n\nexport const renameCommand = (options?: MenuOptions) =>\n  ({\n    label: `Rename`,\n    location: \"filter\",\n    action: `rename-filter`,\n    options,\n  } as ContextMenuItemDescriptor);\n\nexport const editCommand = (options?: MenuOptions) =>\n  ({\n    label: `Edit`,\n    location: \"filter\",\n    action: \"edit-filter\",\n    options,\n  } as ContextMenuItemDescriptor);\n"],"names":[],"mappings":";;AAaa,MAAA,YAAA,GAAe,CAAC,OAC1B,MAAA;AAAA,EACC,KAAO,EAAA,CAAA,KAAA,CAAA;AAAA,EACP,QAAU,EAAA,QAAA;AAAA,EACV,MAAQ,EAAA,CAAA,YAAA,CAAA;AAAA,EACR,OAAA;AACF,CAAA,EAAA;AAEW,MAAA,aAAA,GAAgB,CAAC,OAC3B,MAAA;AAAA,EACC,KAAO,EAAA,CAAA,MAAA,CAAA;AAAA,EACP,QAAU,EAAA,QAAA;AAAA,EACV,MAAQ,EAAA,CAAA,aAAA,CAAA;AAAA,EACR,OAAA;AACF,CAAA,EAAA;AAEW,MAAA,aAAA,GAAgB,CAAC,OAC3B,MAAA;AAAA,EACC,KAAO,EAAA,CAAA,MAAA,CAAA;AAAA,EACP,QAAU,EAAA,QAAA;AAAA,EACV,MAAQ,EAAA,CAAA,aAAA,CAAA;AAAA,EACR,OAAA;AACF,CAAA,EAAA;AAEW,MAAA,WAAA,GAAc,CAAC,OACzB,MAAA;AAAA,EACC,KAAO,EAAA,CAAA,IAAA,CAAA;AAAA,EACP,QAAU,EAAA,QAAA;AAAA,EACV,MAAQ,EAAA,aAAA;AAAA,EACR,OAAA;AACF,CAAA;;;;;;;"}

package/cjs/filter-pill/filterAsReactNode.js

@@ -0,0 +1,27 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var vuuUtils = require('@vuu-ui/vuu-utils');
+var getFilterLabel = require('./getFilterLabel.js');
+
+const filterAsReactNode = (f, getLabel = getFilterLabel.getFilterLabel()) => {
+  if (vuuUtils.isMultiClauseFilter(f)) {
+    const heading = f.op === "and" ? "Match all ..." : "Match any ...";
+    return /* @__PURE__ */ jsxRuntime.jsxs("ul", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { children: heading }),
+      f.filters.map((f2, i) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: filterAsReactNode(f2, getLabel) }, i))
+    ] });
+  } else if (vuuUtils.isMultiValueFilter(f)) {
+    if (f.values.length > 3) {
+      const values = f.values.slice(0, 3);
+      return `${getLabel({ ...f, values }).slice(0, -1)},...]`;
+    } else {
+      return getLabel(f);
+    }
+  } else {
+    return getLabel(f);
+  }
+};
+
+exports.filterAsReactNode = filterAsReactNode;
+//# sourceMappingURL=filterAsReactNode.js.map

package/cjs/filter-pill/filterAsReactNode.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"filterAsReactNode.js","sources":["../../src/filter-pill/filterAsReactNode.tsx"],"sourcesContent":["import { isMultiClauseFilter, isMultiValueFilter } from \"@vuu-ui/vuu-utils\";\nimport { Filter } from \"@vuu-ui/vuu-filter-types\";\nimport { ReactNode } from \"react\";\nimport { getFilterLabel } from \"./getFilterLabel\";\n\nexport const filterAsReactNode = (\n  f: Filter,\n  getLabel: (f: Filter) => string = getFilterLabel()\n): ReactNode => {\n  if (isMultiClauseFilter(f)) {\n    const heading = f.op === \"and\" ? \"Match all ...\" : \"Match any ...\";\n    return (\n      <ul>\n        <span>{heading}</span>\n        {f.filters.map((f, i) => (\n          <li key={i}>{filterAsReactNode(f, getLabel)}</li>\n        ))}\n      </ul>\n    );\n  } else if (isMultiValueFilter(f)) {\n    if (f.values.length > 3) {\n      const values = f.values.slice(0, 3);\n      return `${getLabel({ ...f, values }).slice(0, -1)},...]`;\n    } else {\n      return getLabel(f);\n    }\n  } else {\n    return getLabel(f);\n  }\n};\n"],"names":["getFilterLabel","isMultiClauseFilter","jsx","f","isMultiValueFilter"],"mappings":";;;;;;AAKO,MAAM,iBAAoB,GAAA,CAC/B,CACA,EAAA,QAAA,GAAkCA,+BACpB,KAAA;AACd,EAAI,IAAAC,4BAAA,CAAoB,CAAC,CAAG,EAAA;AAC1B,IAAA,MAAM,OAAU,GAAA,CAAA,CAAE,EAAO,KAAA,KAAA,GAAQ,eAAkB,GAAA,eAAA,CAAA;AACnD,IAAA,uCACG,IACC,EAAA,EAAA,QAAA,EAAA;AAAA,sBAAAC,cAAA,CAAC,UAAM,QAAQ,EAAA,OAAA,EAAA,CAAA;AAAA,MACd,CAAE,CAAA,OAAA,CAAQ,GAAI,CAAA,CAACC,EAAG,EAAA,CAAA,qBAChBD,cAAA,CAAA,IAAA,EAAA,EAAY,QAAkBC,EAAAA,iBAAAA,CAAAA,EAAAA,EAAG,QAAQ,CAAA,EAAA,EAAjC,CAAmC,CAC7C,CAAA;AAAA,KACH,EAAA,CAAA,CAAA;AAAA,GAEJ,MAAA,IAAWC,2BAAmB,CAAA,CAAC,CAAG,EAAA;AAChC,IAAI,IAAA,CAAA,CAAE,MAAO,CAAA,MAAA,GAAS,CAAG,EAAA;AACvB,MAAA,MAAM,MAAS,GAAA,CAAA,CAAE,MAAO,CAAA,KAAA,CAAM,GAAG,CAAC,CAAA,CAAA;AAClC,MAAO,OAAA,CAAA,EAAG,QAAS,CAAA,EAAE,GAAG,CAAA,EAAG,MAAO,EAAC,CAAE,CAAA,KAAA,CAAM,CAAG,EAAA,CAAA,CAAE,CAAC,CAAA,KAAA,CAAA,CAAA;AAAA,KAC5C,MAAA;AACL,MAAA,OAAO,SAAS,CAAC,CAAA,CAAA;AAAA,KACnB;AAAA,GACK,MAAA;AACL,IAAA,OAAO,SAAS,CAAC,CAAA,CAAA;AAAA,GACnB;AACF;;;;"}

package/cjs/filter-pill/getFilterLabel.js

@@ -0,0 +1,22 @@
+'use strict';
+
+var vuuUtils = require('@vuu-ui/vuu-utils');
+
+const getColumnLabel = (filter, columnsByName) => {
+  const column = columnsByName?.[filter.column];
+  if (column) {
+    return column.label ?? column.name;
+  } else {
+    return filter.column;
+  }
+};
+const getFilterLabel = (columnsByName) => (filter) => {
+  if (vuuUtils.isMultiClauseFilter(filter)) {
+    return filter.filters.map((f) => getFilterLabel(columnsByName)(f)).join(", ");
+  } else {
+    return getColumnLabel(filter, columnsByName);
+  }
+};
+
+exports.getFilterLabel = getFilterLabel;
+//# sourceMappingURL=getFilterLabel.js.map

package/cjs/filter-pill/getFilterLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getFilterLabel.js","sources":["../../src/filter-pill/getFilterLabel.ts"],"sourcesContent":["import {\n  ColumnDescriptorsByName,\n  Filter,\n  FilterClause,\n} from \"@vuu-ui/vuu-filter-types\";\nimport { isMultiClauseFilter } from \"@vuu-ui/vuu-utils\";\n\nconst getColumnLabel = (\n  filter: FilterClause,\n  columnsByName?: ColumnDescriptorsByName\n) => {\n  const column = columnsByName?.[filter.column];\n  if (column) {\n    return column.label ?? column.name;\n  } else {\n    return filter.column;\n  }\n};\n\nexport const getFilterLabel =\n  (columnsByName?: ColumnDescriptorsByName) =>\n  (filter: Filter): string => {\n    if (isMultiClauseFilter(filter)) {\n      return filter.filters\n        .map((f) => getFilterLabel(columnsByName)(f))\n        .join(\", \");\n    } else {\n      return getColumnLabel(filter, columnsByName);\n    }\n  };\n"],"names":["isMultiClauseFilter"],"mappings":";;;;AAOA,MAAM,cAAA,GAAiB,CACrB,MAAA,EACA,aACG,KAAA;AACH,EAAM,MAAA,MAAA,GAAS,aAAgB,GAAA,MAAA,CAAO,MAAM,CAAA,CAAA;AAC5C,EAAA,IAAI,MAAQ,EAAA;AACV,IAAO,OAAA,MAAA,CAAO,SAAS,MAAO,CAAA,IAAA,CAAA;AAAA,GACzB,MAAA;AACL,IAAA,OAAO,MAAO,CAAA,MAAA,CAAA;AAAA,GAChB;AACF,CAAA,CAAA;AAEO,MAAM,cACX,GAAA,CAAC,aACD,KAAA,CAAC,MAA2B,KAAA;AAC1B,EAAI,IAAAA,4BAAA,CAAoB,MAAM,CAAG,EAAA;AAC/B,IAAA,OAAO,MAAO,CAAA,OAAA,CACX,GAAI,CAAA,CAAC,CAAM,KAAA,cAAA,CAAe,aAAa,CAAA,CAAE,CAAC,CAAC,CAC3C,CAAA,IAAA,CAAK,IAAI,CAAA,CAAA;AAAA,GACP,MAAA;AACL,IAAO,OAAA,cAAA,CAAe,QAAQ,aAAa,CAAA,CAAA;AAAA,GAC7C;AACF;;;;"}

package/cjs/filter-pill/getFilterTooltipText.js

@@ -0,0 +1,41 @@
+'use strict';
+
+var vuuUtils = require('@vuu-ui/vuu-utils');
+var filterUtils = require('../filter-utils.js');
+
+function applyFormatter(filter, formatter) {
+  if ("value" in filter) {
+    return { ...filter, value: formatter(filter.value) };
+  } else {
+    return { ...filter, values: filter.values.map(formatter) };
+  }
+}
+function formatFilterValue(filter, columnsByName) {
+  const column = columnsByName?.[filter.column];
+  if (column && vuuUtils.isDateTimeColumn(column)) {
+    const pattern = vuuUtils.dateTimePattern(column.type);
+    const formatter = (n) => vuuUtils.formatDate({ date: pattern.date ?? vuuUtils.defaultPatternsByType.date })(
+      new Date(n)
+    );
+    return applyFormatter(
+      filter,
+      formatter
+    );
+  }
+  return filter;
+}
+const getFilterTooltipText = (columnsByName) => (filter) => {
+  if (vuuUtils.isMultiClauseFilter(filter)) {
+    const [firstClause] = filterUtils.filterClauses(filter);
+    const formattedFilter = formatFilterValue(
+      firstClause,
+      columnsByName
+    );
+    return `${vuuUtils.filterAsQuery(formattedFilter)} ${filter.op} ...`;
+  } else {
+    return vuuUtils.filterAsQuery(formatFilterValue(filter, columnsByName));
+  }
+};
+
+exports.getFilterTooltipText = getFilterTooltipText;
+//# sourceMappingURL=getFilterTooltipText.js.map

package/cjs/filter-pill/getFilterTooltipText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getFilterTooltipText.js","sources":["../../src/filter-pill/getFilterTooltipText.ts"],"sourcesContent":["import {\n  ColumnDescriptorsByName,\n  Filter,\n  FilterClause,\n  MultiValueFilterClause,\n  SingleValueFilterClause,\n} from \"@vuu-ui/vuu-filter-types\";\nimport {\n  filterAsQuery,\n  formatDate,\n  isDateTimeColumn,\n  isMultiClauseFilter,\n  dateTimePattern,\n  defaultPatternsByType,\n} from \"@vuu-ui/vuu-utils\";\nimport { filterClauses } from \"../filter-utils\";\n\nfunction applyFormatter<T>(\n  filter: SingleValueFilterClause<T> | MultiValueFilterClause<T[]>,\n  formatter: (t: T) => string\n): FilterClause {\n  if (\"value\" in filter) {\n    return { ...filter, value: formatter(filter.value) };\n  } else {\n    return { ...filter, values: filter.values.map(formatter) };\n  }\n}\n\nfunction formatFilterValue(\n  filter: FilterClause,\n  columnsByName?: ColumnDescriptorsByName\n): FilterClause {\n  const column = columnsByName?.[filter.column];\n  if (column && isDateTimeColumn(column)) {\n    const pattern = dateTimePattern(column.type);\n    const formatter = (n: number) =>\n      formatDate({ date: pattern.date ?? defaultPatternsByType.date })(\n        new Date(n)\n      );\n    return applyFormatter(\n      filter as\n        | SingleValueFilterClause<number>\n        | MultiValueFilterClause<number[]>,\n      formatter\n    );\n  }\n\n  return filter;\n}\n\nexport const getFilterTooltipText =\n  (columnsByName?: ColumnDescriptorsByName) => (filter: Filter) => {\n    if (isMultiClauseFilter(filter)) {\n      const [firstClause] = filterClauses(filter);\n      const formattedFilter = formatFilterValue(\n        firstClause as FilterClause,\n        columnsByName\n      );\n      return `${filterAsQuery(formattedFilter)} ${filter.op} ...`;\n    } else {\n      return filterAsQuery(formatFilterValue(filter, columnsByName));\n    }\n  };\n"],"names":["isDateTimeColumn","dateTimePattern","formatDate","defaultPatternsByType","isMultiClauseFilter","filterClauses","filterAsQuery"],"mappings":";;;;;AAiBA,SAAS,cAAA,CACP,QACA,SACc,EAAA;AACd,EAAA,IAAI,WAAW,MAAQ,EAAA;AACrB,IAAA,OAAO,EAAE,GAAG,MAAA,EAAQ,OAAO,SAAU,CAAA,MAAA,CAAO,KAAK,CAAE,EAAA,CAAA;AAAA,GAC9C,MAAA;AACL,IAAO,OAAA,EAAE,GAAG,MAAQ,EAAA,MAAA,EAAQ,OAAO,MAAO,CAAA,GAAA,CAAI,SAAS,CAAE,EAAA,CAAA;AAAA,GAC3D;AACF,CAAA;AAEA,SAAS,iBAAA,CACP,QACA,aACc,EAAA;AACd,EAAM,MAAA,MAAA,GAAS,aAAgB,GAAA,MAAA,CAAO,MAAM,CAAA,CAAA;AAC5C,EAAI,IAAA,MAAA,IAAUA,yBAAiB,CAAA,MAAM,CAAG,EAAA;AACtC,IAAM,MAAA,OAAA,GAAUC,wBAAgB,CAAA,MAAA,CAAO,IAAI,CAAA,CAAA;AAC3C,IAAM,MAAA,SAAA,GAAY,CAAC,CAAA,KACjBC,mBAAW,CAAA,EAAE,MAAM,OAAQ,CAAA,IAAA,IAAQC,8BAAsB,CAAA,IAAA,EAAM,CAAA;AAAA,MAC7D,IAAI,KAAK,CAAC,CAAA;AAAA,KACZ,CAAA;AACF,IAAO,OAAA,cAAA;AAAA,MACL,MAAA;AAAA,MAGA,SAAA;AAAA,KACF,CAAA;AAAA,GACF;AAEA,EAAO,OAAA,MAAA,CAAA;AACT,CAAA;AAEO,MAAM,oBACX,GAAA,CAAC,aAA4C,KAAA,CAAC,MAAmB,KAAA;AAC/D,EAAI,IAAAC,4BAAA,CAAoB,MAAM,CAAG,EAAA;AAC/B,IAAA,MAAM,CAAC,WAAW,CAAI,GAAAC,yBAAA,CAAc,MAAM,CAAA,CAAA;AAC1C,IAAA,MAAM,eAAkB,GAAA,iBAAA;AAAA,MACtB,WAAA;AAAA,MACA,aAAA;AAAA,KACF,CAAA;AACA,IAAA,OAAO,GAAGC,sBAAc,CAAA,eAAe,CAAC,CAAA,CAAA,EAAI,OAAO,EAAE,CAAA,IAAA,CAAA,CAAA;AAAA,GAChD,MAAA;AACL,IAAA,OAAOA,sBAAc,CAAA,iBAAA,CAAkB,MAAQ,EAAA,aAAa,CAAC,CAAA,CAAA;AAAA,GAC/D;AACF;;;;"}