@contember/react-select 1.3.0-alpha.20 → 1.3.0-alpha.22

package/dist/development/components/SortableMultiSelect.js

@@ -1,12 +1,28 @@
 import { jsxDEV } from "react/jsx-dev-runtime";
 import { useMemo, useCallback } from "react";
-import { SelectCurrentEntitiesContext, SelectIsSelectedContext, SelectHandleSelectContext, SelectOptionsContext } from "../contexts.js";
-import { Component, useEntityList, HasOne } from "@contember/react-binding";
+import { SelectCurrentEntitiesContext, SelectIsSelectedContext, SelectHandleSelectContext, SelectOptionsContext, SelectOptionsFilterContext } from "../contexts.js";
+import { Component, useEntityList, QueryLanguage, PlaceholderGenerator, FieldMarker, HasOne } from "@contember/react-binding";
 import { useReferentiallyStableCallback } from "@contember/react-utils";
 import { Repeater } from "@contember/react-repeater";
-const SortableMultiSelect = Component(({ field, children, sortableBy, connectAt, options, onSelect, onUnselect }) => {
+import { useSelectFilter } from "../hooks/useSelectFilter.js";
+const SortableMultiSelect = Component(({ field, children, sortableBy, connectAt, options, onSelect, onUnselect, filterField }) => {
   const list = useEntityList({ field });
   const entitiesArr = useMemo(() => Array.from(list), [list]);
+  const optionsMarker = useMemo(() => {
+    const desugared = QueryLanguage.desugarRelativeSingleEntity({ field: connectAt }, list.environment);
+    let marker = list.getMarker();
+    for (let relation of desugared.hasOneRelationPath) {
+      const placeholder = PlaceholderGenerator.getHasOneRelationPlaceholder(relation);
+      const relationMarker = marker.fields.markers.get(placeholder);
+      if (!relationMarker || relationMarker instanceof FieldMarker) {
+        throw new Error("Invalid marker");
+      }
+      marker = relationMarker;
+    }
+    return marker;
+  }, [connectAt, list]);
+  options ?? (options = optionsMarker.environment.getSubTreeNode().entity.name);
+  const filter = useSelectFilter({ filterField, marker: optionsMarker });
   const selectedEntities = useMemo(() => Array.from(list).map((it) => it.getEntity({ field: connectAt }).id), [connectAt, list]);
   const handler = useReferentiallyStableCallback((entity, action = "toggle") => {
     const isSelected2 = selectedEntities.includes(entity.id);
@@ -26,35 +42,39 @@ const SortableMultiSelect = Component(({ field, children, sortableBy, connectAt,
   const isSelected = useCallback((entity) => {
     return selectedEntities.includes(entity.id);
   }, [selectedEntities]);
-  return /* @__PURE__ */ jsxDEV(Repeater, { field, sortableBy, initialEntityCount: 0, children: /* @__PURE__ */ jsxDEV(SelectCurrentEntitiesContext.Provider, { value: entitiesArr, children: /* @__PURE__ */ jsxDEV(SelectIsSelectedContext.Provider, { value: isSelected, children: /* @__PURE__ */ jsxDEV(SelectHandleSelectContext.Provider, { value: handler, children: /* @__PURE__ */ jsxDEV(SelectOptionsContext.Provider, { value: options, children }, void 0, false, {
+  return /* @__PURE__ */ jsxDEV(Repeater, { field, sortableBy, initialEntityCount: 0, children: /* @__PURE__ */ jsxDEV(SelectCurrentEntitiesContext.Provider, { value: entitiesArr, children: /* @__PURE__ */ jsxDEV(SelectIsSelectedContext.Provider, { value: isSelected, children: /* @__PURE__ */ jsxDEV(SelectHandleSelectContext.Provider, { value: handler, children: /* @__PURE__ */ jsxDEV(SelectOptionsContext.Provider, { value: options, children: /* @__PURE__ */ jsxDEV(SelectOptionsFilterContext.Provider, { value: filter, children }, void 0, false, {
+    fileName: "/__w/interface/interface/packages/react-select/src/components/SortableMultiSelect.tsx",
+    lineNumber: 82,
+    columnNumber: 8
+  }, void 0) }, void 0, false, {
     fileName: "/__w/interface/interface/packages/react-select/src/components/SortableMultiSelect.tsx",
-    lineNumber: 48,
+    lineNumber: 81,
     columnNumber: 7
   }, void 0) }, void 0, false, {
     fileName: "/__w/interface/interface/packages/react-select/src/components/SortableMultiSelect.tsx",
-    lineNumber: 47,
+    lineNumber: 80,
     columnNumber: 6
   }, void 0) }, void 0, false, {
     fileName: "/__w/interface/interface/packages/react-select/src/components/SortableMultiSelect.tsx",
-    lineNumber: 46,
+    lineNumber: 79,
     columnNumber: 5
   }, void 0) }, void 0, false, {
     fileName: "/__w/interface/interface/packages/react-select/src/components/SortableMultiSelect.tsx",
-    lineNumber: 45,
+    lineNumber: 78,
     columnNumber: 4
   }, void 0) }, void 0, false, {
     fileName: "/__w/interface/interface/packages/react-select/src/components/SortableMultiSelect.tsx",
-    lineNumber: 44,
+    lineNumber: 77,
     columnNumber: 3
   }, void 0);
 }, ({ children, field, sortableBy, connectAt }) => {
-  return /* @__PURE__ */ jsxDEV(Repeater, { field, sortableBy, initialEntityCount: 0, children: /* @__PURE__ */ jsxDEV(HasOne, { field: connectAt, children }, void 0, false, {
+  return /* @__PURE__ */ jsxDEV(Repeater, { field, sortableBy, initialEntityCount: 0, children: /* @__PURE__ */ jsxDEV(HasOne, { field: connectAt, expectedMutation: "connectOrDisconnect", children }, void 0, false, {
     fileName: "/__w/interface/interface/packages/react-select/src/components/SortableMultiSelect.tsx",
-    lineNumber: 59,
+    lineNumber: 94,
     columnNumber: 4
   }, void 0) }, void 0, false, {
     fileName: "/__w/interface/interface/packages/react-select/src/components/SortableMultiSelect.tsx",
-    lineNumber: 58,
+    lineNumber: 93,
     columnNumber: 3
   }, void 0);
 });

package/dist/development/components/SortableMultiSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"SortableMultiSelect.js","sources":["../../../src/components/SortableMultiSelect.tsx"],"sourcesContent":["import React, { ReactNode, useCallback, useMemo } from 'react'\nimport { SelectCurrentEntitiesContext, SelectHandler, SelectHandleSelectContext, SelectIsSelectedContext, SelectOptionsContext } from '../contexts'\nimport { Component, EntityAccessor, HasOne, SugaredQualifiedEntityList, SugaredRelativeEntityList, SugaredRelativeSingleEntity, SugaredRelativeSingleField, useEntityList } from '@contember/react-binding'\nimport { useReferentiallyStableCallback } from '@contember/react-utils'\nimport { Repeater } from '@contember/react-repeater'\nimport { SelectEvents } from '../types'\n\nexport type SortableMultiSelectProps =\n\t& {\n\t\tchildren: ReactNode\n\t\tfield: SugaredRelativeEntityList['field']\n\t\toptions: SugaredQualifiedEntityList['entities']\n\t\tsortableBy: SugaredRelativeSingleField['field']\n\t\tconnectAt: SugaredRelativeSingleEntity['field']\n\t}\n\t& SelectEvents\n\nexport const SortableMultiSelect = Component(({ field, children, sortableBy, connectAt, options, onSelect, onUnselect }: SortableMultiSelectProps) => {\n\tconst list = useEntityList({ field })\n\tconst entitiesArr = useMemo(() => Array.from(list), [list])\n\n\tconst selectedEntities = useMemo(() => Array.from(list).map(it => it.getEntity({ field: connectAt }).id), [connectAt, list])\n\n\tconst handler = useReferentiallyStableCallback<SelectHandler>((entity, action = 'toggle') => {\n\t\tconst isSelected = selectedEntities.includes(entity.id)\n\t\tif (action === 'toggle') {\n\t\t\taction = isSelected ? 'unselect' : 'select'\n\t\t}\n\t\tif (action === 'unselect' && isSelected) {\n\t\t\tArray.from(list).find(it => it.getEntity({ field: connectAt }).id === entity.id)?.deleteEntity()\n\t\t\tonUnselect?.(entity)\n\t\t} else if (action === 'select' && !isSelected) {\n\t\t\tlist.createNewEntity(getEntity => {\n\t\t\t\tgetEntity().connectEntityAtField({ field: connectAt }, entity)\n\t\t\t\tonSelect?.(entity)\n\t\t\t})\n\t\t}\n\t})\n\tconst isSelected = useCallback((entity: EntityAccessor) => {\n\t\treturn selectedEntities.includes(entity.id)\n\t}, [selectedEntities])\n\n\treturn (\n\t\t<Repeater field={field} sortableBy={sortableBy} initialEntityCount={0}>\n\t\t\t<SelectCurrentEntitiesContext.Provider value={entitiesArr}>\n\t\t\t\t<SelectIsSelectedContext.Provider value={isSelected}>\n\t\t\t\t\t<SelectHandleSelectContext.Provider value={handler}>\n\t\t\t\t\t\t<SelectOptionsContext.Provider value={options}>\n\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t</SelectOptionsContext.Provider>\n\t\t\t\t\t</SelectHandleSelectContext.Provider>\n\t\t\t\t</SelectIsSelectedContext.Provider>\n\t\t\t</SelectCurrentEntitiesContext.Provider>\n\t\t</Repeater>\n\t)\n}, ({ children, field, sortableBy, connectAt }) => {\n\treturn (\n\t\t<Repeater field={field} sortableBy={sortableBy} initialEntityCount={0}>\n\t\t\t<HasOne field={connectAt}>\n\t\t\t\t{children}\n\t\t\t</HasOne>\n\t\t</Repeater>\n\t)\n})\n\n"],"names":["isSelected","this"],"mappings":";;;;;;AAiBa,MAAA,sBAAsB,UAAU,CAAC,EAAE,OAAO,UAAU,YAAY,WAAW,SAAS,UAAU,iBAA2C;AACrJ,QAAM,OAAO,cAAc,EAAE,MAAO,CAAA;AAC9B,QAAA,cAAc,QAAQ,MAAM,MAAM,KAAK,IAAI,GAAG,CAAC,IAAI,CAAC;AAEpD,QAAA,mBAAmB,QAAQ,MAAM,MAAM,KAAK,IAAI,EAAE,IAAI,CAAM,OAAA,GAAG,UAAU,EAAE,OAAO,WAAW,EAAE,EAAE,GAAG,CAAC,WAAW,IAAI,CAAC;AAE3H,QAAM,UAAU,+BAA8C,CAAC,QAAQ,SAAS,aAAa;AAC5F,UAAMA,cAAa,iBAAiB,SAAS,OAAO,EAAE;AACtD,QAAI,WAAW,UAAU;AACxB,eAASA,cAAa,aAAa;AAAA,IACpC;AACI,QAAA,WAAW,cAAcA,aAAY;AACxC,YAAM,KAAK,IAAI,EAAE,KAAK,CAAA,OAAM,GAAG,UAAU,EAAE,OAAO,UAAW,CAAA,EAAE,OAAO,OAAO,EAAE,GAAG;AAClF,mBAAa,MAAM;AAAA,IACT,WAAA,WAAW,YAAY,CAACA,aAAY;AAC9C,WAAK,gBAAgB,CAAa,cAAA;AACjC,kBAAA,EAAY,qBAAqB,EAAE,OAAO,UAAA,GAAa,MAAM;AAC7D,mBAAW,MAAM;AAAA,MAAA,CACjB;AAAA,IACF;AAAA,EAAA,CACA;AACK,QAAA,aAAa,YAAY,CAAC,WAA2B;AACnD,WAAA,iBAAiB,SAAS,OAAO,EAAE;AAAA,EAAA,GACxC,CAAC,gBAAgB,CAAC;AAErB,SACE,uBAAA,UAAA,EAAS,OAAc,YAAwB,oBAAoB,GACnE,UAAC,uBAAA,6BAA6B,UAA7B,EAAsC,OAAO,aAC7C,iCAAC,wBAAwB,UAAxB,EAAiC,OAAO,YACxC,UAAA,uBAAC,0BAA0B,UAA1B,EAAmC,OAAO,SAC1C,UAAA,uBAAC,qBAAqB,UAArB,EAA8B,OAAO,SACpC,YADF,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAC,MAEA,EAHD,GAAA,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAIA,EALD,GAAA,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAMA,EAPD,GAAA,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAQA,EATD,GAAA,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAUA,GAAAA,MAAA;AAEF,GAAG,CAAC,EAAE,UAAU,OAAO,YAAY,gBAAgB;AAEjD,SAAA,uBAAC,UAAS,EAAA,OAAc,YAAwB,oBAAoB,GACnE,UAAC,uBAAA,QAAA,EAAO,OAAO,WACb,SADF,GAAA,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAEA,EAHD,GAAA,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAIA,GAAAA,MAAA;AAEF,CAAC;"}
+{"version":3,"file":"SortableMultiSelect.js","sources":["../../../src/components/SortableMultiSelect.tsx"],"sourcesContent":["import React, { ReactNode, useCallback, useMemo } from 'react'\nimport { SelectCurrentEntitiesContext, SelectHandler, SelectHandleSelectContext, SelectIsSelectedContext, SelectOptionsContext, SelectOptionsFilterContext } from '../contexts'\nimport {\n\tComponent,\n\tEntityAccessor,\n\tFieldMarker,\n\tHasOne,\n\tMeaningfulMarker,\n\tPlaceholderGenerator,\n\tQueryLanguage,\n\tSugaredQualifiedEntityList,\n\tSugaredRelativeEntityList,\n\tSugaredRelativeSingleEntity,\n\tSugaredRelativeSingleField,\n\tuseEntityList,\n} from '@contember/react-binding'\nimport { useReferentiallyStableCallback } from '@contember/react-utils'\nimport { Repeater } from '@contember/react-repeater'\nimport { SelectEvents } from '../types'\nimport { SelectFilterFieldProps, useSelectFilter } from '../hooks'\n\nexport type SortableMultiSelectProps =\n\t& {\n\t\tchildren: ReactNode\n\t\tfield: SugaredRelativeEntityList['field']\n\t\toptions?: SugaredQualifiedEntityList['entities']\n\t\tsortableBy: SugaredRelativeSingleField['field']\n\t\tconnectAt: SugaredRelativeSingleEntity['field']\n\t}\n\t& SelectFilterFieldProps\n\t& SelectEvents\n\nexport const SortableMultiSelect = Component(({ field, children, sortableBy, connectAt, options, onSelect, onUnselect, filterField }: SortableMultiSelectProps) => {\n\tconst list = useEntityList({ field })\n\tconst entitiesArr = useMemo(() => Array.from(list), [list])\n\n\tconst optionsMarker = useMemo(() => {\n\t\tconst desugared = QueryLanguage.desugarRelativeSingleEntity({ field: connectAt }, list.environment)\n\t\tlet marker: Exclude<MeaningfulMarker, FieldMarker> = list.getMarker()\n\t\tfor (let relation of desugared.hasOneRelationPath) {\n\t\t\tconst placeholder = PlaceholderGenerator.getHasOneRelationPlaceholder(relation)\n\t\t\tconst relationMarker = marker.fields.markers.get(placeholder)\n\t\t\tif (!relationMarker || relationMarker instanceof FieldMarker) {\n\t\t\t\tthrow new Error('Invalid marker')\n\t\t\t}\n\t\t\tmarker = relationMarker\n\t\t}\n\t\treturn marker\n\t}, [connectAt, list])\n\n\toptions ??= optionsMarker.environment.getSubTreeNode().entity.name\n\n\tconst filter = useSelectFilter({ filterField, marker: optionsMarker })\n\n\tconst selectedEntities = useMemo(() => Array.from(list).map(it => it.getEntity({ field: connectAt }).id), [connectAt, list])\n\n\tconst handler = useReferentiallyStableCallback<SelectHandler>((entity, action = 'toggle') => {\n\t\tconst isSelected = selectedEntities.includes(entity.id)\n\t\tif (action === 'toggle') {\n\t\t\taction = isSelected ? 'unselect' : 'select'\n\t\t}\n\t\tif (action === 'unselect' && isSelected) {\n\t\t\tArray.from(list).find(it => it.getEntity({ field: connectAt }).id === entity.id)?.deleteEntity()\n\t\t\tonUnselect?.(entity)\n\t\t} else if (action === 'select' && !isSelected) {\n\t\t\tlist.createNewEntity(getEntity => {\n\t\t\t\tgetEntity().connectEntityAtField({ field: connectAt }, entity)\n\t\t\t\tonSelect?.(entity)\n\t\t\t})\n\t\t}\n\t})\n\tconst isSelected = useCallback((entity: EntityAccessor) => {\n\t\treturn selectedEntities.includes(entity.id)\n\t}, [selectedEntities])\n\n\treturn (\n\t\t<Repeater field={field} sortableBy={sortableBy} initialEntityCount={0}>\n\t\t\t<SelectCurrentEntitiesContext.Provider value={entitiesArr}>\n\t\t\t\t<SelectIsSelectedContext.Provider value={isSelected}>\n\t\t\t\t\t<SelectHandleSelectContext.Provider value={handler}>\n\t\t\t\t\t\t<SelectOptionsContext.Provider value={options}>\n\t\t\t\t\t\t\t<SelectOptionsFilterContext.Provider value={filter}>\n\t\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t\t</SelectOptionsFilterContext.Provider>\n\t\t\t\t\t\t</SelectOptionsContext.Provider>\n\t\t\t\t\t</SelectHandleSelectContext.Provider>\n\t\t\t\t</SelectIsSelectedContext.Provider>\n\t\t\t</SelectCurrentEntitiesContext.Provider>\n\t\t</Repeater>\n\t)\n}, ({ children, field, sortableBy, connectAt }) => {\n\treturn (\n\t\t<Repeater field={field} sortableBy={sortableBy} initialEntityCount={0}>\n\t\t\t<HasOne field={connectAt} expectedMutation=\"connectOrDisconnect\">\n\t\t\t\t{children}\n\t\t\t</HasOne>\n\t\t</Repeater>\n\t)\n})\n\n"],"names":["isSelected","this"],"mappings":";;;;;;;AAgCO,MAAM,sBAAsB,UAAU,CAAC,EAAE,OAAO,UAAU,YAAY,WAAW,SAAS,UAAU,YAAY,YAAA,MAA4C;AAClK,QAAM,OAAO,cAAc,EAAE,MAAO,CAAA;AAC9B,QAAA,cAAc,QAAQ,MAAM,MAAM,KAAK,IAAI,GAAG,CAAC,IAAI,CAAC;AAEpD,QAAA,gBAAgB,QAAQ,MAAM;AAC7B,UAAA,YAAY,cAAc,4BAA4B,EAAE,OAAO,UAAU,GAAG,KAAK,WAAW;AAC9F,QAAA,SAAiD,KAAK;AACjD,aAAA,YAAY,UAAU,oBAAoB;AAC5C,YAAA,cAAc,qBAAqB,6BAA6B,QAAQ;AAC9E,YAAM,iBAAiB,OAAO,OAAO,QAAQ,IAAI,WAAW;AACxD,UAAA,CAAC,kBAAkB,0BAA0B,aAAa;AACvD,cAAA,IAAI,MAAM,gBAAgB;AAAA,MACjC;AACS,eAAA;AAAA,IACV;AACO,WAAA;AAAA,EAAA,GACL,CAAC,WAAW,IAAI,CAAC;AAEpB,wBAAY,cAAc,YAAY,eAAe,EAAE,OAAO;AAE9D,QAAM,SAAS,gBAAgB,EAAE,aAAa,QAAQ,eAAe;AAE/D,QAAA,mBAAmB,QAAQ,MAAM,MAAM,KAAK,IAAI,EAAE,IAAI,CAAM,OAAA,GAAG,UAAU,EAAE,OAAO,WAAW,EAAE,EAAE,GAAG,CAAC,WAAW,IAAI,CAAC;AAE3H,QAAM,UAAU,+BAA8C,CAAC,QAAQ,SAAS,aAAa;AAC5F,UAAMA,cAAa,iBAAiB,SAAS,OAAO,EAAE;AACtD,QAAI,WAAW,UAAU;AACxB,eAASA,cAAa,aAAa;AAAA,IACpC;AACI,QAAA,WAAW,cAAcA,aAAY;AACxC,YAAM,KAAK,IAAI,EAAE,KAAK,CAAA,OAAM,GAAG,UAAU,EAAE,OAAO,UAAW,CAAA,EAAE,OAAO,OAAO,EAAE,GAAG;AAClF,mBAAa,MAAM;AAAA,IACT,WAAA,WAAW,YAAY,CAACA,aAAY;AAC9C,WAAK,gBAAgB,CAAa,cAAA;AACjC,kBAAA,EAAY,qBAAqB,EAAE,OAAO,UAAA,GAAa,MAAM;AAC7D,mBAAW,MAAM;AAAA,MAAA,CACjB;AAAA,IACF;AAAA,EAAA,CACA;AACK,QAAA,aAAa,YAAY,CAAC,WAA2B;AACnD,WAAA,iBAAiB,SAAS,OAAO,EAAE;AAAA,EAAA,GACxC,CAAC,gBAAgB,CAAC;AAErB,gCACE,UAAS,EAAA,OAAc,YAAwB,oBAAoB,GACnE,UAAC,uBAAA,6BAA6B,UAA7B,EAAsC,OAAO,aAC7C,UAAA,uBAAC,wBAAwB,UAAxB,EAAiC,OAAO,YACxC,UAAC,uBAAA,0BAA0B,UAA1B,EAAmC,OAAO,SAC1C,UAAA,uBAAC,qBAAqB,UAArB,EAA8B,OAAO,SACrC,iCAAC,2BAA2B,UAA3B,EAAoC,OAAO,QAC1C,SADF,GAAA,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAC,MAEA,EAHD,GAAA,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAIA,EALD,GAAA,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAMA,EAPD,GAAA,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAQA,EATD,GAAA,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAUA,EAXD,GAAA,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAYA,GAAAA,MAAA;AAEF,GAAG,CAAC,EAAE,UAAU,OAAO,YAAY,gBAAgB;AAClD,SACE,uBAAA,UAAA,EAAS,OAAc,YAAwB,oBAAoB,GACnE,UAAC,uBAAA,QAAA,EAAO,OAAO,WAAW,kBAAiB,uBACzC,YADF,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAAA,GAAAA,MAEA,EAHD,GAAA,QAAA,OAAA;AAAA,IAAA,UAAA;AAAA,IAAA,YAAA;AAAA,IAAA,cAAA;AAAA,EAIA,GAAAA,MAAA;AAEF,CAAC;"}

package/dist/development/contexts.cjs

@@ -13,12 +13,17 @@ const useSelectHandleSelect = _SelectHandleSelectContext[1];
 const _SelectOptionsContext = reactUtils.createRequiredContext("SelectOptionsContext");
 const SelectOptionsContext = _SelectOptionsContext[0];
 const useSelectOptions = _SelectOptionsContext[1];
+const _SelectOptionsFilterContext = reactUtils.createRequiredContext("SelectOptionsFilterContext");
+const SelectOptionsFilterContext = _SelectOptionsFilterContext[0];
+const useSelectOptionsFilter = _SelectOptionsFilterContext[1];
 exports.SelectCurrentEntitiesContext = SelectCurrentEntitiesContext;
 exports.SelectHandleSelectContext = SelectHandleSelectContext;
 exports.SelectIsSelectedContext = SelectIsSelectedContext;
 exports.SelectOptionsContext = SelectOptionsContext;
+exports.SelectOptionsFilterContext = SelectOptionsFilterContext;
 exports.useSelectCurrentEntities = useSelectCurrentEntities;
 exports.useSelectHandleSelect = useSelectHandleSelect;
 exports.useSelectIsSelected = useSelectIsSelected;
 exports.useSelectOptions = useSelectOptions;
+exports.useSelectOptionsFilter = useSelectOptionsFilter;
 //# sourceMappingURL=contexts.cjs.map

package/dist/development/contexts.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"contexts.cjs","sources":["../../src/contexts.ts"],"sourcesContent":["import { createRequiredContext } from '@contember/react-utils'\nimport { EntityAccessor, SugaredQualifiedEntityList } from '@contember/react-binding'\n\nconst _SelectCurrentEntitiesContext = createRequiredContext<EntityAccessor[]>('SelectCurrentEntitiesContext')\n/** @internal */\nexport const SelectCurrentEntitiesContext = _SelectCurrentEntitiesContext[0]\nexport const useSelectCurrentEntities = _SelectCurrentEntitiesContext[1]\n\n\n\nconst _SelectIsSelectedContext = createRequiredContext<(entity: EntityAccessor) => boolean>('SelectIsSelectedContext')\n/** @internal */\nexport const SelectIsSelectedContext = _SelectIsSelectedContext[0]\nexport const useSelectIsSelected = _SelectIsSelectedContext[1]\n\nexport type SelectHandler = (entity: EntityAccessor, action?: 'select' | 'unselect' | 'toggle') => void\nconst _SelectHandleSelectContext = createRequiredContext<SelectHandler>('SelectHandleSelectContext')\n/** @internal */\nexport const SelectHandleSelectContext = _SelectHandleSelectContext[0]\nexport const useSelectHandleSelect = _SelectHandleSelectContext[1]\n\nconst _SelectOptionsContext = createRequiredContext<SugaredQualifiedEntityList['entities']>('SelectOptionsContext')\n/** @internal */\nexport const SelectOptionsContext = _SelectOptionsContext[0]\nexport const useSelectOptions = _SelectOptionsContext[1]\n"],"names":["createRequiredContext"],"mappings":";;;AAGA,MAAM,gCAAgCA,WAAAA,sBAAwC,8BAA8B;AAE/F,MAAA,+BAA+B,8BAA8B,CAAC;AAC9D,MAAA,2BAA2B,8BAA8B,CAAC;AAIvE,MAAM,2BAA2BA,WAAAA,sBAA2D,yBAAyB;AAExG,MAAA,0BAA0B,yBAAyB,CAAC;AACpD,MAAA,sBAAsB,yBAAyB,CAAC;AAG7D,MAAM,6BAA6BA,WAAAA,sBAAqC,2BAA2B;AAEtF,MAAA,4BAA4B,2BAA2B,CAAC;AACxD,MAAA,wBAAwB,2BAA2B,CAAC;AAEjE,MAAM,wBAAwBA,WAAAA,sBAA8D,sBAAsB;AAErG,MAAA,uBAAuB,sBAAsB,CAAC;AAC9C,MAAA,mBAAmB,sBAAsB,CAAC;;;;;;;;;"}
+{"version":3,"file":"contexts.cjs","sources":["../../src/contexts.ts"],"sourcesContent":["import { createRequiredContext } from '@contember/react-utils'\nimport { EntityAccessor, SugaredQualifiedEntityList } from '@contember/react-binding'\nimport { DataViewFilterHandler, TextFilterArtifacts } from '@contember/react-dataview'\n\nconst _SelectCurrentEntitiesContext = createRequiredContext<EntityAccessor[]>('SelectCurrentEntitiesContext')\n/** @internal */\nexport const SelectCurrentEntitiesContext = _SelectCurrentEntitiesContext[0]\nexport const useSelectCurrentEntities = _SelectCurrentEntitiesContext[1]\n\n\n\nconst _SelectIsSelectedContext = createRequiredContext<(entity: EntityAccessor) => boolean>('SelectIsSelectedContext')\n/** @internal */\nexport const SelectIsSelectedContext = _SelectIsSelectedContext[0]\nexport const useSelectIsSelected = _SelectIsSelectedContext[1]\n\nexport type SelectHandler = (entity: EntityAccessor, action?: 'select' | 'unselect' | 'toggle') => void\nconst _SelectHandleSelectContext = createRequiredContext<SelectHandler>('SelectHandleSelectContext')\n/** @internal */\nexport const SelectHandleSelectContext = _SelectHandleSelectContext[0]\nexport const useSelectHandleSelect = _SelectHandleSelectContext[1]\n\nconst _SelectOptionsContext = createRequiredContext<SugaredQualifiedEntityList['entities']>('SelectOptionsContext')\n/** @internal */\nexport const SelectOptionsContext = _SelectOptionsContext[0]\nexport const useSelectOptions = _SelectOptionsContext[1]\n\nconst _SelectOptionsFilterContext = createRequiredContext<DataViewFilterHandler<TextFilterArtifacts> | undefined>('SelectOptionsFilterContext')\n/** @internal */\nexport const SelectOptionsFilterContext = _SelectOptionsFilterContext[0]\nexport const useSelectOptionsFilter = _SelectOptionsFilterContext[1]\n"],"names":["createRequiredContext"],"mappings":";;;AAIA,MAAM,gCAAgCA,WAAAA,sBAAwC,8BAA8B;AAE/F,MAAA,+BAA+B,8BAA8B,CAAC;AAC9D,MAAA,2BAA2B,8BAA8B,CAAC;AAIvE,MAAM,2BAA2BA,WAAAA,sBAA2D,yBAAyB;AAExG,MAAA,0BAA0B,yBAAyB,CAAC;AACpD,MAAA,sBAAsB,yBAAyB,CAAC;AAG7D,MAAM,6BAA6BA,WAAAA,sBAAqC,2BAA2B;AAEtF,MAAA,4BAA4B,2BAA2B,CAAC;AACxD,MAAA,wBAAwB,2BAA2B,CAAC;AAEjE,MAAM,wBAAwBA,WAAAA,sBAA8D,sBAAsB;AAErG,MAAA,uBAAuB,sBAAsB,CAAC;AAC9C,MAAA,mBAAmB,sBAAsB,CAAC;AAEvD,MAAM,8BAA8BA,WAAAA,sBAA8E,4BAA4B;AAEjI,MAAA,6BAA6B,4BAA4B,CAAC;AAC1D,MAAA,yBAAyB,4BAA4B,CAAC;;;;;;;;;;;"}

package/dist/development/contexts.js

@@ -11,14 +11,19 @@ const useSelectHandleSelect = _SelectHandleSelectContext[1];
 const _SelectOptionsContext = createRequiredContext("SelectOptionsContext");
 const SelectOptionsContext = _SelectOptionsContext[0];
 const useSelectOptions = _SelectOptionsContext[1];
+const _SelectOptionsFilterContext = createRequiredContext("SelectOptionsFilterContext");
+const SelectOptionsFilterContext = _SelectOptionsFilterContext[0];
+const useSelectOptionsFilter = _SelectOptionsFilterContext[1];
 export {
   SelectCurrentEntitiesContext,
   SelectHandleSelectContext,
   SelectIsSelectedContext,
   SelectOptionsContext,
+  SelectOptionsFilterContext,
   useSelectCurrentEntities,
   useSelectHandleSelect,
   useSelectIsSelected,
-  useSelectOptions
+  useSelectOptions,
+  useSelectOptionsFilter
 };
 //# sourceMappingURL=contexts.js.map

package/dist/development/contexts.js.map

@@ -1 +1 @@
-{"version":3,"file":"contexts.js","sources":["../../src/contexts.ts"],"sourcesContent":["import { createRequiredContext } from '@contember/react-utils'\nimport { EntityAccessor, SugaredQualifiedEntityList } from '@contember/react-binding'\n\nconst _SelectCurrentEntitiesContext = createRequiredContext<EntityAccessor[]>('SelectCurrentEntitiesContext')\n/** @internal */\nexport const SelectCurrentEntitiesContext = _SelectCurrentEntitiesContext[0]\nexport const useSelectCurrentEntities = _SelectCurrentEntitiesContext[1]\n\n\n\nconst _SelectIsSelectedContext = createRequiredContext<(entity: EntityAccessor) => boolean>('SelectIsSelectedContext')\n/** @internal */\nexport const SelectIsSelectedContext = _SelectIsSelectedContext[0]\nexport const useSelectIsSelected = _SelectIsSelectedContext[1]\n\nexport type SelectHandler = (entity: EntityAccessor, action?: 'select' | 'unselect' | 'toggle') => void\nconst _SelectHandleSelectContext = createRequiredContext<SelectHandler>('SelectHandleSelectContext')\n/** @internal */\nexport const SelectHandleSelectContext = _SelectHandleSelectContext[0]\nexport const useSelectHandleSelect = _SelectHandleSelectContext[1]\n\nconst _SelectOptionsContext = createRequiredContext<SugaredQualifiedEntityList['entities']>('SelectOptionsContext')\n/** @internal */\nexport const SelectOptionsContext = _SelectOptionsContext[0]\nexport const useSelectOptions = _SelectOptionsContext[1]\n"],"names":[],"mappings":";AAGA,MAAM,gCAAgC,sBAAwC,8BAA8B;AAE/F,MAAA,+BAA+B,8BAA8B,CAAC;AAC9D,MAAA,2BAA2B,8BAA8B,CAAC;AAIvE,MAAM,2BAA2B,sBAA2D,yBAAyB;AAExG,MAAA,0BAA0B,yBAAyB,CAAC;AACpD,MAAA,sBAAsB,yBAAyB,CAAC;AAG7D,MAAM,6BAA6B,sBAAqC,2BAA2B;AAEtF,MAAA,4BAA4B,2BAA2B,CAAC;AACxD,MAAA,wBAAwB,2BAA2B,CAAC;AAEjE,MAAM,wBAAwB,sBAA8D,sBAAsB;AAErG,MAAA,uBAAuB,sBAAsB,CAAC;AAC9C,MAAA,mBAAmB,sBAAsB,CAAC;"}
+{"version":3,"file":"contexts.js","sources":["../../src/contexts.ts"],"sourcesContent":["import { createRequiredContext } from '@contember/react-utils'\nimport { EntityAccessor, SugaredQualifiedEntityList } from '@contember/react-binding'\nimport { DataViewFilterHandler, TextFilterArtifacts } from '@contember/react-dataview'\n\nconst _SelectCurrentEntitiesContext = createRequiredContext<EntityAccessor[]>('SelectCurrentEntitiesContext')\n/** @internal */\nexport const SelectCurrentEntitiesContext = _SelectCurrentEntitiesContext[0]\nexport const useSelectCurrentEntities = _SelectCurrentEntitiesContext[1]\n\n\n\nconst _SelectIsSelectedContext = createRequiredContext<(entity: EntityAccessor) => boolean>('SelectIsSelectedContext')\n/** @internal */\nexport const SelectIsSelectedContext = _SelectIsSelectedContext[0]\nexport const useSelectIsSelected = _SelectIsSelectedContext[1]\n\nexport type SelectHandler = (entity: EntityAccessor, action?: 'select' | 'unselect' | 'toggle') => void\nconst _SelectHandleSelectContext = createRequiredContext<SelectHandler>('SelectHandleSelectContext')\n/** @internal */\nexport const SelectHandleSelectContext = _SelectHandleSelectContext[0]\nexport const useSelectHandleSelect = _SelectHandleSelectContext[1]\n\nconst _SelectOptionsContext = createRequiredContext<SugaredQualifiedEntityList['entities']>('SelectOptionsContext')\n/** @internal */\nexport const SelectOptionsContext = _SelectOptionsContext[0]\nexport const useSelectOptions = _SelectOptionsContext[1]\n\nconst _SelectOptionsFilterContext = createRequiredContext<DataViewFilterHandler<TextFilterArtifacts> | undefined>('SelectOptionsFilterContext')\n/** @internal */\nexport const SelectOptionsFilterContext = _SelectOptionsFilterContext[0]\nexport const useSelectOptionsFilter = _SelectOptionsFilterContext[1]\n"],"names":[],"mappings":";AAIA,MAAM,gCAAgC,sBAAwC,8BAA8B;AAE/F,MAAA,+BAA+B,8BAA8B,CAAC;AAC9D,MAAA,2BAA2B,8BAA8B,CAAC;AAIvE,MAAM,2BAA2B,sBAA2D,yBAAyB;AAExG,MAAA,0BAA0B,yBAAyB,CAAC;AACpD,MAAA,sBAAsB,yBAAyB,CAAC;AAG7D,MAAM,6BAA6B,sBAAqC,2BAA2B;AAEtF,MAAA,4BAA4B,2BAA2B,CAAC;AACxD,MAAA,wBAAwB,2BAA2B,CAAC;AAEjE,MAAM,wBAAwB,sBAA8D,sBAAsB;AAErG,MAAA,uBAAuB,sBAAsB,CAAC;AAC9C,MAAA,mBAAmB,sBAAsB,CAAC;AAEvD,MAAM,8BAA8B,sBAA8E,4BAA4B;AAEjI,MAAA,6BAA6B,4BAA4B,CAAC;AAC1D,MAAA,yBAAyB,4BAA4B,CAAC;"}

package/dist/development/hooks/useSelectFilter.cjs

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const reactBinding = require("@contember/react-binding");
+const reactDataview = require("@contember/react-dataview");
+const react = require("react");
+const useSelectFilter = ({ filterField, marker }) => {
+  return react.useMemo(() => {
+    const filter = filterField ?? extractStringFields(marker);
+    if (!filter || Array.isArray(filter) && filter.length === 0) {
+      return void 0;
+    }
+    return reactDataview.createUnionTextFilter(Array.isArray(filter) ? filter : [filter]);
+  }, [filterField, marker]);
+};
+const extractStringFields = (marker) => {
+  const node = marker.environment.getSubTreeNode();
+  const textFields = [];
+  for (const field of marker.fields.markers.values()) {
+    if (field instanceof reactBinding.FieldMarker) {
+      const columnInfo = node.entity.fields.get(field.fieldName);
+      if (columnInfo?.type === "String") {
+        textFields.push(field.fieldName);
+      }
+    } else if (field instanceof reactBinding.HasOneRelationMarker) {
+      textFields.push(...extractStringFields(field).map((it) => `${field.parameters.field}.${it}`));
+    }
+  }
+  return textFields;
+};
+exports.useSelectFilter = useSelectFilter;
+//# sourceMappingURL=useSelectFilter.cjs.map

package/dist/development/hooks/useSelectFilter.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSelectFilter.cjs","sources":["../../../src/hooks/useSelectFilter.ts"],"sourcesContent":["import { FieldMarker, HasOneRelationMarker, MeaningfulMarker, SugaredRelativeSingleField } from '@contember/react-binding'\nimport { createUnionTextFilter } from '@contember/react-dataview'\nimport { useMemo } from 'react'\n\nexport type SelectFilterFieldProps = {\n\tfilterField?: SugaredRelativeSingleField['field'] | SugaredRelativeSingleField['field'][]\n}\n\nexport const useSelectFilter = ({ filterField, marker }: SelectFilterFieldProps & {\n\tmarker: Exclude<MeaningfulMarker, FieldMarker>\n}) => {\n\treturn useMemo(() => {\n\t\tconst filter = filterField ?? extractStringFields(marker)\n\t\tif (!filter || (Array.isArray(filter) && filter.length === 0)) {\n\t\t\treturn undefined\n\t\t}\n\t\treturn createUnionTextFilter(Array.isArray(filter) ? filter : [filter])\n\t}, [filterField, marker])\n}\n\nconst extractStringFields = (marker: Exclude<MeaningfulMarker, FieldMarker>): string[] => {\n\tconst node = marker.environment.getSubTreeNode()\n\tconst textFields = []\n\tfor (const field of marker.fields.markers.values()) {\n\t\tif (field instanceof FieldMarker) {\n\t\t\tconst columnInfo = node.entity.fields.get(field.fieldName)\n\t\t\tif (columnInfo?.type === 'String') {\n\t\t\t\ttextFields.push(field.fieldName)\n\t\t\t}\n\t\t} else if (field instanceof HasOneRelationMarker) {\n\t\t\ttextFields.push(...extractStringFields(field).map(it => `${field.parameters.field}.${it}`))\n\t\t}\n\t}\n\treturn textFields\n}\n"],"names":["useMemo","createUnionTextFilter","FieldMarker","HasOneRelationMarker"],"mappings":";;;;;AAQO,MAAM,kBAAkB,CAAC,EAAE,aAAa,aAEzC;AACL,SAAOA,cAAQ,MAAM;AACd,UAAA,SAAS,eAAe,oBAAoB,MAAM;AACpD,QAAA,CAAC,UAAW,MAAM,QAAQ,MAAM,KAAK,OAAO,WAAW,GAAI;AACvD,aAAA;AAAA,IACR;AACO,WAAAC,cAAA,sBAAsB,MAAM,QAAQ,MAAM,IAAI,SAAS,CAAC,MAAM,CAAC;AAAA,EAAA,GACpE,CAAC,aAAa,MAAM,CAAC;AACzB;AAEA,MAAM,sBAAsB,CAAC,WAA6D;AACnF,QAAA,OAAO,OAAO,YAAY,eAAe;AAC/C,QAAM,aAAa,CAAA;AACnB,aAAW,SAAS,OAAO,OAAO,QAAQ,UAAU;AACnD,QAAI,iBAAiBC,aAAAA,aAAa;AACjC,YAAM,aAAa,KAAK,OAAO,OAAO,IAAI,MAAM,SAAS;AACrD,UAAA,YAAY,SAAS,UAAU;AACvB,mBAAA,KAAK,MAAM,SAAS;AAAA,MAChC;AAAA,IAAA,WACU,iBAAiBC,mCAAsB;AACjD,iBAAW,KAAK,GAAG,oBAAoB,KAAK,EAAE,IAAI,CAAA,OAAM,GAAG,MAAM,WAAW,KAAK,IAAI,EAAE,EAAE,CAAC;AAAA,IAC3F;AAAA,EACD;AACO,SAAA;AACR;;"}

package/dist/development/hooks/useSelectFilter.js

@@ -0,0 +1,31 @@
+import { FieldMarker, HasOneRelationMarker } from "@contember/react-binding";
+import { createUnionTextFilter } from "@contember/react-dataview";
+import { useMemo } from "react";
+const useSelectFilter = ({ filterField, marker }) => {
+  return useMemo(() => {
+    const filter = filterField ?? extractStringFields(marker);
+    if (!filter || Array.isArray(filter) && filter.length === 0) {
+      return void 0;
+    }
+    return createUnionTextFilter(Array.isArray(filter) ? filter : [filter]);
+  }, [filterField, marker]);
+};
+const extractStringFields = (marker) => {
+  const node = marker.environment.getSubTreeNode();
+  const textFields = [];
+  for (const field of marker.fields.markers.values()) {
+    if (field instanceof FieldMarker) {
+      const columnInfo = node.entity.fields.get(field.fieldName);
+      if (columnInfo?.type === "String") {
+        textFields.push(field.fieldName);
+      }
+    } else if (field instanceof HasOneRelationMarker) {
+      textFields.push(...extractStringFields(field).map((it) => `${field.parameters.field}.${it}`));
+    }
+  }
+  return textFields;
+};
+export {
+  useSelectFilter
+};
+//# sourceMappingURL=useSelectFilter.js.map

package/dist/development/hooks/useSelectFilter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSelectFilter.js","sources":["../../../src/hooks/useSelectFilter.ts"],"sourcesContent":["import { FieldMarker, HasOneRelationMarker, MeaningfulMarker, SugaredRelativeSingleField } from '@contember/react-binding'\nimport { createUnionTextFilter } from '@contember/react-dataview'\nimport { useMemo } from 'react'\n\nexport type SelectFilterFieldProps = {\n\tfilterField?: SugaredRelativeSingleField['field'] | SugaredRelativeSingleField['field'][]\n}\n\nexport const useSelectFilter = ({ filterField, marker }: SelectFilterFieldProps & {\n\tmarker: Exclude<MeaningfulMarker, FieldMarker>\n}) => {\n\treturn useMemo(() => {\n\t\tconst filter = filterField ?? extractStringFields(marker)\n\t\tif (!filter || (Array.isArray(filter) && filter.length === 0)) {\n\t\t\treturn undefined\n\t\t}\n\t\treturn createUnionTextFilter(Array.isArray(filter) ? filter : [filter])\n\t}, [filterField, marker])\n}\n\nconst extractStringFields = (marker: Exclude<MeaningfulMarker, FieldMarker>): string[] => {\n\tconst node = marker.environment.getSubTreeNode()\n\tconst textFields = []\n\tfor (const field of marker.fields.markers.values()) {\n\t\tif (field instanceof FieldMarker) {\n\t\t\tconst columnInfo = node.entity.fields.get(field.fieldName)\n\t\t\tif (columnInfo?.type === 'String') {\n\t\t\t\ttextFields.push(field.fieldName)\n\t\t\t}\n\t\t} else if (field instanceof HasOneRelationMarker) {\n\t\t\ttextFields.push(...extractStringFields(field).map(it => `${field.parameters.field}.${it}`))\n\t\t}\n\t}\n\treturn textFields\n}\n"],"names":[],"mappings":";;;AAQO,MAAM,kBAAkB,CAAC,EAAE,aAAa,aAEzC;AACL,SAAO,QAAQ,MAAM;AACd,UAAA,SAAS,eAAe,oBAAoB,MAAM;AACpD,QAAA,CAAC,UAAW,MAAM,QAAQ,MAAM,KAAK,OAAO,WAAW,GAAI;AACvD,aAAA;AAAA,IACR;AACO,WAAA,sBAAsB,MAAM,QAAQ,MAAM,IAAI,SAAS,CAAC,MAAM,CAAC;AAAA,EAAA,GACpE,CAAC,aAAa,MAAM,CAAC;AACzB;AAEA,MAAM,sBAAsB,CAAC,WAA6D;AACnF,QAAA,OAAO,OAAO,YAAY,eAAe;AAC/C,QAAM,aAAa,CAAA;AACnB,aAAW,SAAS,OAAO,OAAO,QAAQ,UAAU;AACnD,QAAI,iBAAiB,aAAa;AACjC,YAAM,aAAa,KAAK,OAAO,OAAO,IAAI,MAAM,SAAS;AACrD,UAAA,YAAY,SAAS,UAAU;AACvB,mBAAA,KAAK,MAAM,SAAS;AAAA,MAChC;AAAA,IAAA,WACU,iBAAiB,sBAAsB;AACjD,iBAAW,KAAK,GAAG,oBAAoB,KAAK,EAAE,IAAI,CAAA,OAAM,GAAG,MAAM,WAAW,KAAK,IAAI,EAAE,EAAE,CAAC;AAAA,IAC3F;AAAA,EACD;AACO,SAAA;AACR;"}

package/dist/development/index.cjs

@@ -10,14 +10,17 @@ const SelectItemTrigger = require("./components/SelectItemTrigger.cjs");
 const SelectOption = require("./components/SelectOption.cjs");
 const SelectPlaceholder = require("./components/SelectPlaceholder.cjs");
 const SortableMultiSelect = require("./components/SortableMultiSelect.cjs");
+const useSelectFilter = require("./hooks/useSelectFilter.cjs");
 exports.SelectCurrentEntitiesContext = contexts.SelectCurrentEntitiesContext;
 exports.SelectHandleSelectContext = contexts.SelectHandleSelectContext;
 exports.SelectIsSelectedContext = contexts.SelectIsSelectedContext;
 exports.SelectOptionsContext = contexts.SelectOptionsContext;
+exports.SelectOptionsFilterContext = contexts.SelectOptionsFilterContext;
 exports.useSelectCurrentEntities = contexts.useSelectCurrentEntities;
 exports.useSelectHandleSelect = contexts.useSelectHandleSelect;
 exports.useSelectIsSelected = contexts.useSelectIsSelected;
 exports.useSelectOptions = contexts.useSelectOptions;
+exports.useSelectOptionsFilter = contexts.useSelectOptionsFilter;
 exports.MultiSelect = MultiSelect.MultiSelect;
 exports.Select = Select.Select;
 exports.SelectNewItem = SelectNewItem.SelectNewItem;
@@ -27,4 +30,5 @@ exports.SelectItemTrigger = SelectItemTrigger.SelectItemTrigger;
 exports.SelectOption = SelectOption.SelectOption;
 exports.SelectPlaceholder = SelectPlaceholder.SelectPlaceholder;
 exports.SortableMultiSelect = SortableMultiSelect.SortableMultiSelect;
+exports.useSelectFilter = useSelectFilter.useSelectFilter;
 //# sourceMappingURL=index.cjs.map

package/dist/development/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/development/index.js

@@ -1,4 +1,4 @@
-import { SelectCurrentEntitiesContext, SelectHandleSelectContext, SelectIsSelectedContext, SelectOptionsContext, useSelectCurrentEntities, useSelectHandleSelect, useSelectIsSelected, useSelectOptions } from "./contexts.js";
+import { SelectCurrentEntitiesContext, SelectHandleSelectContext, SelectIsSelectedContext, SelectOptionsContext, SelectOptionsFilterContext, useSelectCurrentEntities, useSelectHandleSelect, useSelectIsSelected, useSelectOptions, useSelectOptionsFilter } from "./contexts.js";
 import { MultiSelect } from "./components/MultiSelect.js";
 import { Select } from "./components/Select.js";
 import { SelectNewItem } from "./components/SelectNewItem.js";
@@ -8,6 +8,7 @@ import { SelectItemTrigger } from "./components/SelectItemTrigger.js";
 import { SelectOption } from "./components/SelectOption.js";
 import { SelectPlaceholder } from "./components/SelectPlaceholder.js";
 import { SortableMultiSelect } from "./components/SortableMultiSelect.js";
+import { useSelectFilter } from "./hooks/useSelectFilter.js";
 export {
   MultiSelect,
   Select,
@@ -20,11 +21,14 @@ export {
   SelectNewItem,
   SelectOption,
   SelectOptionsContext,
+  SelectOptionsFilterContext,
   SelectPlaceholder,
   SortableMultiSelect,
   useSelectCurrentEntities,
+  useSelectFilter,
   useSelectHandleSelect,
   useSelectIsSelected,
-  useSelectOptions
+  useSelectOptions,
+  useSelectOptionsFilter
 };
 //# sourceMappingURL=index.js.map

package/dist/development/index.js.map

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

package/dist/production/components/MultiSelect.cjs

@@ -5,8 +5,11 @@ const react = require("react");
 const contexts = require("../contexts.cjs");
 const reactBinding = require("@contember/react-binding");
 const reactUtils = require("@contember/react-utils");
-const MultiSelect = reactBinding.Component(({ field, children, options, onSelect, onUnselect }) => {
+const useSelectFilter = require("../hooks/useSelectFilter.cjs");
+const MultiSelect = reactBinding.Component(({ field, children, options, onSelect, onUnselect, filterField }) => {
   const entities = reactBinding.useEntityList({ field });
+  options ?? (options = entities.name);
+  const filter = useSelectFilter.useSelectFilter({ filterField, marker: entities.getMarker() });
   const entitiesArr = react.useMemo(() => Array.from(entities), [entities]);
   const selectedEntities = react.useMemo(() => Array.from(entities).map((it) => it.id), [entities]);
   const handler = reactUtils.useReferentiallyStableCallback((entity, action = "toggle") => {
@@ -25,9 +28,9 @@ const MultiSelect = reactBinding.Component(({ field, children, options, onSelect
   const isSelected = react.useCallback((entity) => {
     return selectedEntities.includes(entity.id);
   }, [selectedEntities]);
-  return /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectCurrentEntitiesContext.Provider, { value: entitiesArr, children: /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectIsSelectedContext.Provider, { value: isSelected, children: /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectHandleSelectContext.Provider, { value: handler, children: /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectOptionsContext.Provider, { value: options, children }) }) }) });
+  return /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectCurrentEntitiesContext.Provider, { value: entitiesArr, children: /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectIsSelectedContext.Provider, { value: isSelected, children: /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectHandleSelectContext.Provider, { value: handler, children: /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectOptionsContext.Provider, { value: options, children: /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectOptionsFilterContext.Provider, { value: filter, children }) }) }) }) });
 }, ({ field, children }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(reactBinding.HasMany, { field, children });
+  return /* @__PURE__ */ jsxRuntime.jsx(reactBinding.HasMany, { field, expectedMutation: "connectOrDisconnect", children });
 });
 exports.MultiSelect = MultiSelect;
 //# sourceMappingURL=MultiSelect.cjs.map

package/dist/production/components/MultiSelect.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MultiSelect.cjs","sources":["../../../src/components/MultiSelect.tsx"],"sourcesContent":["import React, { ReactNode, useCallback, useMemo } from 'react'\nimport { SelectCurrentEntitiesContext, SelectHandler, SelectHandleSelectContext, SelectIsSelectedContext, SelectOptionsContext } from '../contexts'\nimport { Component, EntityAccessor, HasMany, SugaredQualifiedEntityList, SugaredRelativeEntityList, useEntityList } from '@contember/react-binding'\nimport { useReferentiallyStableCallback } from '@contember/react-utils'\nimport { SelectEvents } from '../types'\n\nexport type MultiSelectProps =\n\t& {\n\t\tchildren: ReactNode\n\t\tfield: SugaredRelativeEntityList['field']\n\t\toptions: SugaredQualifiedEntityList['entities']\n\t}\n\t& SelectEvents\n\nexport const MultiSelect = Component(({ field, children, options, onSelect, onUnselect }: MultiSelectProps) => {\n\tconst entities = useEntityList({ field })\n\tconst entitiesArr = useMemo(() => Array.from(entities), [entities])\n\tconst selectedEntities = useMemo(() => Array.from(entities).map(it => it.id), [entities])\n\n\tconst handler = useReferentiallyStableCallback<SelectHandler>((entity, action = 'toggle') => {\n\t\tconst isSelected = selectedEntities.includes(entity.id)\n\t\tif (action === 'toggle') {\n\t\t\taction = isSelected ? 'unselect' : 'select'\n\t\t}\n\t\tif (action === 'unselect' && isSelected) {\n\t\t\tentities.disconnectEntity(entity)\n\t\t\tonUnselect?.(entity)\n\t\t} else if (action === 'select' && !isSelected) {\n\t\t\tentities.connectEntity(entity)\n\t\t\tonSelect?.(entity)\n\t\t}\n\t})\n\tconst isSelected = useCallback((entity: EntityAccessor) => {\n\t\treturn selectedEntities.includes(entity.id)\n\t}, [selectedEntities])\n\n\treturn (\n\t\t<SelectCurrentEntitiesContext.Provider value={entitiesArr}>\n\t\t\t<SelectIsSelectedContext.Provider value={isSelected}>\n\t\t\t\t<SelectHandleSelectContext.Provider value={handler}>\n\t\t\t\t\t<SelectOptionsContext.Provider value={options}>\n\t\t\t\t\t\t{children}\n\t\t\t\t\t</SelectOptionsContext.Provider>\n\t\t\t\t</SelectHandleSelectContext.Provider>\n\t\t\t</SelectIsSelectedContext.Provider>\n\t\t</SelectCurrentEntitiesContext.Provider>\n\t)\n}, ({ field, children }) => {\n\treturn (\n\t\t<HasMany field={field}>\n\t\t\t{children}\n\t\t</HasMany>\n\t)\n})\n\n"],"names":["Component","useEntityList","useMemo","useReferentiallyStableCallback","isSelected","useCallback","jsx","SelectCurrentEntitiesContext","SelectIsSelectedContext","SelectHandleSelectContext","SelectOptionsContext","HasMany"],"mappings":";;;;;;;AAca,MAAA,cAAcA,aAAAA,UAAU,CAAC,EAAE,OAAO,UAAU,SAAS,UAAU,iBAAmC;AAC9G,QAAM,WAAWC,aAAAA,cAAc,EAAE,MAAO,CAAA;AAClC,QAAA,cAAcC,cAAQ,MAAM,MAAM,KAAK,QAAQ,GAAG,CAAC,QAAQ,CAAC;AAClE,QAAM,mBAAmBA,MAAA,QAAQ,MAAM,MAAM,KAAK,QAAQ,EAAE,IAAI,CAAA,OAAM,GAAG,EAAE,GAAG,CAAC,QAAQ,CAAC;AAExF,QAAM,UAAUC,WAAA,+BAA8C,CAAC,QAAQ,SAAS,aAAa;AAC5F,UAAMC,cAAa,iBAAiB,SAAS,OAAO,EAAE;AACtD,QAAI,WAAW,UAAU;AACxB,eAASA,cAAa,aAAa;AAAA,IACpC;AACI,QAAA,WAAW,cAAcA,aAAY;AACxC,eAAS,iBAAiB,MAAM;AAChC,mBAAa,MAAM;AAAA,IACT,WAAA,WAAW,YAAY,CAACA,aAAY;AAC9C,eAAS,cAAc,MAAM;AAC7B,iBAAW,MAAM;AAAA,IAClB;AAAA,EAAA,CACA;AACK,QAAA,aAAaC,kBAAY,CAAC,WAA2B;AACnD,WAAA,iBAAiB,SAAS,OAAO,EAAE;AAAA,EAAA,GACxC,CAAC,gBAAgB,CAAC;AAGpB,SAAAC,2BAAAA,IAACC,SAAAA,6BAA6B,UAA7B,EAAsC,OAAO,aAC7C,UAAAD,2BAAA,IAACE,SAAwB,wBAAA,UAAxB,EAAiC,OAAO,YACxC,UAAAF,2BAAAA,IAACG,SAAAA,0BAA0B,UAA1B,EAAmC,OAAO,SAC1C,UAAAH,2BAAA,IAACI,SAAqB,qBAAA,UAArB,EAA8B,OAAO,SACpC,SACF,CAAA,EACD,CAAA,EACD,CAAA,EACD,CAAA;AAEF,GAAG,CAAC,EAAE,OAAO,eAAe;AAE1B,SAAAJ,2BAAA,IAACK,aAAQ,SAAA,EAAA,OACP,SACF,CAAA;AAEF,CAAC;;"}
+{"version":3,"file":"MultiSelect.cjs","sources":["../../../src/components/MultiSelect.tsx"],"sourcesContent":["import React, { ReactNode, useCallback, useMemo } from 'react'\nimport { SelectCurrentEntitiesContext, SelectHandler, SelectHandleSelectContext, SelectIsSelectedContext, SelectOptionsContext, SelectOptionsFilterContext } from '../contexts'\nimport { Component, EntityAccessor, HasMany, SugaredQualifiedEntityList, SugaredRelativeEntityList, useEntityList } from '@contember/react-binding'\nimport { useReferentiallyStableCallback } from '@contember/react-utils'\nimport { SelectEvents } from '../types'\nimport { SelectFilterFieldProps, useSelectFilter } from '../hooks'\n\nexport type MultiSelectProps =\n\t& {\n\t\tchildren: ReactNode\n\t\tfield: SugaredRelativeEntityList['field']\n\t\toptions?: SugaredQualifiedEntityList['entities']\n\t}\n\t& SelectFilterFieldProps\n\t& SelectEvents\n\nexport const MultiSelect = Component(({ field, children, options, onSelect, onUnselect, filterField }: MultiSelectProps) => {\n\tconst entities = useEntityList({ field })\n\toptions ??= entities.name\n\tconst filter = useSelectFilter({ filterField, marker: entities.getMarker() })\n\tconst entitiesArr = useMemo(() => Array.from(entities), [entities])\n\tconst selectedEntities = useMemo(() => Array.from(entities).map(it => it.id), [entities])\n\n\tconst handler = useReferentiallyStableCallback<SelectHandler>((entity, action = 'toggle') => {\n\t\tconst isSelected = selectedEntities.includes(entity.id)\n\t\tif (action === 'toggle') {\n\t\t\taction = isSelected ? 'unselect' : 'select'\n\t\t}\n\t\tif (action === 'unselect' && isSelected) {\n\t\t\tentities.disconnectEntity(entity)\n\t\t\tonUnselect?.(entity)\n\t\t} else if (action === 'select' && !isSelected) {\n\t\t\tentities.connectEntity(entity)\n\t\t\tonSelect?.(entity)\n\t\t}\n\t})\n\tconst isSelected = useCallback((entity: EntityAccessor) => {\n\t\treturn selectedEntities.includes(entity.id)\n\t}, [selectedEntities])\n\n\treturn (\n\t\t<SelectCurrentEntitiesContext.Provider value={entitiesArr}>\n\t\t\t<SelectIsSelectedContext.Provider value={isSelected}>\n\t\t\t\t<SelectHandleSelectContext.Provider value={handler}>\n\t\t\t\t\t<SelectOptionsContext.Provider value={options}>\n\t\t\t\t\t\t<SelectOptionsFilterContext.Provider value={filter}>\n\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t</SelectOptionsFilterContext.Provider>\n\t\t\t\t\t</SelectOptionsContext.Provider>\n\t\t\t\t</SelectHandleSelectContext.Provider>\n\t\t\t</SelectIsSelectedContext.Provider>\n\t\t</SelectCurrentEntitiesContext.Provider>\n\t)\n}, ({ field, children }) => {\n\treturn (\n\t\t<HasMany field={field} expectedMutation=\"connectOrDisconnect\">\n\t\t\t{children}\n\t\t</HasMany>\n\t)\n})\n\n"],"names":["Component","useEntityList","useSelectFilter","useMemo","useReferentiallyStableCallback","isSelected","useCallback","jsx","SelectCurrentEntitiesContext","SelectIsSelectedContext","SelectHandleSelectContext","SelectOptionsContext","SelectOptionsFilterContext","HasMany"],"mappings":";;;;;;;;AAgBa,MAAA,cAAcA,aAAAA,UAAU,CAAC,EAAE,OAAO,UAAU,SAAS,UAAU,YAAY,kBAAoC;AAC3H,QAAM,WAAWC,aAAAA,cAAc,EAAE,MAAO,CAAA;AACxC,wBAAY,SAAS;AACf,QAAA,SAASC,gCAAgB,EAAE,aAAa,QAAQ,SAAS,aAAa;AACtE,QAAA,cAAcC,cAAQ,MAAM,MAAM,KAAK,QAAQ,GAAG,CAAC,QAAQ,CAAC;AAClE,QAAM,mBAAmBA,MAAA,QAAQ,MAAM,MAAM,KAAK,QAAQ,EAAE,IAAI,CAAA,OAAM,GAAG,EAAE,GAAG,CAAC,QAAQ,CAAC;AAExF,QAAM,UAAUC,WAAA,+BAA8C,CAAC,QAAQ,SAAS,aAAa;AAC5F,UAAMC,cAAa,iBAAiB,SAAS,OAAO,EAAE;AACtD,QAAI,WAAW,UAAU;AACxB,eAASA,cAAa,aAAa;AAAA,IACpC;AACI,QAAA,WAAW,cAAcA,aAAY;AACxC,eAAS,iBAAiB,MAAM;AAChC,mBAAa,MAAM;AAAA,IACT,WAAA,WAAW,YAAY,CAACA,aAAY;AAC9C,eAAS,cAAc,MAAM;AAC7B,iBAAW,MAAM;AAAA,IAClB;AAAA,EAAA,CACA;AACK,QAAA,aAAaC,kBAAY,CAAC,WAA2B;AACnD,WAAA,iBAAiB,SAAS,OAAO,EAAE;AAAA,EAAA,GACxC,CAAC,gBAAgB,CAAC;AAErB,SACEC,2BAAAA,IAAAC,SAAAA,6BAA6B,UAA7B,EAAsC,OAAO,aAC7C,UAAAD,+BAACE,SAAAA,wBAAwB,UAAxB,EAAiC,OAAO,YACxC,UAACF,2BAAA,IAAAG,mCAA0B,UAA1B,EAAmC,OAAO,SAC1C,UAAAH,2BAAA,IAACI,SAAqB,qBAAA,UAArB,EAA8B,OAAO,SACrC,UAACJ,2BAAAA,IAAAK,SAAA,2BAA2B,UAA3B,EAAoC,OAAO,QAC1C,SACF,CAAA,EACD,CAAA,GACD,GACD,EACD,CAAA;AAEF,GAAG,CAAC,EAAE,OAAO,eAAe;AAC3B,SACEL,2BAAAA,IAAAM,aAAAA,SAAA,EAAQ,OAAc,kBAAiB,uBACtC,SACF,CAAA;AAEF,CAAC;;"}

package/dist/production/components/MultiSelect.js

@@ -1,10 +1,13 @@
 import { jsx } from "react/jsx-runtime";
 import { useMemo, useCallback } from "react";
-import { SelectCurrentEntitiesContext, SelectIsSelectedContext, SelectHandleSelectContext, SelectOptionsContext } from "../contexts.js";
+import { SelectCurrentEntitiesContext, SelectIsSelectedContext, SelectHandleSelectContext, SelectOptionsContext, SelectOptionsFilterContext } from "../contexts.js";
 import { Component, useEntityList, HasMany } from "@contember/react-binding";
 import { useReferentiallyStableCallback } from "@contember/react-utils";
-const MultiSelect = Component(({ field, children, options, onSelect, onUnselect }) => {
+import { useSelectFilter } from "../hooks/useSelectFilter.js";
+const MultiSelect = Component(({ field, children, options, onSelect, onUnselect, filterField }) => {
   const entities = useEntityList({ field });
+  options ?? (options = entities.name);
+  const filter = useSelectFilter({ filterField, marker: entities.getMarker() });
   const entitiesArr = useMemo(() => Array.from(entities), [entities]);
   const selectedEntities = useMemo(() => Array.from(entities).map((it) => it.id), [entities]);
   const handler = useReferentiallyStableCallback((entity, action = "toggle") => {
@@ -23,9 +26,9 @@ const MultiSelect = Component(({ field, children, options, onSelect, onUnselect
   const isSelected = useCallback((entity) => {
     return selectedEntities.includes(entity.id);
   }, [selectedEntities]);
-  return /* @__PURE__ */ jsx(SelectCurrentEntitiesContext.Provider, { value: entitiesArr, children: /* @__PURE__ */ jsx(SelectIsSelectedContext.Provider, { value: isSelected, children: /* @__PURE__ */ jsx(SelectHandleSelectContext.Provider, { value: handler, children: /* @__PURE__ */ jsx(SelectOptionsContext.Provider, { value: options, children }) }) }) });
+  return /* @__PURE__ */ jsx(SelectCurrentEntitiesContext.Provider, { value: entitiesArr, children: /* @__PURE__ */ jsx(SelectIsSelectedContext.Provider, { value: isSelected, children: /* @__PURE__ */ jsx(SelectHandleSelectContext.Provider, { value: handler, children: /* @__PURE__ */ jsx(SelectOptionsContext.Provider, { value: options, children: /* @__PURE__ */ jsx(SelectOptionsFilterContext.Provider, { value: filter, children }) }) }) }) });
 }, ({ field, children }) => {
-  return /* @__PURE__ */ jsx(HasMany, { field, children });
+  return /* @__PURE__ */ jsx(HasMany, { field, expectedMutation: "connectOrDisconnect", children });
 });
 export {
   MultiSelect

package/dist/production/components/MultiSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"MultiSelect.js","sources":["../../../src/components/MultiSelect.tsx"],"sourcesContent":["import React, { ReactNode, useCallback, useMemo } from 'react'\nimport { SelectCurrentEntitiesContext, SelectHandler, SelectHandleSelectContext, SelectIsSelectedContext, SelectOptionsContext } from '../contexts'\nimport { Component, EntityAccessor, HasMany, SugaredQualifiedEntityList, SugaredRelativeEntityList, useEntityList } from '@contember/react-binding'\nimport { useReferentiallyStableCallback } from '@contember/react-utils'\nimport { SelectEvents } from '../types'\n\nexport type MultiSelectProps =\n\t& {\n\t\tchildren: ReactNode\n\t\tfield: SugaredRelativeEntityList['field']\n\t\toptions: SugaredQualifiedEntityList['entities']\n\t}\n\t& SelectEvents\n\nexport const MultiSelect = Component(({ field, children, options, onSelect, onUnselect }: MultiSelectProps) => {\n\tconst entities = useEntityList({ field })\n\tconst entitiesArr = useMemo(() => Array.from(entities), [entities])\n\tconst selectedEntities = useMemo(() => Array.from(entities).map(it => it.id), [entities])\n\n\tconst handler = useReferentiallyStableCallback<SelectHandler>((entity, action = 'toggle') => {\n\t\tconst isSelected = selectedEntities.includes(entity.id)\n\t\tif (action === 'toggle') {\n\t\t\taction = isSelected ? 'unselect' : 'select'\n\t\t}\n\t\tif (action === 'unselect' && isSelected) {\n\t\t\tentities.disconnectEntity(entity)\n\t\t\tonUnselect?.(entity)\n\t\t} else if (action === 'select' && !isSelected) {\n\t\t\tentities.connectEntity(entity)\n\t\t\tonSelect?.(entity)\n\t\t}\n\t})\n\tconst isSelected = useCallback((entity: EntityAccessor) => {\n\t\treturn selectedEntities.includes(entity.id)\n\t}, [selectedEntities])\n\n\treturn (\n\t\t<SelectCurrentEntitiesContext.Provider value={entitiesArr}>\n\t\t\t<SelectIsSelectedContext.Provider value={isSelected}>\n\t\t\t\t<SelectHandleSelectContext.Provider value={handler}>\n\t\t\t\t\t<SelectOptionsContext.Provider value={options}>\n\t\t\t\t\t\t{children}\n\t\t\t\t\t</SelectOptionsContext.Provider>\n\t\t\t\t</SelectHandleSelectContext.Provider>\n\t\t\t</SelectIsSelectedContext.Provider>\n\t\t</SelectCurrentEntitiesContext.Provider>\n\t)\n}, ({ field, children }) => {\n\treturn (\n\t\t<HasMany field={field}>\n\t\t\t{children}\n\t\t</HasMany>\n\t)\n})\n\n"],"names":["isSelected"],"mappings":";;;;;AAca,MAAA,cAAc,UAAU,CAAC,EAAE,OAAO,UAAU,SAAS,UAAU,iBAAmC;AAC9G,QAAM,WAAW,cAAc,EAAE,MAAO,CAAA;AAClC,QAAA,cAAc,QAAQ,MAAM,MAAM,KAAK,QAAQ,GAAG,CAAC,QAAQ,CAAC;AAClE,QAAM,mBAAmB,QAAQ,MAAM,MAAM,KAAK,QAAQ,EAAE,IAAI,CAAA,OAAM,GAAG,EAAE,GAAG,CAAC,QAAQ,CAAC;AAExF,QAAM,UAAU,+BAA8C,CAAC,QAAQ,SAAS,aAAa;AAC5F,UAAMA,cAAa,iBAAiB,SAAS,OAAO,EAAE;AACtD,QAAI,WAAW,UAAU;AACxB,eAASA,cAAa,aAAa;AAAA,IACpC;AACI,QAAA,WAAW,cAAcA,aAAY;AACxC,eAAS,iBAAiB,MAAM;AAChC,mBAAa,MAAM;AAAA,IACT,WAAA,WAAW,YAAY,CAACA,aAAY;AAC9C,eAAS,cAAc,MAAM;AAC7B,iBAAW,MAAM;AAAA,IAClB;AAAA,EAAA,CACA;AACK,QAAA,aAAa,YAAY,CAAC,WAA2B;AACnD,WAAA,iBAAiB,SAAS,OAAO,EAAE;AAAA,EAAA,GACxC,CAAC,gBAAgB,CAAC;AAGpB,SAAA,oBAAC,6BAA6B,UAA7B,EAAsC,OAAO,aAC7C,UAAA,oBAAC,wBAAwB,UAAxB,EAAiC,OAAO,YACxC,UAAA,oBAAC,0BAA0B,UAA1B,EAAmC,OAAO,SAC1C,UAAA,oBAAC,qBAAqB,UAArB,EAA8B,OAAO,SACpC,SACF,CAAA,EACD,CAAA,EACD,CAAA,EACD,CAAA;AAEF,GAAG,CAAC,EAAE,OAAO,eAAe;AAE1B,SAAA,oBAAC,SAAQ,EAAA,OACP,SACF,CAAA;AAEF,CAAC;"}
+{"version":3,"file":"MultiSelect.js","sources":["../../../src/components/MultiSelect.tsx"],"sourcesContent":["import React, { ReactNode, useCallback, useMemo } from 'react'\nimport { SelectCurrentEntitiesContext, SelectHandler, SelectHandleSelectContext, SelectIsSelectedContext, SelectOptionsContext, SelectOptionsFilterContext } from '../contexts'\nimport { Component, EntityAccessor, HasMany, SugaredQualifiedEntityList, SugaredRelativeEntityList, useEntityList } from '@contember/react-binding'\nimport { useReferentiallyStableCallback } from '@contember/react-utils'\nimport { SelectEvents } from '../types'\nimport { SelectFilterFieldProps, useSelectFilter } from '../hooks'\n\nexport type MultiSelectProps =\n\t& {\n\t\tchildren: ReactNode\n\t\tfield: SugaredRelativeEntityList['field']\n\t\toptions?: SugaredQualifiedEntityList['entities']\n\t}\n\t& SelectFilterFieldProps\n\t& SelectEvents\n\nexport const MultiSelect = Component(({ field, children, options, onSelect, onUnselect, filterField }: MultiSelectProps) => {\n\tconst entities = useEntityList({ field })\n\toptions ??= entities.name\n\tconst filter = useSelectFilter({ filterField, marker: entities.getMarker() })\n\tconst entitiesArr = useMemo(() => Array.from(entities), [entities])\n\tconst selectedEntities = useMemo(() => Array.from(entities).map(it => it.id), [entities])\n\n\tconst handler = useReferentiallyStableCallback<SelectHandler>((entity, action = 'toggle') => {\n\t\tconst isSelected = selectedEntities.includes(entity.id)\n\t\tif (action === 'toggle') {\n\t\t\taction = isSelected ? 'unselect' : 'select'\n\t\t}\n\t\tif (action === 'unselect' && isSelected) {\n\t\t\tentities.disconnectEntity(entity)\n\t\t\tonUnselect?.(entity)\n\t\t} else if (action === 'select' && !isSelected) {\n\t\t\tentities.connectEntity(entity)\n\t\t\tonSelect?.(entity)\n\t\t}\n\t})\n\tconst isSelected = useCallback((entity: EntityAccessor) => {\n\t\treturn selectedEntities.includes(entity.id)\n\t}, [selectedEntities])\n\n\treturn (\n\t\t<SelectCurrentEntitiesContext.Provider value={entitiesArr}>\n\t\t\t<SelectIsSelectedContext.Provider value={isSelected}>\n\t\t\t\t<SelectHandleSelectContext.Provider value={handler}>\n\t\t\t\t\t<SelectOptionsContext.Provider value={options}>\n\t\t\t\t\t\t<SelectOptionsFilterContext.Provider value={filter}>\n\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t</SelectOptionsFilterContext.Provider>\n\t\t\t\t\t</SelectOptionsContext.Provider>\n\t\t\t\t</SelectHandleSelectContext.Provider>\n\t\t\t</SelectIsSelectedContext.Provider>\n\t\t</SelectCurrentEntitiesContext.Provider>\n\t)\n}, ({ field, children }) => {\n\treturn (\n\t\t<HasMany field={field} expectedMutation=\"connectOrDisconnect\">\n\t\t\t{children}\n\t\t</HasMany>\n\t)\n})\n\n"],"names":["isSelected"],"mappings":";;;;;;AAgBa,MAAA,cAAc,UAAU,CAAC,EAAE,OAAO,UAAU,SAAS,UAAU,YAAY,kBAAoC;AAC3H,QAAM,WAAW,cAAc,EAAE,MAAO,CAAA;AACxC,wBAAY,SAAS;AACf,QAAA,SAAS,gBAAgB,EAAE,aAAa,QAAQ,SAAS,aAAa;AACtE,QAAA,cAAc,QAAQ,MAAM,MAAM,KAAK,QAAQ,GAAG,CAAC,QAAQ,CAAC;AAClE,QAAM,mBAAmB,QAAQ,MAAM,MAAM,KAAK,QAAQ,EAAE,IAAI,CAAA,OAAM,GAAG,EAAE,GAAG,CAAC,QAAQ,CAAC;AAExF,QAAM,UAAU,+BAA8C,CAAC,QAAQ,SAAS,aAAa;AAC5F,UAAMA,cAAa,iBAAiB,SAAS,OAAO,EAAE;AACtD,QAAI,WAAW,UAAU;AACxB,eAASA,cAAa,aAAa;AAAA,IACpC;AACI,QAAA,WAAW,cAAcA,aAAY;AACxC,eAAS,iBAAiB,MAAM;AAChC,mBAAa,MAAM;AAAA,IACT,WAAA,WAAW,YAAY,CAACA,aAAY;AAC9C,eAAS,cAAc,MAAM;AAC7B,iBAAW,MAAM;AAAA,IAClB;AAAA,EAAA,CACA;AACK,QAAA,aAAa,YAAY,CAAC,WAA2B;AACnD,WAAA,iBAAiB,SAAS,OAAO,EAAE;AAAA,EAAA,GACxC,CAAC,gBAAgB,CAAC;AAErB,SACE,oBAAA,6BAA6B,UAA7B,EAAsC,OAAO,aAC7C,UAAA,oBAAC,wBAAwB,UAAxB,EAAiC,OAAO,YACxC,UAAC,oBAAA,0BAA0B,UAA1B,EAAmC,OAAO,SAC1C,UAAA,oBAAC,qBAAqB,UAArB,EAA8B,OAAO,SACrC,UAAC,oBAAA,2BAA2B,UAA3B,EAAoC,OAAO,QAC1C,SACF,CAAA,EACD,CAAA,GACD,GACD,EACD,CAAA;AAEF,GAAG,CAAC,EAAE,OAAO,eAAe;AAC3B,SACE,oBAAA,SAAA,EAAQ,OAAc,kBAAiB,uBACtC,SACF,CAAA;AAEF,CAAC;"}

package/dist/production/components/Select.cjs

@@ -5,9 +5,12 @@ const react = require("react");
 const contexts = require("../contexts.cjs");
 const reactBinding = require("@contember/react-binding");
 const reactUtils = require("@contember/react-utils");
-const Select = reactBinding.Component(({ field, children, onUnselect, onSelect, options }) => {
+const useSelectFilter = require("../hooks/useSelectFilter.cjs");
+const Select = reactBinding.Component(({ field, children, onUnselect, onSelect, options, filterField }) => {
   const entity = reactBinding.useEntity();
   const selectedEntity = entity.getEntity({ field });
+  options ?? (options = selectedEntity.name);
+  const filter = useSelectFilter.useSelectFilter({ filterField, marker: selectedEntity.getMarker() });
   const entityExists = selectedEntity.existsOnServer || selectedEntity.hasUnpersistedChanges;
   const entitiesArr = react.useMemo(() => entityExists ? [selectedEntity] : [], [entityExists, selectedEntity]);
   const handleSelect = reactUtils.useReferentiallyStableCallback((selected, action = "toggle") => {
@@ -23,9 +26,9 @@ const Select = reactBinding.Component(({ field, children, onUnselect, onSelect,
     }
   });
   const isSelected = react.useCallback((entity2) => entity2.id === selectedEntity.id, [selectedEntity.id]);
-  return /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectCurrentEntitiesContext.Provider, { value: entitiesArr, children: /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectIsSelectedContext.Provider, { value: isSelected, children: /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectHandleSelectContext.Provider, { value: handleSelect, children: /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectOptionsContext.Provider, { value: options, children }) }) }) });
+  return /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectCurrentEntitiesContext.Provider, { value: entitiesArr, children: /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectIsSelectedContext.Provider, { value: isSelected, children: /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectHandleSelectContext.Provider, { value: handleSelect, children: /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectOptionsContext.Provider, { value: options, children: /* @__PURE__ */ jsxRuntime.jsx(contexts.SelectOptionsFilterContext.Provider, { value: filter, children }) }) }) }) });
 }, ({ field, children }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(reactBinding.HasOne, { field, children });
+  return /* @__PURE__ */ jsxRuntime.jsx(reactBinding.HasOne, { field, expectedMutation: "connectOrDisconnect", children });
 });
 exports.Select = Select;
 //# sourceMappingURL=Select.cjs.map

package/dist/production/components/Select.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Select.cjs","sources":["../../../src/components/Select.tsx"],"sourcesContent":["import React, { ReactNode, useCallback, useMemo } from 'react'\nimport { SelectCurrentEntitiesContext, SelectHandler, SelectHandleSelectContext, SelectIsSelectedContext, SelectOptionsContext } from '../contexts'\nimport { Component, EntityAccessor, HasOne, SugaredQualifiedEntityList, SugaredRelativeSingleEntity, useEntity } from '@contember/react-binding'\nimport { useReferentiallyStableCallback } from '@contember/react-utils'\nimport { SelectEvents } from '../types'\n\nexport type SelectProps =\n\t& {\n\t\tchildren: ReactNode\n\t\tfield: SugaredRelativeSingleEntity['field']\n\t\toptions: SugaredQualifiedEntityList['entities']\n\t}\n\t& SelectEvents\n\nexport const Select = Component(({ field, children, onUnselect, onSelect, options }: SelectProps) => {\n\tconst entity = useEntity()\n\tconst selectedEntity = entity.getEntity({ field })\n\tconst entityExists = selectedEntity.existsOnServer || selectedEntity.hasUnpersistedChanges\n\tconst entitiesArr = useMemo(() => entityExists ? [selectedEntity] : [], [entityExists, selectedEntity])\n\n\tconst handleSelect = useReferentiallyStableCallback<SelectHandler>((selected, action = 'toggle') => {\n\t\tif (action === 'toggle') {\n\t\t\taction = selected.id === selectedEntity.id ? 'unselect' : 'select'\n\t\t}\n\t\tif (action === 'unselect') {\n\t\t\tentity.disconnectEntityAtField({ field })\n\t\t\tonUnselect?.(selected)\n\t\t} else if (action === 'select') {\n\t\t\tentity.connectEntityAtField({ field }, selected)\n\t\t\tonSelect?.(selected)\n\t\t}\n\t})\n\tconst isSelected = useCallback((entity: EntityAccessor) => entity.id === selectedEntity.id, [selectedEntity.id])\n\n\treturn (\n\t\t<SelectCurrentEntitiesContext.Provider value={entitiesArr}>\n\t\t\t<SelectIsSelectedContext.Provider value={isSelected}>\n\t\t\t\t<SelectHandleSelectContext.Provider value={handleSelect}>\n\t\t\t\t\t<SelectOptionsContext.Provider value={options}>\n\t\t\t\t\t\t{children}\n\t\t\t\t\t</SelectOptionsContext.Provider>\n\t\t\t\t</SelectHandleSelectContext.Provider>\n\t\t\t</SelectIsSelectedContext.Provider>\n\t\t</SelectCurrentEntitiesContext.Provider>\n\t)\n}, ({ field, children }) => {\n\treturn (\n\t\t<HasOne field={field}>\n\t\t\t{children}\n\t\t</HasOne>\n\t)\n})\n\n"],"names":["Component","useEntity","useMemo","useReferentiallyStableCallback","useCallback","entity","jsx","SelectCurrentEntitiesContext","SelectIsSelectedContext","SelectHandleSelectContext","SelectOptionsContext","HasOne"],"mappings":";;;;;;;AAca,MAAA,SAASA,aAAAA,UAAU,CAAC,EAAE,OAAO,UAAU,YAAY,UAAU,cAA2B;AACpG,QAAM,SAASC,aAAAA;AACf,QAAM,iBAAiB,OAAO,UAAU,EAAE,MAAO,CAAA;AAC3C,QAAA,eAAe,eAAe,kBAAkB,eAAe;AACrE,QAAM,cAAcC,MAAAA,QAAQ,MAAM,eAAe,CAAC,cAAc,IAAI,CAAA,GAAI,CAAC,cAAc,cAAc,CAAC;AAEtG,QAAM,eAAeC,WAAA,+BAA8C,CAAC,UAAU,SAAS,aAAa;AACnG,QAAI,WAAW,UAAU;AACxB,eAAS,SAAS,OAAO,eAAe,KAAK,aAAa;AAAA,IAC3D;AACA,QAAI,WAAW,YAAY;AACnB,aAAA,wBAAwB,EAAE,MAAA,CAAO;AACxC,mBAAa,QAAQ;AAAA,IAAA,WACX,WAAW,UAAU;AAC/B,aAAO,qBAAqB,EAAE,MAAM,GAAG,QAAQ;AAC/C,iBAAW,QAAQ;AAAA,IACpB;AAAA,EAAA,CACA;AACK,QAAA,aAAaC,MAAAA,YAAY,CAACC,YAA2BA,QAAO,OAAO,eAAe,IAAI,CAAC,eAAe,EAAE,CAAC;AAG9G,SAAAC,2BAAAA,IAACC,SAAAA,6BAA6B,UAA7B,EAAsC,OAAO,aAC7C,UAAAD,2BAAA,IAACE,SAAwB,wBAAA,UAAxB,EAAiC,OAAO,YACxC,UAAAF,2BAAAA,IAACG,SAAAA,0BAA0B,UAA1B,EAAmC,OAAO,cAC1C,UAAAH,2BAAA,IAACI,SAAqB,qBAAA,UAArB,EAA8B,OAAO,SACpC,SACF,CAAA,EACD,CAAA,EACD,CAAA,EACD,CAAA;AAEF,GAAG,CAAC,EAAE,OAAO,eAAe;AAE1B,SAAAJ,2BAAA,IAACK,aAAO,QAAA,EAAA,OACN,SACF,CAAA;AAEF,CAAC;;"}
+{"version":3,"file":"Select.cjs","sources":["../../../src/components/Select.tsx"],"sourcesContent":["import React, { ReactNode, useCallback, useMemo } from 'react'\nimport { SelectCurrentEntitiesContext, SelectHandler, SelectHandleSelectContext, SelectIsSelectedContext, SelectOptionsContext, SelectOptionsFilterContext } from '../contexts'\nimport { Component, EntityAccessor, HasOne, SugaredQualifiedEntityList, SugaredRelativeSingleEntity, useEntity } from '@contember/react-binding'\nimport { useReferentiallyStableCallback } from '@contember/react-utils'\nimport { SelectEvents } from '../types'\nimport { SelectFilterFieldProps, useSelectFilter } from '../hooks'\n\nexport type SelectProps =\n\t& {\n\t\tchildren: ReactNode\n\t\tfield: SugaredRelativeSingleEntity['field']\n\t\toptions?: SugaredQualifiedEntityList['entities']\n\t}\n\t& SelectFilterFieldProps\n\t& SelectEvents\n\nexport const Select = Component(({ field, children, onUnselect, onSelect, options, filterField }: SelectProps) => {\n\tconst entity = useEntity()\n\tconst selectedEntity = entity.getEntity({ field })\n\toptions ??= selectedEntity.name\n\tconst filter = useSelectFilter({ filterField, marker: selectedEntity.getMarker() })\n\n\tconst entityExists = selectedEntity.existsOnServer || selectedEntity.hasUnpersistedChanges\n\tconst entitiesArr = useMemo(() => entityExists ? [selectedEntity] : [], [entityExists, selectedEntity])\n\n\tconst handleSelect = useReferentiallyStableCallback<SelectHandler>((selected, action = 'toggle') => {\n\t\tif (action === 'toggle') {\n\t\t\taction = selected.id === selectedEntity.id ? 'unselect' : 'select'\n\t\t}\n\t\tif (action === 'unselect') {\n\t\t\tentity.disconnectEntityAtField({ field })\n\t\t\tonUnselect?.(selected)\n\t\t} else if (action === 'select') {\n\t\t\tentity.connectEntityAtField({ field }, selected)\n\t\t\tonSelect?.(selected)\n\t\t}\n\t})\n\tconst isSelected = useCallback((entity: EntityAccessor) => entity.id === selectedEntity.id, [selectedEntity.id])\n\n\treturn (\n\t\t<SelectCurrentEntitiesContext.Provider value={entitiesArr}>\n\t\t\t<SelectIsSelectedContext.Provider value={isSelected}>\n\t\t\t\t<SelectHandleSelectContext.Provider value={handleSelect}>\n\t\t\t\t\t<SelectOptionsContext.Provider value={options}>\n\t\t\t\t\t\t<SelectOptionsFilterContext.Provider value={filter}>\n\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t</SelectOptionsFilterContext.Provider>\n\t\t\t\t\t</SelectOptionsContext.Provider>\n\t\t\t\t</SelectHandleSelectContext.Provider>\n\t\t\t</SelectIsSelectedContext.Provider>\n\t\t</SelectCurrentEntitiesContext.Provider>\n\t)\n}, ({ field, children }) => {\n\treturn (\n\t\t<HasOne field={field} expectedMutation=\"connectOrDisconnect\">\n\t\t\t{children}\n\t\t</HasOne>\n\t)\n})\n\n"],"names":["Component","useEntity","useSelectFilter","useMemo","useReferentiallyStableCallback","useCallback","entity","jsx","SelectCurrentEntitiesContext","SelectIsSelectedContext","SelectHandleSelectContext","SelectOptionsContext","SelectOptionsFilterContext","HasOne"],"mappings":";;;;;;;;AAgBa,MAAA,SAASA,aAAAA,UAAU,CAAC,EAAE,OAAO,UAAU,YAAY,UAAU,SAAS,kBAA+B;AACjH,QAAM,SAASC,aAAAA;AACf,QAAM,iBAAiB,OAAO,UAAU,EAAE,MAAO,CAAA;AACjD,wBAAY,eAAe;AACrB,QAAA,SAASC,gCAAgB,EAAE,aAAa,QAAQ,eAAe,aAAa;AAE5E,QAAA,eAAe,eAAe,kBAAkB,eAAe;AACrE,QAAM,cAAcC,MAAAA,QAAQ,MAAM,eAAe,CAAC,cAAc,IAAI,CAAA,GAAI,CAAC,cAAc,cAAc,CAAC;AAEtG,QAAM,eAAeC,WAAA,+BAA8C,CAAC,UAAU,SAAS,aAAa;AACnG,QAAI,WAAW,UAAU;AACxB,eAAS,SAAS,OAAO,eAAe,KAAK,aAAa;AAAA,IAC3D;AACA,QAAI,WAAW,YAAY;AACnB,aAAA,wBAAwB,EAAE,MAAA,CAAO;AACxC,mBAAa,QAAQ;AAAA,IAAA,WACX,WAAW,UAAU;AAC/B,aAAO,qBAAqB,EAAE,MAAM,GAAG,QAAQ;AAC/C,iBAAW,QAAQ;AAAA,IACpB;AAAA,EAAA,CACA;AACK,QAAA,aAAaC,MAAAA,YAAY,CAACC,YAA2BA,QAAO,OAAO,eAAe,IAAI,CAAC,eAAe,EAAE,CAAC;AAE/G,SACEC,2BAAAA,IAAAC,SAAAA,6BAA6B,UAA7B,EAAsC,OAAO,aAC7C,UAAAD,+BAACE,SAAAA,wBAAwB,UAAxB,EAAiC,OAAO,YACxC,UAACF,2BAAA,IAAAG,mCAA0B,UAA1B,EAAmC,OAAO,cAC1C,UAAAH,2BAAA,IAACI,SAAqB,qBAAA,UAArB,EAA8B,OAAO,SACrC,UAACJ,2BAAAA,IAAAK,SAAA,2BAA2B,UAA3B,EAAoC,OAAO,QAC1C,SACF,CAAA,EACD,CAAA,GACD,GACD,EACD,CAAA;AAEF,GAAG,CAAC,EAAE,OAAO,eAAe;AAC3B,SACEL,2BAAAA,IAAAM,aAAAA,QAAA,EAAO,OAAc,kBAAiB,uBACrC,SACF,CAAA;AAEF,CAAC;;"}

package/dist/production/components/Select.js

@@ -1,11 +1,14 @@
 import { jsx } from "react/jsx-runtime";
 import { useMemo, useCallback } from "react";
-import { SelectCurrentEntitiesContext, SelectIsSelectedContext, SelectHandleSelectContext, SelectOptionsContext } from "../contexts.js";
+import { SelectCurrentEntitiesContext, SelectIsSelectedContext, SelectHandleSelectContext, SelectOptionsContext, SelectOptionsFilterContext } from "../contexts.js";
 import { Component, useEntity, HasOne } from "@contember/react-binding";
 import { useReferentiallyStableCallback } from "@contember/react-utils";
-const Select = Component(({ field, children, onUnselect, onSelect, options }) => {
+import { useSelectFilter } from "../hooks/useSelectFilter.js";
+const Select = Component(({ field, children, onUnselect, onSelect, options, filterField }) => {
   const entity = useEntity();
   const selectedEntity = entity.getEntity({ field });
+  options ?? (options = selectedEntity.name);
+  const filter = useSelectFilter({ filterField, marker: selectedEntity.getMarker() });
   const entityExists = selectedEntity.existsOnServer || selectedEntity.hasUnpersistedChanges;
   const entitiesArr = useMemo(() => entityExists ? [selectedEntity] : [], [entityExists, selectedEntity]);
   const handleSelect = useReferentiallyStableCallback((selected, action = "toggle") => {
@@ -21,9 +24,9 @@ const Select = Component(({ field, children, onUnselect, onSelect, options }) =>
     }
   });
   const isSelected = useCallback((entity2) => entity2.id === selectedEntity.id, [selectedEntity.id]);
-  return /* @__PURE__ */ jsx(SelectCurrentEntitiesContext.Provider, { value: entitiesArr, children: /* @__PURE__ */ jsx(SelectIsSelectedContext.Provider, { value: isSelected, children: /* @__PURE__ */ jsx(SelectHandleSelectContext.Provider, { value: handleSelect, children: /* @__PURE__ */ jsx(SelectOptionsContext.Provider, { value: options, children }) }) }) });
+  return /* @__PURE__ */ jsx(SelectCurrentEntitiesContext.Provider, { value: entitiesArr, children: /* @__PURE__ */ jsx(SelectIsSelectedContext.Provider, { value: isSelected, children: /* @__PURE__ */ jsx(SelectHandleSelectContext.Provider, { value: handleSelect, children: /* @__PURE__ */ jsx(SelectOptionsContext.Provider, { value: options, children: /* @__PURE__ */ jsx(SelectOptionsFilterContext.Provider, { value: filter, children }) }) }) }) });
 }, ({ field, children }) => {
-  return /* @__PURE__ */ jsx(HasOne, { field, children });
+  return /* @__PURE__ */ jsx(HasOne, { field, expectedMutation: "connectOrDisconnect", children });
 });
 export {
   Select

package/dist/production/components/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sources":["../../../src/components/Select.tsx"],"sourcesContent":["import React, { ReactNode, useCallback, useMemo } from 'react'\nimport { SelectCurrentEntitiesContext, SelectHandler, SelectHandleSelectContext, SelectIsSelectedContext, SelectOptionsContext } from '../contexts'\nimport { Component, EntityAccessor, HasOne, SugaredQualifiedEntityList, SugaredRelativeSingleEntity, useEntity } from '@contember/react-binding'\nimport { useReferentiallyStableCallback } from '@contember/react-utils'\nimport { SelectEvents } from '../types'\n\nexport type SelectProps =\n\t& {\n\t\tchildren: ReactNode\n\t\tfield: SugaredRelativeSingleEntity['field']\n\t\toptions: SugaredQualifiedEntityList['entities']\n\t}\n\t& SelectEvents\n\nexport const Select = Component(({ field, children, onUnselect, onSelect, options }: SelectProps) => {\n\tconst entity = useEntity()\n\tconst selectedEntity = entity.getEntity({ field })\n\tconst entityExists = selectedEntity.existsOnServer || selectedEntity.hasUnpersistedChanges\n\tconst entitiesArr = useMemo(() => entityExists ? [selectedEntity] : [], [entityExists, selectedEntity])\n\n\tconst handleSelect = useReferentiallyStableCallback<SelectHandler>((selected, action = 'toggle') => {\n\t\tif (action === 'toggle') {\n\t\t\taction = selected.id === selectedEntity.id ? 'unselect' : 'select'\n\t\t}\n\t\tif (action === 'unselect') {\n\t\t\tentity.disconnectEntityAtField({ field })\n\t\t\tonUnselect?.(selected)\n\t\t} else if (action === 'select') {\n\t\t\tentity.connectEntityAtField({ field }, selected)\n\t\t\tonSelect?.(selected)\n\t\t}\n\t})\n\tconst isSelected = useCallback((entity: EntityAccessor) => entity.id === selectedEntity.id, [selectedEntity.id])\n\n\treturn (\n\t\t<SelectCurrentEntitiesContext.Provider value={entitiesArr}>\n\t\t\t<SelectIsSelectedContext.Provider value={isSelected}>\n\t\t\t\t<SelectHandleSelectContext.Provider value={handleSelect}>\n\t\t\t\t\t<SelectOptionsContext.Provider value={options}>\n\t\t\t\t\t\t{children}\n\t\t\t\t\t</SelectOptionsContext.Provider>\n\t\t\t\t</SelectHandleSelectContext.Provider>\n\t\t\t</SelectIsSelectedContext.Provider>\n\t\t</SelectCurrentEntitiesContext.Provider>\n\t)\n}, ({ field, children }) => {\n\treturn (\n\t\t<HasOne field={field}>\n\t\t\t{children}\n\t\t</HasOne>\n\t)\n})\n\n"],"names":["entity"],"mappings":";;;;;AAca,MAAA,SAAS,UAAU,CAAC,EAAE,OAAO,UAAU,YAAY,UAAU,cAA2B;AACpG,QAAM,SAAS;AACf,QAAM,iBAAiB,OAAO,UAAU,EAAE,MAAO,CAAA;AAC3C,QAAA,eAAe,eAAe,kBAAkB,eAAe;AACrE,QAAM,cAAc,QAAQ,MAAM,eAAe,CAAC,cAAc,IAAI,CAAA,GAAI,CAAC,cAAc,cAAc,CAAC;AAEtG,QAAM,eAAe,+BAA8C,CAAC,UAAU,SAAS,aAAa;AACnG,QAAI,WAAW,UAAU;AACxB,eAAS,SAAS,OAAO,eAAe,KAAK,aAAa;AAAA,IAC3D;AACA,QAAI,WAAW,YAAY;AACnB,aAAA,wBAAwB,EAAE,MAAA,CAAO;AACxC,mBAAa,QAAQ;AAAA,IAAA,WACX,WAAW,UAAU;AAC/B,aAAO,qBAAqB,EAAE,MAAM,GAAG,QAAQ;AAC/C,iBAAW,QAAQ;AAAA,IACpB;AAAA,EAAA,CACA;AACK,QAAA,aAAa,YAAY,CAACA,YAA2BA,QAAO,OAAO,eAAe,IAAI,CAAC,eAAe,EAAE,CAAC;AAG9G,SAAA,oBAAC,6BAA6B,UAA7B,EAAsC,OAAO,aAC7C,UAAA,oBAAC,wBAAwB,UAAxB,EAAiC,OAAO,YACxC,UAAA,oBAAC,0BAA0B,UAA1B,EAAmC,OAAO,cAC1C,UAAA,oBAAC,qBAAqB,UAArB,EAA8B,OAAO,SACpC,SACF,CAAA,EACD,CAAA,EACD,CAAA,EACD,CAAA;AAEF,GAAG,CAAC,EAAE,OAAO,eAAe;AAE1B,SAAA,oBAAC,QAAO,EAAA,OACN,SACF,CAAA;AAEF,CAAC;"}
+{"version":3,"file":"Select.js","sources":["../../../src/components/Select.tsx"],"sourcesContent":["import React, { ReactNode, useCallback, useMemo } from 'react'\nimport { SelectCurrentEntitiesContext, SelectHandler, SelectHandleSelectContext, SelectIsSelectedContext, SelectOptionsContext, SelectOptionsFilterContext } from '../contexts'\nimport { Component, EntityAccessor, HasOne, SugaredQualifiedEntityList, SugaredRelativeSingleEntity, useEntity } from '@contember/react-binding'\nimport { useReferentiallyStableCallback } from '@contember/react-utils'\nimport { SelectEvents } from '../types'\nimport { SelectFilterFieldProps, useSelectFilter } from '../hooks'\n\nexport type SelectProps =\n\t& {\n\t\tchildren: ReactNode\n\t\tfield: SugaredRelativeSingleEntity['field']\n\t\toptions?: SugaredQualifiedEntityList['entities']\n\t}\n\t& SelectFilterFieldProps\n\t& SelectEvents\n\nexport const Select = Component(({ field, children, onUnselect, onSelect, options, filterField }: SelectProps) => {\n\tconst entity = useEntity()\n\tconst selectedEntity = entity.getEntity({ field })\n\toptions ??= selectedEntity.name\n\tconst filter = useSelectFilter({ filterField, marker: selectedEntity.getMarker() })\n\n\tconst entityExists = selectedEntity.existsOnServer || selectedEntity.hasUnpersistedChanges\n\tconst entitiesArr = useMemo(() => entityExists ? [selectedEntity] : [], [entityExists, selectedEntity])\n\n\tconst handleSelect = useReferentiallyStableCallback<SelectHandler>((selected, action = 'toggle') => {\n\t\tif (action === 'toggle') {\n\t\t\taction = selected.id === selectedEntity.id ? 'unselect' : 'select'\n\t\t}\n\t\tif (action === 'unselect') {\n\t\t\tentity.disconnectEntityAtField({ field })\n\t\t\tonUnselect?.(selected)\n\t\t} else if (action === 'select') {\n\t\t\tentity.connectEntityAtField({ field }, selected)\n\t\t\tonSelect?.(selected)\n\t\t}\n\t})\n\tconst isSelected = useCallback((entity: EntityAccessor) => entity.id === selectedEntity.id, [selectedEntity.id])\n\n\treturn (\n\t\t<SelectCurrentEntitiesContext.Provider value={entitiesArr}>\n\t\t\t<SelectIsSelectedContext.Provider value={isSelected}>\n\t\t\t\t<SelectHandleSelectContext.Provider value={handleSelect}>\n\t\t\t\t\t<SelectOptionsContext.Provider value={options}>\n\t\t\t\t\t\t<SelectOptionsFilterContext.Provider value={filter}>\n\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t</SelectOptionsFilterContext.Provider>\n\t\t\t\t\t</SelectOptionsContext.Provider>\n\t\t\t\t</SelectHandleSelectContext.Provider>\n\t\t\t</SelectIsSelectedContext.Provider>\n\t\t</SelectCurrentEntitiesContext.Provider>\n\t)\n}, ({ field, children }) => {\n\treturn (\n\t\t<HasOne field={field} expectedMutation=\"connectOrDisconnect\">\n\t\t\t{children}\n\t\t</HasOne>\n\t)\n})\n\n"],"names":["entity"],"mappings":";;;;;;AAgBa,MAAA,SAAS,UAAU,CAAC,EAAE,OAAO,UAAU,YAAY,UAAU,SAAS,kBAA+B;AACjH,QAAM,SAAS;AACf,QAAM,iBAAiB,OAAO,UAAU,EAAE,MAAO,CAAA;AACjD,wBAAY,eAAe;AACrB,QAAA,SAAS,gBAAgB,EAAE,aAAa,QAAQ,eAAe,aAAa;AAE5E,QAAA,eAAe,eAAe,kBAAkB,eAAe;AACrE,QAAM,cAAc,QAAQ,MAAM,eAAe,CAAC,cAAc,IAAI,CAAA,GAAI,CAAC,cAAc,cAAc,CAAC;AAEtG,QAAM,eAAe,+BAA8C,CAAC,UAAU,SAAS,aAAa;AACnG,QAAI,WAAW,UAAU;AACxB,eAAS,SAAS,OAAO,eAAe,KAAK,aAAa;AAAA,IAC3D;AACA,QAAI,WAAW,YAAY;AACnB,aAAA,wBAAwB,EAAE,MAAA,CAAO;AACxC,mBAAa,QAAQ;AAAA,IAAA,WACX,WAAW,UAAU;AAC/B,aAAO,qBAAqB,EAAE,MAAM,GAAG,QAAQ;AAC/C,iBAAW,QAAQ;AAAA,IACpB;AAAA,EAAA,CACA;AACK,QAAA,aAAa,YAAY,CAACA,YAA2BA,QAAO,OAAO,eAAe,IAAI,CAAC,eAAe,EAAE,CAAC;AAE/G,SACE,oBAAA,6BAA6B,UAA7B,EAAsC,OAAO,aAC7C,UAAA,oBAAC,wBAAwB,UAAxB,EAAiC,OAAO,YACxC,UAAC,oBAAA,0BAA0B,UAA1B,EAAmC,OAAO,cAC1C,UAAA,oBAAC,qBAAqB,UAArB,EAA8B,OAAO,SACrC,UAAC,oBAAA,2BAA2B,UAA3B,EAAoC,OAAO,QAC1C,SACF,CAAA,EACD,CAAA,GACD,GACD,EACD,CAAA;AAEF,GAAG,CAAC,EAAE,OAAO,eAAe;AAC3B,SACE,oBAAA,QAAA,EAAO,OAAc,kBAAiB,uBACrC,SACF,CAAA;AAEF,CAAC;"}

package/dist/production/components/SelectDataView.cjs

@@ -1,12 +1,26 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
 const contexts = require("../contexts.cjs");
 const reactDataview = require("@contember/react-dataview");
 const SelectDataView = (props) => {
   const handleSelect = contexts.useSelectHandleSelect();
   const entities = contexts.useSelectOptions();
-  return /* @__PURE__ */ jsxRuntime.jsx(reactDataview.DataView, { ...props, onSelectHighlighted: handleSelect, entities });
+  const filter = contexts.useSelectOptionsFilter();
+  const defaultFilterTypes = react.useMemo(() => filter ? { query: filter } : {}, [filter]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    reactDataview.DataView,
+    {
+      filterTypes: defaultFilterTypes,
+      ...props,
+      onSelectHighlighted: handleSelect,
+      entities,
+      filteringStateStorage: "null",
+      sortingStateStorage: "null",
+      currentPageStateStorage: "null"
+    }
+  );
 };
 exports.SelectDataView = SelectDataView;
 //# sourceMappingURL=SelectDataView.cjs.map

package/dist/production/components/SelectDataView.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SelectDataView.cjs","sources":["../../../src/components/SelectDataView.tsx"],"sourcesContent":["import React, { ReactNode } from 'react'\nimport { useSelectHandleSelect, useSelectOptions } from '../contexts'\nimport { DataViewProps, DataView } from '@contember/react-dataview'\n\nexport type SelectDataViewProps =\n\t& Omit<DataViewProps, 'entities'>\n\t& {\n\t\tchildren: ReactNode\n\t}\n\nexport const SelectDataView = (props: SelectDataViewProps) => {\n\tconst handleSelect = useSelectHandleSelect()\n\tconst entities = useSelectOptions()\n\treturn (\n\t\t<DataView {...props} onSelectHighlighted={handleSelect} entities={entities} />\n\t)\n}\n"],"names":["useSelectHandleSelect","useSelectOptions","DataView"],"mappings":";;;;;AAUa,MAAA,iBAAiB,CAAC,UAA+B;AAC7D,QAAM,eAAeA,SAAAA;AACrB,QAAM,WAAWC,SAAAA;AACjB,wCACEC,cAAU,UAAA,EAAA,GAAG,OAAO,qBAAqB,cAAc,SAAoB,CAAA;AAE9E;;"}
+{"version":3,"file":"SelectDataView.cjs","sources":["../../../src/components/SelectDataView.tsx"],"sourcesContent":["import React, { ReactNode, useMemo } from 'react'\nimport { useSelectHandleSelect, useSelectOptions, useSelectOptionsFilter } from '../contexts'\nimport { DataViewProps, DataView, DataViewFilterHandlerRegistry } from '@contember/react-dataview'\n\nexport type SelectDataViewProps =\n\t& Omit<DataViewProps, 'entities'>\n\t& {\n\t\tchildren: ReactNode\n\t}\n\nexport const SelectDataView = (props: SelectDataViewProps) => {\n\tconst handleSelect = useSelectHandleSelect()\n\tconst entities = useSelectOptions()\n\tconst filter = useSelectOptionsFilter()\n\tconst defaultFilterTypes = useMemo((): DataViewFilterHandlerRegistry => filter ? { query: filter } : {}, [filter])\n\n\treturn (\n\t\t<DataView\n\t\t\tfilterTypes={defaultFilterTypes}\n\t\t\t{...props}\n\t\t\tonSelectHighlighted={handleSelect}\n\t\t\tentities={entities}\n\t\t\tfilteringStateStorage=\"null\"\n\t\t\tsortingStateStorage=\"null\"\n\t\t\tcurrentPageStateStorage=\"null\"\n\t\t/>\n\t)\n}\n"],"names":["useSelectHandleSelect","useSelectOptions","useSelectOptionsFilter","useMemo","jsx","DataView"],"mappings":";;;;;;AAUa,MAAA,iBAAiB,CAAC,UAA+B;AAC7D,QAAM,eAAeA,SAAAA;AACrB,QAAM,WAAWC,SAAAA;AACjB,QAAM,SAASC,SAAAA;AACf,QAAM,qBAAqBC,MAAAA,QAAQ,MAAqC,SAAS,EAAE,OAAO,OAAO,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC;AAGhH,SAAAC,2BAAA;AAAA,IAACC,cAAA;AAAA,IAAA;AAAA,MACA,aAAa;AAAA,MACZ,GAAG;AAAA,MACJ,qBAAqB;AAAA,MACrB;AAAA,MACA,uBAAsB;AAAA,MACtB,qBAAoB;AAAA,MACpB,yBAAwB;AAAA,IAAA;AAAA,EAAA;AAG3B;;"}

package/dist/production/components/SelectDataView.js

@@ -1,10 +1,24 @@
 import { jsx } from "react/jsx-runtime";
-import { useSelectHandleSelect, useSelectOptions } from "../contexts.js";
+import { useMemo } from "react";
+import { useSelectHandleSelect, useSelectOptions, useSelectOptionsFilter } from "../contexts.js";
 import { DataView } from "@contember/react-dataview";
 const SelectDataView = (props) => {
   const handleSelect = useSelectHandleSelect();
   const entities = useSelectOptions();
-  return /* @__PURE__ */ jsx(DataView, { ...props, onSelectHighlighted: handleSelect, entities });
+  const filter = useSelectOptionsFilter();
+  const defaultFilterTypes = useMemo(() => filter ? { query: filter } : {}, [filter]);
+  return /* @__PURE__ */ jsx(
+    DataView,
+    {
+      filterTypes: defaultFilterTypes,
+      ...props,
+      onSelectHighlighted: handleSelect,
+      entities,
+      filteringStateStorage: "null",
+      sortingStateStorage: "null",
+      currentPageStateStorage: "null"
+    }
+  );
 };
 export {
   SelectDataView