@umbra.ui/core 0.1.7 → 0.1.9

package/dist/components/navigation/slideover/useSlideoverController.js

@@ -1,12 +1,15 @@
-import { ref, computed } from "vue";
-import { gsap } from "gsap";
-import { Flip } from "gsap/Flip";
-gsap.registerPlugin(Flip);
-export const useSlideoverController = (panes, componentId) => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSlideoverController = void 0;
+const vue_1 = require("vue");
+const gsap_1 = require("gsap");
+const Flip_1 = require("gsap/Flip");
+gsap_1.gsap.registerPlugin(Flip_1.Flip);
+const useSlideoverController = (panes, componentId) => {
     // State to track visibility of panes
-    const visiblePanes = ref(panes.map(() => false));
+    const visiblePanes = (0, vue_1.ref)(panes.map(() => false));
     // Track the current active pane index
-    const currentPaneIndex = computed(() => {
+    const currentPaneIndex = (0, vue_1.computed)(() => {
         // Find the highest index that's visible
         for (let i = visiblePanes.value.length - 1; i >= 0; i--) {
             if (visiblePanes.value[i]) {
@@ -28,11 +31,11 @@ export const useSlideoverController = (panes, componentId) => {
             return;
         if (show) {
             darken.style.pointerEvents = "all";
-            gsap.to(darken, { duration: 0.5, opacity: 1, ease: "circ.outOut" });
+            gsap_1.gsap.to(darken, { duration: 0.5, opacity: 1, ease: "circ.outOut" });
         }
         else {
             darken.style.pointerEvents = "none";
-            gsap.to(darken, { duration: 0.5, opacity: 0, ease: "circ.outOut" });
+            gsap_1.gsap.to(darken, { duration: 0.5, opacity: 0, ease: "circ.outOut" });
         }
     };
     // Show a specific pane and all panes after it
@@ -51,7 +54,7 @@ export const useSlideoverController = (panes, componentId) => {
             .slice(0, -1) // Exclude main pane
             .map((_, i) => document.getElementById(getPaneId(i)))
             .filter((el) => el !== null);
-        const state = Flip.getState(paneElements);
+        const state = Flip_1.Flip.getState(paneElements);
         // Show all panes from the selected index onward
         for (let i = 0; i < panes.length - 1; i++) {
             const pane = document.getElementById(getPaneId(i));
@@ -69,7 +72,7 @@ export const useSlideoverController = (panes, componentId) => {
             }
         }
         // Animate
-        Flip.from(state, {
+        Flip_1.Flip.from(state, {
             duration: 0.3,
             ease: "power1.inOut",
             absolute: true,
@@ -90,7 +93,7 @@ export const useSlideoverController = (panes, componentId) => {
             .slice(0, -1)
             .map((_, i) => document.getElementById(getPaneId(i)))
             .filter((el) => el !== null);
-        const state = Flip.getState(paneElements);
+        const state = Flip_1.Flip.getState(paneElements);
         // Hide all panes up to and including the specified index
         for (let i = 0; i <= index && i < panes.length - 1; i++) {
             const pane = document.getElementById(getPaneId(i));
@@ -101,7 +104,7 @@ export const useSlideoverController = (panes, componentId) => {
             }
         }
         // Animate
-        Flip.from(state, {
+        Flip_1.Flip.from(state, {
             duration: 0.3,
             ease: "power1.inOut",
             absolute: true,
@@ -125,7 +128,7 @@ export const useSlideoverController = (panes, componentId) => {
             .slice(0, -1)
             .map((_, i) => document.getElementById(getPaneId(i)))
             .filter((el) => el !== null);
-        const state = Flip.getState(paneElements);
+        const state = Flip_1.Flip.getState(paneElements);
         // If the previous pane is visible, hide all before this one
         if (visiblePanes.value[index - 1]) {
             for (let i = 0; i < index; i++) {
@@ -147,7 +150,7 @@ export const useSlideoverController = (panes, componentId) => {
             }
         }
         // Animate
-        Flip.from(state, {
+        Flip_1.Flip.from(state, {
             duration: 0.3,
             ease: "power1.inOut",
             absolute: true,
@@ -166,7 +169,7 @@ export const useSlideoverController = (panes, componentId) => {
             .slice(0, -1)
             .map((_, i) => document.getElementById(getPaneId(i)))
             .filter((el) => el !== null);
-        const state = Flip.getState(paneElements);
+        const state = Flip_1.Flip.getState(paneElements);
         // Move all secondary panes to overlay
         for (let i = 0; i < panes.length - 1; i++) {
             const pane = document.getElementById(getPaneId(i));
@@ -176,7 +179,7 @@ export const useSlideoverController = (panes, componentId) => {
                 overlay.appendChild(pane);
             }
         }
-        Flip.from(state, {
+        Flip_1.Flip.from(state, {
             duration: 0.3,
             ease: "power1.inOut",
             absolute: true,
@@ -195,7 +198,7 @@ export const useSlideoverController = (panes, componentId) => {
             .slice(0, -1)
             .map((_, i) => document.getElementById(getPaneId(i)))
             .filter((el) => el !== null);
-        const state = Flip.getState(paneElements);
+        const state = Flip_1.Flip.getState(paneElements);
         // Move all panes from overlay to offscreen
         for (let i = 0; i < panes.length - 1; i++) {
             const pane = document.getElementById(getPaneId(i));
@@ -205,7 +208,7 @@ export const useSlideoverController = (panes, componentId) => {
                 offscreen.appendChild(pane);
             }
         }
-        Flip.from(state, {
+        Flip_1.Flip.from(state, {
             duration: 0.3,
             ease: "power1.inOut",
             absolute: true,
@@ -265,3 +268,4 @@ export const useSlideoverController = (panes, componentId) => {
         navigate,
     };
 };
+exports.useSlideoverController = useSlideoverController;

package/dist/components/navigation/splitview/useSplitViewController.js

@@ -1,21 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSplitViewController = void 0;
 //useSplitViewController.ts
-import { ref, computed, unref, watch } from "vue";
-import { gsap } from "gsap";
-import { Flip } from "gsap/Flip";
-gsap.registerPlugin(Flip);
-export const useSplitViewController = (panes, componentId) => {
+const vue_1 = require("vue");
+const gsap_1 = require("gsap");
+const Flip_1 = require("gsap/Flip");
+gsap_1.gsap.registerPlugin(Flip_1.Flip);
+const useSplitViewController = (panes, componentId) => {
     // Get the actual panes array
-    const panesArray = computed(() => unref(panes));
+    const panesArray = (0, vue_1.computed)(() => (0, vue_1.unref)(panes));
     // State to track visibility of panes
-    const visiblePanes = ref(panesArray.value.map(() => true));
+    const visiblePanes = (0, vue_1.ref)(panesArray.value.map(() => true));
     // Vue-native event stream for visibility changes
-    const lastVisibilityEvent = ref(null);
+    const lastVisibilityEvent = (0, vue_1.ref)(null);
     // Watch for changes in panes and update visiblePanes accordingly
-    watch(panesArray, (newPanes) => {
+    (0, vue_1.watch)(panesArray, (newPanes) => {
         visiblePanes.value = newPanes.map((_, index) => index === newPanes.length - 1 ? true : visiblePanes.value[index] || false);
     });
     // Track the current visible pane indices
-    const currentPaneIndex = computed(() => {
+    const currentPaneIndex = (0, vue_1.computed)(() => {
         // Find the highest index that's visible (excluding the last pane which is always visible)
         for (let i = visiblePanes.value.length - 2; i >= 0; i--) {
             if (visiblePanes.value[i]) {
@@ -42,7 +45,7 @@ export const useSplitViewController = (panes, componentId) => {
         const paneElements = panesArray.value
             .map((_, i) => document.getElementById(getPaneId(i)))
             .filter((el) => el !== null);
-        const state = Flip.getState(paneElements);
+        const state = Flip_1.Flip.getState(paneElements);
         // Show the specified pane
         const pane = document.getElementById(getPaneId(index));
         if (pane && !visiblePanes.value[index]) {
@@ -66,7 +69,7 @@ export const useSplitViewController = (panes, componentId) => {
             lastVisibilityEvent.value = { type: "show", index };
         }
         // Animate
-        Flip.from(state, {
+        Flip_1.Flip.from(state, {
             duration: 0.3,
             ease: "power1.inOut",
             absolute: true,
@@ -86,7 +89,7 @@ export const useSplitViewController = (panes, componentId) => {
         const paneElements = panesArray.value
             .map((_, i) => document.getElementById(getPaneId(i)))
             .filter((el) => el !== null);
-        const state = Flip.getState(paneElements);
+        const state = Flip_1.Flip.getState(paneElements);
         // Hide the specified pane
         const pane = document.getElementById(getPaneId(index));
         if (pane && visiblePanes.value[index]) {
@@ -96,7 +99,7 @@ export const useSplitViewController = (panes, componentId) => {
             lastVisibilityEvent.value = { type: "hide", index };
         }
         // Animate
-        Flip.from(state, {
+        Flip_1.Flip.from(state, {
             duration: 0.3,
             ease: "power1.inOut",
             absolute: true,
@@ -116,7 +119,7 @@ export const useSplitViewController = (panes, componentId) => {
         const paneElements = panesArray.value
             .map((_, i) => document.getElementById(getPaneId(i)))
             .filter((el) => el !== null);
-        const state = Flip.getState(paneElements);
+        const state = Flip_1.Flip.getState(paneElements);
         // Hide all panes before the clicked pane
         if (visiblePanes.value[index - 1]) {
             for (let i = 0; i < index; i++) {
@@ -140,7 +143,7 @@ export const useSplitViewController = (panes, componentId) => {
             }
         }
         // Animate
-        Flip.from(state, {
+        Flip_1.Flip.from(state, {
             duration: 0.3,
             ease: "power1.inOut",
             absolute: true,
@@ -157,7 +160,7 @@ export const useSplitViewController = (panes, componentId) => {
         const paneElements = panesArray.value
             .map((_, i) => document.getElementById(getPaneId(i)))
             .filter((el) => el !== null);
-        const state = Flip.getState(paneElements);
+        const state = Flip_1.Flip.getState(paneElements);
         // Show all panes except the last one (which is always visible)
         for (let i = 0; i < panesArray.value.length - 1; i++) {
             const pane = document.getElementById(getPaneId(i));
@@ -182,7 +185,7 @@ export const useSplitViewController = (panes, componentId) => {
                 lastVisibilityEvent.value = { type: "show", index: i };
             }
         }
-        Flip.from(state, {
+        Flip_1.Flip.from(state, {
             duration: 0.3,
             ease: "power1.inOut",
             absolute: true,
@@ -199,7 +202,7 @@ export const useSplitViewController = (panes, componentId) => {
         const paneElements = panesArray.value
             .map((_, i) => document.getElementById(getPaneId(i)))
             .filter((el) => el !== null);
-        const state = Flip.getState(paneElements);
+        const state = Flip_1.Flip.getState(paneElements);
         // Hide all panes except the last one
         for (let i = 0; i < panesArray.value.length - 1; i++) {
             const pane = document.getElementById(getPaneId(i));
@@ -210,7 +213,7 @@ export const useSplitViewController = (panes, componentId) => {
                 lastVisibilityEvent.value = { type: "hide", index: i };
             }
         }
-        Flip.from(state, {
+        Flip_1.Flip.from(state, {
             duration: 0.3,
             ease: "power1.inOut",
             absolute: true,
@@ -269,7 +272,7 @@ export const useSplitViewController = (panes, componentId) => {
             const paneElements = panesArray.value
                 .map((_, i) => document.getElementById(getPaneId(i)))
                 .filter((el) => el !== null);
-            const state = Flip.getState(paneElements);
+            const state = Flip_1.Flip.getState(paneElements);
             // First hide all panes
             for (let i = 0; i < panesArray.value.length - 1; i++) {
                 if (i !== index && visiblePanes.value[i]) {
@@ -304,7 +307,7 @@ export const useSplitViewController = (panes, componentId) => {
                 }
                 lastVisibilityEvent.value = { type: "show", index };
             }
-            Flip.from(state, {
+            Flip_1.Flip.from(state, {
                 duration: 0.3,
                 ease: "power1.inOut",
                 absolute: true,
@@ -323,3 +326,4 @@ export const useSplitViewController = (panes, componentId) => {
         navigate,
     };
 };
+exports.useSplitViewController = useSplitViewController;

package/dist/components/navigation/tabcontroller/types.js

@@ -1 +1,2 @@
-export {};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/components/navigation/tabcontroller/useTabController.js

@@ -1,10 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useTabController = exports.TabControllerKey = void 0;
 // ============= useTabController.ts =============
-import { inject } from "vue";
-export const TabControllerKey = Symbol("TabController");
-export const useTabController = () => {
-    const context = inject(TabControllerKey);
+const vue_1 = require("vue");
+exports.TabControllerKey = Symbol("TabController");
+const useTabController = () => {
+    const context = (0, vue_1.inject)(exports.TabControllerKey);
     if (!context) {
         throw new Error("useTabController must be used within a TabController component");
     }
     return context;
 };
+exports.useTabController = useTabController;

package/dist/components/navigation/types.js

@@ -1 +1,2 @@
-export {};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/components/pickers/CollectionPicker/types.js

@@ -1 +1,2 @@
-export {};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/components/pickers/ColorPicker/colors.js

@@ -1,4 +1,7 @@
-export const colors = [
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.colorGroups = exports.colorPickerColors = exports.colors = void 0;
+exports.colors = [
     { name: "Gray", hex: "#E5E7EB", weight: 200 },
     { name: "Gray", hex: "#D1D5DB", weight: 300 },
     { name: "Gray", hex: "#9CA3AF", weight: 400 },
@@ -169,98 +172,98 @@ export const colors = [
     { name: "Rose", hex: "#881337", weight: 900 },
 ];
 // Create a colorPicker object for easy access to colors by name and weight
-export const colorPickerColors = {};
+exports.colorPickerColors = {};
 // Populate the colorPicker object
-colors.forEach((color) => {
+exports.colors.forEach((color) => {
     if (color.name && color.weight) {
         const key = `${color.name.toLowerCase()}${color.weight}`;
-        colorPickerColors[key] = color;
+        exports.colorPickerColors[key] = color;
     }
 });
 // Also export individual color groups for convenience
-export const colorGroups = [
+exports.colorGroups = [
     {
         name: "Gray",
-        colors: colors.filter((c) => c.name === "Gray"),
+        colors: exports.colors.filter((c) => c.name === "Gray"),
     },
     {
         name: "Zinc",
-        colors: colors.filter((c) => c.name === "Zinc"),
+        colors: exports.colors.filter((c) => c.name === "Zinc"),
     },
     {
         name: "Neutral",
-        colors: colors.filter((c) => c.name === "Neutral"),
+        colors: exports.colors.filter((c) => c.name === "Neutral"),
     },
     {
         name: "Stone",
-        colors: colors.filter((c) => c.name === "Stone"),
+        colors: exports.colors.filter((c) => c.name === "Stone"),
     },
     {
         name: "Red",
-        colors: colors.filter((c) => c.name === "Red"),
+        colors: exports.colors.filter((c) => c.name === "Red"),
     },
     {
         name: "Orange",
-        colors: colors.filter((c) => c.name === "Orange"),
+        colors: exports.colors.filter((c) => c.name === "Orange"),
     },
     {
         name: "Amber",
-        colors: colors.filter((c) => c.name === "Amber"),
+        colors: exports.colors.filter((c) => c.name === "Amber"),
     },
     {
         name: "Yellow",
-        colors: colors.filter((c) => c.name === "Yellow"),
+        colors: exports.colors.filter((c) => c.name === "Yellow"),
     },
     {
         name: "Lime",
-        colors: colors.filter((c) => c.name === "Lime"),
+        colors: exports.colors.filter((c) => c.name === "Lime"),
     },
     {
         name: "Green",
-        colors: colors.filter((c) => c.name === "Green"),
+        colors: exports.colors.filter((c) => c.name === "Green"),
     },
     {
         name: "Emerald",
-        colors: colors.filter((c) => c.name === "Emerald"),
+        colors: exports.colors.filter((c) => c.name === "Emerald"),
     },
     {
         name: "Teal",
-        colors: colors.filter((c) => c.name === "Teal"),
+        colors: exports.colors.filter((c) => c.name === "Teal"),
     },
     {
         name: "Cyan",
-        colors: colors.filter((c) => c.name === "Cyan"),
+        colors: exports.colors.filter((c) => c.name === "Cyan"),
     },
     {
         name: "Sky",
-        colors: colors.filter((c) => c.name === "Sky"),
+        colors: exports.colors.filter((c) => c.name === "Sky"),
     },
     {
         name: "Blue",
-        colors: colors.filter((c) => c.name === "Blue"),
+        colors: exports.colors.filter((c) => c.name === "Blue"),
     },
     {
         name: "Indigo",
-        colors: colors.filter((c) => c.name === "Indigo"),
+        colors: exports.colors.filter((c) => c.name === "Indigo"),
     },
     {
         name: "Violet",
-        colors: colors.filter((c) => c.name === "Violet"),
+        colors: exports.colors.filter((c) => c.name === "Violet"),
     },
     {
         name: "Purple",
-        colors: colors.filter((c) => c.name === "Purple"),
+        colors: exports.colors.filter((c) => c.name === "Purple"),
     },
     {
         name: "Fuchsia",
-        colors: colors.filter((c) => c.name === "Fuchsia"),
+        colors: exports.colors.filter((c) => c.name === "Fuchsia"),
     },
     {
         name: "Pink",
-        colors: colors.filter((c) => c.name === "Pink"),
+        colors: exports.colors.filter((c) => c.name === "Pink"),
     },
     {
         name: "Rose",
-        colors: colors.filter((c) => c.name === "Rose"),
+        colors: exports.colors.filter((c) => c.name === "Rose"),
     },
 ];

package/dist/components/pickers/FilePicker/types.js

@@ -1 +1,2 @@
-export {};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });