@ozdao/martyrs 0.2.561 → 0.2.563

package/dist/martyrs/src/modules/core/views/components/sections/Filters.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"Filters.vue.js","sources":["../../../../../../../../src/modules/core/views/components/sections/Filters.vue"],"sourcesContent":["<template>\n  <div class=\"flex t-nowrap  gap-thin\">\n    <!-- All Filters Button -->\n    <button\n      @click=\"showAllFilters = true\"\n      class=\"pd-small radius-medium bg-light flex-v-center flex gap-micro cursor-pointer\"\n      :class=\"{ 'bg-main': activeFiltersCount > 0 }\"\n    >\n      <IconFilter class=\"i-medium\" />\n      <span class=\"h-1r\"></span>\n      <span v-if=\"activeFiltersCount\">{{ activeFiltersCount }}</span>\n    </button>\n\n    <!-- Individual Filter Buttons -->\n    <button\n      v-for=\"filter in filters\"\n      :key=\"filter.value\"\n      @click=\"openFilter(filter.value)\"\n      class=\"pd-small radius-medium bg-light cursor-pointer flex-v-center flex gap-micro\"\n      :class=\"{ 'selected bg-main': isFilterActive(filter) }\"\n    >\n      <IconCalendar v-if=\"filter.type === 'date'\" class=\"mn-r-micro i-medium\" />\n      <span class=\"t-nowrap\">{{ filter.type === 'date' && getFilterValue(filter) ? formatFilterValue(filter) : filter.title }}</span>\n      <span v-if=\"getFilterValue(filter) && filter.type !== 'date'\" class=\"mn-l-micro\">\n        {{ formatFilterValue(filter) }}\n      </span>\n    </button>\n\n    <!-- All Filters Popup -->\n    <Popup\n      :isPopupOpen=\"showAllFilters\"\n      @close-popup=\"showAllFilters = false\"\n      :align=\"isPhone() ? 'bottom center' : 'center center'\"\n      class=\"w-min-20r bg-white radius-medium mobile:radius-zero mobile:radius-tr-medium mobile:radius-tl-medium mobile:w-100 pd-medium\"\n    >\n      <div class=\"flex-v-center flex-nowrap flex mn-b-medium\">\n        <h3 class=\"flex-child-full\">Filters</h3>\n      </div>\n\n      <div class=\"filters-content\">\n        <div \n          v-for=\"filter in filters\" \n          :key=\"filter.value\"\n          class=\"mn-b-medium\"\n        >\n          <h4 class=\"mn-b-small\">{{ filter.title }}</h4>\n          \n          <!-- Checkbox Filter -->\n          <div v-if=\"filter.type === 'checkbox'\">\n            <Checkbox\n              v-for=\"option in filter.options\"\n              :key=\"option.value\"\n              :label=\"option.label\"\n              :value=\"option.value\"\n              v-model:radio=\"tempSelected[filter.value]\"\n              mode=\"checkbox\"\n              class=\"mn-b-micro\"\n            />\n          </div>\n\n          <!-- Radio Filter -->\n          <div v-else-if=\"filter.type === 'radio'\">\n            <div\n              v-for=\"option in filter.options\"\n              :key=\"option.value\"\n              @click=\"tempSelected[filter.value] = option.value\"\n              class=\"pd-small radius-small cursor-pointer mn-b-micro\"\n              :class=\"{ \n                'bg-main': tempSelected[filter.value] === option.value,\n                'bg-light': tempSelected[filter.value] !== option.value\n              }\"\n            >\n              {{ option.label }}\n            </div>\n          </div>\n\n          <!-- Range Filter -->\n          <div v-else-if=\"filter.type === 'range'\" class=\"flex gap-thin\">\n            <Field\n              v-model:field=\"tempSelected[filter.value].min\"\n              :placeholder=\"filter.minPlaceholder || 'Min'\"\n              type=\"number\"\n              :label=\"returnCurrency()\"\n              class=\"w-50 bg-light pd-small radius-small\"\n            />\n            <Field\n              v-model:field=\"tempSelected[filter.value].max\"\n              :placeholder=\"filter.maxPlaceholder || 'Max'\"\n              type=\"number\"\n              :label=\"returnCurrency()\"\n              class=\"w-50 bg-light pd-small  radius-small\"\n            />\n          </div>\n\n          <!-- Date Filter -->\n          <div v-else-if=\"filter.type === 'date'\">\n            <Calendar\n              v-model:date=\"tempSelected[filter.value]\"\n              :allowRange=\"true\"\n              :disablePastDates=\"true\"\n              class=\"bg-light radius-small\"\n            />\n          </div>\n        </div>\n      </div>\n\n      <div class=\"flex gap-thin mn-t-medium\">\n        <button \n          @click=\"applyAllFilters\" \n          class=\"button bg-main flex-child-full\"\n        >\n          Apply\n        </button>\n        <button \n          @click=\"resetFilters\" \n          class=\"button bg-light\"\n        >\n          Reset Filters\n        </button>\n      </div>\n    </Popup>\n\n    <!-- Individual Filter Popups -->\n    <Popup\n      v-for=\"filter in filters\"\n      :key=\"`popup-${filter.value}`\"\n      :isPopupOpen=\"individualPopups[filter.value]\"\n      @close-popup=\"individualPopups[filter.value] = false\"\n      :align=\"isPhone() ? 'bottom center' : 'center center'\"\n      class=\"bg-white radius-medium mobile:radius-zero mobile:radius-tr-medium mobile:radius-tl-medium mobile:w-100 pd-medium\"\n    >\n      <h4 class=\"mn-b-medium\">{{ filter.title }}</h4>\n      \n      <!-- Checkbox Filter -->\n      <div v-if=\"filter.type === 'checkbox'\">\n        <Checkbox\n          v-for=\"option in filter.options\"\n          :key=\"option.value\"\n          :label=\"option.label\"\n          :value=\"option.value\"\n          v-model:radio=\"tempSelected[filter.value]\"\n          mode=\"checkbox\"\n          class=\"mn-b-micro\"\n        />\n      </div>\n\n      <!-- Radio Filter -->\n      <div v-else-if=\"filter.type === 'radio'\">\n        <div\n          v-for=\"option in filter.options\"\n          :key=\"option.value\"\n          @click=\"tempSelected[filter.value] = option.value\"\n          class=\"pd-small radius-small cursor-pointer mn-b-micro\"\n          :class=\"{ \n            'bg-main': tempSelected[filter.value] === option.value,\n            'bg-light': tempSelected[filter.value] !== option.value\n          }\"\n        >\n          {{ option.label }}\n        </div>\n      </div>\n\n      <!-- Range Filter -->\n      <div v-else-if=\"filter.type === 'range'\" class=\"flex gap-thin\">\n        <Field\n          v-model:field=\"tempSelected[filter.value].min\"\n          :placeholder=\"filter.minPlaceholder || 'Min'\"\n          type=\"number\"\n          :label=\"returnCurrency()\"\n          class=\"w-50 bg-light pd-small radius-small\"\n        />\n        <Field\n          v-model:field=\"tempSelected[filter.value].max\"\n          :placeholder=\"filter.maxPlaceholder || 'Max'\"\n          type=\"number\"\n          :label=\"returnCurrency()\"\n          class=\"w-50 bg-light pd-small radius-small\"\n        />\n      </div>\n\n      <!-- Date Filter -->\n      <div v-else-if=\"filter.type === 'date'\">\n        <div class=\"mn-t-small\">\n          <Calendar\n            v-model:date=\"tempSelected[filter.value]\"\n            :allowRange=\"true\"\n            :disablePastDates=\"true\"\n            class=\"bg-light radius-small\"\n          />\n        </div>\n      </div>\n\n      <div class=\"flex gap-thin mn-t-medium\">\n         <button \n          @click=\"cancelFilter(filter.value)\" \n          class=\"bg-light button flex-child-full\"\n        >\n          Cancel\n        </button>\n         <button \n          @click=\"applyFilter(filter.value)\" \n          class=\"bg-main w-100 button flex-child-full\"\n        >\n          Apply\n        </button>\n       \n       \n      </div>\n    </Popup>\n  </div>\n</template>\n\n<script setup>\nimport { ref, computed, reactive, watch } from 'vue'\nimport { useGlobalMixins } from '@martyrs/src/modules/core/views/mixins/mixins.js'\nimport Popup from '@martyrs/src/components/Popup/Popup.vue'\nimport Checkbox from '@martyrs/src/components/Checkbox/Checkbox.vue'\nimport Field from '@martyrs/src/components/Field/Field.vue'\nimport Calendar from '@martyrs/src/components/Calendar/Calendar.vue'\nimport IconFilter from '@martyrs/src/modules/icons/navigation/IconFilter.vue'\nimport IconCross from '@martyrs/src/modules/icons/navigation/IconCross.vue'\nimport IconCalendar from '@martyrs/src/modules/icons/entities/IconCalendar.vue'\n\nconst filters = defineModel('filters', {\n  type: Array,\n  required: true\n})\n\nconst selected = defineModel('selected', {\n  type: Object,\n  default: () => ({})\n})\n\nconst emit = defineEmits(['select'])\n\nconst { formatDate, returnCurrency } = useGlobalMixins()\n\n// State\nconst showAllFilters = ref(false)\nconst individualPopups = reactive({})\nconst tempSelected = reactive({})\nconst tempDateRange = ref(null)\n\n// Initialize popups and temp values\nwatch(filters, (newFilters) => {\n  newFilters.forEach(filter => {\n    individualPopups[filter.value] = false\n    \n    if (!tempSelected[filter.value]) {\n      if (filter.type === 'checkbox') {\n        tempSelected[filter.value] = [...(selected.value[filter.value] || [])]\n      } else if (filter.type === 'range') {\n        tempSelected[filter.value] = { ...(selected.value[filter.value] || { min: '', max: '' }) }\n      } else if (filter.type === 'date') {\n        tempSelected[filter.value] = selected.value[filter.value] || null\n      } else {\n        tempSelected[filter.value] = selected.value[filter.value] || null\n      }\n    }\n  })\n}, { immediate: true, deep: true })\n\n// Sync selected to tempSelected\nwatch(selected, (newSelected) => {\n  Object.keys(newSelected).forEach(key => {\n    const filter = filters.value.find(f => f.value === key)\n    if (filter) {\n      if (filter.type === 'checkbox') {\n        tempSelected[key] = [...(newSelected[key] || [])]\n      } else if (filter.type === 'range') {\n        tempSelected[key] = { ...(newSelected[key] || { min: '', max: '' }) }\n      } else {\n        tempSelected[key] = newSelected[key]\n      }\n    }\n  })\n}, { deep: true })\n\n// Computed\nconst activeFiltersCount = computed(() => {\n  return Object.entries(selected.value).filter(([key, value]) => {\n    if (Array.isArray(value)) return value.length > 0\n    if (typeof value === 'object' && value !== null) {\n      return value.min || value.max\n    }\n    return value !== null && value !== undefined\n  }).length\n})\n\n// Methods\nconst openFilter = (filterValue) => {\n  individualPopups[filterValue] = true\n}\n\nconst isFilterActive = (filter) => {\n  const value = selected.value[filter.value]\n  if (!value) return false\n  if (Array.isArray(value)) return value.length > 0\n  if (filter.type === 'range') return value.min || value.max\n  return true\n}\n\nconst getFilterValue = (filter) => {\n  const value = selected.value[filter.value]\n  if (!value) return false\n  \n  if (filter.type === 'range') {\n    return value.min || value.max\n  }\n  \n  if (filter.type === 'date') {\n    return value && value.start && value.end\n  }\n  \n  if (Array.isArray(value)) {\n    return value.length > 0\n  }\n  \n  return value\n}\n\nconst formatFilterValue = (filter) => {\n  const value = selected.value[filter.value]\n  if (!value) return ''\n  \n  if (Array.isArray(value)) {\n    return `(${value.length})`\n  }\n  \n  if (filter.type === 'range') {\n    if (!value.min && !value.max) return ''\n    return `${value.min || '0'}-${value.max || '∞'}`\n  }\n  \n  if (filter.type === 'date') {\n    if (!value || !value.start || !value.end) return ''\n    return `${formatDate(value.start, { dayMonth: true, language: 'en' })} - ${formatDate(value.end, { dayMonth: true, language: 'en' })}`\n  }\n  \n  if (filter.type === 'radio') {\n    const option = filter.options.find(o => o.value === value)\n    return option ? `(${option.label})` : ''\n  }\n  \n  return ''\n}\n\nconst applyFilter = (filterValue) => {\n  selected.value[filterValue] = tempSelected[filterValue]\n  individualPopups[filterValue] = false\n  emit('select', { filter: filterValue, value: tempSelected[filterValue] })\n}\n\nconst cancelFilter = (filterValue) => {\n  const filter = filters.value.find(f => f.value === filterValue)\n  if (filter) {\n    if (filter.type === 'checkbox') {\n      tempSelected[filterValue] = [...(selected.value[filterValue] || [])]\n    } else if (filter.type === 'range') {\n      tempSelected[filterValue] = { ...(selected.value[filterValue] || { min: '', max: '' }) }\n    } else if (filter.type === 'date') {\n      tempSelected[filterValue] = selected.value[filterValue] || null\n    } else {\n      tempSelected[filterValue] = selected.value[filterValue] || null\n    }\n  }\n  individualPopups[filterValue] = false\n}\n\nconst applyAllFilters = () => {\n  Object.entries(tempSelected).forEach(([key, value]) => {\n    if (selected.value[key] !== value) {\n      selected.value[key] = value\n      emit('select', { filter: key, value })\n    }\n  })\n  showAllFilters.value = false\n}\n\nconst resetFilters = () => {\n  filters.value.forEach(filter => {\n    if (filter.type === 'checkbox') {\n      tempSelected[filter.value] = []\n      selected.value[filter.value] = []\n    } else if (filter.type === 'range') {\n      tempSelected[filter.value] = { min: '', max: '' }\n      selected.value[filter.value] = { min: '', max: '' }\n    } else if (filter.type === 'date') {\n      tempSelected[filter.value] = null\n      selected.value[filter.value] = null\n    } else {\n      tempSelected[filter.value] = null\n      selected.value[filter.value] = null\n    }\n    emit('select', { filter: filter.value, value: null })\n  })\n}\n</script>\n\n<style scoped>\n.filters-content {\n  max-height: 60vh;\n  overflow-y: auto;\n}\n</style>"],"names":["_useModel"],"mappings":"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"}
+{"version":3,"file":"Filters.vue.js","sources":["../../../../../../../../src/modules/core/views/components/sections/Filters.vue"],"sourcesContent":["<template>\n  <div class=\"flex o-x-scroll scroll-hide t-nowrap  gap-thin\">\n    <!-- All Filters Button -->\n    <button\n      @click=\"showAllFilters = true\"\n      class=\"pd-small radius-medium bg-light flex-v-center flex gap-micro cursor-pointer\"\n      :class=\"{ 'bg-main': activeFiltersCount > 0 }\"\n    >\n      <IconFilter class=\"i-regular\" />\n      <span class=\"h-1r\"></span>\n      <span v-if=\"activeFiltersCount\">{{ activeFiltersCount }}</span>\n    </button>\n\n    <!-- Individual Filter Buttons -->\n    <button\n      v-for=\"filter in filters\"\n      :key=\"filter.value\"\n      @click=\"openFilter(filter.value)\"\n      class=\"pd-small radius-medium bg-light cursor-pointer flex-v-center flex gap-micro\"\n      :class=\"{ 'selected bg-main': isFilterActive(filter) }\"\n    >\n      <IconCalendar v-if=\"filter.type === 'date'\" class=\"mn-r-micro i-regular\" />\n      <span class=\"t-nowrap\">{{ filter.type === 'date' && getFilterValue(filter) ? formatFilterValue(filter) : filter.title }}</span>\n      <span v-if=\"getFilterValue(filter) && filter.type !== 'date'\" class=\"mn-l-micro\">\n        {{ formatFilterValue(filter) }}\n      </span>\n    </button>\n\n    <!-- All Filters Popup -->\n    <Popup\n      :isPopupOpen=\"showAllFilters\"\n      @close-popup=\"closeAllFilters\"\n      :align=\"isPhone() ? 'bottom center' : 'center center'\"\n      class=\"w-min-20r bg-white radius-medium mobile:radius-zero mobile:radius-tr-medium mobile:radius-tl-medium mobile:w-100 pd-medium\"\n    >\n      <FiltersGroup\n        :filters=\"filters\"\n        v-model:selected=\"tempSelected\"\n        :immediate=\"false\"\n        :showHeader=\"true\"\n        :showApplyButton=\"true\"\n        :showResetButton=\"true\"\n        @update:selected=\"applyAllFilters\"\n      />\n    </Popup>\n\n    <!-- Individual Filter Popups -->\n    <Popup\n      v-for=\"filter in filters\"\n      :key=\"`popup-${filter.value}`\"\n      :isPopupOpen=\"individualPopups[filter.value]\"\n      @close-popup=\"cancelFilter(filter.value)\"\n      :align=\"isPhone() ? 'bottom center' : 'center center'\"\n      class=\"bg-white radius-medium mobile:radius-zero mobile:radius-tr-medium mobile:radius-tl-medium mobile:w-100 pd-medium\"\n    >\n      <h4 class=\"mn-b-medium\">{{ filter.title }}</h4>\n\n      <!-- Checkbox Filter -->\n      <FilterCheckbox\n        v-if=\"filter.type === 'checkbox'\"\n        v-model=\"tempSelected[filter.value]\"\n        :options=\"filter.options\"\n      />\n\n      <!-- Range Filter -->\n      <FilterRange\n        v-else-if=\"filter.type === 'range'\"\n        v-model=\"tempSelected[filter.value]\"\n        :minPlaceholder=\"filter.minPlaceholder || 'Min'\"\n        :maxPlaceholder=\"filter.maxPlaceholder || 'Max'\"\n        :label=\"filter.label\"\n      />\n\n      <!-- Date Filter -->\n      <div v-else-if=\"filter.type === 'date'\">\n        <div class=\"mn-t-small\">\n          <Calendar\n            v-model:date=\"tempSelected[filter.value]\"\n            :allowRange=\"true\"\n            :disablePastDates=\"true\"\n            class=\"bg-light radius-small\"\n          />\n        </div>\n      </div>\n\n      <!-- Radio/Options Filter -->\n      <FilterOptions\n        v-else-if=\"filter.type === 'radio'\"\n        v-model=\"tempSelected[filter.value]\"\n        :options=\"filter.options\"\n      />\n\n      <div class=\"flex gap-thin mn-t-medium\">\n        <button\n          @click=\"cancelFilter(filter.value)\"\n          class=\"bg-light button flex-child-full\"\n        >\n          Cancel\n        </button>\n        <button\n          @click=\"applyFilter(filter.value)\"\n          class=\"bg-main w-100 button flex-child-full\"\n        >\n          Apply\n        </button>\n      </div>\n    </Popup>\n  </div>\n</template>\n\n<script setup>\nimport { ref, computed, reactive, watch } from 'vue'\nimport { useGlobalMixins } from '@martyrs/src/modules/core/views/mixins/mixins.js'\nimport Popup from '@martyrs/src/components/Popup/Popup.vue'\nimport Calendar from '@martyrs/src/components/Calendar/Calendar.vue'\nimport FiltersGroup from './filters/FiltersGroup.vue'\nimport FilterCheckbox from './filters/FilterCheckbox.vue'\nimport FilterRange from './filters/FilterRange.vue'\nimport FilterDateRange from './filters/FilterDateRange.vue'\nimport FilterOptions from './filters/FilterOptions.vue'\nimport IconFilter from '@martyrs/src/modules/icons/navigation/IconFilter.vue'\nimport IconCross from '@martyrs/src/modules/icons/navigation/IconCross.vue'\nimport IconCalendar from '@martyrs/src/modules/icons/entities/IconCalendar.vue'\n\nconst filters = defineModel('filters', {\n  type: Array,\n  required: true\n})\n\nconst selected = defineModel('selected', {\n  type: Object,\n  default: () => ({})\n})\n\nconst emit = defineEmits(['select'])\n\nconst { formatDate, returnCurrency } = useGlobalMixins()\n\n// State\nconst showAllFilters = ref(false)\nconst individualPopups = reactive({})\nconst tempSelected = reactive({})\nconst tempDateRange = ref(null)\n\n// Initialize popups and temp values\nwatch(filters, (newFilters) => {\n  newFilters.forEach(filter => {\n    individualPopups[filter.value] = false\n    \n    if (!tempSelected[filter.value]) {\n      if (filter.type === 'checkbox') {\n        tempSelected[filter.value] = [...(selected.value[filter.value] || [])]\n      } else if (filter.type === 'range') {\n        tempSelected[filter.value] = { ...(selected.value[filter.value] || { min: '', max: '' }) }\n      } else if (filter.type === 'date') {\n        tempSelected[filter.value] = selected.value[filter.value] || null\n      } else {\n        tempSelected[filter.value] = selected.value[filter.value] || null\n      }\n    }\n  })\n}, { immediate: true, deep: true })\n\n// Sync selected to tempSelected\nwatch(selected, (newSelected) => {\n  Object.keys(newSelected).forEach(key => {\n    const filter = filters.value.find(f => f.value === key)\n    if (filter) {\n      if (filter.type === 'checkbox') {\n        tempSelected[key] = [...(newSelected[key] || [])]\n      } else if (filter.type === 'range') {\n        tempSelected[key] = { ...(newSelected[key] || { min: '', max: '' }) }\n      } else {\n        tempSelected[key] = newSelected[key]\n      }\n    }\n  })\n}, { deep: true })\n\n// Computed\nconst activeFiltersCount = computed(() => {\n  return Object.entries(selected.value).filter(([key, value]) => {\n    if (Array.isArray(value)) return value.length > 0\n    if (typeof value === 'object' && value !== null) {\n      return value.min || value.max\n    }\n    return value !== null && value !== undefined\n  }).length\n})\n\n// Methods\nconst openFilter = (filterValue) => {\n  individualPopups[filterValue] = true\n}\n\nconst isFilterActive = (filter) => {\n  const value = selected.value[filter.value]\n  if (!value) return false\n  if (Array.isArray(value)) return value.length > 0\n  if (filter.type === 'range') return value.min || value.max\n  return true\n}\n\nconst getFilterValue = (filter) => {\n  const value = selected.value[filter.value]\n  if (!value) return false\n  \n  if (filter.type === 'range') {\n    return value.min || value.max\n  }\n  \n  if (filter.type === 'date') {\n    return value && value.start && value.end\n  }\n  \n  if (Array.isArray(value)) {\n    return value.length > 0\n  }\n  \n  return value\n}\n\nconst formatFilterValue = (filter) => {\n  const value = selected.value[filter.value]\n  if (!value) return ''\n  \n  if (Array.isArray(value)) {\n    return `(${value.length})`\n  }\n  \n  if (filter.type === 'range') {\n    if (!value.min && !value.max) return ''\n    return `${value.min || '0'}-${value.max || '∞'}`\n  }\n  \n  if (filter.type === 'date') {\n    if (!value || !value.start || !value.end) return ''\n    return `${formatDate(value.start, { dayMonth: true, language: 'en' })} - ${formatDate(value.end, { dayMonth: true, language: 'en' })}`\n  }\n  \n  if (filter.type === 'radio') {\n    const option = filter.options.find(o => o.value === value)\n    return option ? `(${option.label})` : ''\n  }\n  \n  return ''\n}\n\nconst applyFilter = (filterValue) => {\n  selected.value[filterValue] = tempSelected[filterValue]\n  individualPopups[filterValue] = false\n  emit('select', { filter: filterValue, value: tempSelected[filterValue] })\n}\n\nconst cancelFilter = (filterValue) => {\n  const filter = filters.value.find(f => f.value === filterValue)\n  if (filter) {\n    if (filter.type === 'checkbox') {\n      tempSelected[filterValue] = [...(selected.value[filterValue] || [])]\n    } else if (filter.type === 'range') {\n      tempSelected[filterValue] = { ...(selected.value[filterValue] || { min: '', max: '' }) }\n    } else if (filter.type === 'date') {\n      tempSelected[filterValue] = selected.value[filterValue] || null\n    } else {\n      tempSelected[filterValue] = selected.value[filterValue] || null\n    }\n  }\n  individualPopups[filterValue] = false\n}\n\nconst applyAllFilters = (newValues) => {\n  Object.entries(newValues).forEach(([key, value]) => {\n    if (selected.value[key] !== value) {\n      selected.value[key] = value\n      emit('select', { filter: key, value })\n    }\n  })\n  showAllFilters.value = false\n}\n\nconst closeAllFilters = () => {\n  showAllFilters.value = false\n}\n</script>\n\n<style scoped>\n.filters-content {\n  max-height: 60vh;\n  overflow-y: auto;\n}\n</style>"],"names":["_useModel"],"mappings":"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"}

package/dist/martyrs/src/modules/core/views/components/sections/filters/FilterCheckbox.vue2.js

@@ -0,0 +1,64 @@
+import { mergeModels, useModel, computed, createElementBlock, openBlock, Fragment, renderList, createBlock } from "vue";
+import _sfc_main$1 from "../../../../../../components/Checkbox/Checkbox.vue.js";
+/* empty css                   */
+import _export_sfc from "../../../../../../../../_virtual/_plugin-vue_export-helper.js";
+const _hoisted_1 = { class: "filter-checkbox" };
+const _sfc_main = {
+  __name: "FilterCheckbox",
+  props: /* @__PURE__ */ mergeModels({
+    options: {
+      type: Array,
+      required: true
+    }
+  }, {
+    "modelValue": {
+      type: Array,
+      default: () => []
+    },
+    "modelModifiers": {}
+  }),
+  emits: /* @__PURE__ */ mergeModels(["apply"], ["update:modelValue"]),
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const model = useModel(__props, "modelValue");
+    const emit = __emit;
+    const normalizedOptions = computed(() => {
+      if (!props.options || !Array.isArray(props.options)) return [];
+      return props.options.map((option, index) => {
+        if (typeof option === "string") {
+          return { label: option, value: option };
+        }
+        if (typeof option === "object" && option !== null) {
+          return {
+            label: option.label || option.text || option.name || String(option.value || option),
+            value: option.value || option.text || option.label || option._id || option.id || `option-${index}`
+          };
+        }
+        return { label: String(option), value: `option-${index}` };
+      });
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(normalizedOptions.value, (option, index) => {
+          return openBlock(), createBlock(_sfc_main$1, {
+            key: option.value,
+            radio: model.value,
+            "onUpdate:radio": [
+              _cache[0] || (_cache[0] = ($event) => model.value = $event),
+              _cache[1] || (_cache[1] = ($event) => emit("apply"))
+            ],
+            label: option.label,
+            value: option.value,
+            mode: "checkbox",
+            class: "br-solid br-1px br-light pd-small radius-small mn-b-micro"
+          }, null, 8, ["radio", "label", "value"]);
+        }), 128))
+      ]);
+    };
+  }
+};
+const FilterCheckbox = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-d3175613"]]);
+export {
+  FilterCheckbox as default
+};
+//# sourceMappingURL=FilterCheckbox.vue2.js.map

package/dist/martyrs/src/modules/core/views/components/sections/filters/FilterCheckbox.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterCheckbox.vue2.js","sources":["../../../../../../../../../src/modules/core/views/components/sections/filters/FilterCheckbox.vue"],"sourcesContent":["<!-- FilterCheckbox.vue -->\n<template>\n  <div class=\"filter-checkbox\">\n    <Checkbox\n      v-for=\"(option, index) in normalizedOptions\"\n      :key=\"option.value\"\n      v-model:radio=\"model\"\n      :label=\"option.label\"\n      :value=\"option.value\"\n      mode=\"checkbox\"\n      class=\"br-solid br-1px br-light pd-small radius-small mn-b-micro\"\n      @update:radio=\"emit('apply')\"\n    />\n  </div>\n</template>\n\n<script setup>\nimport { computed } from 'vue'\nimport Checkbox from '@martyrs/src/components/Checkbox/Checkbox.vue'\n\nconst props = defineProps({\n  options: {\n    type: Array,\n    required: true\n  }\n})\n\nconst model = defineModel({\n  type: Array,\n  default: () => []\n})\n\nconst emit = defineEmits(['apply'])\n\n// Normalize options to always have label and value\nconst normalizedOptions = computed(() => {\n  if (!props.options || !Array.isArray(props.options)) return []\n\n  return props.options.map((option, index) => {\n    if (typeof option === 'string') {\n      return { label: option, value: option }\n    }\n    if (typeof option === 'object' && option !== null) {\n      return {\n        label: option.label || option.text || option.name || String(option.value || option),\n        value: option.value || option.text || option.label || option._id || option.id || `option-${index}`\n      }\n    }\n    return { label: String(option), value: `option-${index}` }\n  })\n})\n</script>\n\n<style scoped>\n.filter-checkbox {\n  max-height: 300px;\n  overflow-y: auto;\n}\n</style>"],"names":["_useModel"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAoBA,UAAM,QAAQ;AAOd,UAAM,QAAQA,SAAW,SAAA,YAGxB;AAED,UAAM,OAAO;AAGb,UAAM,oBAAoB,SAAS,MAAM;AACvC,UAAI,CAAC,MAAM,WAAW,CAAC,MAAM,QAAQ,MAAM,OAAO,EAAG,QAAO,CAAA;AAE5D,aAAO,MAAM,QAAQ,IAAI,CAAC,QAAQ,UAAU;AAC1C,YAAI,OAAO,WAAW,UAAU;AAC9B,iBAAO,EAAE,OAAO,QAAQ,OAAO,OAAM;AAAA,QACvC;AACA,YAAI,OAAO,WAAW,YAAY,WAAW,MAAM;AACjD,iBAAO;AAAA,YACL,OAAO,OAAO,SAAS,OAAO,QAAQ,OAAO,QAAQ,OAAO,OAAO,SAAS,MAAM;AAAA,YAClF,OAAO,OAAO,SAAS,OAAO,QAAQ,OAAO,SAAS,OAAO,OAAO,OAAO,MAAM,UAAU,KAAK;AAAA,UACxG;AAAA,QACI;AACA,eAAO,EAAE,OAAO,OAAO,MAAM,GAAG,OAAO,UAAU,KAAK,GAAE;AAAA,MAC1D,CAAC;AAAA,IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/core/views/components/sections/filters/FilterDateRange.vue2.js

@@ -0,0 +1,160 @@
+import { mergeModels, useModel, ref, computed, watch, createElementBlock, openBlock, createCommentVNode, createElementVNode, createVNode, Fragment, renderList, normalizeClass, toDisplayString, withCtx } from "vue";
+import Calendar from "../../../../../../components/Calendar/Calendar.vue2.js";
+import _sfc_main$2 from "../../../../../../components/Popup/Popup.vue.js";
+import _sfc_main$1 from "../../../../../icons/entities/IconCalendar.vue.js";
+import { useGlobalMixins } from "../../../mixins/mixins.js";
+/* empty css                    */
+import _export_sfc from "../../../../../../../../_virtual/_plugin-vue_export-helper.js";
+const _hoisted_1 = { class: "filter-date-range" };
+const _hoisted_2 = ["onClick"];
+const _hoisted_3 = { class: "flex gap-small" };
+const _sfc_main = {
+  __name: "FilterDateRange",
+  props: /* @__PURE__ */ mergeModels({
+    dateOptions: {
+      type: Array,
+      default: () => []
+    }
+  }, {
+    "modelValue": {
+      type: Object,
+      default: () => null
+    },
+    "modelModifiers": {}
+  }),
+  emits: /* @__PURE__ */ mergeModels(["update:modelValue", "apply"], ["update:modelValue"]),
+  setup(__props, { emit: __emit }) {
+    const { formatDate } = useGlobalMixins();
+    const model = useModel(__props, "modelValue");
+    const emit = __emit;
+    const showCalendar = ref(false);
+    const selectedOption = ref(null);
+    const tempDates = ref(null);
+    const dateRangeLabel = computed(() => {
+      if (!model.value || !model.value.start || !model.value.end) {
+        return "Select dates";
+      }
+      const start = formatDate(model.value.start, { dayMonth: true, language: "en" });
+      const end = formatDate(model.value.end, { dayMonth: true, language: "en" });
+      return `${start} - ${end}`;
+    });
+    const selectOption = (value) => {
+      selectedOption.value = value;
+      const today = /* @__PURE__ */ new Date();
+      today.setHours(0, 0, 0, 0);
+      let dateRange = null;
+      switch (value) {
+        case "today":
+          dateRange = {
+            start: today,
+            end: today
+          };
+          break;
+        case "week":
+          const weekEnd = new Date(today);
+          weekEnd.setDate(today.getDate() + 7);
+          dateRange = {
+            start: today,
+            end: weekEnd
+          };
+          break;
+        case "month":
+          const monthEnd = new Date(today);
+          monthEnd.setMonth(today.getMonth() + 1);
+          dateRange = {
+            start: today,
+            end: monthEnd
+          };
+          break;
+      }
+      if (dateRange) {
+        model.value = dateRange;
+        emit("apply");
+      }
+    };
+    const applyDates = () => {
+      if (tempDates.value) {
+        model.value = tempDates.value;
+        selectedOption.value = "custom";
+        emit("apply");
+      }
+      showCalendar.value = false;
+    };
+    watch(() => model.value, (newVal) => {
+      if (newVal && newVal.start && newVal.end) {
+        tempDates.value = { ...newVal };
+        const today = /* @__PURE__ */ new Date();
+        today.setHours(0, 0, 0, 0);
+        const start = new Date(newVal.start);
+        start.setHours(0, 0, 0, 0);
+        const end = new Date(newVal.end);
+        end.setHours(0, 0, 0, 0);
+        const diffDays = Math.round((end - start) / (1e3 * 60 * 60 * 24));
+        if (start.getTime() === today.getTime() && end.getTime() === today.getTime()) {
+          selectedOption.value = "today";
+        } else if (start.getTime() === today.getTime() && diffDays === 7) {
+          selectedOption.value = "week";
+        } else if (start.getTime() === today.getTime() && diffDays >= 28 && diffDays <= 31) {
+          selectedOption.value = "month";
+        } else {
+          selectedOption.value = "custom";
+        }
+      } else {
+        selectedOption.value = null;
+      }
+    }, { immediate: true, deep: true });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        __props.dateOptions.length > 0 ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(__props.dateOptions, (option) => {
+          return openBlock(), createElementBlock("div", {
+            key: option.value,
+            onClick: ($event) => selectOption(option.value),
+            class: normalizeClass([{ "bg-light": selectedOption.value === option.value }, "pd-small radius-small cursor-pointer hover-bg-light transition-all mn-b-micro"])
+          }, toDisplayString(option.label), 11, _hoisted_2);
+        }), 128)) : createCommentVNode("", true),
+        createElementVNode("div", {
+          onClick: _cache[0] || (_cache[0] = () => {
+            showCalendar.value = true;
+          }),
+          class: normalizeClass([{ "bg-light": model.value }, "pd-small field-wrapper radius-small bg-light cursor-pointer hover-bg-light transition-all flex-v-center flex gap-thin"])
+        }, [
+          createVNode(_sfc_main$1, { class: "i-medium" }),
+          createElementVNode("span", null, toDisplayString(dateRangeLabel.value), 1)
+        ], 2),
+        createVNode(_sfc_main$2, {
+          isPopupOpen: showCalendar.value,
+          onClosePopup: _cache[3] || (_cache[3] = ($event) => showCalendar.value = false),
+          class: "pd-medium bg-white radius-medium",
+          style: { "min-width": "350px" }
+        }, {
+          default: withCtx(() => [
+            _cache[4] || (_cache[4] = createElementVNode("h3", { class: "mn-b-medium" }, "Select Date Range", -1)),
+            createVNode(Calendar, {
+              date: tempDates.value,
+              "onUpdate:date": _cache[1] || (_cache[1] = ($event) => tempDates.value = $event),
+              allowRange: true,
+              disablePastDates: true,
+              class: "mn-b-medium"
+            }, null, 8, ["date"]),
+            createElementVNode("div", _hoisted_3, [
+              createElementVNode("button", {
+                onClick: applyDates,
+                class: "button bg-main t-white flex-child-full pd-small radius-small"
+              }, " Apply "),
+              createElementVNode("button", {
+                onClick: _cache[2] || (_cache[2] = ($event) => showCalendar.value = false),
+                class: "button bg-light flex-child-full pd-small radius-small"
+              }, " Cancel ")
+            ])
+          ]),
+          _: 1
+        }, 8, ["isPopupOpen"])
+      ]);
+    };
+  }
+};
+const FilterDateRange = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-dbe77cee"]]);
+export {
+  FilterDateRange as default
+};
+//# sourceMappingURL=FilterDateRange.vue2.js.map

package/dist/martyrs/src/modules/core/views/components/sections/filters/FilterDateRange.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterDateRange.vue2.js","sources":["../../../../../../../../../src/modules/core/views/components/sections/filters/FilterDateRange.vue"],"sourcesContent":["<!-- FilterDateRange.vue -->\n<template>\n  <div class=\"filter-date-range\">\n    <!-- Quick options (only if provided) -->\n    <div\n      v-if=\"dateOptions.length > 0\"\n      v-for=\"option in dateOptions\"\n      :key=\"option.value\"\n      @click=\"selectOption(option.value)\"\n      :class=\"{ 'bg-light': selectedOption === option.value }\"\n      class=\"pd-small radius-small cursor-pointer hover-bg-light transition-all mn-b-micro\"\n    >\n      {{ option.label }}\n    </div>\n\n    <!-- Custom dates with icon (like in Products) -->\n    <div\n      @click=\"() => { showCalendar = true }\"\n      :class=\"{ 'bg-light': model }\"\n      class=\"pd-small field-wrapper radius-small bg-light cursor-pointer hover-bg-light transition-all flex-v-center flex gap-thin\"\n    >\n      <IconCalendar class=\"i-medium\" />\n      <span>{{ dateRangeLabel }}</span>\n    </div>\n\n    <!-- Calendar Popup -->\n    <Popup\n      :isPopupOpen=\"showCalendar\"\n      @close-popup=\"showCalendar = false\"\n      class=\"pd-medium bg-white radius-medium\"\n      style=\"min-width: 350px;\"\n    >\n      <h3 class=\"mn-b-medium\">Select Date Range</h3>\n      \n      <Calendar\n        v-model:date=\"tempDates\"\n        :allowRange=\"true\"\n        :disablePastDates=\"true\"\n        class=\"mn-b-medium\"\n      />\n      \n      <div class=\"flex gap-small\">\n        <button \n          @click=\"applyDates\"\n          class=\"button bg-main t-white flex-child-full pd-small radius-small\"\n        >\n          Apply\n        </button>\n        <button \n          @click=\"showCalendar = false\"\n          class=\"button bg-light flex-child-full pd-small radius-small\"\n        >\n          Cancel\n        </button>\n      </div>\n    </Popup>\n  </div>\n</template>\n\n<script setup>\nimport { ref, computed, watch } from 'vue'\nimport Calendar from '@martyrs/src/components/Calendar/Calendar.vue'\nimport Popup from '@martyrs/src/components/Popup/Popup.vue'\nimport IconCalendar from '@martyrs/src/modules/icons/entities/IconCalendar.vue'\nimport { useGlobalMixins } from '@martyrs/src/modules/core/views/mixins/mixins.js'\n\nconst { formatDate } = useGlobalMixins()\n\nconst props = defineProps({\n  dateOptions: {\n    type: Array,\n    default: () => []\n  }\n})\n\nconst model = defineModel({\n  type: Object,\n  default: () => null\n})\n\nconst emit = defineEmits(['update:modelValue', 'apply'])\n\nconst showCalendar = ref(false)\nconst selectedOption = ref(null)\nconst tempDates = ref(null)\n\nconst dateRangeLabel = computed(() => {\n  if (!model.value || !model.value.start || !model.value.end) {\n    return 'Select dates'\n  }\n  const start = formatDate(model.value.start, { dayMonth: true, language: 'en' })\n  const end = formatDate(model.value.end, { dayMonth: true, language: 'en' })\n  return `${start} - ${end}`\n})\n\nconst selectOption = (value) => {\n  selectedOption.value = value\n  const today = new Date()\n  today.setHours(0, 0, 0, 0)\n  \n  let dateRange = null\n  \n  switch(value) {\n    case 'today':\n      dateRange = {\n        start: today,\n        end: today\n      }\n      break\n    case 'week':\n      const weekEnd = new Date(today)\n      weekEnd.setDate(today.getDate() + 7)\n      dateRange = {\n        start: today,\n        end: weekEnd\n      }\n      break\n    case 'month':\n      const monthEnd = new Date(today)\n      monthEnd.setMonth(today.getMonth() + 1)\n      dateRange = {\n        start: today,\n        end: monthEnd\n      }\n      break\n  }\n  \n  if (dateRange) {\n    model.value = dateRange\n    emit('apply')\n  }\n}\n\nconst applyDates = () => {\n  if (tempDates.value) {\n    model.value = tempDates.value\n    selectedOption.value = 'custom'\n    emit('apply')\n  }\n  showCalendar.value = false\n}\n\n// Watch for model changes to update selected option\nwatch(() => model.value, (newVal) => {\n  if (newVal && newVal.start && newVal.end) {\n    tempDates.value = { ...newVal }\n    \n    // Determine which option is selected based on dates\n    const today = new Date()\n    today.setHours(0, 0, 0, 0)\n    const start = new Date(newVal.start)\n    start.setHours(0, 0, 0, 0)\n    const end = new Date(newVal.end)\n    end.setHours(0, 0, 0, 0)\n    \n    const diffDays = Math.round((end - start) / (1000 * 60 * 60 * 24))\n    \n    if (start.getTime() === today.getTime() && end.getTime() === today.getTime()) {\n      selectedOption.value = 'today'\n    } else if (start.getTime() === today.getTime() && diffDays === 7) {\n      selectedOption.value = 'week'\n    } else if (start.getTime() === today.getTime() && diffDays >= 28 && diffDays <= 31) {\n      selectedOption.value = 'month'\n    } else {\n      selectedOption.value = 'custom'\n    }\n  } else {\n    selectedOption.value = null\n  }\n}, { immediate: true, deep: true })\n</script>\n\n<style scoped>\n.filter-date-range {\n  width: 100%;\n}\n</style>"],"names":["_useModel"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAkEA,UAAM,EAAE,WAAU,IAAK,gBAAe;AAStC,UAAM,QAAQA,SAAW,SAAA,YAGxB;AAED,UAAM,OAAO;AAEb,UAAM,eAAe,IAAI,KAAK;AAC9B,UAAM,iBAAiB,IAAI,IAAI;AAC/B,UAAM,YAAY,IAAI,IAAI;AAE1B,UAAM,iBAAiB,SAAS,MAAM;AACpC,UAAI,CAAC,MAAM,SAAS,CAAC,MAAM,MAAM,SAAS,CAAC,MAAM,MAAM,KAAK;AAC1D,eAAO;AAAA,MACT;AACA,YAAM,QAAQ,WAAW,MAAM,MAAM,OAAO,EAAE,UAAU,MAAM,UAAU,KAAI,CAAE;AAC9E,YAAM,MAAM,WAAW,MAAM,MAAM,KAAK,EAAE,UAAU,MAAM,UAAU,KAAI,CAAE;AAC1E,aAAO,GAAG,KAAK,MAAM,GAAG;AAAA,IAC1B,CAAC;AAED,UAAM,eAAe,CAAC,UAAU;AAC9B,qBAAe,QAAQ;AACvB,YAAM,QAAQ,oBAAI,KAAI;AACtB,YAAM,SAAS,GAAG,GAAG,GAAG,CAAC;AAEzB,UAAI,YAAY;AAEhB,cAAO,OAAK;AAAA,QACV,KAAK;AACH,sBAAY;AAAA,YACV,OAAO;AAAA,YACP,KAAK;AAAA,UACb;AACM;AAAA,QACF,KAAK;AACH,gBAAM,UAAU,IAAI,KAAK,KAAK;AAC9B,kBAAQ,QAAQ,MAAM,QAAO,IAAK,CAAC;AACnC,sBAAY;AAAA,YACV,OAAO;AAAA,YACP,KAAK;AAAA,UACb;AACM;AAAA,QACF,KAAK;AACH,gBAAM,WAAW,IAAI,KAAK,KAAK;AAC/B,mBAAS,SAAS,MAAM,SAAQ,IAAK,CAAC;AACtC,sBAAY;AAAA,YACV,OAAO;AAAA,YACP,KAAK;AAAA,UACb;AACM;AAAA,MACN;AAEE,UAAI,WAAW;AACb,cAAM,QAAQ;AACd,aAAK,OAAO;AAAA,MACd;AAAA,IACF;AAEA,UAAM,aAAa,MAAM;AACvB,UAAI,UAAU,OAAO;AACnB,cAAM,QAAQ,UAAU;AACxB,uBAAe,QAAQ;AACvB,aAAK,OAAO;AAAA,MACd;AACA,mBAAa,QAAQ;AAAA,IACvB;AAGA,UAAM,MAAM,MAAM,OAAO,CAAC,WAAW;AACnC,UAAI,UAAU,OAAO,SAAS,OAAO,KAAK;AACxC,kBAAU,QAAQ,EAAE,GAAG,OAAM;AAG7B,cAAM,QAAQ,oBAAI,KAAI;AACtB,cAAM,SAAS,GAAG,GAAG,GAAG,CAAC;AACzB,cAAM,QAAQ,IAAI,KAAK,OAAO,KAAK;AACnC,cAAM,SAAS,GAAG,GAAG,GAAG,CAAC;AACzB,cAAM,MAAM,IAAI,KAAK,OAAO,GAAG;AAC/B,YAAI,SAAS,GAAG,GAAG,GAAG,CAAC;AAEvB,cAAM,WAAW,KAAK,OAAO,MAAM,UAAU,MAAO,KAAK,KAAK,GAAG;AAEjE,YAAI,MAAM,cAAc,MAAM,QAAO,KAAM,IAAI,QAAO,MAAO,MAAM,WAAW;AAC5E,yBAAe,QAAQ;AAAA,QACzB,WAAW,MAAM,QAAO,MAAO,MAAM,QAAO,KAAM,aAAa,GAAG;AAChE,yBAAe,QAAQ;AAAA,QACzB,WAAW,MAAM,QAAO,MAAO,MAAM,QAAO,KAAM,YAAY,MAAM,YAAY,IAAI;AAClF,yBAAe,QAAQ;AAAA,QACzB,OAAO;AACL,yBAAe,QAAQ;AAAA,QACzB;AAAA,MACF,OAAO;AACL,uBAAe,QAAQ;AAAA,MACzB;AAAA,IACF,GAAG,EAAE,WAAW,MAAM,MAAM,KAAI,CAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/core/views/components/sections/filters/FilterOptions.vue.js

@@ -0,0 +1,46 @@
+import { mergeModels, useModel, createElementBlock, openBlock, Fragment, renderList, createBlock } from "vue";
+import _sfc_main$1 from "../../../../../../components/Checkbox/Checkbox.vue.js";
+const _hoisted_1 = { class: "filter-options" };
+const _sfc_main = {
+  __name: "FilterOptions",
+  props: /* @__PURE__ */ mergeModels({
+    options: {
+      type: Array,
+      required: true,
+      default: () => []
+    }
+  }, {
+    "modelValue": {
+      type: String,
+      default: null
+    },
+    "modelModifiers": {}
+  }),
+  emits: /* @__PURE__ */ mergeModels(["apply"], ["update:modelValue"]),
+  setup(__props, { emit: __emit }) {
+    const model = useModel(__props, "modelValue");
+    const emit = __emit;
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(__props.options, (option) => {
+          return openBlock(), createBlock(_sfc_main$1, {
+            key: option.value,
+            radio: model.value,
+            "onUpdate:radio": [
+              _cache[0] || (_cache[0] = ($event) => model.value = $event),
+              _cache[1] || (_cache[1] = ($event) => emit("apply"))
+            ],
+            label: option.label,
+            value: option.value,
+            mode: "radio",
+            class: "mn-b-micro"
+          }, null, 8, ["radio", "label", "value"]);
+        }), 128))
+      ]);
+    };
+  }
+};
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=FilterOptions.vue.js.map

package/dist/martyrs/src/modules/core/views/components/sections/filters/FilterOptions.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterOptions.vue.js","sources":["../../../../../../../../../src/modules/core/views/components/sections/filters/FilterOptions.vue"],"sourcesContent":["<!-- filters/FilterOptions.vue -->\n<template>\n  <div class=\"filter-options\">\n    <Checkbox\n      v-for=\"option in options\"\n      :key=\"option.value\"\n      v-model:radio=\"model\"\n      :label=\"option.label\"\n      :value=\"option.value\"\n      mode=\"radio\"\n      class=\"mn-b-micro\"\n      @update:radio=\"emit('apply')\"\n    />\n  </div>\n</template>\n\n<script setup>\nimport Checkbox from '@martyrs/src/components/Checkbox/Checkbox.vue'\n\nconst props = defineProps({\n  options: {\n    type: Array,\n    required: true,\n    default: () => []\n  }\n})\n\nconst model = defineModel({\n  type: String,\n  default: null\n})\n\nconst emit = defineEmits(['apply'])\n</script>"],"names":["_useModel"],"mappings":";;;;;;;;;;;;;;;;;;;;AA2BA,UAAM,QAAQA,SAAW,SAAA,YAGxB;AAED,UAAM,OAAO;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/core/views/components/sections/filters/FilterRange.vue.js

@@ -0,0 +1,105 @@
+import { mergeModels, useModel, ref, watch, createElementBlock, openBlock, createElementVNode, createCommentVNode, createVNode, Fragment, renderList, normalizeClass, toDisplayString } from "vue";
+import Field from "../../../../../../components/Field/Field.vue.js";
+const _hoisted_1 = { class: "filter-price" };
+const _hoisted_2 = { class: "flex flex-v-center gap-thin" };
+const _hoisted_3 = {
+  key: 0,
+  class: "mt-thin"
+};
+const _hoisted_4 = ["onClick"];
+const _sfc_main = {
+  __name: "FilterRange",
+  props: /* @__PURE__ */ mergeModels({
+    config: {
+      type: Object,
+      default: () => ({})
+    },
+    minPlaceholder: {
+      type: String,
+      default: "Min"
+    },
+    maxPlaceholder: {
+      type: String,
+      default: "Max"
+    },
+    label: {
+      type: String,
+      default: void 0
+    }
+  }, {
+    "modelValue": {
+      type: Object,
+      default: () => ({ min: null, max: null })
+    },
+    "modelModifiers": {}
+  }),
+  emits: /* @__PURE__ */ mergeModels(["update:modelValue", "apply"], ["update:modelValue"]),
+  setup(__props, { emit: __emit }) {
+    const model = useModel(__props, "modelValue");
+    const emit = __emit;
+    const localValue = ref({
+      min: model.value?.min || null,
+      max: model.value?.max || null
+    });
+    watch(model, (val) => {
+      if (val) {
+        localValue.value = {
+          min: val.min || null,
+          max: val.max || null
+        };
+      }
+    }, { deep: true });
+    const updateValue = () => {
+      model.value = { ...localValue.value };
+      emit("apply");
+    };
+    const applyPreset = (preset) => {
+      localValue.value = {
+        min: preset.min || null,
+        max: preset.max || null
+      };
+      updateValue();
+    };
+    const isPresetActive = (preset) => {
+      return localValue.value.min === preset.min && localValue.value.max === preset.max;
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("div", _hoisted_2, [
+          createVNode(Field, {
+            type: "number",
+            field: localValue.value.min,
+            "onUpdate:field": _cache[0] || (_cache[0] = ($event) => localValue.value.min = $event),
+            placeholder: __props.minPlaceholder,
+            label: __props.label,
+            class: "flex-1 bg-light pd-regular radius-small",
+            onBlur: updateValue
+          }, null, 8, ["field", "placeholder", "label"]),
+          _cache[2] || (_cache[2] = createElementVNode("span", { class: "t-small" }, "—", -1)),
+          createVNode(Field, {
+            type: "number",
+            field: localValue.value.max,
+            "onUpdate:field": _cache[1] || (_cache[1] = ($event) => localValue.value.max = $event),
+            placeholder: __props.maxPlaceholder,
+            label: __props.label,
+            class: "flex-1 bg-light pd-regular radius-small",
+            onBlur: updateValue
+          }, null, 8, ["field", "placeholder", "label"])
+        ]),
+        __props.config?.presets ? (openBlock(), createElementBlock("div", _hoisted_3, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(__props.config.presets, (preset) => {
+            return openBlock(), createElementBlock("button", {
+              key: preset.label,
+              onClick: ($event) => applyPreset(preset),
+              class: normalizeClass(["btn btn-small mr-thin mb-thin", isPresetActive(preset) ? "btn-primary" : "btn-secondary"])
+            }, toDisplayString(preset.label), 11, _hoisted_4);
+          }), 128))
+        ])) : createCommentVNode("", true)
+      ]);
+    };
+  }
+};
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=FilterRange.vue.js.map

package/dist/martyrs/src/modules/core/views/components/sections/filters/FilterRange.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilterRange.vue.js","sources":["../../../../../../../../../src/modules/core/views/components/sections/filters/FilterRange.vue"],"sourcesContent":["<!-- filters/FilterPrice.vue -->\n<template>\n  <div class=\"filter-price\">\n    <div class=\"flex flex-v-center gap-thin\">\n      <Field\n        type=\"number\"\n        v-model:field=\"localValue.min\"\n        :placeholder=\"minPlaceholder\"\n        :label=\"label\"\n        class=\"flex-1 bg-light pd-regular radius-small\"\n        @blur=\"updateValue\"\n      />\n      <span class=\"t-small\">—</span>\n      <Field\n        type=\"number\"\n        v-model:field=\"localValue.max\"\n        :placeholder=\"maxPlaceholder\"\n        :label=\"label\"\n        class=\"flex-1 bg-light pd-regular radius-small\"\n        @blur=\"updateValue\"\n      />\n    </div>\n    \n    <div v-if=\"config?.presets\" class=\"mt-thin\">\n      <button\n        v-for=\"preset in config.presets\"\n        :key=\"preset.label\"\n        @click=\"applyPreset(preset)\"\n        class=\"btn btn-small mr-thin mb-thin\"\n        :class=\"isPresetActive(preset) ? 'btn-primary' : 'btn-secondary'\"\n      >\n        {{ preset.label }}\n      </button>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, watch } from 'vue'\nimport Field from '@martyrs/src/components/Field/Field.vue';\n\nconst props = defineProps({\n  config: {\n    type: Object,\n    default: () => ({})\n  },\n  minPlaceholder: {\n    type: String,\n    default: 'Min'\n  },\n  maxPlaceholder: {\n    type: String,\n    default: 'Max'\n  },\n  label: {\n    type: String,\n    default: undefined\n  }\n})\n\nconst model = defineModel({\n  type: Object,\n  default: () => ({ min: null, max: null })\n})\n\nconst emit = defineEmits(['update:modelValue', 'apply'])\n\nconst localValue = ref({ \n  min: model.value?.min || null, \n  max: model.value?.max || null \n})\n\nwatch(model, (val) => {\n  if (val) {\n    localValue.value = { \n      min: val.min || null, \n      max: val.max || null \n    }\n  }\n}, { deep: true })\n\nconst updateValue = () => {\n  model.value = { ...localValue.value }\n  emit('apply')\n}\n\nconst applyPreset = (preset) => {\n  localValue.value = { \n    min: preset.min || null, \n    max: preset.max || null \n  }\n  updateValue()\n}\n\nconst isPresetActive = (preset) => {\n  return localValue.value.min === preset.min && localValue.value.max === preset.max\n}\n</script>"],"names":["_useModel"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4DA,UAAM,QAAQA,SAAW,SAAA,YAGxB;AAED,UAAM,OAAO;AAEb,UAAM,aAAa,IAAI;AAAA,MACrB,KAAK,MAAM,OAAO,OAAO;AAAA,MACzB,KAAK,MAAM,OAAO,OAAO;AAAA,IAC3B,CAAC;AAED,UAAM,OAAO,CAAC,QAAQ;AACpB,UAAI,KAAK;AACP,mBAAW,QAAQ;AAAA,UACjB,KAAK,IAAI,OAAO;AAAA,UAChB,KAAK,IAAI,OAAO;AAAA,QACtB;AAAA,MACE;AAAA,IACF,GAAG,EAAE,MAAM,KAAI,CAAE;AAEjB,UAAM,cAAc,MAAM;AACxB,YAAM,QAAQ,EAAE,GAAG,WAAW,MAAK;AACnC,WAAK,OAAO;AAAA,IACd;AAEA,UAAM,cAAc,CAAC,WAAW;AAC9B,iBAAW,QAAQ;AAAA,QACjB,KAAK,OAAO,OAAO;AAAA,QACnB,KAAK,OAAO,OAAO;AAAA,MACvB;AACE,kBAAW;AAAA,IACb;AAEA,UAAM,iBAAiB,CAAC,WAAW;AACjC,aAAO,WAAW,MAAM,QAAQ,OAAO,OAAO,WAAW,MAAM,QAAQ,OAAO;AAAA,IAChF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}