@vertz/ui-primitives 0.2.16 → 0.2.18

package/dist/shared/chunk-48v8j0vh.js

@@ -1,267 +0,0 @@
-// src/calendar/calendar.ts
-import { signal } from "@vertz/ui";
-var MONTH_NAMES = [
-  "January",
-  "February",
-  "March",
-  "April",
-  "May",
-  "June",
-  "July",
-  "August",
-  "September",
-  "October",
-  "November",
-  "December"
-];
-var DAY_NAMES = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
-function getDaysInMonth(year, month) {
-  return new Date(year, month + 1, 0).getDate();
-}
-function isSameDay(a, b) {
-  return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
-}
-function addDays(date, days) {
-  const result = new Date(date);
-  result.setDate(result.getDate() + days);
-  return result;
-}
-function addMonths(date, months) {
-  const result = new Date(date);
-  result.setMonth(result.getMonth() + months);
-  return result;
-}
-var Calendar = {
-  Root(options = {}) {
-    const now = new Date;
-    const defaultMonth = options.defaultMonth ?? now;
-    const weekStartsOn = options.weekStartsOn ?? 0;
-    const mode = options.mode ?? "single";
-    const state = {
-      value: signal(options.defaultValue ?? null),
-      focusedDate: signal(defaultMonth),
-      displayMonth: signal(defaultMonth)
-    };
-    const root = document.createElement("div");
-    const header = document.createElement("div");
-    const title = document.createElement("div");
-    const prevButton = document.createElement("button");
-    prevButton.setAttribute("type", "button");
-    const nextButton = document.createElement("button");
-    nextButton.setAttribute("type", "button");
-    const grid = document.createElement("table");
-    grid.setAttribute("role", "grid");
-    function updateTitle() {
-      const month = state.displayMonth.peek();
-      title.textContent = `${MONTH_NAMES[month.getMonth()]} ${month.getFullYear()}`;
-    }
-    function isDateDisabled(date) {
-      if (options.disabled?.(date))
-        return true;
-      if (options.minDate && date < options.minDate && !isSameDay(date, options.minDate)) {
-        return true;
-      }
-      if (options.maxDate && date > options.maxDate && !isSameDay(date, options.maxDate)) {
-        return true;
-      }
-      return false;
-    }
-    function isSelected(date) {
-      const val = state.value.peek();
-      if (val === null)
-        return false;
-      if (val instanceof Date)
-        return isSameDay(val, date);
-      if (Array.isArray(val))
-        return val.some((d) => isSameDay(d, date));
-      if ("from" in val && "to" in val) {
-        return isSameDay(val.from, date) || isSameDay(val.to, date);
-      }
-      return false;
-    }
-    function isInRange(date) {
-      const val = state.value.peek();
-      if (val === null || !("from" in val))
-        return false;
-      const range = val;
-      return date > range.from && date < range.to;
-    }
-    function selectDate(date) {
-      if (isDateDisabled(date))
-        return;
-      if (mode === "single") {
-        state.value.value = date;
-      } else if (mode === "multiple") {
-        const current = state.value.peek() ?? [];
-        const existing = current.findIndex((d) => isSameDay(d, date));
-        if (existing >= 0) {
-          const next = [...current];
-          next.splice(existing, 1);
-          state.value.value = next;
-        } else {
-          state.value.value = [...current, date];
-        }
-      } else if (mode === "range") {
-        const current = state.value.peek();
-        if (!current || "to" in current && current.to) {
-          state.value.value = { from: date, to: date };
-        } else {
-          if (date < current.from) {
-            state.value.value = { from: date, to: current.from };
-          } else {
-            state.value.value = { from: current.from, to: date };
-          }
-        }
-      }
-      options.onValueChange?.(state.value.peek());
-    }
-    function buildGrid() {
-      grid.innerHTML = "";
-      const display = state.displayMonth.peek();
-      const year = display.getFullYear();
-      const month = display.getMonth();
-      const daysInMonth = getDaysInMonth(year, month);
-      const thead = document.createElement("thead");
-      const headerRow = document.createElement("tr");
-      for (let i = 0;i < 7; i++) {
-        const dayIndex = (weekStartsOn + i) % 7;
-        const th = document.createElement("th");
-        th.setAttribute("scope", "col");
-        th.textContent = DAY_NAMES[dayIndex] ?? "";
-        headerRow.appendChild(th);
-      }
-      thead.appendChild(headerRow);
-      grid.appendChild(thead);
-      const tbody = document.createElement("tbody");
-      const firstDay = new Date(year, month, 1);
-      const firstDayOfWeek = firstDay.getDay();
-      const offset = (firstDayOfWeek - weekStartsOn + 7) % 7;
-      const startDate = addDays(firstDay, -offset);
-      let currentDate = startDate;
-      const totalCells = offset + daysInMonth;
-      const totalRows = Math.ceil(totalCells / 7);
-      for (let row = 0;row < totalRows; row++) {
-        const tr = document.createElement("tr");
-        for (let col = 0;col < 7; col++) {
-          const td = document.createElement("td");
-          td.setAttribute("role", "gridcell");
-          const btn = document.createElement("button");
-          btn.setAttribute("type", "button");
-          const cellDate = new Date(currentDate);
-          btn.textContent = String(cellDate.getDate());
-          btn.setAttribute("data-date", cellDate.toISOString().split("T")[0] ?? "");
-          const isOutside = cellDate.getMonth() !== month;
-          if (isOutside) {
-            btn.setAttribute("data-outside-month", "true");
-          }
-          if (isSameDay(cellDate, now)) {
-            btn.setAttribute("data-today", "true");
-          }
-          if (isDateDisabled(cellDate)) {
-            btn.setAttribute("aria-disabled", "true");
-          }
-          if (isSelected(cellDate)) {
-            btn.setAttribute("aria-selected", "true");
-          }
-          if (mode === "range") {
-            const val = state.value.peek();
-            if (val && "from" in val) {
-              if (isSameDay(cellDate, val.from)) {
-                btn.setAttribute("data-range-start", "true");
-              }
-              if (isSameDay(cellDate, val.to)) {
-                btn.setAttribute("data-range-end", "true");
-              }
-              if (isInRange(cellDate)) {
-                btn.setAttribute("data-in-range", "true");
-              }
-            }
-          }
-          btn.addEventListener("click", () => {
-            selectDate(cellDate);
-            rebuildGrid();
-          });
-          td.appendChild(btn);
-          tr.appendChild(td);
-          currentDate = addDays(currentDate, 1);
-        }
-        tbody.appendChild(tr);
-      }
-      grid.appendChild(tbody);
-    }
-    function rebuildGrid() {
-      updateTitle();
-      buildGrid();
-    }
-    function navigateMonth(delta) {
-      state.displayMonth.value = addMonths(state.displayMonth.peek(), delta);
-      options.onMonthChange?.(state.displayMonth.peek());
-      rebuildGrid();
-    }
-    prevButton.addEventListener("click", () => navigateMonth(-1));
-    nextButton.addEventListener("click", () => navigateMonth(1));
-    grid.addEventListener("keydown", (event) => {
-      const active = document.activeElement;
-      if (!active || active.tagName !== "BUTTON")
-        return;
-      const dateStr = active.getAttribute("data-date");
-      if (!dateStr)
-        return;
-      const focused = new Date(dateStr + "T00:00:00");
-      let next = null;
-      if (event.key === "ArrowLeft") {
-        event.preventDefault();
-        next = addDays(focused, -1);
-      } else if (event.key === "ArrowRight") {
-        event.preventDefault();
-        next = addDays(focused, 1);
-      } else if (event.key === "ArrowUp") {
-        event.preventDefault();
-        next = addDays(focused, -7);
-      } else if (event.key === "ArrowDown") {
-        event.preventDefault();
-        next = addDays(focused, 7);
-      } else if (event.key === "Home") {
-        event.preventDefault();
-        const dayOfWeek = (focused.getDay() - weekStartsOn + 7) % 7;
-        next = addDays(focused, -dayOfWeek);
-      } else if (event.key === "End") {
-        event.preventDefault();
-        const dayOfWeek = (focused.getDay() - weekStartsOn + 7) % 7;
-        next = addDays(focused, 6 - dayOfWeek);
-      } else if (event.key === "PageUp") {
-        event.preventDefault();
-        next = event.shiftKey ? addMonths(focused, -12) : addMonths(focused, -1);
-      } else if (event.key === "PageDown") {
-        event.preventDefault();
-        next = event.shiftKey ? addMonths(focused, 12) : addMonths(focused, 1);
-      } else if (event.key === "Enter" || event.key === " ") {
-        event.preventDefault();
-        selectDate(focused);
-        rebuildGrid();
-        return;
-      }
-      if (next) {
-        state.focusedDate.value = next;
-        if (next.getMonth() !== state.displayMonth.peek().getMonth() || next.getFullYear() !== state.displayMonth.peek().getFullYear()) {
-          state.displayMonth.value = new Date(next.getFullYear(), next.getMonth(), 1);
-          options.onMonthChange?.(state.displayMonth.peek());
-          rebuildGrid();
-        }
-        const dateKey = next.toISOString().split("T")[0];
-        const btn = grid.querySelector(`button[data-date="${dateKey}"]`);
-        btn?.focus();
-      }
-    });
-    updateTitle();
-    buildGrid();
-    root.appendChild(header);
-    root.appendChild(grid);
-    header.appendChild(prevButton);
-    header.appendChild(title);
-    header.appendChild(nextButton);
-    return { root, header, title, prevButton, nextButton, grid, state };
-  }
-};
-
-export { Calendar };

package/dist/shared/chunk-6dmt4513.js

@@ -1,78 +0,0 @@
-import {
-  createFloatingPosition
-} from "./chunk-0mcr52hc.js";
-import {
-  Keys,
-  isKey
-} from "./chunk-jctqs9m4.js";
-import {
-  setDataState,
-  setDescribedBy,
-  setHidden,
-  setHiddenAnimated
-} from "./chunk-vvjyx7fe.js";
-import {
-  uniqueId
-} from "./chunk-8y1jf6xr.js";
-
-// src/tooltip/tooltip.ts
-import { signal } from "@vertz/ui";
-var Tooltip = {
-  Root(options = {}) {
-    const { delay = 300, onOpenChange, positioning } = options;
-    const contentId = uniqueId("tooltip");
-    const state = { open: signal(false) };
-    let showTimeout = null;
-    let floatingCleanup = null;
-    const trigger = document.createElement("span");
-    setDescribedBy(trigger, contentId);
-    const content = document.createElement("div");
-    content.setAttribute("role", "tooltip");
-    content.id = contentId;
-    setHidden(content, true);
-    setDataState(content, "closed");
-    function show() {
-      if (showTimeout !== null)
-        return;
-      showTimeout = setTimeout(() => {
-        state.open.value = true;
-        setHidden(content, false);
-        setDataState(content, "open");
-        if (positioning) {
-          const effectivePlacement = positioning.placement ?? "top";
-          const result = createFloatingPosition(trigger, content, {
-            ...positioning,
-            placement: effectivePlacement
-          });
-          floatingCleanup = result.cleanup;
-        }
-        onOpenChange?.(true);
-        showTimeout = null;
-      }, delay);
-    }
-    function hide() {
-      if (showTimeout !== null) {
-        clearTimeout(showTimeout);
-        showTimeout = null;
-      }
-      state.open.value = false;
-      setDataState(content, "closed");
-      setHiddenAnimated(content, true);
-      floatingCleanup?.();
-      floatingCleanup = null;
-      onOpenChange?.(false);
-    }
-    trigger.addEventListener("mouseenter", show);
-    trigger.addEventListener("mouseleave", hide);
-    trigger.addEventListener("focus", show);
-    trigger.addEventListener("blur", hide);
-    trigger.addEventListener("keydown", (event) => {
-      if (isKey(event, Keys.Escape)) {
-        hide();
-      }
-    });
-    return { trigger, content, state };
-  }
-};
-
-export { Tooltip };

package/dist/shared/chunk-6sqwjfg8.js

@@ -1,169 +0,0 @@
-import {
-  focusFirst,
-  setRovingTabindex
-} from "./chunk-e2v1c9ex.js";
-import {
-  Keys,
-  handleListNavigation,
-  isKey
-} from "./chunk-jctqs9m4.js";
-import {
-  setDataState,
-  setExpanded,
-  setHidden,
-  setHiddenAnimated
-} from "./chunk-vvjyx7fe.js";
-import {
-  linkedIds
-} from "./chunk-8y1jf6xr.js";
-
-// src/navigation-menu/navigation-menu.ts
-import { signal } from "@vertz/ui";
-var NavigationMenu = {
-  Root(options = {}) {
-    const { orientation = "horizontal", delayOpen = 200, delayClose = 300 } = options;
-    const state = { activeItem: signal(null) };
-    const triggers = [];
-    const items = new Map;
-    let openTimeout = null;
-    let closeTimeout = null;
-    const root = document.createElement("nav");
-    const list = document.createElement("div");
-    const viewport = document.createElement("div");
-    function cancelTimers() {
-      if (openTimeout) {
-        clearTimeout(openTimeout);
-        openTimeout = null;
-      }
-      if (closeTimeout) {
-        clearTimeout(closeTimeout);
-        closeTimeout = null;
-      }
-    }
-    function openItem(value) {
-      cancelTimers();
-      const current = state.activeItem.peek();
-      if (current && current !== value) {
-        const prev = items.get(current);
-        if (prev) {
-          setExpanded(prev.trigger, false);
-          setDataState(prev.trigger, "closed");
-          setDataState(prev.content, "closed");
-          setHiddenAnimated(prev.content, true);
-        }
-      }
-      const item = items.get(value);
-      if (!item)
-        return;
-      state.activeItem.value = value;
-      setExpanded(item.trigger, true);
-      setHidden(item.content, false);
-      setDataState(item.trigger, "open");
-      setDataState(item.content, "open");
-    }
-    function closeAll() {
-      cancelTimers();
-      const current = state.activeItem.peek();
-      if (current) {
-        const item = items.get(current);
-        if (item) {
-          setExpanded(item.trigger, false);
-          setDataState(item.trigger, "closed");
-          setDataState(item.content, "closed");
-          setHiddenAnimated(item.content, true);
-        }
-      }
-      state.activeItem.value = null;
-    }
-    function Item(value, label) {
-      const ids = linkedIds("nav-menu");
-      const trigger = document.createElement("button");
-      trigger.setAttribute("type", "button");
-      trigger.id = ids.triggerId;
-      trigger.setAttribute("aria-controls", ids.contentId);
-      trigger.setAttribute("data-value", value);
-      trigger.textContent = label ?? value;
-      setExpanded(trigger, false);
-      setDataState(trigger, "closed");
-      const content = document.createElement("div");
-      content.id = ids.contentId;
-      setHidden(content, true);
-      setDataState(content, "closed");
-      trigger.addEventListener("click", () => {
-        if (state.activeItem.peek() === value) {
-          closeAll();
-        } else {
-          openItem(value);
-        }
-      });
-      trigger.addEventListener("mouseenter", () => {
-        cancelTimers();
-        openTimeout = setTimeout(() => {
-          openItem(value);
-          openTimeout = null;
-        }, delayOpen);
-      });
-      trigger.addEventListener("mouseleave", () => {
-        cancelTimers();
-        closeTimeout = setTimeout(() => {
-          closeAll();
-          closeTimeout = null;
-        }, delayClose);
-      });
-      content.addEventListener("mouseenter", () => {
-        cancelTimers();
-      });
-      content.addEventListener("mouseleave", () => {
-        cancelTimers();
-        closeTimeout = setTimeout(() => {
-          closeAll();
-          closeTimeout = null;
-        }, delayClose);
-      });
-      trigger.addEventListener("keydown", (event) => {
-        if (isKey(event, Keys.Enter, Keys.Space)) {
-          event.preventDefault();
-          openItem(value);
-          queueMicrotask(() => focusFirst(content));
-        }
-        if (isKey(event, Keys.Escape)) {
-          event.preventDefault();
-          closeAll();
-        }
-      });
-      content.addEventListener("keydown", (event) => {
-        if (isKey(event, Keys.Escape)) {
-          event.preventDefault();
-          event.stopPropagation();
-          closeAll();
-          trigger.focus();
-        }
-      });
-      triggers.push(trigger);
-      setRovingTabindex(triggers, 0);
-      items.set(value, { trigger, content });
-      list.appendChild(trigger);
-      viewport.appendChild(content);
-      return { trigger, content };
-    }
-    function Link(href, label) {
-      const a = document.createElement("a");
-      a.href = href;
-      a.textContent = label;
-      list.appendChild(a);
-      return a;
-    }
-    list.addEventListener("keydown", (event) => {
-      if (isKey(event, Keys.ArrowLeft, Keys.ArrowRight, Keys.Home, Keys.End)) {
-        handleListNavigation(event, triggers, {
-          orientation: orientation === "horizontal" ? "horizontal" : "vertical"
-        });
-      }
-    });
-    root.appendChild(list);
-    root.appendChild(viewport);
-    return { root, list, viewport, state, Item, Link };
-  }
-};
-
-export { NavigationMenu };

package/dist/shared/chunk-8qfeqrrz.js

@@ -1,179 +0,0 @@
-import {
-  createDismiss
-} from "./chunk-a6wp8c32.js";
-import {
-  createFloatingPosition,
-  virtualElement
-} from "./chunk-0mcr52hc.js";
-import {
-  Keys,
-  handleListNavigation,
-  isKey
-} from "./chunk-jctqs9m4.js";
-import {
-  setDataState,
-  setHidden,
-  setHiddenAnimated
-} from "./chunk-vvjyx7fe.js";
-import {
-  uniqueId
-} from "./chunk-8y1jf6xr.js";
-
-// src/context-menu/context-menu.ts
-import { signal } from "@vertz/ui";
-var ContextMenu = {
-  Root(options = {}) {
-    const { onSelect, positioning } = options;
-    const state = {
-      open: signal(false),
-      activeIndex: signal(-1)
-    };
-    const items = [];
-    let floatingCleanup = null;
-    let dismissCleanup = null;
-    const trigger = document.createElement("div");
-    const contentId = uniqueId("ctx-menu");
-    const content = document.createElement("div");
-    content.setAttribute("role", "menu");
-    content.id = contentId;
-    content.style.position = "fixed";
-    setHidden(content, true);
-    setDataState(content, "closed");
-    function handleClickOutside(event) {
-      const target = event.target;
-      if (!trigger.contains(target) && !content.contains(target)) {
-        close();
-      }
-    }
-    function open(x, y) {
-      state.open.value = true;
-      setHidden(content, false);
-      setDataState(content, "open");
-      if (positioning) {
-        const result = createFloatingPosition(virtualElement(x, y), content, {
-          strategy: "fixed",
-          ...positioning
-        });
-        floatingCleanup = result.cleanup;
-        dismissCleanup = createDismiss({
-          onDismiss: close,
-          insideElements: [trigger, content],
-          escapeKey: false
-        });
-      } else {
-        content.style.left = `${x}px`;
-        content.style.top = `${y}px`;
-        document.addEventListener("mousedown", handleClickOutside);
-      }
-      state.activeIndex.value = 0;
-      updateActiveItem(0);
-      items[0]?.focus();
-    }
-    function close() {
-      state.open.value = false;
-      setDataState(content, "closed");
-      setHiddenAnimated(content, true);
-      if (positioning) {
-        floatingCleanup?.();
-        floatingCleanup = null;
-        dismissCleanup?.();
-        dismissCleanup = null;
-      } else {
-        document.removeEventListener("mousedown", handleClickOutside);
-      }
-    }
-    function updateActiveItem(index) {
-      for (let i = 0;i < items.length; i++) {
-        items[i]?.setAttribute("tabindex", i === index ? "0" : "-1");
-      }
-    }
-    trigger.addEventListener("contextmenu", (event) => {
-      event.preventDefault();
-      if (state.open.peek()) {
-        close();
-      }
-      open(event.clientX, event.clientY);
-    });
-    content.addEventListener("keydown", (event) => {
-      if (isKey(event, Keys.Escape)) {
-        event.preventDefault();
-        close();
-        return;
-      }
-      if (isKey(event, Keys.Enter, Keys.Space)) {
-        event.preventDefault();
-        const active = items[state.activeIndex.peek()];
-        if (active) {
-          const val = active.getAttribute("data-value");
-          if (val !== null) {
-            onSelect?.(val);
-            close();
-          }
-        }
-        return;
-      }
-      const result = handleListNavigation(event, items, { orientation: "vertical" });
-      if (result) {
-        const idx = items.indexOf(result);
-        if (idx >= 0) {
-          state.activeIndex.value = idx;
-          updateActiveItem(idx);
-        }
-        return;
-      }
-      if (event.key.length === 1 && !event.ctrlKey && !event.metaKey && !event.altKey) {
-        const char = event.key.toLowerCase();
-        const match = items.find((item) => item.textContent?.toLowerCase().startsWith(char));
-        if (match) {
-          const idx = items.indexOf(match);
-          state.activeIndex.value = idx;
-          updateActiveItem(idx);
-          match.focus();
-        }
-      }
-    });
-    function createItem(value, label, parent) {
-      const item = document.createElement("div");
-      item.setAttribute("role", "menuitem");
-      item.setAttribute("data-value", value);
-      item.setAttribute("tabindex", "-1");
-      item.textContent = label ?? value;
-      item.addEventListener("click", () => {
-        onSelect?.(value);
-        close();
-      });
-      items.push(item);
-      (parent ?? content).appendChild(item);
-      return item;
-    }
-    function Item(value, label) {
-      return createItem(value, label);
-    }
-    function Group(label) {
-      const el = document.createElement("div");
-      el.setAttribute("role", "group");
-      el.setAttribute("aria-label", label);
-      content.appendChild(el);
-      return {
-        el,
-        Item: (value, itemLabel) => createItem(value, itemLabel, el)
-      };
-    }
-    function Separator() {
-      const hr = document.createElement("hr");
-      hr.setAttribute("role", "separator");
-      content.appendChild(hr);
-      return hr;
-    }
-    function Label(text) {
-      const el = document.createElement("div");
-      el.setAttribute("role", "none");
-      el.textContent = text;
-      content.appendChild(el);
-      return el;
-    }
-    return { trigger, content, state, Item, Group, Separator, Label };
-  }
-};
-
-export { ContextMenu };