@vuu-ui/vuu-filters 0.8.57 → 0.8.59

package/cjs/filter-bar/FilterBar.css.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var filterBarCss = ".vuuFilterBar {\n  --vuu-svg-grid: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\"><path d=\"M2 6.00004H4.66667V3.33337H3.33333C2.6 3.33337 2 3.93337 2 4.66671V6.00004ZM2 9.33337H4.66667V6.66671H2V9.33337ZM5.33333 9.33337H8V6.66671H5.33333V9.33337ZM8.66667 9.33337H11.3333V6.66671H8.66667V9.33337ZM5.33333 6.00004H8V3.33337H5.33333V6.00004ZM8.66667 3.33337V6.00004H11.3333V3.33337H8.66667ZM12 9.33337H14.6667V6.66671H12V9.33337ZM3.33333 12.6667H4.66667V10H2V11.3334C2 12.0667 2.6 12.6667 3.33333 12.6667ZM5.33333 12.6667H8V10H5.33333V12.6667ZM8.66667 12.6667H11.3333V10H8.66667V12.6667ZM12 12.6667H13.3333C14.0667 12.6667 14.6667 12.0667 14.6667 11.3334V10H12V12.6667ZM12 3.33337V6.00004H14.6667V4.66671C14.6667 3.93337 14.0667 3.33337 13.3333 3.33337H12Z\"/></svg>');\n  --vuu-svg-tune: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\"><path d=\"M3 18C3 18.55 3.45 19 4 19H9V17H4C3.45 17 3 17.45 3 18ZM3 6C3 6.55 3.45 7 4 7H13V5H4C3.45 5 3 5.45 3 6ZM13 20V19H20C20.55 19 21 18.55 21 18C21 17.45 20.55 17 20 17H13V16C13 15.45 12.55 15 12 15C11.45 15 11 15.45 11 16V20C11 20.55 11.45 21 12 21C12.55 21 13 20.55 13 20ZM7 10V11H4C3.45 11 3 11.45 3 12C3 12.55 3.45 13 4 13H7V14C7 14.55 7.45 15 8 15C8.55 15 9 14.55 9 14V10C9 9.45 8.55 9 8 9C7.45 9 7 9.45 7 10ZM21 12C21 11.45 20.55 11 20 11H11V13H20C20.55 13 21 12.55 21 12ZM16 9C16.55 9 17 8.55 17 8V7H20C20.55 7 21 6.55 21 6C21 5.45 20.55 5 20 5H17V4C17 3.45 16.55 3 16 3C15.45 3 15 3.45 15 4V8C15 8.55 15.45 9 16 9Z\" /></svg>');\n  --vuuOverflowContainer-minWidth: 0;\n  --filterbar-height: var(--vuuFilterBar-height, calc(var(--salt-size-base) + var(--salt-spacing-100))); \n  --vuuFilterEditor-height: var(--filterbar-height);\n  --flexbar-gap: var(--salt-spacing-100);\n\n  align-items: flex-start;\n  background-color: var(--salt-container-secondary-background);\n  border-color: var(--salt-container-primary-borderColor);\n  border-style: var(--vuuFilterBar-borderStyle, none none solid none);\n  border-width: 1px;\n  display: inline-flex;\n  flex: var(--vuuFilterBar-flex);\n  flex-wrap: wrap;\n  gap: var(--flexbar-gap);\n  grid-template-columns: 70px 1fr 28px;\n  grid-auto-rows: 28px 0px;\n  height: calc(1px + var(--filterbar-height));\n  overflow: hidden;\n  padding: var(--salt-spacing-100) var(--salt-spacing-200) 0px var(--salt-spacing-200);\n\n}\n\n.vuuFilterBar-quick-filter {\n  align-items: flex-end;\n  padding: var(--salt-spacing-100) var(--salt-spacing-200);\n}\n\n.vuuFilterBar:has(.vuuFilterEditor){\n  grid-template-rows: 28px 28px;\n  height: calc(1px + var(--flexbar-gap) + (2 * var(--filterbar-height))) ;\n}\n\n.vuuFilterbar-icon {\n  display: inline-block;\n  height: 16px;\n  width: 16px;\n}\n\n.vuuFilterBar [data-icon=\"grid\"] {\n  --vuu-icon-size: 16px;\n  --vuu-icon-svg: var(--vuu-svg-grid);\n}\n.vuuFilterBar [data-icon=\"tune\"] {\n  --vuu-icon-size: 16px;\n  --vuu-icon-svg: var(--vuu-svg-tune);\n}\n\n.vuuFilterBar [data-icon=\"plus\"] {\n  --vuu-icon-size: 16px;\n}\n\n.vuuFilterBar .vuuToolbar {\n  flex: 0 1 auto;\n}\n\n.vuuFilterBar-Editor {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: var(--salt-spacing-100);\n}\n\n.vuuCustomFilters {\n  display: flex;\n  gap: var(--salt-spacing-100);\n}\n.vuuCustomFilters-filters {\n  display: flex;\n  gap: var(--salt-spacing-100);\n}\n";
+var filterBarCss = ".vuuFilterBar {\n  --vuu-svg-grid: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\"><path d=\"M2 6.00004H4.66667V3.33337H3.33333C2.6 3.33337 2 3.93337 2 4.66671V6.00004ZM2 9.33337H4.66667V6.66671H2V9.33337ZM5.33333 9.33337H8V6.66671H5.33333V9.33337ZM8.66667 9.33337H11.3333V6.66671H8.66667V9.33337ZM5.33333 6.00004H8V3.33337H5.33333V6.00004ZM8.66667 3.33337V6.00004H11.3333V3.33337H8.66667ZM12 9.33337H14.6667V6.66671H12V9.33337ZM3.33333 12.6667H4.66667V10H2V11.3334C2 12.0667 2.6 12.6667 3.33333 12.6667ZM5.33333 12.6667H8V10H5.33333V12.6667ZM8.66667 12.6667H11.3333V10H8.66667V12.6667ZM12 12.6667H13.3333C14.0667 12.6667 14.6667 12.0667 14.6667 11.3334V10H12V12.6667ZM12 3.33337V6.00004H14.6667V4.66671C14.6667 3.93337 14.0667 3.33337 13.3333 3.33337H12Z\"/></svg>');\n  --vuu-svg-tune: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\"><path d=\"M3 18C3 18.55 3.45 19 4 19H9V17H4C3.45 17 3 17.45 3 18ZM3 6C3 6.55 3.45 7 4 7H13V5H4C3.45 5 3 5.45 3 6ZM13 20V19H20C20.55 19 21 18.55 21 18C21 17.45 20.55 17 20 17H13V16C13 15.45 12.55 15 12 15C11.45 15 11 15.45 11 16V20C11 20.55 11.45 21 12 21C12.55 21 13 20.55 13 20ZM7 10V11H4C3.45 11 3 11.45 3 12C3 12.55 3.45 13 4 13H7V14C7 14.55 7.45 15 8 15C8.55 15 9 14.55 9 14V10C9 9.45 8.55 9 8 9C7.45 9 7 9.45 7 10ZM21 12C21 11.45 20.55 11 20 11H11V13H20C20.55 13 21 12.55 21 12ZM16 9C16.55 9 17 8.55 17 8V7H20C20.55 7 21 6.55 21 6C21 5.45 20.55 5 20 5H17V4C17 3.45 16.55 3 16 3C15.45 3 15 3.45 15 4V8C15 8.55 15.45 9 16 9Z\" /></svg>');\n  --vuuOverflowContainer-minWidth: 0;\n  --filterbar-height: var(\n    --vuuFilterBar-height,\n    calc(var(--salt-size-base) + var(--salt-spacing-100))\n  );\n  --vuuFilterEditor-height: var(--filterbar-height);\n  --flexbar-gap: var(--salt-spacing-100);\n\n  align-items: flex-start;\n  background-color: var(--salt-container-secondary-background);\n  border-color: var(--salt-container-primary-borderColor);\n  border-style: var(--vuuFilterBar-borderStyle, none none solid none);\n  border-width: 1px;\n  display: inline-flex;\n  flex: var(--vuuFilterBar-flex);\n  flex-wrap: wrap;\n  gap: var(--flexbar-gap);\n  grid-template-columns: 70px 1fr 28px;\n  grid-auto-rows: 28px 0px;\n  height: calc(var(--salt-spacing-100) + var(--filterbar-height));\n  overflow: hidden;\n  padding: var(--salt-spacing-100) var(--salt-spacing-200);\n}\n\n.vuuFilterBar-quick-filter {\n  align-items: flex-end;\n  padding: var(--salt-spacing-100) var(--salt-spacing-200);\n}\n\n.vuuFilterBar:has(.vuuFilterEditor) {\n  grid-template-rows: 28px 28px;\n  height: calc(1px + var(--flexbar-gap) + (2 * var(--filterbar-height)));\n}\n\n.vuuFilterbar-icon {\n  display: inline-block;\n  height: 16px;\n  width: 16px;\n}\n\n.vuuFilterBar [data-icon=\"grid\"] {\n  --vuu-icon-size: 16px;\n  --vuu-icon-svg: var(--vuu-svg-grid);\n}\n.vuuFilterBar [data-icon=\"tune\"] {\n  --vuu-icon-size: 16px;\n  --vuu-icon-svg: var(--vuu-svg-tune);\n}\n\n.vuuFilterBar [data-icon=\"plus\"] {\n  --vuu-icon-size: 16px;\n}\n\n.vuuFilterBar .vuuToolbar {\n  flex: 0 1 auto;\n}\n\n.vuuFilterBar-Editor {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: var(--salt-spacing-100);\n}\n\n.vuuCustomFilters {\n  display: flex;\n  gap: var(--salt-spacing-100);\n}\n.vuuCustomFilters-filters {\n  display: flex;\n  gap: var(--salt-spacing-100);\n}\n";
 
 module.exports = filterBarCss;
 //# sourceMappingURL=FilterBar.css.js.map

package/cjs/index.js

@@ -8,8 +8,8 @@ var FilterClauseValueEditorText = require('./filter-clause/value-editors/FilterC
 var FilterEditor = require('./filter-editor/FilterEditor.js');
 var FilterPill = require('./filter-pill/FilterPill.js');
 var filterUtils = require('./filter-utils.js');
+var InlineFilter = require('./inline-filter/InlineFilter.js');
 var QuickFilters = require('./quick-filters/QuickFilters.js');
-var useFilterConfig = require('./use-filter-config.js');
 
 
 
@@ -41,6 +41,6 @@ exports.removeFilter = filterUtils.removeFilter;
 exports.removeLastClause = filterUtils.removeLastClause;
 exports.splitFilterOnColumn = filterUtils.splitFilterOnColumn;
 exports.updateFilter = filterUtils.updateFilter;
+exports.InlineFilter = InlineFilter.InlineFilter;
 exports.QuickFilters = QuickFilters.QuickFilters;
-exports.useFilterConfig = useFilterConfig.useFilterConfig;
 //# sourceMappingURL=index.js.map

package/cjs/inline-filter/InlineFilter.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var inlineFilteCss = ".vuuInlineFilter {\n  .vuuInlineFilter-filter {\n    display: inline-block;\n    padding: 1px;\n  }\n\n  .vuuInlineFilter-virtualColSpan {\n    display: inline-block;\n  }\n}\n";
+
+module.exports = inlineFilteCss;
+//# sourceMappingURL=InlineFilter.css.js.map

package/cjs/inline-filter/InlineFilter.css.js.map

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

package/cjs/inline-filter/InlineFilter.js

@@ -0,0 +1,52 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var vuuDataReact = require('@vuu-ui/vuu-data-react');
+var vuuTable = require('@vuu-ui/vuu-table');
+var vuuUtils = require('@vuu-ui/vuu-utils');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var react = require('react');
+var InlineFilter$1 = require('./InlineFilter.css.js');
+
+const classBase = "vuuInlineFilter";
+const InlineFilter = ({
+  onChange,
+  ...htmlAttributes
+}) => {
+  const targetWindow = window.useWindow();
+  styles.useComponentCssInjection({
+    testId: "vuu-inline-filter",
+    css: InlineFilter$1,
+    window: targetWindow
+  });
+  const { columns, virtualColSpan = 0 } = vuuTable.useHeaderProps();
+  const onCommit = react.useCallback(
+    (evt, value) => {
+      const field = vuuUtils.queryClosest(evt.target, "[data-field]");
+      if (field) {
+        const columnName = field.dataset.field;
+        const column = columns.find((c) => c.name === columnName);
+        if (column) {
+          onChange(column, value);
+        }
+      }
+    },
+    [columns, onChange]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ...htmlAttributes, className: classBase, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(vuuTable.VirtualColSpan, { width: virtualColSpan }),
+    columns.map((column) => /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: `${classBase}-filter`,
+        style: { width: column.width },
+        children: vuuDataReact.getDataItemEditControl({ column, onCommit })
+      },
+      column.name
+    ))
+  ] });
+};
+
+exports.InlineFilter = InlineFilter;
+//# sourceMappingURL=InlineFilter.js.map

package/cjs/inline-filter/InlineFilter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineFilter.js","sources":["../../src/inline-filter/InlineFilter.tsx"],"sourcesContent":["import { getDataItemEditControl } from \"@vuu-ui/vuu-data-react\";\nimport { VirtualColSpan, useHeaderProps } from \"@vuu-ui/vuu-table\";\nimport { Commithandler } from \"@vuu-ui/vuu-ui-controls\";\nimport { queryClosest } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes, useCallback } from \"react\";\n\nimport inlineFilteCss from \"./InlineFilter.css\";\nimport { ColumnDescriptor } from \"packages/vuu-table-types\";\n\nconst classBase = \"vuuInlineFilter\";\n\nexport type FilterValueChangeHandler = (\n  column: ColumnDescriptor,\n  value: string\n) => void;\nexport interface InlineFilterProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  onChange: FilterValueChangeHandler;\n}\n\nexport const InlineFilter = ({\n  onChange,\n  ...htmlAttributes\n}: InlineFilterProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-inline-filter\",\n    css: inlineFilteCss,\n    window: targetWindow,\n  });\n\n  const { columns, virtualColSpan = 0 } = useHeaderProps();\n\n  const onCommit = useCallback<Commithandler>(\n    (evt, value) => {\n      const field = queryClosest(evt.target, \"[data-field]\");\n      if (field) {\n        const columnName = field.dataset.field;\n        const column = columns.find((c) => c.name === columnName);\n        if (column) {\n          onChange(column, value);\n        }\n      }\n    },\n    [columns, onChange]\n  );\n\n  return (\n    <div {...htmlAttributes} className={classBase}>\n      <VirtualColSpan width={virtualColSpan} />\n      {columns.map((column) => (\n        <div\n          className={`${classBase}-filter`}\n          key={column.name}\n          style={{ width: column.width }}\n        >\n          {getDataItemEditControl({ column, onCommit })}\n        </div>\n      ))}\n    </div>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","inlineFilteCss","useHeaderProps","useCallback","queryClosest","jsxs","jsx","VirtualColSpan","getDataItemEditControl"],"mappings":";;;;;;;;;;;AAWA,MAAM,SAAY,GAAA,iBAAA,CAAA;AAWX,MAAM,eAAe,CAAC;AAAA,EAC3B,QAAA;AAAA,EACA,GAAG,cAAA;AACL,CAAyB,KAAA;AACvB,EAAA,MAAM,eAAeA,gBAAU,EAAA,CAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAAC,cAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,OAAA,EAAS,cAAiB,GAAA,CAAA,KAAMC,uBAAe,EAAA,CAAA;AAEvD,EAAA,MAAM,QAAW,GAAAC,iBAAA;AAAA,IACf,CAAC,KAAK,KAAU,KAAA;AACd,MAAA,MAAM,KAAQ,GAAAC,qBAAA,CAAa,GAAI,CAAA,MAAA,EAAQ,cAAc,CAAA,CAAA;AACrD,MAAA,IAAI,KAAO,EAAA;AACT,QAAM,MAAA,UAAA,GAAa,MAAM,OAAQ,CAAA,KAAA,CAAA;AACjC,QAAA,MAAM,SAAS,OAAQ,CAAA,IAAA,CAAK,CAAC,CAAM,KAAA,CAAA,CAAE,SAAS,UAAU,CAAA,CAAA;AACxD,QAAA,IAAI,MAAQ,EAAA;AACV,UAAA,QAAA,CAAS,QAAQ,KAAK,CAAA,CAAA;AAAA,SACxB;AAAA,OACF;AAAA,KACF;AAAA,IACA,CAAC,SAAS,QAAQ,CAAA;AAAA,GACpB,CAAA;AAEA,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA,EAAK,GAAG,cAAA,EAAgB,WAAW,SAClC,EAAA,QAAA,EAAA;AAAA,oBAACC,cAAA,CAAAC,uBAAA,EAAA,EAAe,OAAO,cAAgB,EAAA,CAAA;AAAA,IACtC,OAAA,CAAQ,GAAI,CAAA,CAAC,MACZ,qBAAAD,cAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,GAAG,SAAS,CAAA,OAAA,CAAA;AAAA,QAEvB,KAAO,EAAA,EAAE,KAAO,EAAA,MAAA,CAAO,KAAM,EAAA;AAAA,QAE5B,QAAuB,EAAAE,mCAAA,CAAA,EAAE,MAAQ,EAAA,QAAA,EAAU,CAAA;AAAA,OAAA;AAAA,MAHvC,MAAO,CAAA,IAAA;AAAA,KAKf,CAAA;AAAA,GACH,EAAA,CAAA,CAAA;AAEJ;;;;"}

package/esm/filter-bar/FilterBar.css.js

@@ -1,4 +1,4 @@
-var filterBarCss = ".vuuFilterBar {\n  --vuu-svg-grid: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\"><path d=\"M2 6.00004H4.66667V3.33337H3.33333C2.6 3.33337 2 3.93337 2 4.66671V6.00004ZM2 9.33337H4.66667V6.66671H2V9.33337ZM5.33333 9.33337H8V6.66671H5.33333V9.33337ZM8.66667 9.33337H11.3333V6.66671H8.66667V9.33337ZM5.33333 6.00004H8V3.33337H5.33333V6.00004ZM8.66667 3.33337V6.00004H11.3333V3.33337H8.66667ZM12 9.33337H14.6667V6.66671H12V9.33337ZM3.33333 12.6667H4.66667V10H2V11.3334C2 12.0667 2.6 12.6667 3.33333 12.6667ZM5.33333 12.6667H8V10H5.33333V12.6667ZM8.66667 12.6667H11.3333V10H8.66667V12.6667ZM12 12.6667H13.3333C14.0667 12.6667 14.6667 12.0667 14.6667 11.3334V10H12V12.6667ZM12 3.33337V6.00004H14.6667V4.66671C14.6667 3.93337 14.0667 3.33337 13.3333 3.33337H12Z\"/></svg>');\n  --vuu-svg-tune: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\"><path d=\"M3 18C3 18.55 3.45 19 4 19H9V17H4C3.45 17 3 17.45 3 18ZM3 6C3 6.55 3.45 7 4 7H13V5H4C3.45 5 3 5.45 3 6ZM13 20V19H20C20.55 19 21 18.55 21 18C21 17.45 20.55 17 20 17H13V16C13 15.45 12.55 15 12 15C11.45 15 11 15.45 11 16V20C11 20.55 11.45 21 12 21C12.55 21 13 20.55 13 20ZM7 10V11H4C3.45 11 3 11.45 3 12C3 12.55 3.45 13 4 13H7V14C7 14.55 7.45 15 8 15C8.55 15 9 14.55 9 14V10C9 9.45 8.55 9 8 9C7.45 9 7 9.45 7 10ZM21 12C21 11.45 20.55 11 20 11H11V13H20C20.55 13 21 12.55 21 12ZM16 9C16.55 9 17 8.55 17 8V7H20C20.55 7 21 6.55 21 6C21 5.45 20.55 5 20 5H17V4C17 3.45 16.55 3 16 3C15.45 3 15 3.45 15 4V8C15 8.55 15.45 9 16 9Z\" /></svg>');\n  --vuuOverflowContainer-minWidth: 0;\n  --filterbar-height: var(--vuuFilterBar-height, calc(var(--salt-size-base) + var(--salt-spacing-100))); \n  --vuuFilterEditor-height: var(--filterbar-height);\n  --flexbar-gap: var(--salt-spacing-100);\n\n  align-items: flex-start;\n  background-color: var(--salt-container-secondary-background);\n  border-color: var(--salt-container-primary-borderColor);\n  border-style: var(--vuuFilterBar-borderStyle, none none solid none);\n  border-width: 1px;\n  display: inline-flex;\n  flex: var(--vuuFilterBar-flex);\n  flex-wrap: wrap;\n  gap: var(--flexbar-gap);\n  grid-template-columns: 70px 1fr 28px;\n  grid-auto-rows: 28px 0px;\n  height: calc(1px + var(--filterbar-height));\n  overflow: hidden;\n  padding: var(--salt-spacing-100) var(--salt-spacing-200) 0px var(--salt-spacing-200);\n\n}\n\n.vuuFilterBar-quick-filter {\n  align-items: flex-end;\n  padding: var(--salt-spacing-100) var(--salt-spacing-200);\n}\n\n.vuuFilterBar:has(.vuuFilterEditor){\n  grid-template-rows: 28px 28px;\n  height: calc(1px + var(--flexbar-gap) + (2 * var(--filterbar-height))) ;\n}\n\n.vuuFilterbar-icon {\n  display: inline-block;\n  height: 16px;\n  width: 16px;\n}\n\n.vuuFilterBar [data-icon=\"grid\"] {\n  --vuu-icon-size: 16px;\n  --vuu-icon-svg: var(--vuu-svg-grid);\n}\n.vuuFilterBar [data-icon=\"tune\"] {\n  --vuu-icon-size: 16px;\n  --vuu-icon-svg: var(--vuu-svg-tune);\n}\n\n.vuuFilterBar [data-icon=\"plus\"] {\n  --vuu-icon-size: 16px;\n}\n\n.vuuFilterBar .vuuToolbar {\n  flex: 0 1 auto;\n}\n\n.vuuFilterBar-Editor {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: var(--salt-spacing-100);\n}\n\n.vuuCustomFilters {\n  display: flex;\n  gap: var(--salt-spacing-100);\n}\n.vuuCustomFilters-filters {\n  display: flex;\n  gap: var(--salt-spacing-100);\n}\n";
+var filterBarCss = ".vuuFilterBar {\n  --vuu-svg-grid: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\"><path d=\"M2 6.00004H4.66667V3.33337H3.33333C2.6 3.33337 2 3.93337 2 4.66671V6.00004ZM2 9.33337H4.66667V6.66671H2V9.33337ZM5.33333 9.33337H8V6.66671H5.33333V9.33337ZM8.66667 9.33337H11.3333V6.66671H8.66667V9.33337ZM5.33333 6.00004H8V3.33337H5.33333V6.00004ZM8.66667 3.33337V6.00004H11.3333V3.33337H8.66667ZM12 9.33337H14.6667V6.66671H12V9.33337ZM3.33333 12.6667H4.66667V10H2V11.3334C2 12.0667 2.6 12.6667 3.33333 12.6667ZM5.33333 12.6667H8V10H5.33333V12.6667ZM8.66667 12.6667H11.3333V10H8.66667V12.6667ZM12 12.6667H13.3333C14.0667 12.6667 14.6667 12.0667 14.6667 11.3334V10H12V12.6667ZM12 3.33337V6.00004H14.6667V4.66671C14.6667 3.93337 14.0667 3.33337 13.3333 3.33337H12Z\"/></svg>');\n  --vuu-svg-tune: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\"><path d=\"M3 18C3 18.55 3.45 19 4 19H9V17H4C3.45 17 3 17.45 3 18ZM3 6C3 6.55 3.45 7 4 7H13V5H4C3.45 5 3 5.45 3 6ZM13 20V19H20C20.55 19 21 18.55 21 18C21 17.45 20.55 17 20 17H13V16C13 15.45 12.55 15 12 15C11.45 15 11 15.45 11 16V20C11 20.55 11.45 21 12 21C12.55 21 13 20.55 13 20ZM7 10V11H4C3.45 11 3 11.45 3 12C3 12.55 3.45 13 4 13H7V14C7 14.55 7.45 15 8 15C8.55 15 9 14.55 9 14V10C9 9.45 8.55 9 8 9C7.45 9 7 9.45 7 10ZM21 12C21 11.45 20.55 11 20 11H11V13H20C20.55 13 21 12.55 21 12ZM16 9C16.55 9 17 8.55 17 8V7H20C20.55 7 21 6.55 21 6C21 5.45 20.55 5 20 5H17V4C17 3.45 16.55 3 16 3C15.45 3 15 3.45 15 4V8C15 8.55 15.45 9 16 9Z\" /></svg>');\n  --vuuOverflowContainer-minWidth: 0;\n  --filterbar-height: var(\n    --vuuFilterBar-height,\n    calc(var(--salt-size-base) + var(--salt-spacing-100))\n  );\n  --vuuFilterEditor-height: var(--filterbar-height);\n  --flexbar-gap: var(--salt-spacing-100);\n\n  align-items: flex-start;\n  background-color: var(--salt-container-secondary-background);\n  border-color: var(--salt-container-primary-borderColor);\n  border-style: var(--vuuFilterBar-borderStyle, none none solid none);\n  border-width: 1px;\n  display: inline-flex;\n  flex: var(--vuuFilterBar-flex);\n  flex-wrap: wrap;\n  gap: var(--flexbar-gap);\n  grid-template-columns: 70px 1fr 28px;\n  grid-auto-rows: 28px 0px;\n  height: calc(var(--salt-spacing-100) + var(--filterbar-height));\n  overflow: hidden;\n  padding: var(--salt-spacing-100) var(--salt-spacing-200);\n}\n\n.vuuFilterBar-quick-filter {\n  align-items: flex-end;\n  padding: var(--salt-spacing-100) var(--salt-spacing-200);\n}\n\n.vuuFilterBar:has(.vuuFilterEditor) {\n  grid-template-rows: 28px 28px;\n  height: calc(1px + var(--flexbar-gap) + (2 * var(--filterbar-height)));\n}\n\n.vuuFilterbar-icon {\n  display: inline-block;\n  height: 16px;\n  width: 16px;\n}\n\n.vuuFilterBar [data-icon=\"grid\"] {\n  --vuu-icon-size: 16px;\n  --vuu-icon-svg: var(--vuu-svg-grid);\n}\n.vuuFilterBar [data-icon=\"tune\"] {\n  --vuu-icon-size: 16px;\n  --vuu-icon-svg: var(--vuu-svg-tune);\n}\n\n.vuuFilterBar [data-icon=\"plus\"] {\n  --vuu-icon-size: 16px;\n}\n\n.vuuFilterBar .vuuToolbar {\n  flex: 0 1 auto;\n}\n\n.vuuFilterBar-Editor {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: var(--salt-spacing-100);\n}\n\n.vuuCustomFilters {\n  display: flex;\n  gap: var(--salt-spacing-100);\n}\n.vuuCustomFilters-filters {\n  display: flex;\n  gap: var(--salt-spacing-100);\n}\n";
 
 export { filterBarCss as default };
 //# sourceMappingURL=FilterBar.css.js.map

package/esm/index.js

@@ -6,6 +6,6 @@ export { FilterClauseValueEditorText } from './filter-clause/value-editors/Filte
 export { FilterEditor } from './filter-editor/FilterEditor.js';
 export { FilterPill } from './filter-pill/FilterPill.js';
 export { AND, ENDS_WITH, EQUALS, GREATER_THAN, IN, LESS_THAN, OR, STARTS_WITH, addClause, addFilter, filterClauses, filterEquals, filterIncludesColumn, getNumericFilter, getTypeaheadFilter, overrideColName, removeFilter, removeLastClause, splitFilterOnColumn, updateFilter } from './filter-utils.js';
+export { InlineFilter } from './inline-filter/InlineFilter.js';
 export { QuickFilters } from './quick-filters/QuickFilters.js';
-export { useFilterConfig } from './use-filter-config.js';
 //# sourceMappingURL=index.js.map

package/esm/inline-filter/InlineFilter.css.js

@@ -0,0 +1,4 @@
+var inlineFilteCss = ".vuuInlineFilter {\n  .vuuInlineFilter-filter {\n    display: inline-block;\n    padding: 1px;\n  }\n\n  .vuuInlineFilter-virtualColSpan {\n    display: inline-block;\n  }\n}\n";
+
+export { inlineFilteCss as default };
+//# sourceMappingURL=InlineFilter.css.js.map

package/esm/inline-filter/InlineFilter.css.js.map

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

package/esm/inline-filter/InlineFilter.js

@@ -0,0 +1,50 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { getDataItemEditControl } from '@vuu-ui/vuu-data-react';
+import { useHeaderProps, VirtualColSpan } from '@vuu-ui/vuu-table';
+import { queryClosest } from '@vuu-ui/vuu-utils';
+import { useComponentCssInjection } from '@salt-ds/styles';
+import { useWindow } from '@salt-ds/window';
+import { useCallback } from 'react';
+import inlineFilteCss from './InlineFilter.css.js';
+
+const classBase = "vuuInlineFilter";
+const InlineFilter = ({
+  onChange,
+  ...htmlAttributes
+}) => {
+  const targetWindow = useWindow();
+  useComponentCssInjection({
+    testId: "vuu-inline-filter",
+    css: inlineFilteCss,
+    window: targetWindow
+  });
+  const { columns, virtualColSpan = 0 } = useHeaderProps();
+  const onCommit = useCallback(
+    (evt, value) => {
+      const field = queryClosest(evt.target, "[data-field]");
+      if (field) {
+        const columnName = field.dataset.field;
+        const column = columns.find((c) => c.name === columnName);
+        if (column) {
+          onChange(column, value);
+        }
+      }
+    },
+    [columns, onChange]
+  );
+  return /* @__PURE__ */ jsxs("div", { ...htmlAttributes, className: classBase, children: [
+    /* @__PURE__ */ jsx(VirtualColSpan, { width: virtualColSpan }),
+    columns.map((column) => /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: `${classBase}-filter`,
+        style: { width: column.width },
+        children: getDataItemEditControl({ column, onCommit })
+      },
+      column.name
+    ))
+  ] });
+};
+
+export { InlineFilter };
+//# sourceMappingURL=InlineFilter.js.map

package/esm/inline-filter/InlineFilter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineFilter.js","sources":["../../src/inline-filter/InlineFilter.tsx"],"sourcesContent":["import { getDataItemEditControl } from \"@vuu-ui/vuu-data-react\";\nimport { VirtualColSpan, useHeaderProps } from \"@vuu-ui/vuu-table\";\nimport { Commithandler } from \"@vuu-ui/vuu-ui-controls\";\nimport { queryClosest } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes, useCallback } from \"react\";\n\nimport inlineFilteCss from \"./InlineFilter.css\";\nimport { ColumnDescriptor } from \"packages/vuu-table-types\";\n\nconst classBase = \"vuuInlineFilter\";\n\nexport type FilterValueChangeHandler = (\n  column: ColumnDescriptor,\n  value: string\n) => void;\nexport interface InlineFilterProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  onChange: FilterValueChangeHandler;\n}\n\nexport const InlineFilter = ({\n  onChange,\n  ...htmlAttributes\n}: InlineFilterProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-inline-filter\",\n    css: inlineFilteCss,\n    window: targetWindow,\n  });\n\n  const { columns, virtualColSpan = 0 } = useHeaderProps();\n\n  const onCommit = useCallback<Commithandler>(\n    (evt, value) => {\n      const field = queryClosest(evt.target, \"[data-field]\");\n      if (field) {\n        const columnName = field.dataset.field;\n        const column = columns.find((c) => c.name === columnName);\n        if (column) {\n          onChange(column, value);\n        }\n      }\n    },\n    [columns, onChange]\n  );\n\n  return (\n    <div {...htmlAttributes} className={classBase}>\n      <VirtualColSpan width={virtualColSpan} />\n      {columns.map((column) => (\n        <div\n          className={`${classBase}-filter`}\n          key={column.name}\n          style={{ width: column.width }}\n        >\n          {getDataItemEditControl({ column, onCommit })}\n        </div>\n      ))}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAWA,MAAM,SAAY,GAAA,iBAAA,CAAA;AAWX,MAAM,eAAe,CAAC;AAAA,EAC3B,QAAA;AAAA,EACA,GAAG,cAAA;AACL,CAAyB,KAAA;AACvB,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAA,cAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,OAAA,EAAS,cAAiB,GAAA,CAAA,KAAM,cAAe,EAAA,CAAA;AAEvD,EAAA,MAAM,QAAW,GAAA,WAAA;AAAA,IACf,CAAC,KAAK,KAAU,KAAA;AACd,MAAA,MAAM,KAAQ,GAAA,YAAA,CAAa,GAAI,CAAA,MAAA,EAAQ,cAAc,CAAA,CAAA;AACrD,MAAA,IAAI,KAAO,EAAA;AACT,QAAM,MAAA,UAAA,GAAa,MAAM,OAAQ,CAAA,KAAA,CAAA;AACjC,QAAA,MAAM,SAAS,OAAQ,CAAA,IAAA,CAAK,CAAC,CAAM,KAAA,CAAA,CAAE,SAAS,UAAU,CAAA,CAAA;AACxD,QAAA,IAAI,MAAQ,EAAA;AACV,UAAA,QAAA,CAAS,QAAQ,KAAK,CAAA,CAAA;AAAA,SACxB;AAAA,OACF;AAAA,KACF;AAAA,IACA,CAAC,SAAS,QAAQ,CAAA;AAAA,GACpB,CAAA;AAEA,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA,EAAK,GAAG,cAAA,EAAgB,WAAW,SAClC,EAAA,QAAA,EAAA;AAAA,oBAAC,GAAA,CAAA,cAAA,EAAA,EAAe,OAAO,cAAgB,EAAA,CAAA;AAAA,IACtC,OAAA,CAAQ,GAAI,CAAA,CAAC,MACZ,qBAAA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,GAAG,SAAS,CAAA,OAAA,CAAA;AAAA,QAEvB,KAAO,EAAA,EAAE,KAAO,EAAA,MAAA,CAAO,KAAM,EAAA;AAAA,QAE5B,QAAuB,EAAA,sBAAA,CAAA,EAAE,MAAQ,EAAA,QAAA,EAAU,CAAA;AAAA,OAAA;AAAA,MAHvC,MAAO,CAAA,IAAA;AAAA,KAKf,CAAA;AAAA,GACH,EAAA,CAAA,CAAA;AAEJ;;;;"}

package/package.json

@@ -1,23 +1,23 @@
 {
-  "version": "0.8.57",
+  "version": "0.8.59",
   "author": "heswell",
   "license": "Apache-2.0",
   "type": "module",
   "devDependencies": {
-    "@vuu-ui/vuu-data-types": "0.8.57",
-    "@vuu-ui/vuu-protocol-types": "0.8.57",
-    "@vuu-ui/vuu-table-types": "0.8.57",
-    "@vuu-ui/vuu-filter-types": "0.8.57",
+    "@vuu-ui/vuu-data-types": "0.8.59",
+    "@vuu-ui/vuu-protocol-types": "0.8.59",
+    "@vuu-ui/vuu-table-types": "0.8.59",
+    "@vuu-ui/vuu-filter-types": "0.8.59",
     "@types/uuid": "^9.0.2"
   },
   "dependencies": {
-    "@vuu-ui/vuu-codemirror": "0.8.57",
-    "@vuu-ui/vuu-data-react": "0.8.57",
-    "@vuu-ui/vuu-filter-parser": "0.8.57",
-    "@vuu-ui/vuu-popups": "0.8.57",
-    "@vuu-ui/vuu-ui-controls": "0.8.57",
-    "@vuu-ui/vuu-utils": "0.8.57",
-    "@salt-ds/core": "1.22.0",
+    "@vuu-ui/vuu-data-react": "0.8.59",
+    "@vuu-ui/vuu-filter-parser": "0.8.59",
+    "@vuu-ui/vuu-popups": "0.8.59",
+    "@vuu-ui/vuu-ui-controls": "0.8.59",
+    "@vuu-ui/vuu-table": "0.8.59",
+    "@vuu-ui/vuu-utils": "0.8.59",
+    "@salt-ds/core": "1.27.1",
     "@salt-ds/styles": "0.2.1",
     "@salt-ds/window": "0.1.1",
     "uuid": "9.0.0"

package/types/FilterModel.d.ts

@@ -18,7 +18,7 @@ export declare class FilterClauseModel extends EventEmitter<FilterClauseModelEve
     private setIsValid;
     get column(): undefined | string;
     set column(column: undefined | string);
-    get op(): "in" | import("@vuu-ui/vuu-filter-types").SingleValueFilterClauseOp | undefined;
+    get op(): import("@vuu-ui/vuu-filter-types").SingleValueFilterClauseOp | "in" | undefined;
     setOp(op: undefined | FilterClauseOp): void;
     setValue(value: undefined | string | string[] | number | number[] | boolean | boolean[], isFinal?: boolean): void;
     asFilter(throwIfInvalid?: boolean): FilterClause;

package/types/filter-clause/ColumnPicker.d.ts

@@ -5,7 +5,7 @@ export type ColumnPickerProps = Pick<ComboBoxProps, "className" | "inputProps" |
     columns: ColumnDescriptor[];
     onSelect: (evt: SyntheticEvent, columnName: string) => void;
 };
-export declare const ColumnPicker: import("react").ForwardRefExoticComponent<Pick<ComboBoxProps, "value" | "className" | "inputProps"> & {
+export declare const ColumnPicker: import("react").ForwardRefExoticComponent<Pick<ComboBoxProps, "className" | "value" | "inputProps"> & {
     columns: ColumnDescriptor[];
     onSelect: (evt: SyntheticEvent, columnName: string) => void;
 } & import("react").RefAttributes<HTMLDivElement>>;

package/types/filter-clause/OperatorPicker.d.ts

@@ -6,7 +6,7 @@ export type OperatorPickerProps = Pick<ComboBoxProps, "className" | "inputProps"
     column: ColumnDescriptor;
     onSelect: (evt: SyntheticEvent, operator: FilterClauseOp) => void;
 };
-export declare const OperatorPicker: import("react").ForwardRefExoticComponent<Pick<ComboBoxProps, "value" | "className" | "inputProps"> & {
+export declare const OperatorPicker: import("react").ForwardRefExoticComponent<Pick<ComboBoxProps, "className" | "value" | "inputProps"> & {
     column: ColumnDescriptor;
     onSelect: (evt: SyntheticEvent, operator: FilterClauseOp) => void;
 } & import("react").RefAttributes<HTMLDivElement>>;

package/types/index.d.ts

@@ -4,5 +4,5 @@ export * from "./filter-clause";
 export * from "./filter-editor";
 export * from "./filter-pill";
 export * from "./filter-utils";
+export * from "./inline-filter";
 export * from "./quick-filters";
-export * from "./use-filter-config";

package/types/inline-filter/InlineFilter.d.ts

@@ -0,0 +1,7 @@
+import { HTMLAttributes } from "react";
+import { ColumnDescriptor } from "packages/vuu-table-types";
+export type FilterValueChangeHandler = (column: ColumnDescriptor, value: string) => void;
+export interface InlineFilterProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange"> {
+    onChange: FilterValueChangeHandler;
+}
+export declare const InlineFilter: ({ onChange, ...htmlAttributes }: InlineFilterProps) => JSX.Element;

package/types/inline-filter/index.d.ts

@@ -0,0 +1 @@
+export * from "./InlineFilter";

package/cjs/use-filter-config.js

@@ -1,39 +0,0 @@
-'use strict';
-
-var useRestConfig = require('./use-rest-config.js');
-var react = require('react');
-
-const useFilterConfig = ({
-  user,
-  saveUrl = "api/vui/filters",
-  saveLocation = "local"
-  // TODO: "remote" is not supported yet
-}) => {
-  const [allFilters, setAllFilters] = react.useState();
-  const { get, getAll, save } = useRestConfig.useRestEntityStore({
-    baseUrl: `${saveUrl}/${user.username}`,
-    saveLocation
-  });
-  const refreshAllFilters = react.useCallback(async () => {
-    const filters = await getAll();
-    setAllFilters(filters);
-  }, [getAll]);
-  react.useEffect(() => {
-    refreshAllFilters().catch((err) => console.error(err));
-  }, [refreshAllFilters]);
-  const saveFilter = react.useCallback(
-    async (filter) => {
-      await save(filter);
-      await refreshAllFilters();
-    },
-    [save, refreshAllFilters]
-  );
-  return {
-    allFilters,
-    getFilterById: get,
-    saveFilter
-  };
-};
-
-exports.useFilterConfig = useFilterConfig;
-//# sourceMappingURL=use-filter-config.js.map

package/cjs/use-filter-config.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-filter-config.js","sources":["../src/use-filter-config.ts"],"sourcesContent":["import { NamedDataSourceFilter } from \"@vuu-ui/vuu-data-types\";\nimport { SaveLocation } from \"@vuu-ui/vuu-shell\";\nimport { useRestEntityStore } from \"./use-rest-config\";\nimport { useCallback, useEffect, useState } from \"react\";\nimport type { VuuUser } from \"@vuu-ui/vuu-utils\";\n\nexport interface FilterConfigHookProps {\n  user: VuuUser;\n  saveUrl?: string;\n  saveLocation: SaveLocation;\n}\n\nexport const useFilterConfig = ({\n  user,\n  saveUrl = \"api/vui/filters\",\n  saveLocation = \"local\", // TODO: \"remote\" is not supported yet\n}: FilterConfigHookProps) => {\n  const [allFilters, setAllFilters] = useState<NamedDataSourceFilter[]>();\n\n  const { get, getAll, save } = useRestEntityStore<NamedDataSourceFilter>({\n    baseUrl: `${saveUrl}/${user.username}`,\n    saveLocation,\n  });\n\n  const refreshAllFilters = useCallback(async () => {\n    const filters = await getAll();\n    setAllFilters(filters);\n  }, [getAll]);\n\n  useEffect(() => {\n    refreshAllFilters().catch((err) => console.error(err));\n  }, [refreshAllFilters]);\n\n  const saveFilter = useCallback(\n    async (filter: NamedDataSourceFilter) => {\n      await save(filter);\n      await refreshAllFilters();\n    },\n    [save, refreshAllFilters]\n  );\n\n  return {\n    allFilters,\n    getFilterById: get,\n    saveFilter,\n  };\n};\n"],"names":["useState","useRestEntityStore","useCallback","useEffect"],"mappings":";;;;;AAYO,MAAM,kBAAkB,CAAC;AAAA,EAC9B,IAAA;AAAA,EACA,OAAU,GAAA,iBAAA;AAAA,EACV,YAAe,GAAA,OAAA;AAAA;AACjB,CAA6B,KAAA;AAC3B,EAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAIA,cAAkC,EAAA,CAAA;AAEtE,EAAA,MAAM,EAAE,GAAA,EAAK,MAAQ,EAAA,IAAA,KAASC,gCAA0C,CAAA;AAAA,IACtE,OAAS,EAAA,CAAA,EAAG,OAAO,CAAA,CAAA,EAAI,KAAK,QAAQ,CAAA,CAAA;AAAA,IACpC,YAAA;AAAA,GACD,CAAA,CAAA;AAED,EAAM,MAAA,iBAAA,GAAoBC,kBAAY,YAAY;AAChD,IAAM,MAAA,OAAA,GAAU,MAAM,MAAO,EAAA,CAAA;AAC7B,IAAA,aAAA,CAAc,OAAO,CAAA,CAAA;AAAA,GACvB,EAAG,CAAC,MAAM,CAAC,CAAA,CAAA;AAEX,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,iBAAA,GAAoB,KAAM,CAAA,CAAC,QAAQ,OAAQ,CAAA,KAAA,CAAM,GAAG,CAAC,CAAA,CAAA;AAAA,GACvD,EAAG,CAAC,iBAAiB,CAAC,CAAA,CAAA;AAEtB,EAAA,MAAM,UAAa,GAAAD,iBAAA;AAAA,IACjB,OAAO,MAAkC,KAAA;AACvC,MAAA,MAAM,KAAK,MAAM,CAAA,CAAA;AACjB,MAAA,MAAM,iBAAkB,EAAA,CAAA;AAAA,KAC1B;AAAA,IACA,CAAC,MAAM,iBAAiB,CAAA;AAAA,GAC1B,CAAA;AAEA,EAAO,OAAA;AAAA,IACL,UAAA;AAAA,IACA,aAAe,EAAA,GAAA;AAAA,IACf,UAAA;AAAA,GACF,CAAA;AACF;;;;"}

package/cjs/use-rest-config.js

@@ -1,63 +0,0 @@
-'use strict';
-
-var vuuUtils = require('@vuu-ui/vuu-utils');
-var react = require('react');
-
-const useRestEntityStore = ({
-  baseUrl,
-  saveLocation
-}) => {
-  const usingLocal = saveLocation === "local";
-  const getAll = react.useCallback(async () => {
-    if (usingLocal)
-      return vuuUtils.getAllLocalEntity(baseUrl);
-    try {
-      const response = await fetch(baseUrl, {});
-      if (response.ok) {
-        return await response.json();
-      }
-    } catch {
-      console.error(`Failed to load entity at ${baseUrl}`);
-    }
-  }, [baseUrl, usingLocal]);
-  const get = react.useCallback(
-    async (id) => {
-      if (usingLocal)
-        return vuuUtils.getLocalEntity(`${baseUrl}/${id}`);
-      try {
-        const response = await fetch(`${baseUrl}/${id}`, {});
-        if (response.ok) {
-          return await response.json();
-        }
-      } catch {
-        console.error(`Failed to load entity at ${baseUrl}/${id}`);
-      }
-    },
-    [baseUrl, usingLocal]
-  );
-  const save = react.useCallback(
-    async (data) => {
-      if (usingLocal)
-        return vuuUtils.saveLocalEntity(`${baseUrl}/${vuuUtils.uuid()}`, data);
-      try {
-        const response = await fetch(baseUrl, {
-          method: "POST",
-          headers: {
-            "Content-Type": "application/json"
-          },
-          body: JSON.stringify(data)
-        });
-        if (response.ok) {
-          return await response.json();
-        }
-      } catch {
-        console.error(`Failed to save entity at ${baseUrl}`);
-      }
-    },
-    [baseUrl, usingLocal]
-  );
-  return { getAll, get, save };
-};
-
-exports.useRestEntityStore = useRestEntityStore;
-//# sourceMappingURL=use-rest-config.js.map

package/cjs/use-rest-config.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-rest-config.js","sources":["../src/use-rest-config.ts"],"sourcesContent":["import { SaveLocation } from \"@vuu-ui/vuu-shell\";\nimport {\n  getAllLocalEntity,\n  getLocalEntity,\n  saveLocalEntity,\n  uuid,\n} from \"@vuu-ui/vuu-utils\";\nimport { useCallback } from \"react\";\n\ntype EntityStoreProps = {\n  baseUrl: string;\n  saveLocation: SaveLocation;\n};\n\nexport const useRestEntityStore = <T>({\n  baseUrl,\n  saveLocation,\n}: EntityStoreProps) => {\n  const usingLocal = saveLocation === \"local\";\n\n  const getAll = useCallback(async (): Promise<T[] | undefined> => {\n    if (usingLocal) return getAllLocalEntity(baseUrl);\n    try {\n      const response = await fetch(baseUrl, {});\n      if (response.ok) {\n        return await response.json();\n      }\n    } catch {\n      console.error(`Failed to load entity at ${baseUrl}`);\n    }\n  }, [baseUrl, usingLocal]);\n\n  const get = useCallback(\n    async (id: string): Promise<T | undefined> => {\n      if (usingLocal) return getLocalEntity(`${baseUrl}/${id}`);\n      try {\n        const response = await fetch(`${baseUrl}/${id}`, {});\n        if (response.ok) {\n          return await response.json();\n        }\n      } catch {\n        console.error(`Failed to load entity at ${baseUrl}/${id}`);\n      }\n    },\n    [baseUrl, usingLocal]\n  );\n\n  const save = useCallback(\n    async (data: T): Promise<T | undefined> => {\n      if (usingLocal) return saveLocalEntity(`${baseUrl}/${uuid()}`, data);\n      try {\n        const response = await fetch(baseUrl, {\n          method: \"POST\",\n          headers: {\n            \"Content-Type\": \"application/json\",\n          },\n          body: JSON.stringify(data),\n        });\n        if (response.ok) {\n          return await response.json();\n        }\n      } catch {\n        console.error(`Failed to save entity at ${baseUrl}`);\n      }\n    },\n    [baseUrl, usingLocal]\n  );\n\n  return { getAll, get, save };\n};\n"],"names":["useCallback","getAllLocalEntity","getLocalEntity","saveLocalEntity","uuid"],"mappings":";;;;;AAcO,MAAM,qBAAqB,CAAI;AAAA,EACpC,OAAA;AAAA,EACA,YAAA;AACF,CAAwB,KAAA;AACtB,EAAA,MAAM,aAAa,YAAiB,KAAA,OAAA,CAAA;AAEpC,EAAM,MAAA,MAAA,GAASA,kBAAY,YAAsC;AAC/D,IAAI,IAAA,UAAA;AAAY,MAAA,OAAOC,2BAAkB,OAAO,CAAA,CAAA;AAChD,IAAI,IAAA;AACF,MAAA,MAAM,QAAW,GAAA,MAAM,KAAM,CAAA,OAAA,EAAS,EAAE,CAAA,CAAA;AACxC,MAAA,IAAI,SAAS,EAAI,EAAA;AACf,QAAO,OAAA,MAAM,SAAS,IAAK,EAAA,CAAA;AAAA,OAC7B;AAAA,KACM,CAAA,MAAA;AACN,MAAQ,OAAA,CAAA,KAAA,CAAM,CAA4B,yBAAA,EAAA,OAAO,CAAE,CAAA,CAAA,CAAA;AAAA,KACrD;AAAA,GACC,EAAA,CAAC,OAAS,EAAA,UAAU,CAAC,CAAA,CAAA;AAExB,EAAA,MAAM,GAAM,GAAAD,iBAAA;AAAA,IACV,OAAO,EAAuC,KAAA;AAC5C,MAAI,IAAA,UAAA;AAAY,QAAA,OAAOE,uBAAe,CAAA,CAAA,EAAG,OAAO,CAAA,CAAA,EAAI,EAAE,CAAE,CAAA,CAAA,CAAA;AACxD,MAAI,IAAA;AACF,QAAM,MAAA,QAAA,GAAW,MAAM,KAAM,CAAA,CAAA,EAAG,OAAO,CAAI,CAAA,EAAA,EAAE,CAAI,CAAA,EAAA,EAAE,CAAA,CAAA;AACnD,QAAA,IAAI,SAAS,EAAI,EAAA;AACf,UAAO,OAAA,MAAM,SAAS,IAAK,EAAA,CAAA;AAAA,SAC7B;AAAA,OACM,CAAA,MAAA;AACN,QAAA,OAAA,CAAQ,KAAM,CAAA,CAAA,yBAAA,EAA4B,OAAO,CAAA,CAAA,EAAI,EAAE,CAAE,CAAA,CAAA,CAAA;AAAA,OAC3D;AAAA,KACF;AAAA,IACA,CAAC,SAAS,UAAU,CAAA;AAAA,GACtB,CAAA;AAEA,EAAA,MAAM,IAAO,GAAAF,iBAAA;AAAA,IACX,OAAO,IAAoC,KAAA;AACzC,MAAI,IAAA,UAAA;AAAY,QAAA,OAAOG,yBAAgB,CAAG,EAAA,OAAO,IAAIC,aAAK,EAAC,IAAI,IAAI,CAAA,CAAA;AACnE,MAAI,IAAA;AACF,QAAM,MAAA,QAAA,GAAW,MAAM,KAAA,CAAM,OAAS,EAAA;AAAA,UACpC,MAAQ,EAAA,MAAA;AAAA,UACR,OAAS,EAAA;AAAA,YACP,cAAgB,EAAA,kBAAA;AAAA,WAClB;AAAA,UACA,IAAA,EAAM,IAAK,CAAA,SAAA,CAAU,IAAI,CAAA;AAAA,SAC1B,CAAA,CAAA;AACD,QAAA,IAAI,SAAS,EAAI,EAAA;AACf,UAAO,OAAA,MAAM,SAAS,IAAK,EAAA,CAAA;AAAA,SAC7B;AAAA,OACM,CAAA,MAAA;AACN,QAAQ,OAAA,CAAA,KAAA,CAAM,CAA4B,yBAAA,EAAA,OAAO,CAAE,CAAA,CAAA,CAAA;AAAA,OACrD;AAAA,KACF;AAAA,IACA,CAAC,SAAS,UAAU,CAAA;AAAA,GACtB,CAAA;AAEA,EAAO,OAAA,EAAE,MAAQ,EAAA,GAAA,EAAK,IAAK,EAAA,CAAA;AAC7B;;;;"}

package/esm/use-filter-config.js

@@ -1,37 +0,0 @@
-import { useRestEntityStore } from './use-rest-config.js';
-import { useState, useCallback, useEffect } from 'react';
-
-const useFilterConfig = ({
-  user,
-  saveUrl = "api/vui/filters",
-  saveLocation = "local"
-  // TODO: "remote" is not supported yet
-}) => {
-  const [allFilters, setAllFilters] = useState();
-  const { get, getAll, save } = useRestEntityStore({
-    baseUrl: `${saveUrl}/${user.username}`,
-    saveLocation
-  });
-  const refreshAllFilters = useCallback(async () => {
-    const filters = await getAll();
-    setAllFilters(filters);
-  }, [getAll]);
-  useEffect(() => {
-    refreshAllFilters().catch((err) => console.error(err));
-  }, [refreshAllFilters]);
-  const saveFilter = useCallback(
-    async (filter) => {
-      await save(filter);
-      await refreshAllFilters();
-    },
-    [save, refreshAllFilters]
-  );
-  return {
-    allFilters,
-    getFilterById: get,
-    saveFilter
-  };
-};
-
-export { useFilterConfig };
-//# sourceMappingURL=use-filter-config.js.map

package/esm/use-filter-config.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-filter-config.js","sources":["../src/use-filter-config.ts"],"sourcesContent":["import { NamedDataSourceFilter } from \"@vuu-ui/vuu-data-types\";\nimport { SaveLocation } from \"@vuu-ui/vuu-shell\";\nimport { useRestEntityStore } from \"./use-rest-config\";\nimport { useCallback, useEffect, useState } from \"react\";\nimport type { VuuUser } from \"@vuu-ui/vuu-utils\";\n\nexport interface FilterConfigHookProps {\n  user: VuuUser;\n  saveUrl?: string;\n  saveLocation: SaveLocation;\n}\n\nexport const useFilterConfig = ({\n  user,\n  saveUrl = \"api/vui/filters\",\n  saveLocation = \"local\", // TODO: \"remote\" is not supported yet\n}: FilterConfigHookProps) => {\n  const [allFilters, setAllFilters] = useState<NamedDataSourceFilter[]>();\n\n  const { get, getAll, save } = useRestEntityStore<NamedDataSourceFilter>({\n    baseUrl: `${saveUrl}/${user.username}`,\n    saveLocation,\n  });\n\n  const refreshAllFilters = useCallback(async () => {\n    const filters = await getAll();\n    setAllFilters(filters);\n  }, [getAll]);\n\n  useEffect(() => {\n    refreshAllFilters().catch((err) => console.error(err));\n  }, [refreshAllFilters]);\n\n  const saveFilter = useCallback(\n    async (filter: NamedDataSourceFilter) => {\n      await save(filter);\n      await refreshAllFilters();\n    },\n    [save, refreshAllFilters]\n  );\n\n  return {\n    allFilters,\n    getFilterById: get,\n    saveFilter,\n  };\n};\n"],"names":[],"mappings":";;;AAYO,MAAM,kBAAkB,CAAC;AAAA,EAC9B,IAAA;AAAA,EACA,OAAU,GAAA,iBAAA;AAAA,EACV,YAAe,GAAA,OAAA;AAAA;AACjB,CAA6B,KAAA;AAC3B,EAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAI,QAAkC,EAAA,CAAA;AAEtE,EAAA,MAAM,EAAE,GAAA,EAAK,MAAQ,EAAA,IAAA,KAAS,kBAA0C,CAAA;AAAA,IACtE,OAAS,EAAA,CAAA,EAAG,OAAO,CAAA,CAAA,EAAI,KAAK,QAAQ,CAAA,CAAA;AAAA,IACpC,YAAA;AAAA,GACD,CAAA,CAAA;AAED,EAAM,MAAA,iBAAA,GAAoB,YAAY,YAAY;AAChD,IAAM,MAAA,OAAA,GAAU,MAAM,MAAO,EAAA,CAAA;AAC7B,IAAA,aAAA,CAAc,OAAO,CAAA,CAAA;AAAA,GACvB,EAAG,CAAC,MAAM,CAAC,CAAA,CAAA;AAEX,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,iBAAA,GAAoB,KAAM,CAAA,CAAC,QAAQ,OAAQ,CAAA,KAAA,CAAM,GAAG,CAAC,CAAA,CAAA;AAAA,GACvD,EAAG,CAAC,iBAAiB,CAAC,CAAA,CAAA;AAEtB,EAAA,MAAM,UAAa,GAAA,WAAA;AAAA,IACjB,OAAO,MAAkC,KAAA;AACvC,MAAA,MAAM,KAAK,MAAM,CAAA,CAAA;AACjB,MAAA,MAAM,iBAAkB,EAAA,CAAA;AAAA,KAC1B;AAAA,IACA,CAAC,MAAM,iBAAiB,CAAA;AAAA,GAC1B,CAAA;AAEA,EAAO,OAAA;AAAA,IACL,UAAA;AAAA,IACA,aAAe,EAAA,GAAA;AAAA,IACf,UAAA;AAAA,GACF,CAAA;AACF;;;;"}

package/esm/use-rest-config.js

@@ -1,61 +0,0 @@
-import { getAllLocalEntity, getLocalEntity, saveLocalEntity, uuid } from '@vuu-ui/vuu-utils';
-import { useCallback } from 'react';
-
-const useRestEntityStore = ({
-  baseUrl,
-  saveLocation
-}) => {
-  const usingLocal = saveLocation === "local";
-  const getAll = useCallback(async () => {
-    if (usingLocal)
-      return getAllLocalEntity(baseUrl);
-    try {
-      const response = await fetch(baseUrl, {});
-      if (response.ok) {
-        return await response.json();
-      }
-    } catch {
-      console.error(`Failed to load entity at ${baseUrl}`);
-    }
-  }, [baseUrl, usingLocal]);
-  const get = useCallback(
-    async (id) => {
-      if (usingLocal)
-        return getLocalEntity(`${baseUrl}/${id}`);
-      try {
-        const response = await fetch(`${baseUrl}/${id}`, {});
-        if (response.ok) {
-          return await response.json();
-        }
-      } catch {
-        console.error(`Failed to load entity at ${baseUrl}/${id}`);
-      }
-    },
-    [baseUrl, usingLocal]
-  );
-  const save = useCallback(
-    async (data) => {
-      if (usingLocal)
-        return saveLocalEntity(`${baseUrl}/${uuid()}`, data);
-      try {
-        const response = await fetch(baseUrl, {
-          method: "POST",
-          headers: {
-            "Content-Type": "application/json"
-          },
-          body: JSON.stringify(data)
-        });
-        if (response.ok) {
-          return await response.json();
-        }
-      } catch {
-        console.error(`Failed to save entity at ${baseUrl}`);
-      }
-    },
-    [baseUrl, usingLocal]
-  );
-  return { getAll, get, save };
-};
-
-export { useRestEntityStore };
-//# sourceMappingURL=use-rest-config.js.map

package/esm/use-rest-config.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-rest-config.js","sources":["../src/use-rest-config.ts"],"sourcesContent":["import { SaveLocation } from \"@vuu-ui/vuu-shell\";\nimport {\n  getAllLocalEntity,\n  getLocalEntity,\n  saveLocalEntity,\n  uuid,\n} from \"@vuu-ui/vuu-utils\";\nimport { useCallback } from \"react\";\n\ntype EntityStoreProps = {\n  baseUrl: string;\n  saveLocation: SaveLocation;\n};\n\nexport const useRestEntityStore = <T>({\n  baseUrl,\n  saveLocation,\n}: EntityStoreProps) => {\n  const usingLocal = saveLocation === \"local\";\n\n  const getAll = useCallback(async (): Promise<T[] | undefined> => {\n    if (usingLocal) return getAllLocalEntity(baseUrl);\n    try {\n      const response = await fetch(baseUrl, {});\n      if (response.ok) {\n        return await response.json();\n      }\n    } catch {\n      console.error(`Failed to load entity at ${baseUrl}`);\n    }\n  }, [baseUrl, usingLocal]);\n\n  const get = useCallback(\n    async (id: string): Promise<T | undefined> => {\n      if (usingLocal) return getLocalEntity(`${baseUrl}/${id}`);\n      try {\n        const response = await fetch(`${baseUrl}/${id}`, {});\n        if (response.ok) {\n          return await response.json();\n        }\n      } catch {\n        console.error(`Failed to load entity at ${baseUrl}/${id}`);\n      }\n    },\n    [baseUrl, usingLocal]\n  );\n\n  const save = useCallback(\n    async (data: T): Promise<T | undefined> => {\n      if (usingLocal) return saveLocalEntity(`${baseUrl}/${uuid()}`, data);\n      try {\n        const response = await fetch(baseUrl, {\n          method: \"POST\",\n          headers: {\n            \"Content-Type\": \"application/json\",\n          },\n          body: JSON.stringify(data),\n        });\n        if (response.ok) {\n          return await response.json();\n        }\n      } catch {\n        console.error(`Failed to save entity at ${baseUrl}`);\n      }\n    },\n    [baseUrl, usingLocal]\n  );\n\n  return { getAll, get, save };\n};\n"],"names":[],"mappings":";;;AAcO,MAAM,qBAAqB,CAAI;AAAA,EACpC,OAAA;AAAA,EACA,YAAA;AACF,CAAwB,KAAA;AACtB,EAAA,MAAM,aAAa,YAAiB,KAAA,OAAA,CAAA;AAEpC,EAAM,MAAA,MAAA,GAAS,YAAY,YAAsC;AAC/D,IAAI,IAAA,UAAA;AAAY,MAAA,OAAO,kBAAkB,OAAO,CAAA,CAAA;AAChD,IAAI,IAAA;AACF,MAAA,MAAM,QAAW,GAAA,MAAM,KAAM,CAAA,OAAA,EAAS,EAAE,CAAA,CAAA;AACxC,MAAA,IAAI,SAAS,EAAI,EAAA;AACf,QAAO,OAAA,MAAM,SAAS,IAAK,EAAA,CAAA;AAAA,OAC7B;AAAA,KACM,CAAA,MAAA;AACN,MAAQ,OAAA,CAAA,KAAA,CAAM,CAA4B,yBAAA,EAAA,OAAO,CAAE,CAAA,CAAA,CAAA;AAAA,KACrD;AAAA,GACC,EAAA,CAAC,OAAS,EAAA,UAAU,CAAC,CAAA,CAAA;AAExB,EAAA,MAAM,GAAM,GAAA,WAAA;AAAA,IACV,OAAO,EAAuC,KAAA;AAC5C,MAAI,IAAA,UAAA;AAAY,QAAA,OAAO,cAAe,CAAA,CAAA,EAAG,OAAO,CAAA,CAAA,EAAI,EAAE,CAAE,CAAA,CAAA,CAAA;AACxD,MAAI,IAAA;AACF,QAAM,MAAA,QAAA,GAAW,MAAM,KAAM,CAAA,CAAA,EAAG,OAAO,CAAI,CAAA,EAAA,EAAE,CAAI,CAAA,EAAA,EAAE,CAAA,CAAA;AACnD,QAAA,IAAI,SAAS,EAAI,EAAA;AACf,UAAO,OAAA,MAAM,SAAS,IAAK,EAAA,CAAA;AAAA,SAC7B;AAAA,OACM,CAAA,MAAA;AACN,QAAA,OAAA,CAAQ,KAAM,CAAA,CAAA,yBAAA,EAA4B,OAAO,CAAA,CAAA,EAAI,EAAE,CAAE,CAAA,CAAA,CAAA;AAAA,OAC3D;AAAA,KACF;AAAA,IACA,CAAC,SAAS,UAAU,CAAA;AAAA,GACtB,CAAA;AAEA,EAAA,MAAM,IAAO,GAAA,WAAA;AAAA,IACX,OAAO,IAAoC,KAAA;AACzC,MAAI,IAAA,UAAA;AAAY,QAAA,OAAO,gBAAgB,CAAG,EAAA,OAAO,IAAI,IAAK,EAAC,IAAI,IAAI,CAAA,CAAA;AACnE,MAAI,IAAA;AACF,QAAM,MAAA,QAAA,GAAW,MAAM,KAAA,CAAM,OAAS,EAAA;AAAA,UACpC,MAAQ,EAAA,MAAA;AAAA,UACR,OAAS,EAAA;AAAA,YACP,cAAgB,EAAA,kBAAA;AAAA,WAClB;AAAA,UACA,IAAA,EAAM,IAAK,CAAA,SAAA,CAAU,IAAI,CAAA;AAAA,SAC1B,CAAA,CAAA;AACD,QAAA,IAAI,SAAS,EAAI,EAAA;AACf,UAAO,OAAA,MAAM,SAAS,IAAK,EAAA,CAAA;AAAA,SAC7B;AAAA,OACM,CAAA,MAAA;AACN,QAAQ,OAAA,CAAA,KAAA,CAAM,CAA4B,yBAAA,EAAA,OAAO,CAAE,CAAA,CAAA,CAAA;AAAA,OACrD;AAAA,KACF;AAAA,IACA,CAAC,SAAS,UAAU,CAAA;AAAA,GACtB,CAAA;AAEA,EAAO,OAAA,EAAE,MAAQ,EAAA,GAAA,EAAK,IAAK,EAAA,CAAA;AAC7B;;;;"}

package/types/use-filter-config.d.ts

@@ -1,13 +0,0 @@
-import { NamedDataSourceFilter } from "@vuu-ui/vuu-data-types";
-import { SaveLocation } from "@vuu-ui/vuu-shell";
-import type { VuuUser } from "@vuu-ui/vuu-utils";
-export interface FilterConfigHookProps {
-    user: VuuUser;
-    saveUrl?: string;
-    saveLocation: SaveLocation;
-}
-export declare const useFilterConfig: ({ user, saveUrl, saveLocation, }: FilterConfigHookProps) => {
-    allFilters: NamedDataSourceFilter[] | undefined;
-    getFilterById: (id: string) => Promise<NamedDataSourceFilter | undefined>;
-    saveFilter: (filter: NamedDataSourceFilter) => Promise<void>;
-};

package/types/use-rest-config.d.ts

@@ -1,11 +0,0 @@
-import { SaveLocation } from "@vuu-ui/vuu-shell";
-type EntityStoreProps = {
-    baseUrl: string;
-    saveLocation: SaveLocation;
-};
-export declare const useRestEntityStore: <T>({ baseUrl, saveLocation, }: EntityStoreProps) => {
-    getAll: () => Promise<T[] | undefined>;
-    get: (id: string) => Promise<T | undefined>;
-    save: (data: T) => Promise<T | undefined>;
-};
-export {};