@necrolab/dashboard 0.5.15 → 0.5.16

package/src/components/ui/controls/atomic/Switch.vue

@@ -1,96 +1,33 @@
 <template>
-    <label class="switch" :class="{ 'disabled': disabled }">
-        <input type="checkbox" v-model="value" :disabled="disabled" />
-        <span class="slider round"></span>
+    <label
+        class="relative inline-block w-[51px] h-[31px] max-modal:w-11 max-modal:min-w-11 max-modal:h-6.5"
+        :class="disabled ? 'pointer-events-none' : ''"
+    >
+        <input
+            type="checkbox"
+            v-model="value"
+            :disabled="disabled"
+            class="opacity-0 w-0 h-0 peer"
+            role="switch"
+            :aria-checked="value"
+        />
+        <span
+            class="absolute inset-0 cursor-pointer border-2 rounded-[31px] transition-all duration-300 ease-out
+                   before:absolute before:content-[''] before:size-[23px] before:left-0.5 before:bottom-0.5 before:rounded-full before:shadow-switch before:transition-all before:duration-300 before:ease-out
+                   bg-dark-550 border-dark-550 before:bg-dark-200
+                   peer-checked:bg-accent-green peer-checked:border-accent-green peer-checked:before:bg-white peer-checked:before:translate-x-5
+                   peer-disabled:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:before:opacity-70
+                   max-modal:before:size-[22px] max-modal:peer-checked:before:translate-x-[18px]"
+        ></span>
     </label>
 </template>
 
 <script setup>
 const value = defineModel();
-const props = defineProps({
+defineProps({
     disabled: {
         type: Boolean,
         default: false
     }
 });
 </script>
-
-<style lang="scss" scoped>
-/* iOS-style switch */
-.switch {
-    @apply relative inline-block;
-    width: 51px;
-    height: 31px;
-}
-
-/* Hide default HTML checkbox */
-.switch input {
-    @apply opacity-0 w-0 h-0;
-}
-
-/* The slider */
-.slider {
-    @apply absolute cursor-pointer inset-0;
-    @apply border-2;
-    background-color: oklch(0.26 0 0);
-    border-color: oklch(0.35 0 0);
-    transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-}
-
-.slider:before {
-    @apply absolute;
-    @apply w-[23px] h-[23px] left-0.5 bottom-0.5;
-    content: "";
-    background-color: oklch(0.50 0 0);
-    transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-    box-shadow: 0 1px 3px oklch(0 0 0 / 0.3);
-}
-
-input:checked + .slider {
-    background-color: oklch(0.72 0.15 145);
-    border-color: oklch(0.72 0.15 145);
-}
-
-input:checked + .slider:before {
-    background-color: oklch(1 0 0);
-}
-
-input:checked + .slider:before {
-    transform: translateX(20px);
-}
-
-.switch.disabled {
-    @apply pointer-events-none;
-}
-
-input:disabled + .slider {
-    @apply opacity-50 cursor-not-allowed;
-}
-
-input:disabled + .slider:before {
-    @apply opacity-70;
-}
-
-/* Rounded sliders */
-.slider.round {
-    border-radius: 31px;
-}
-
-.slider.round:before {
-    border-radius: 50%;
-}
-
-@media (max-width: 810px) {
-    .switch {
-        @apply w-11 min-w-11 h-[26px];
-
-        .slider:before {
-            @apply w-[22px] h-[22px] left-0.5 bottom-0.5;
-        }
-    }
-
-    input:checked + .slider:before {
-        @apply translate-x-[18px];
-    }
-}
-</style>

package/src/composables/useColorMapping.js

@@ -0,0 +1,15 @@
+export function useColorMapping() {
+    const colorToClass = (color) => {
+        const colorMap = {
+            green: "bg-green-400",
+            red: "bg-red-400",
+            yellow: "bg-yellow-400",
+            blue: "bg-blue-400",
+            error: "bg-red-400",
+            success: "bg-green-400"
+        };
+        return colorMap[color?.toLowerCase()] || "bg-white";
+    };
+
+    return { colorToClass };
+}

package/src/composables/useCopyToClipboard.js

@@ -17,7 +17,7 @@ export function useCopyToClipboard() {
       })
       .catch((err) => {
         ui.showError('Failed to copy')
-        console.error('Copy failed:', err)
+        ui.logger.Error('Copy failed:', err)
       })
   }
 

package/src/composables/useDateFormatting.js

@@ -0,0 +1,21 @@
+export function useDateFormatting() {
+    const formatEventDate = (dateString) => {
+        if (!dateString) return '';
+        try {
+            const date = new Date(dateString);
+            const options = {
+                month: 'short',
+                day: 'numeric',
+                year: 'numeric',
+                hour: 'numeric',
+                minute: '2-digit',
+                hour12: true
+            };
+            return date.toLocaleString('en-US', options).replace(',', '');
+        } catch {
+            return dateString;
+        }
+    };
+
+    return { formatEventDate };
+}

package/src/composables/useDeviceDetection.js

@@ -0,0 +1,14 @@
+export function useDeviceDetection() {
+    const isIOS = () => {
+        if (/iPad|iPhone|iPod/.test(navigator.platform)) {
+            return true;
+        }
+        return navigator.maxTouchPoints && navigator.maxTouchPoints > 2 && /MacIntel/.test(navigator.platform);
+    };
+
+    const isIpadOS = () => {
+        return navigator.maxTouchPoints && navigator.maxTouchPoints > 2 && /MacIntel/.test(navigator.platform);
+    };
+
+    return { isIOS, isIpadOS };
+}

package/src/composables/useDropdownPosition.js

@@ -1,4 +1,5 @@
 import { ref, nextTick, onMounted, onUnmounted } from "vue";
+import { DEBUG } from "@/utils/debug";
 
 export function useDropdownPosition(dropdownRef, options = {}) {
     const menuStyle = ref({});
@@ -8,8 +9,7 @@ export function useDropdownPosition(dropdownRef, options = {}) {
         minWidth = null,
         maxHeight = window.innerHeight * 0.8, // Use 80% of viewport height
         estimateHeight = null,
-        includeAdjacentButtons = false,
-        containerSelector = null
+        includeAdjacentButtons = false
     } = options;
 
     const calculateMenuPosition = () => {
@@ -109,8 +109,7 @@ export function useDropdownPosition(dropdownRef, options = {}) {
                 maxHeight: `${maxHeight}px`
             };
         } catch (error) {
-            console.warn("Error calculating dropdown position:", error);
-            // Fallback to basic positioning
+            if (DEBUG) console.warn("Error calculating dropdown position:", error);
             menuStyle.value = {
                 position: "fixed",
                 top: "0px",

package/src/composables/useDynamicTableHeight.js

@@ -0,0 +1,31 @@
+import { computed } from "vue";
+import { useWindowDimensions } from "./useWindowDimensions";
+
+export function useDynamicTableHeight(options = {}) {
+    const { windowHeight, windowWidth } = useWindowDimensions();
+
+    const {
+        topReservedSpace = 243,
+        bottomBuffer = 16,
+        rowHeight = 64,
+        minRowsToShow = 2
+    } = options;
+
+    const dynamicTableHeight = computed(() => {
+        // Detect PWA mode and small screens
+        const isPWA = window.matchMedia('(display-mode: standalone)').matches;
+        const isMobile = windowWidth.value <= 768;
+
+        // Extra buffer for iPhone PWA to prevent overflow
+        const extraBuffer = isPWA && isMobile ? 60 : 0;
+
+        const availableHeight = windowHeight.value - topReservedSpace - bottomBuffer - extraBuffer;
+        const minHeight = minRowsToShow * rowHeight;
+        const maxCompleteRows = Math.floor(Math.max(availableHeight, minHeight) / rowHeight);
+        const exactHeight = maxCompleteRows * rowHeight;
+
+        return exactHeight + "px";
+    });
+
+    return { dynamicTableHeight };
+}

package/src/composables/useRowSelection.js

@@ -12,7 +12,6 @@ export function useRowSelection(toggleCallback) {
   const DOUBLE_TAP_DELAY = 300
 
   const handleDoubleClick = (event) => {
-    // Don't trigger on button or checkbox clicks
     if (event.target.closest('button') || event.target.closest('.checkbox')) {
       return
     }
@@ -24,7 +23,6 @@ export function useRowSelection(toggleCallback) {
     const tapGap = currentTime - lastTapTime
 
     if (tapGap < DOUBLE_TAP_DELAY && tapGap > 0) {
-      // Don't trigger on button or checkbox taps
       if (!event.target.closest('button') && !event.target.closest('.checkbox')) {
         event.preventDefault()
         toggleCallback()
@@ -34,7 +32,6 @@ export function useRowSelection(toggleCallback) {
   }
 
   const handleTouchEnd = (event) => {
-    // Prevent default touch behavior on buttons/checkboxes
     if (event.target.closest('button') || event.target.closest('.checkbox')) {
       return
     }

package/src/composables/useTicketPricing.js

@@ -0,0 +1,16 @@
+export function useTicketPricing() {
+    const isTotalPrice = (line, index, lines) => {
+        const trimmed = line.trim();
+        if (!trimmed) return false;
+
+        const nonEmptyLines = lines.filter(l => l.trim());
+        const isLastLine = index === lines.lastIndexOf(nonEmptyLines[nonEmptyLines.length - 1]);
+
+        if (!isLastLine) return false;
+
+        const totalPricePattern = /^([$€£¥₹₽¢]|[A-Z]{3})\s*[\d,]+\.?\d*$/;
+        return totalPricePattern.test(trimmed) && !trimmed.includes('(') && !trimmed.includes(')');
+    };
+
+    return { isTotalPrice };
+}

package/src/composables/useWindowDimensions.js

@@ -0,0 +1,21 @@
+import { ref, onMounted, onUnmounted } from "vue";
+
+export function useWindowDimensions() {
+    const windowHeight = ref(window.innerHeight);
+    const windowWidth = ref(window.innerWidth);
+
+    const updateDimensions = () => {
+        windowHeight.value = window.innerHeight;
+        windowWidth.value = window.innerWidth;
+    };
+
+    onMounted(() => {
+        window.addEventListener("resize", updateDimensions);
+    });
+
+    onUnmounted(() => {
+        window.removeEventListener("resize", updateDimensions);
+    });
+
+    return { windowHeight, windowWidth };
+}

package/src/libs/Filter.js

@@ -1,5 +1,5 @@
-const debug = false;
-const log = (...args) => debug && console.log("[filter]", ...args);
+import { DEBUG } from "@/utils/debug";
+const log = (...args) => DEBUG && console.log("[filter]", ...args);
 
 const colors = {
     HIGHLIGHT: "#d3f8e2",
@@ -30,27 +30,23 @@ const isWheelchair = (p) => {
 };
 
 const sortAlphaNum = (a, b) => {
-    var reA = /[^a-zA-Z]/g;
-    var reN = /[^0-9]/g;
-    var AInt = parseInt(a, 10);
-    var BInt = parseInt(b, 10);
+    const reA = /[^a-zA-Z]/g;
+    const reN = /[^0-9]/g;
+    const AInt = parseInt(a, 10);
+    const BInt = parseInt(b, 10);
 
     if (isNaN(AInt) && isNaN(BInt)) {
-        var aA = a.replace(reA, "");
-        var bA = b.replace(reA, "");
+        const aA = a.replace(reA, "");
+        const bA = b.replace(reA, "");
         if (aA === bA) {
-            var aN = parseInt(a.replace(reN, ""), 10);
-            var bN = parseInt(b.replace(reN, ""), 10);
+            const aN = parseInt(a.replace(reN, ""), 10);
+            const bN = parseInt(b.replace(reN, ""), 10);
             return aN === bN ? 0 : aN > bN ? 1 : -1;
         } else {
             return aA > bA ? 1 : -1;
         }
-    } else if (isNaN(AInt)) {
-        //A is not an Int
-        return 1; //to make alphanumeric sort first return -1 here
     } else if (isNaN(BInt)) {
-        //B is not an Int
-        return -1; //to make alphanumeric sort first return 1 here
+        return -1;
     } else {
         return AInt > BInt ? 1 : -1;
     }
@@ -313,7 +309,7 @@ export default class FilterBuilder {
         });
 
         if (existingFilter) {
-            console.log("Filter already exists:", existingFilter);
+            if (DEBUG) log("Filter already exists:", existingFilter);
             return; // Don't add the filter if it already exists
         }
 
@@ -385,7 +381,7 @@ export default class FilterBuilder {
             } else {
                 color = this.expandedFilter === filter.id ? colors.SELECTED_EXPANDED : colors.SELECTED;
             }
-            
+
             switch (type) {
                 case this.filterTypes.NORMAL:
                     // If it has no 'rows' property
@@ -416,7 +412,6 @@ export default class FilterBuilder {
                     break;
 
                 case this.filterTypes.CATCH_ALL_FLOOR:
-                    // this.cssClasses += floors.map((f) => `path[name="${f}"] {fill: ${color} !important;}`).join("\n") + "\n";
                     break;
 
                 case this.filterTypes.INVALID:
@@ -432,7 +427,7 @@ export default class FilterBuilder {
             const color = colors.UNSELECTABLE;
             this.cssClasses += `.svg-wrapper path[section="${section}"][row="${row}"] {stroke: ${color} !important;}\n`;
         });
-        
+
         log("Generated CSS:", this.cssClasses);
     }
 
@@ -533,7 +528,6 @@ export default class FilterBuilder {
 
     deleteFilterById(id) {
         this.filters = this.filters.filter((f) => f.id !== id);
-        // this.updateHooks = this.updateHooks.filter((i) => id !== i);
         if (this.expandedFilter === id) this.expandedFilter = "";
         this.updateCss();
         this.updateHooks.forEach((fn) => fn());

package/src/libs/panzoom.js

@@ -1,7 +1,6 @@
 export default (function (f) {
     const panzoom = f();
     window.panzoom = panzoom;
-    // module.exports = panzoom;
     return panzoom;
 })(function () {
     var define, module, exports;
@@ -718,7 +717,6 @@ export default (function (f) {
                         failTransformOrigin();
                     }
                     function failTransformOrigin(options) {
-                        console.error(options);
                         throw new Error(
                             [
                                 "Cannot parse transform origin.",
@@ -783,7 +781,6 @@ export default (function (f) {
                                     setTimeout(tryAttach, 100);
                                     return;
                                 }
-                                console.error("Cannot find the panzoom element", globalName);
                                 return;
                             }
                             var options = collectOptions(panzoomScript);
@@ -1107,8 +1104,7 @@ export default (function (f) {
                         var easing = typeof options.easing === "function" ? options.easing : animations[options.easing];
                         if (!easing) {
                             if (options.easing) {
-                                console.warn("Unknown easing function in amator: " + options.easing);
-                            }
+                                }
                             easing = animations.ease;
                         }
                         var step = typeof options.step === "function" ? options.step : noop;

package/src/libs/utils/array.js

@@ -0,0 +1,60 @@
+const removeDuplicates = (arr) => [...new Set(arr)];
+
+const pickRandom = (arr) => arr[Math.floor(Math.random() * arr.length)];
+
+function betterSort(a, b) {
+    if (a === undefined || a === null) return b === undefined || b === null ? 0 : -1;
+    if (b === undefined || b === null) return 1;
+
+    const aStr = String(a);
+    const bStr = String(b);
+
+    if (!isNaN(aStr) && !isNaN(bStr)) {
+        return Number(aStr) - Number(bStr);
+    }
+
+    const aParts = aStr.split(/(\d+)/).filter(Boolean);
+    const bParts = bStr.split(/(\d+)/).filter(Boolean);
+
+    const len = Math.min(aParts.length, bParts.length);
+    for (let i = 0; i < len; i++) {
+        if (!isNaN(aParts[i]) && !isNaN(bParts[i])) {
+            const numA = parseInt(aParts[i], 10);
+            const numB = parseInt(bParts[i], 10);
+            if (numA !== numB) return numA - numB;
+        } else {
+            const cmp = aParts[i].localeCompare(bParts[i]);
+            if (cmp !== 0) return cmp;
+        }
+    }
+
+    return aParts.length - bParts.length;
+}
+
+function sortTaskIds(a, b) {
+    const parseId = (id) => {
+        if (!id) return { prefix: "", num: -1 };
+
+        if (/^\d+$/.test(id)) {
+            return { prefix: "", num: parseInt(id, 10) };
+        }
+
+        const match = id.match(/^([A-Za-z-]+)(\d+)$/);
+        if (match) {
+            return { prefix: match[1], num: parseInt(match[2], 10) };
+        }
+
+        return { prefix: id, num: -1 };
+    };
+
+    const aInfo = parseId(a);
+    const bInfo = parseId(b);
+
+    if (aInfo.prefix !== bInfo.prefix) {
+        return aInfo.prefix.localeCompare(bInfo.prefix);
+    }
+
+    return aInfo.num - bInfo.num;
+}
+
+export { removeDuplicates, pickRandom, betterSort, sortTaskIds };