@evance/evance-ui 1.0.18 → 1.0.19

package/dist/cjs/EvDataTableSearch.vue_vue_type_script_setup_true_lang-BWjOXX2V.cjs

@@ -0,0 +1,453 @@
+"use strict";
+/*! Evance UI v1.0.19 | MIT License */
+const vue = require("vue");
+const modelProxy = require("./modelProxy-Df-Rb6Ln.cjs");
+const SearchIcon = require("./SearchIcon-Dm4hoIPo.cjs");
+const locale = require("./locale-A5VJhhZx.cjs");
+const props = require("./props-D-eDJwTQ.cjs");
+const EvBadge_vue_vue_type_script_setup_true_lang = require("./EvBadge.vue_vue_type_script_setup_true_lang-3eJfEeFP.cjs");
+const EvButton_vue_vue_type_script_setup_true_lang = require("./EvButton.vue_vue_type_script_setup_true_lang-BK93owmy.cjs");
+const EvButtonGroup_vue_vue_type_script_setup_true_lang = require("./EvButtonGroup.vue_vue_type_script_setup_true_lang-J2O-g38A.cjs");
+const EvCheckbox_vue_vue_type_script_setup_true_lang = require("./EvCheckbox.vue_vue_type_script_setup_true_lang-Uc7e2Kas.cjs");
+const EvDefaultsProvider_vue_vue_type_script_setup_true_lang = require("./EvDefaultsProvider.vue_vue_type_script_setup_true_lang-D2SfitjW.cjs");
+const EvDivider_vue_vue_type_style_index_0_lang = require("./EvDivider.vue_vue_type_style_index_0_lang-DsJZovlv.cjs");
+const EvList_vue_vue_type_script_setup_true_lang = require("./EvList.vue_vue_type_script_setup_true_lang-DsNWOUId.cjs");
+const EvMenu_vue_vue_type_script_setup_true_lang = require("./EvMenu.vue_vue_type_script_setup_true_lang-DsxDLEAL.cjs");
+const EvSection_vue_vue_type_script_setup_true_lang = require("./EvSection.vue_vue_type_script_setup_true_lang-RgIu8l0r.cjs");
+const EvSlideGroup_vue_vue_type_script_setup_true_lang = require("./EvSlideGroup.vue_vue_type_script_setup_true_lang-BjQBHWj9.cjs");
+const EvSurface_vue_vue_type_script_setup_true_lang = require("./EvSurface.vue_vue_type_script_setup_true_lang-BQ7LuIt7.cjs");
+const EvTextfield_vue_vue_type_script_setup_true_lang = require("./EvTextfield.vue_vue_type_script_setup_true_lang-Dut9xwui.cjs");
+const EvTooltip_vue_vue_type_script_setup_true_lang = require("./EvTooltip.vue_vue_type_script_setup_true_lang-DfWC0U3F.cjs");
+const select = require("./select-DLuAOLDe.cjs");
+const EvTransitionExpand = require("./EvTransitionExpand.cjs");
+const helpers = require("./helpers-BDF23Mo9.cjs");
+const isFunctions = require("./is-functions-wLPKe_5h.cjs");
+const makeDataTableSortProps = props.propsFactory(
+  {
+    sort: {
+      type: Array,
+      default: () => []
+    },
+    sortOptions: Array
+  },
+  "data-table-sort"
+);
+function useSortOptions(props2) {
+  const sortSelected = modelProxy.useModelProxy(props2, "sort");
+  const { t } = locale.useLocaleFunctions();
+  const hasSort = vue.computed(() => {
+    var _a;
+    return (_a = props2.sortOptions) == null ? void 0 : _a.length;
+  });
+  function isTitleDisabled(title) {
+    return getItemsByTitle(title).every((option) => option.disabled);
+  }
+  function getItemsByTitle(title) {
+    return sortOptions.value.filter((item) => item.title === title);
+  }
+  function getTitleFromValue(value) {
+    const titles = sortOptions.value.filter((item) => item.value === value).map((item) => item.title);
+    return titles[0] ?? void 0;
+  }
+  function isAscending(value) {
+    return value == null ? void 0 : value.endsWith("asc");
+  }
+  const sortOptions = vue.computed(() => {
+    return props2.sortOptions.map((item) => {
+      return Object.assign(
+        {
+          disabled: item.disabled ?? false,
+          direction: item.value.endsWith("asc") ? t("sort.ascending") : t("sort.descending")
+        },
+        item
+      );
+    });
+  });
+  const sortTitleOptions = vue.computed(() => {
+    const titles = Array.from(
+      new Set(sortOptions.value.map((item) => item.title))
+    );
+    const options = [];
+    for (const title of titles) {
+      options.push({
+        title,
+        value: title,
+        props: {
+          disabled: isTitleDisabled(title)
+        }
+      });
+    }
+    return options;
+  });
+  const sortTitleSelected = vue.computed(() => {
+    const titles = [];
+    for (const value of sortSelected.value) {
+      titles.push(getTitleFromValue(value));
+    }
+    return titles;
+  });
+  const sortTitle = vue.computed(() => sortTitleSelected.value[0]);
+  const sortDirectionOptions = vue.computed(() => {
+    const options = getItemsByTitle(sortTitle.value);
+    return options.map((option) => {
+      return Object.assign(
+        {
+          props: {
+            disabled: option.disabled,
+            iconStart: isAscending(option.value) ? SearchIcon.ArrowUpIcon : SearchIcon.ArrowDownIcon
+          }
+        },
+        option
+      );
+    });
+  });
+  const onSortTitleSelected = (selection) => {
+    const options = getItemsByTitle(selection[0]);
+    const availableValues = options.filter((option) => {
+      return isAscending(option.value) === isAscending(sortSelected.value[0]) && !option.disabled;
+    });
+    const newOption = availableValues[0] ?? options[0];
+    sortSelected.value = [newOption.value];
+  };
+  const sortIcon = vue.computed(() => {
+    return isAscending(sortSelected.value[0]) ? SearchIcon.ArrowUpIcon : SearchIcon.ArrowDownIcon;
+  });
+  return {
+    hasSort,
+    sortOptions,
+    sortSelected,
+    sortTitle,
+    sortTitleOptions,
+    sortTitleSelected,
+    sortDirectionOptions,
+    onSortTitleSelected,
+    sortIcon
+  };
+}
+const makeEvDataTableSearchProps = props.propsFactory(
+  {
+    filters: {
+      type: Object,
+      default: () => ({})
+    },
+    hideSelectAll: Boolean,
+    loading: Boolean,
+    search: String,
+    searchDelay: {
+      type: Number,
+      default: 300
+    },
+    searchPlaceholder: String,
+    selectActions: Array,
+    ...makeDataTableSortProps()
+  },
+  "EvDataTableSearch"
+);
+const _hoisted_1 = {
+  key: 0,
+  class: "ev-data-table-search--checkbox"
+};
+const _hoisted_2 = {
+  key: 0,
+  class: "ev-data-table-search--options"
+};
+const _hoisted_3 = { class: "ev-data-table-search--field" };
+const _hoisted_4 = {
+  key: 0,
+  class: "ev-data-table-search--filter"
+};
+const _hoisted_5 = {
+  key: 1,
+  class: "ev-data-table-search--filters"
+};
+const _hoisted_6 = {
+  key: 2,
+  class: "ev-data-table-search--sort"
+};
+const _hoisted_7 = {
+  key: 1,
+  class: "ev-data-table-search--actions"
+};
+const _hoisted_8 = {
+  key: "filter",
+  class: "ev-data-table-filters-mask"
+};
+const _hoisted_9 = { class: "ev-data-table-filters" };
+const filtersBreakpoint = 900;
+const sortBreakpoint = 480;
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "EvDataTableSearch",
+  props: { ...makeEvDataTableSearchProps() },
+  emits: ["update:sort", "click:filter", "update:search"],
+  setup(__props, { emit }) {
+    const props2 = __props;
+    const sortButtonRef = vue.ref();
+    const filterButtonRef = vue.ref();
+    const { t } = locale.useLocaleFunctions();
+    const search = modelProxy.useModelProxy(props2, "search");
+    const searchInternal = vue.shallowRef("");
+    const {
+      hasSort,
+      sortSelected,
+      sortTitle,
+      sortTitleOptions,
+      sortTitleSelected,
+      sortDirectionOptions,
+      onSortTitleSelected,
+      sortIcon
+    } = useSortOptions(props2);
+    const slots = vue.useSlots();
+    const { allSelected, someSelected, selectAll, showSelectAll } = select.useSelection();
+    const isTransitioning = vue.shallowRef(false);
+    const containerRef = vue.ref(null);
+    const containerWidth = vue.shallowRef(null);
+    const showFilters = vue.shallowRef(false);
+    function onClickFilter(e) {
+      showFilters.value = !showFilters.value;
+      emit("click:filter", e);
+    }
+    const placeholder = vue.computed(
+      () => {
+        var _a;
+        return ((_a = props2.searchPlaceholder) == null ? void 0 : _a.length) ? props2.searchPlaceholder : t("search.placeholder");
+      }
+    );
+    const updateSearch = helpers.debounce((value) => {
+      search.value = value;
+    }, props2.searchDelay);
+    const showActions = vue.computed(() => {
+      const hasSelectActions = slots["select-actions"] || props2.selectActions;
+      return someSelected.value && hasSelectActions;
+    });
+    const isFiltersMobile = vue.computed(() => {
+      return containerWidth.value < filtersBreakpoint;
+    });
+    const filterDefaults = {
+      EvFilterButton: { size: "small", rounded: true },
+      EvButton: { size: "small" }
+    };
+    const sortButtonTitle = vue.computed(() => {
+      return containerWidth.value > sortBreakpoint ? sortTitle.value : void 0;
+    });
+    const isFiltered = vue.computed(() => {
+      for (const key in props2.filters) {
+        const value = props2.filters[key];
+        if (isFunctions.isBoolean(value) && value) {
+          return true;
+        } else if (Array.isArray(value) && value.length > 0) {
+          return true;
+        } else if (!isFunctions.isBoolean(value) && !isFunctions.isArray(value) && !isFunctions.isEmpty(value)) {
+          return true;
+        }
+      }
+      return false;
+    });
+    function onSearchInternal(value) {
+      updateSearch(value);
+    }
+    function onBeforeLeave() {
+      isTransitioning.value = true;
+    }
+    function onAfterEnter() {
+      isTransitioning.value = false;
+    }
+    function onResize() {
+      containerWidth.value = containerRef.value.getBoundingClientRect().width;
+    }
+    vue.onMounted(() => {
+      window.addEventListener("resize", onResize, { passive: true });
+      onResize();
+    });
+    vue.onUnmounted(() => {
+      window.removeEventListener("resize", onResize);
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
+        vue.createElementVNode("div", {
+          ref_key: "containerRef",
+          ref: containerRef,
+          class: "ev-data-table-search"
+        }, [
+          vue.unref(showSelectAll) && !props2.hideSelectAll ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+            vue.createVNode(vue.unref(EvCheckbox_vue_vue_type_script_setup_true_lang._sfc_main), {
+              "model-value": vue.unref(allSelected),
+              indeterminate: vue.unref(someSelected) && !vue.unref(allSelected),
+              "onUpdate:modelValue": vue.unref(selectAll)
+            }, null, 8, ["model-value", "indeterminate", "onUpdate:modelValue"])
+          ])) : vue.createCommentVNode("", true),
+          vue.createElementVNode("div", {
+            class: vue.normalizeClass([
+              "ev-data-table-search--modifiers",
+              {
+                "is-transitioning": isTransitioning.value
+              }
+            ])
+          }, [
+            vue.createVNode(vue.Transition, {
+              name: "transition-slide-up",
+              mode: "out-in",
+              onBeforeLeave,
+              onAfterEnter
+            }, {
+              default: vue.withCtx(() => [
+                !showActions.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
+                  vue.createElementVNode("div", _hoisted_3, [
+                    vue.createVNode(vue.unref(EvTextfield_vue_vue_type_script_setup_true_lang._sfc_main), {
+                      modelValue: searchInternal.value,
+                      "onUpdate:modelValue": [
+                        _cache[0] || (_cache[0] = ($event) => searchInternal.value = $event),
+                        onSearchInternal
+                      ],
+                      rounded: "",
+                      clearable: "",
+                      appearance: "subtle",
+                      size: "small",
+                      loading: props2.loading,
+                      placeholder: placeholder.value,
+                      "icon-start": vue.unref(SearchIcon.SearchIcon)
+                    }, null, 8, ["modelValue", "loading", "placeholder", "icon-start"])
+                  ]),
+                  isFiltersMobile.value && vue.unref(slots).filters ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4, [
+                    vue.createVNode(vue.unref(EvBadge_vue_vue_type_script_setup_true_lang._sfc_main), {
+                      dot: "",
+                      bold: "",
+                      pulsate: "",
+                      appearance: "primary",
+                      "model-value": isFiltered.value && !showFilters.value
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createVNode(vue.unref(EvButton_vue_vue_type_script_setup_true_lang._sfc_main), {
+                          ref_key: "filterButtonRef",
+                          ref: filterButtonRef,
+                          rounded: "",
+                          size: "small",
+                          appearance: isFiltered.value ? "primary" : "default",
+                          variant: isFiltered.value ? "tonal" : "subtle",
+                          icon: vue.unref(SearchIcon.FilterIcon),
+                          onClick: onClickFilter
+                        }, null, 8, ["appearance", "variant", "icon"])
+                      ]),
+                      _: 1
+                    }, 8, ["model-value"]),
+                    vue.createVNode(vue.unref(EvTooltip_vue_vue_type_script_setup_true_lang._sfc_main), {
+                      activator: filterButtonRef.value,
+                      text: vue.unref(t)("search.filter")
+                    }, null, 8, ["activator", "text"])
+                  ])) : vue.createCommentVNode("", true),
+                  !isFiltersMobile.value && vue.unref(slots).filters ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5, [
+                    vue.createVNode(vue.unref(EvDefaultsProvider_vue_vue_type_script_setup_true_lang._sfc_main), { defaults: filterDefaults }, {
+                      default: vue.withCtx(() => [
+                        vue.createVNode(vue.unref(EvSlideGroup_vue_vue_type_script_setup_true_lang._sfc_main), null, {
+                          default: vue.withCtx(() => [
+                            vue.renderSlot(_ctx.$slots, "filters")
+                          ]),
+                          _: 3
+                        })
+                      ]),
+                      _: 3
+                    })
+                  ])) : vue.createCommentVNode("", true),
+                  vue.unref(hasSort) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6, [
+                    vue.createVNode(vue.unref(EvButton_vue_vue_type_script_setup_true_lang._sfc_main), {
+                      ref_key: "sortButtonRef",
+                      ref: sortButtonRef,
+                      rounded: "",
+                      size: "small",
+                      variant: "subtle",
+                      text: sortButtonTitle.value,
+                      "icon-end": vue.unref(sortIcon)
+                    }, null, 8, ["text", "icon-end"]),
+                    vue.createVNode(vue.unref(EvTooltip_vue_vue_type_script_setup_true_lang._sfc_main), {
+                      activator: sortButtonRef.value,
+                      text: vue.unref(t)("sort.label")
+                    }, null, 8, ["activator", "text"]),
+                    vue.createVNode(vue.unref(EvMenu_vue_vue_type_script_setup_true_lang._sfc_main), {
+                      activator: sortButtonRef.value,
+                      "close-on-content-click": false,
+                      width: 200,
+                      position: "bottom-end"
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createVNode(vue.unref(EvSurface_vue_vue_type_script_setup_true_lang._sfc_main), {
+                          elevation: "overlay",
+                          class: "w-100 h-100"
+                        }, {
+                          default: vue.withCtx(() => [
+                            vue.createVNode(vue.unref(EvSection_vue_vue_type_script_setup_true_lang._sfc_main), {
+                              title: vue.unref(t)("sort.heading")
+                            }, {
+                              default: vue.withCtx(() => [
+                                vue.createVNode(vue.unref(EvList_vue_vue_type_script_setup_true_lang._sfc_main), {
+                                  required: "",
+                                  "select-strategy": "single-any",
+                                  items: vue.unref(sortTitleOptions),
+                                  selected: vue.unref(sortTitleSelected),
+                                  "onUpdate:selected": vue.unref(onSortTitleSelected)
+                                }, null, 8, ["items", "selected", "onUpdate:selected"])
+                              ]),
+                              _: 1
+                            }, 8, ["title"]),
+                            vue.createVNode(vue.unref(EvDivider_vue_vue_type_style_index_0_lang._sfc_main)),
+                            vue.createVNode(vue.unref(EvSection_vue_vue_type_script_setup_true_lang._sfc_main), {
+                              title: vue.unref(t)("sort.direction")
+                            }, {
+                              default: vue.withCtx(() => [
+                                vue.createVNode(vue.unref(EvList_vue_vue_type_script_setup_true_lang._sfc_main), {
+                                  selected: vue.unref(sortSelected),
+                                  "onUpdate:selected": _cache[1] || (_cache[1] = ($event) => vue.isRef(sortSelected) ? sortSelected.value = $event : null),
+                                  required: "",
+                                  "select-strategy": "single-any",
+                                  "item-title": "direction",
+                                  items: vue.unref(sortDirectionOptions)
+                                }, null, 8, ["selected", "items"])
+                              ]),
+                              _: 1
+                            }, 8, ["title"])
+                          ]),
+                          _: 1
+                        })
+                      ]),
+                      _: 1
+                    }, 8, ["activator"])
+                  ])) : vue.createCommentVNode("", true)
+                ])) : (vue.openBlock(), vue.createElementBlock("div", _hoisted_7, [
+                  vue.renderSlot(_ctx.$slots, "select-actions", {}, () => [
+                    vue.createVNode(vue.unref(EvButtonGroup_vue_vue_type_script_setup_true_lang._sfc_main), {
+                      size: "small",
+                      variant: "subtle",
+                      items: props2.selectActions
+                    }, null, 8, ["items"])
+                  ])
+                ]))
+              ]),
+              _: 3
+            })
+          ], 2)
+        ], 512),
+        vue.createVNode(vue.unref(EvTransitionExpand.EvTransitionExpand), null, {
+          default: vue.withCtx(() => [
+            isFiltersMobile.value && showFilters.value && vue.unref(slots).filters && !showActions.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_8, [
+              vue.createElementVNode("div", _hoisted_9, [
+                vue.createVNode(vue.unref(EvDefaultsProvider_vue_vue_type_script_setup_true_lang._sfc_main), { defaults: filterDefaults }, {
+                  default: vue.withCtx(() => [
+                    vue.createVNode(vue.unref(EvSlideGroup_vue_vue_type_script_setup_true_lang._sfc_main), null, {
+                      default: vue.withCtx(() => [
+                        vue.renderSlot(_ctx.$slots, "filters")
+                      ]),
+                      _: 3
+                    })
+                  ]),
+                  _: 3
+                })
+              ])
+            ])) : vue.createCommentVNode("", true)
+          ]),
+          _: 3
+        })
+      ], 64);
+    };
+  }
+});
+exports._sfc_main = _sfc_main;
+exports.makeEvDataTableSearchProps = makeEvDataTableSearchProps;
+//# sourceMappingURL=EvDataTableSearch.vue_vue_type_script_setup_true_lang-BWjOXX2V.cjs.map

package/dist/cjs/EvDataTableSearch.vue_vue_type_script_setup_true_lang-BWjOXX2V.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"EvDataTableSearch.vue_vue_type_script_setup_true_lang-BWjOXX2V.cjs","sources":["../../src/components/EvDataTable/composables/sort.ts","../../src/components/EvDataTable/EvDataTableSearch/EvDataTableSearch.ts","../../src/components/EvDataTable/EvDataTableSearch/EvDataTableSearch.vue"],"sourcesContent":["import { propsFactory } from \"@/util\";\nimport { computed, ComputedRef, PropType } from \"vue\";\nimport { useModelProxy } from \"@/composables/modelProxy\";\nimport { useLocaleFunctions } from \"@/composables\";\nimport { ArrowDownIcon, ArrowUpIcon } from \"@/icons\";\n\nexport type SortItem = {\n    key: string;\n    order?: boolean | \"asc\" | \"desc\";\n};\n\nexport interface SortOption {\n    title: string;\n    value: string;\n    direction?: string;\n    disabled?: boolean;\n}\n\nexport interface SortProps {\n    sort: string[];\n    sortOptions: SortOption[];\n}\n\nexport const makeDataTableSortProps = propsFactory(\n    {\n        sort: {\n            type: Array as PropType<string[]>,\n            default: () => [],\n        },\n        sortOptions: Array as PropType<SortOption[]>,\n    },\n    \"data-table-sort\",\n);\n\nexport function useSortOptions(props: SortProps) {\n    const sortSelected = useModelProxy(props, \"sort\");\n    const { t } = useLocaleFunctions();\n    const hasSort = computed(() => props.sortOptions?.length);\n\n    function isTitleDisabled(title: string) {\n        return getItemsByTitle(title).every((option) => option.disabled);\n    }\n\n    function getItemsByTitle(title: string) {\n        return sortOptions.value.filter((item) => item.title === title);\n    }\n\n    function getTitleFromValue(value: string) {\n        const titles = sortOptions.value\n            .filter((item) => item.value === value)\n            .map((item) => item.title);\n        return titles[0] ?? undefined;\n    }\n\n    function isAscending(value: string) {\n        return value?.endsWith(\"asc\");\n    }\n\n    /**\n     * Fixes some optional properties in `SortOption` objects.\n     */\n    const sortOptions: ComputedRef<SortOption[]> = computed(() => {\n        return props.sortOptions.map((item) => {\n            return Object.assign(\n                {\n                    disabled: item.disabled ?? false,\n                    direction: item.value.endsWith(\"asc\")\n                        ? t(\"sort.ascending\")\n                        : t(\"sort.descending\"),\n                },\n                item,\n            );\n        });\n    });\n\n    /**\n     * Reduces the supplied sort options down to unique titles\n     * and determines whether the title is disabled if all of its\n     * values are disabled.\n     */\n    const sortTitleOptions = computed(() => {\n        const titles = Array.from(\n            new Set(sortOptions.value.map((item) => item.title)),\n        );\n        const options = [];\n        for (const title of titles) {\n            options.push({\n                title,\n                value: title,\n                props: {\n                    disabled: isTitleDisabled(title),\n                },\n            });\n        }\n        return options;\n    });\n\n    const sortTitleSelected = computed(() => {\n        const titles = [];\n        for (const value of sortSelected.value) {\n            titles.push(getTitleFromValue(value));\n        }\n        return titles;\n    });\n\n    const sortTitle = computed(() => sortTitleSelected.value[0]);\n\n    const sortDirectionOptions = computed(() => {\n        const options = getItemsByTitle(sortTitle.value);\n        return options.map((option) => {\n            return Object.assign(\n                {\n                    props: {\n                        disabled: option.disabled,\n                        iconStart: isAscending(option.value)\n                            ? ArrowUpIcon\n                            : ArrowDownIcon,\n                    },\n                },\n                option,\n            );\n        });\n    });\n\n    const onSortTitleSelected = (selection: string[]) => {\n        const options = getItemsByTitle(selection[0]);\n        const availableValues = options.filter((option) => {\n            return (\n                isAscending(option.value) ===\n                    isAscending(sortSelected.value[0]) && !option.disabled\n            );\n        });\n        const newOption = availableValues[0] ?? options[0];\n        sortSelected.value = [newOption.value];\n    };\n\n    const sortIcon = computed(() => {\n        return isAscending(sortSelected.value[0]) ? ArrowUpIcon : ArrowDownIcon;\n    });\n\n    return {\n        hasSort,\n        sortOptions,\n        sortSelected,\n        sortTitle,\n        sortTitleOptions,\n        sortTitleSelected,\n        sortDirectionOptions,\n        onSortTitleSelected,\n        sortIcon,\n    };\n}\n","import { propsFactory } from \"@/util\";\nimport { makeDataTableSortProps } from \"../composables/sort\";\nimport { PropType } from \"vue\";\nimport { EvButtonProps } from \"@/components\";\n\nexport const makeEvDataTableSearchProps = propsFactory(\n    {\n        filters: {\n            type: Object as PropType<Record<string, any>>,\n            default: () => ({}),\n        },\n        hideSelectAll: Boolean,\n        loading: Boolean,\n        search: String,\n        searchDelay: {\n            type: Number,\n            default: 300,\n        },\n        searchPlaceholder: String,\n        selectActions: Array as PropType<EvButtonProps[]>,\n        ...makeDataTableSortProps(),\n    },\n    \"EvDataTableSearch\",\n);\n","<script setup lang=\"ts\">\nimport \"./EvDataTableSearch.scss\";\nimport { makeEvDataTableSearchProps } from \"./EvDataTableSearch\";\nimport { EvBadge } from \"@/components/EvBadge\";\nimport { EvButton } from \"@/components/EvButton\";\nimport { EvButtonGroup } from \"@/components/EvButtonGroup\";\nimport { EvCheckbox } from \"@/components/EvCheckbox\";\nimport { EvDefaultsProvider } from \"@/components/EvDefaultsProvider\";\nimport { EvDivider } from \"@/components/EvDivider\";\nimport { EvList } from \"@/components/EvList\";\nimport { EvMenu } from \"@/components/EvMenu\";\nimport { EvSection } from \"@/components/EvSection\";\nimport { EvSlideGroup } from \"@/components/EvSlideGroup\";\nimport { EvSurface } from \"@/components/EvSurface\";\nimport { EvTextfield } from \"@/components/EvTextfield\";\nimport { EvTooltip } from \"@/components/EvTooltip\";\nimport { FilterIcon, SearchIcon } from \"@/icons\";\nimport { computed, onMounted, onUnmounted, ref, shallowRef } from \"vue\";\nimport { useLocaleFunctions } from \"@/composables\";\nimport {\n    SortProps,\n    useSortOptions,\n} from \"@/components/EvDataTable/composables/sort\";\nimport { useModelProxy } from \"@/composables/modelProxy\";\nimport { useSelection } from \"@/components/EvDataTable/composables/select\";\nimport { debounce, isArray, isBoolean, isEmpty } from \"@/util\";\nimport { EvTransitionExpand } from \"@/components/EvTransition/transitions\";\n\nconst props = defineProps({ ...makeEvDataTableSearchProps() });\nconst emit = defineEmits([\"update:sort\", \"click:filter\", \"update:search\"]);\nconst sortButtonRef = ref<HTMLElement>();\nconst filterButtonRef = ref<HTMLElement>();\nconst { t } = useLocaleFunctions();\nconst search = useModelProxy(props, \"search\");\nconst searchInternal = shallowRef(\"\");\nconst {\n    hasSort,\n    sortSelected,\n    sortTitle,\n    sortTitleOptions,\n    sortTitleSelected,\n    sortDirectionOptions,\n    onSortTitleSelected,\n    sortIcon,\n} = useSortOptions(props as SortProps);\n\nconst slots = defineSlots<{\n    filters(): never;\n    \"select-actions\"(): never;\n}>();\n\nconst { allSelected, someSelected, selectAll, showSelectAll } = useSelection();\nconst isTransitioning = shallowRef(false);\nconst containerRef = ref<HTMLElement | null>(null);\nconst containerWidth = shallowRef<number | null>(null);\nconst showFilters = shallowRef(false);\nconst filtersBreakpoint = 900;\nconst sortBreakpoint = 480;\n\nfunction onClickFilter(e: MouseEvent) {\n    showFilters.value = !showFilters.value;\n    emit(\"click:filter\", e);\n}\n\nconst placeholder = computed(() =>\n    props.searchPlaceholder?.length\n        ? props.searchPlaceholder\n        : t(\"search.placeholder\"),\n);\n\nconst updateSearch = debounce((value) => {\n    search.value = value;\n}, props.searchDelay);\n\nconst showActions = computed(() => {\n    const hasSelectActions = slots[\"select-actions\"] || props.selectActions;\n    return someSelected.value && hasSelectActions;\n});\n\nconst isFiltersMobile = computed(() => {\n    return containerWidth.value < filtersBreakpoint;\n});\n\nconst filterDefaults = {\n    EvFilterButton: { size: \"small\", rounded: true },\n    EvButton: { size: \"small\" },\n};\n\nconst sortButtonTitle = computed(() => {\n    return containerWidth.value > sortBreakpoint\n        ? sortTitle.value\n        : undefined;\n});\n\nconst isFiltered = computed(() => {\n    for (const key in props.filters) {\n        const value = props.filters[key];\n        if (isBoolean(value) && value) {\n            return true;\n        } else if (Array.isArray(value) && value.length > 0) {\n            return true;\n        } else if (!isBoolean(value) && !isArray(value) && !isEmpty(value)) {\n            return true;\n        }\n    }\n    return false;\n});\n\nfunction onSearchInternal(value: string) {\n    updateSearch(value);\n}\n\nfunction onBeforeLeave() {\n    isTransitioning.value = true;\n}\n\nfunction onAfterEnter() {\n    isTransitioning.value = false;\n}\n\nfunction onResize() {\n    containerWidth.value = containerRef.value.getBoundingClientRect().width;\n}\n\nonMounted(() => {\n    window.addEventListener(\"resize\", onResize, { passive: true });\n    onResize();\n});\n\nonUnmounted(() => {\n    window.removeEventListener(\"resize\", onResize);\n});\n</script>\n\n<template>\n    <div ref=\"containerRef\" class=\"ev-data-table-search\">\n        <div\n            v-if=\"showSelectAll && !props.hideSelectAll\"\n            class=\"ev-data-table-search--checkbox\">\n            <ev-checkbox\n                :model-value=\"allSelected\"\n                :indeterminate=\"someSelected && !allSelected\"\n                @update:model-value=\"selectAll\" />\n        </div>\n        <div\n            :class=\"[\n                'ev-data-table-search--modifiers',\n                {\n                    'is-transitioning': isTransitioning,\n                },\n            ]\">\n            <transition\n                name=\"transition-slide-up\"\n                mode=\"out-in\"\n                @before-leave=\"onBeforeLeave\"\n                @after-enter=\"onAfterEnter\">\n                <div v-if=\"!showActions\" class=\"ev-data-table-search--options\">\n                    <div class=\"ev-data-table-search--field\">\n                        <ev-textfield\n                            v-model=\"searchInternal\"\n                            rounded\n                            clearable\n                            appearance=\"subtle\"\n                            size=\"small\"\n                            :loading=\"props.loading\"\n                            :placeholder=\"placeholder\"\n                            :icon-start=\"SearchIcon\"\n                            @update:model-value=\"onSearchInternal\" />\n                    </div>\n                    <div\n                        v-if=\"isFiltersMobile && slots.filters\"\n                        class=\"ev-data-table-search--filter\">\n                        <ev-badge\n                            dot\n                            bold\n                            pulsate\n                            appearance=\"primary\"\n                            :model-value=\"isFiltered && !showFilters\">\n                            <ev-button\n                                ref=\"filterButtonRef\"\n                                rounded\n                                size=\"small\"\n                                :appearance=\"isFiltered ? 'primary' : 'default'\"\n                                :variant=\"isFiltered ? 'tonal' : 'subtle'\"\n                                :icon=\"FilterIcon\"\n                                @click=\"onClickFilter\" />\n                        </ev-badge>\n                        <ev-tooltip\n                            :activator=\"filterButtonRef\"\n                            :text=\"t('search.filter')\" />\n                    </div>\n                    <div\n                        v-if=\"!isFiltersMobile && slots.filters\"\n                        class=\"ev-data-table-search--filters\">\n                        <ev-defaults-provider :defaults=\"filterDefaults\">\n                            <ev-slide-group>\n                                <slot name=\"filters\" />\n                            </ev-slide-group>\n                        </ev-defaults-provider>\n                    </div>\n                    <div v-if=\"hasSort\" class=\"ev-data-table-search--sort\">\n                        <ev-button\n                            ref=\"sortButtonRef\"\n                            rounded\n                            size=\"small\"\n                            variant=\"subtle\"\n                            :text=\"sortButtonTitle\"\n                            :icon-end=\"sortIcon\" />\n                        <ev-tooltip\n                            :activator=\"sortButtonRef\"\n                            :text=\"t('sort.label')\" />\n                        <ev-menu\n                            :activator=\"sortButtonRef\"\n                            :close-on-content-click=\"false\"\n                            :width=\"200\"\n                            position=\"bottom-end\">\n                            <ev-surface elevation=\"overlay\" class=\"w-100 h-100\">\n                                <ev-section :title=\"t('sort.heading')\">\n                                    <ev-list\n                                        required\n                                        select-strategy=\"single-any\"\n                                        :items=\"sortTitleOptions\"\n                                        :selected=\"sortTitleSelected\"\n                                        @update:selected=\"\n                                            onSortTitleSelected\n                                        \" />\n                                </ev-section>\n                                <ev-divider />\n                                <ev-section :title=\"t('sort.direction')\">\n                                    <ev-list\n                                        v-model:selected=\"sortSelected\"\n                                        required\n                                        select-strategy=\"single-any\"\n                                        item-title=\"direction\"\n                                        :items=\"sortDirectionOptions\" />\n                                </ev-section>\n                            </ev-surface>\n                        </ev-menu>\n                    </div>\n                </div>\n                <div v-else class=\"ev-data-table-search--actions\">\n                    <slot name=\"select-actions\">\n                        <ev-button-group\n                            size=\"small\"\n                            variant=\"subtle\"\n                            :items=\"props.selectActions\" />\n                    </slot>\n                </div>\n            </transition>\n        </div>\n    </div>\n    <ev-transition-expand>\n        <div\n            v-if=\"isFiltersMobile && showFilters && slots.filters && !showActions\"\n            key=\"filter\"\n            class=\"ev-data-table-filters-mask\">\n            <div class=\"ev-data-table-filters\">\n                <ev-defaults-provider :defaults=\"filterDefaults\">\n                    <ev-slide-group>\n                        <slot name=\"filters\" />\n                    </ev-slide-group>\n                </ev-defaults-provider>\n            </div>\n        </div>\n    </ev-transition-expand>\n</template>\n"],"names":["propsFactory","props","useModelProxy","useLocaleFunctions","computed","ArrowUpIcon","ArrowDownIcon","ref","shallowRef","_useSlots","useSelection","debounce","isBoolean","isArray","isEmpty","onMounted","onUnmounted"],"mappings":"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"}

package/dist/cjs/EvDateField.cjs

@@ -1,7 +1,7 @@
 "use strict";
-/*! Evance UI v1.0.18 | MIT License */
+/*! Evance UI v1.0.19 | MIT License */
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const EvDateField_vue_vue_type_script_setup_true_lang = require("./EvDateField.vue_vue_type_script_setup_true_lang-Dc3x8YIX.cjs");
+const EvDateField_vue_vue_type_script_setup_true_lang = require("./EvDateField.vue_vue_type_script_setup_true_lang-DRNW94PB.cjs");
 exports.EvDateField = EvDateField_vue_vue_type_script_setup_true_lang._sfc_main;
 exports.makeEvDateFieldProps = EvDateField_vue_vue_type_script_setup_true_lang.makeEvDateFieldProps;
 //# sourceMappingURL=EvDateField.cjs.map