@canlooks/can-ui 0.0.141 → 0.0.142

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/cjs/components/dataGrid/filterBubbleContent.js +9 -10
  2. package/dist/esm/components/dataGrid/filterBubbleContent.js +9 -10
  3. package/package.json +1 -1
package/dist/cjs/components/dataGrid/filterBubbleContent.js CHANGED
@@ -18,35 +18,34 @@ exports.FilterBubbleContent = (0, react_1.memo)(({ columnKey, columnFilterProps
18
18
  const { formRef } = (0, form_1.useFormContext)();
19
19
  const { open, setOpen } = (0, popper_1.usePopperContext)();
20
20
  (0, react_1.useEffect)(() => {
21
- if (!open && !('control' in columnFilterProps) && columnFilterProps.multiple) {
21
+ if (!open && 'multiple' in columnFilterProps && columnFilterProps.multiple) {
22
22
  // 多选模式下，关闭弹框触发筛选
23
23
  formRef.current.submit().then();
24
24
  }
25
25
  }, [open]);
26
26
  return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(form_1.FormItem, { field: columnKey, children: 'control' in columnFilterProps
27
27
  ? columnFilterProps.control
28
- : (0, jsx_runtime_1.jsx)(FilterOptions, { ...columnFilterProps, onChange: value => {
29
- columnFilterProps.onChange?.(value);
30
- !columnFilterProps.multiple && setOpen(false);
31
- } }) }), columnFilterProps.showButton !== false &&
28
+ : (0, jsx_runtime_1.jsx)(FilterOptions, { ...columnFilterProps }) }), columnFilterProps.showButton !== false &&
32
29
  (0, jsx_runtime_1.jsx)(flex_1.Flex, { gap: 6, justifyContent: "center", marginTop: 6, children: (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "text", onClick: () => {
33
30
  formRef.current.setFieldValue(columnKey, null);
34
31
  setOpen(false);
35
- }, children: "\u91CD\u7F6E" }) }), !('control' in columnFilterProps) && !columnFilterProps.multiple &&
32
+ }, children: "\u91CD\u7F6E" }) }), 'multiple' in columnFilterProps && !columnFilterProps.multiple &&
36
33
  // 单选模式，变化即触发筛选
37
- (0, jsx_runtime_1.jsx)(TriggerFilterOnChange, {})] }));
34
+ (0, jsx_runtime_1.jsx)(TriggerFilterOnChange, { onSubmit: () => setOpen(false) })] }));
38
35
  });
39
36
  const FilterOptions = (0, react_1.memo)(({ multiple = true, showButton = true, searchable = false, value, onChange, ...props }) => {
40
37
  const [selectedValue, toggleSelect] = (0, selectionContext_1.useFlatSelection)({ multiple, value, onChange });
41
38
  const [searchValue, setSearchValue] = (0, react_1.useState)('');
42
39
  const deferredSearchValue = (0, react_1.useDeferredValue)(searchValue);
43
- return ((0, jsx_runtime_1.jsxs)("div", { css: filterBubbleContent_style_1.style, children: [(0, jsx_runtime_1.jsx)(input_1.Input, { prefix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: free_solid_svg_icons_1.faSearch }), placeholder: "\u641C\u7D22", value: searchValue, onChange: e => setSearchValue(e.target.value) }), (0, jsx_runtime_1.jsx)(optionsBase_1.OptionsBase, { showCheckbox: multiple, ...props, searchValue: deferredSearchValue, selectedValue: selectedValue, onToggleSelected: toggleSelect })] }));
40
+ return ((0, jsx_runtime_1.jsxs)("div", { css: filterBubbleContent_style_1.style, children: [searchable &&
41
+ (0, jsx_runtime_1.jsx)(input_1.Input, { prefix: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: free_solid_svg_icons_1.faSearch }), placeholder: "\u641C\u7D22", value: searchValue, onChange: e => setSearchValue(e.target.value) }), (0, jsx_runtime_1.jsx)(optionsBase_1.OptionsBase, { showCheckbox: multiple, ...props, searchValue: deferredSearchValue, selectedValue: selectedValue, onToggleSelected: toggleSelect })] }));
44
42
  });
45
- const TriggerFilterOnChange = (0, react_1.memo)(() => {
43
+ function TriggerFilterOnChange(props) {
46
44
  const { formRef } = (0, form_1.useFormContext)();
47
45
  const { formValue } = (0, form_1.useFormValueContext)();
48
46
  (0, utils_1.useUpdateEffect)(() => {
49
47
  formRef.current.submit().then();
48
+ props.onSubmit?.();
50
49
  }, [formValue]);
51
50
  return null;
52
- });
51
+ }
package/dist/esm/components/dataGrid/filterBubbleContent.js CHANGED
@@ -15,35 +15,34 @@ export const FilterBubbleContent = memo(({ columnKey, columnFilterProps }) => {
15
15
  const { formRef } = useFormContext();
16
16
  const { open, setOpen } = usePopperContext();
17
17
  useEffect(() => {
18
- if (!open && !('control' in columnFilterProps) && columnFilterProps.multiple) {
18
+ if (!open && 'multiple' in columnFilterProps && columnFilterProps.multiple) {
19
19
  // 多选模式下，关闭弹框触发筛选
20
20
  formRef.current.submit().then();
21
21
  }
22
22
  }, [open]);
23
23
  return (_jsxs(_Fragment, { children: [_jsx(FormItem, { field: columnKey, children: 'control' in columnFilterProps
24
24
  ? columnFilterProps.control
25
- : _jsx(FilterOptions, { ...columnFilterProps, onChange: value => {
26
- columnFilterProps.onChange?.(value);
27
- !columnFilterProps.multiple && setOpen(false);
28
- } }) }), columnFilterProps.showButton !== false &&
25
+ : _jsx(FilterOptions, { ...columnFilterProps }) }), columnFilterProps.showButton !== false &&
29
26
  _jsx(Flex, { gap: 6, justifyContent: "center", marginTop: 6, children: _jsx(Button, { variant: "text", onClick: () => {
30
27
  formRef.current.setFieldValue(columnKey, null);
31
28
  setOpen(false);
32
- }, children: "\u91CD\u7F6E" }) }), !('control' in columnFilterProps) && !columnFilterProps.multiple &&
29
+ }, children: "\u91CD\u7F6E" }) }), 'multiple' in columnFilterProps && !columnFilterProps.multiple &&
33
30
  // 单选模式，变化即触发筛选
34
- _jsx(TriggerFilterOnChange, {})] }));
31
+ _jsx(TriggerFilterOnChange, { onSubmit: () => setOpen(false) })] }));
35
32
  });
36
33
  const FilterOptions = memo(({ multiple = true, showButton = true, searchable = false, value, onChange, ...props }) => {
37
34
  const [selectedValue, toggleSelect] = useFlatSelection({ multiple, value, onChange });
38
35
  const [searchValue, setSearchValue] = useState('');
39
36
  const deferredSearchValue = useDeferredValue(searchValue);
40
- return (_jsxs("div", { css: style, children: [_jsx(Input, { prefix: _jsx(Icon, { icon: faSearch }), placeholder: "\u641C\u7D22", value: searchValue, onChange: e => setSearchValue(e.target.value) }), _jsx(OptionsBase, { showCheckbox: multiple, ...props, searchValue: deferredSearchValue, selectedValue: selectedValue, onToggleSelected: toggleSelect })] }));
37
+ return (_jsxs("div", { css: style, children: [searchable &&
38
+ _jsx(Input, { prefix: _jsx(Icon, { icon: faSearch }), placeholder: "\u641C\u7D22", value: searchValue, onChange: e => setSearchValue(e.target.value) }), _jsx(OptionsBase, { showCheckbox: multiple, ...props, searchValue: deferredSearchValue, selectedValue: selectedValue, onToggleSelected: toggleSelect })] }));
41
39
  });
42
- const TriggerFilterOnChange = memo(() => {
40
+ function TriggerFilterOnChange(props) {
43
41
  const { formRef } = useFormContext();
44
42
  const { formValue } = useFormValueContext();
45
43
  useUpdateEffect(() => {
46
44
  formRef.current.submit().then();
45
+ props.onSubmit?.();
47
46
  }, [formValue]);
48
47
  return null;
49
- });
48
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@canlooks/can-ui",
3
- "version": "0.0.141",
3
+ "version": "0.0.142",
4
4
  "author": "C.CanLiang <canlooks@gmail.com>",
5
5
  "description": "My ui framework",
6
6
  "license": "MIT",