@dragonmastery/zinia-forms-core 0.5.4 → 0.5.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.js +93 -44
  2. package/dist/index.js.map +1 -1
  3. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -8619,6 +8619,13 @@ var EnumMultiSelectFilter = (props) => {
8619
8619
  updateDropdownPosition();
8620
8620
  });
8621
8621
  };
8622
+ const closeDropdown = () => {
8623
+ applyPendingFilter();
8624
+ state.isOpen = false;
8625
+ state.searchQuery = "";
8626
+ state.selectedIndex = -1;
8627
+ cleanupEventListeners();
8628
+ };
8622
8629
  const removeSelected = (value) => {
8623
8630
  const currentValues = (Array.isArray(props.value) ? props.value : props.value ? [props.value] : []).filter(
8624
8631
  (v) => !valuesEqual(v, value)
@@ -8871,56 +8878,90 @@ var EnumMultiSelectFilter = (props) => {
8871
8878
  children: /* @__PURE__ */ jsx("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "M19 9l-7 7-7-7" })
8872
8879
  }
8873
8880
  ) }),
8874
- state.isOpen && /* @__PURE__ */ jsx(Teleport, { to: "body", children: /* @__PURE__ */ jsx(
8881
+ state.isOpen && /* @__PURE__ */ jsx(Teleport, { to: "body", children: /* @__PURE__ */ jsxs(
8875
8882
  "div",
8876
8883
  {
8877
8884
  "data-enum-multiselect-dropdown": props.field,
8878
- class: "bg-base-100 border border-base-300 rounded-box shadow-lg overflow-auto",
8885
+ class: "bg-base-100 border border-base-300 rounded-box shadow-lg flex flex-col",
8879
8886
  style: dropdownStyle.value,
8880
8887
  onMousedown: (e) => {
8881
8888
  e.preventDefault();
8882
8889
  },
8883
- children: props.isOptionsLoading ? /* @__PURE__ */ jsx("div", { class: "p-2", children: /* @__PURE__ */ jsx("span", { class: "text-sm text-base-content/70", children: "Loading options..." }) }) : props.options.length === 0 ? /* @__PURE__ */ jsx("div", { class: "p-2", children: /* @__PURE__ */ jsx("span", { class: "text-sm text-base-content/70", children: "No options available" }) }) : filteredOptions.value.length === 0 ? /* @__PURE__ */ jsx("div", { class: "p-2", children: /* @__PURE__ */ jsxs("span", { class: "text-sm text-base-content/70", children: [
8884
- 'No options found matching "',
8885
- state.searchQuery,
8886
- '"'
8887
- ] }) }) : /* @__PURE__ */ jsx("ul", { class: "menu menu-sm w-full p-2", role: "listbox", "aria-label": `${props.label} options`, children: filteredOptions.value.map((option, index) => {
8888
- const isSelected = selectedValues.some((v) => valuesEqual(v, option.value));
8889
- const isHighlighted = index === state.selectedIndex;
8890
- return /* @__PURE__ */ jsx(
8891
- "li",
8892
- {
8893
- "data-option-index": index,
8894
- role: "option",
8895
- "aria-selected": isSelected,
8896
- class: isHighlighted ? "bg-base-200 rounded" : "",
8897
- children: /* @__PURE__ */ jsxs(
8898
- "label",
8899
- {
8900
- class: "label cursor-pointer gap-2 p-2 rounded hover:bg-base-200",
8901
- onMousedown: (e) => {
8902
- e.preventDefault();
8903
- },
8904
- children: [
8905
- /* @__PURE__ */ jsx(
8906
- "input",
8907
- {
8908
- type: "checkbox",
8909
- checked: isSelected,
8910
- onChange: () => toggleOption(option),
8911
- class: "checkbox checkbox-sm checkbox-primary",
8912
- "data-testid": `datatable-filter-${props.field}-option-${option.value}`,
8913
- tabindex: -1
8914
- }
8915
- ),
8916
- /* @__PURE__ */ jsx("span", { class: "label-text flex-1 truncate", title: option.label, children: option.label })
8917
- ]
8918
- }
8919
- )
8920
- },
8921
- String(option.value)
8922
- );
8923
- }) })
8890
+ children: [
8891
+ /* @__PURE__ */ jsxs("div", { class: "flex items-center justify-between p-2 border-b border-base-300 flex-shrink-0", children: [
8892
+ /* @__PURE__ */ jsx("span", { class: "text-xs font-semibold text-base-content/70", children: props.label }),
8893
+ /* @__PURE__ */ jsx(
8894
+ "button",
8895
+ {
8896
+ type: "button",
8897
+ onClick: (e) => {
8898
+ e.preventDefault();
8899
+ e.stopPropagation();
8900
+ closeDropdown();
8901
+ },
8902
+ onMousedown: (e) => {
8903
+ e.preventDefault();
8904
+ },
8905
+ class: "btn btn-ghost btn-xs p-0 h-5 w-5 min-h-0 rounded hover:bg-base-300",
8906
+ "aria-label": "Close dropdown",
8907
+ "data-testid": `datatable-filter-${props.field}-close`,
8908
+ children: /* @__PURE__ */ jsx(
8909
+ "svg",
8910
+ {
8911
+ xmlns: "http://www.w3.org/2000/svg",
8912
+ class: "h-4 w-4",
8913
+ fill: "none",
8914
+ viewBox: "0 0 24 24",
8915
+ stroke: "currentColor",
8916
+ "stroke-width": "2",
8917
+ children: /* @__PURE__ */ jsx("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "M6 18L18 6M6 6l12 12" })
8918
+ }
8919
+ )
8920
+ }
8921
+ )
8922
+ ] }),
8923
+ /* @__PURE__ */ jsx("div", { class: "overflow-auto flex-1", children: props.isOptionsLoading ? /* @__PURE__ */ jsx("div", { class: "p-2", children: /* @__PURE__ */ jsx("span", { class: "text-sm text-base-content/70", children: "Loading options..." }) }) : props.options.length === 0 ? /* @__PURE__ */ jsx("div", { class: "p-2", children: /* @__PURE__ */ jsx("span", { class: "text-sm text-base-content/70", children: "No options available" }) }) : filteredOptions.value.length === 0 ? /* @__PURE__ */ jsx("div", { class: "p-2", children: /* @__PURE__ */ jsxs("span", { class: "text-sm text-base-content/70", children: [
8924
+ 'No options found matching "',
8925
+ state.searchQuery,
8926
+ '"'
8927
+ ] }) }) : /* @__PURE__ */ jsx("ul", { class: "menu menu-sm w-full p-2", role: "listbox", "aria-label": `${props.label} options`, children: filteredOptions.value.map((option, index) => {
8928
+ const isSelected = selectedValues.some((v) => valuesEqual(v, option.value));
8929
+ const isHighlighted = index === state.selectedIndex;
8930
+ return /* @__PURE__ */ jsx(
8931
+ "li",
8932
+ {
8933
+ "data-option-index": index,
8934
+ role: "option",
8935
+ "aria-selected": isSelected,
8936
+ class: isHighlighted ? "bg-base-200 rounded" : "",
8937
+ children: /* @__PURE__ */ jsxs(
8938
+ "label",
8939
+ {
8940
+ class: "label cursor-pointer gap-2 p-2 rounded hover:bg-base-200",
8941
+ onMousedown: (e) => {
8942
+ e.preventDefault();
8943
+ },
8944
+ children: [
8945
+ /* @__PURE__ */ jsx(
8946
+ "input",
8947
+ {
8948
+ type: "checkbox",
8949
+ checked: isSelected,
8950
+ onChange: () => toggleOption(option),
8951
+ class: "checkbox checkbox-sm checkbox-primary",
8952
+ "data-testid": `datatable-filter-${props.field}-option-${option.value}`,
8953
+ tabindex: -1
8954
+ }
8955
+ ),
8956
+ /* @__PURE__ */ jsx("span", { class: "label-text flex-1 truncate", title: option.label, children: option.label })
8957
+ ]
8958
+ }
8959
+ )
8960
+ },
8961
+ String(option.value)
8962
+ );
8963
+ }) }) })
8964
+ ]
8924
8965
  }
8925
8966
  ) })
8926
8967
  ] }),
@@ -10130,7 +10171,15 @@ var FilterDrawer = (props) => {
10130
10171
  fill: "none",
10131
10172
  viewBox: "0 0 24 24",
10132
10173
  stroke: "currentColor",
10133
- children: /* @__PURE__ */ jsx("path", { "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", d: "M6 18L18 6M6 6l12 12" })
10174
+ children: /* @__PURE__ */ jsx(
10175
+ "path",
10176
+ {
10177
+ "stroke-linecap": "round",
10178
+ "stroke-linejoin": "round",
10179
+ "stroke-width": "2",
10180
+ d: "M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
10181
+ }
10182
+ )
10134
10183
  }
10135
10184
  ),
10136
10185
  "Clear All"