@starwind-ui/core 1.14.0 → 1.15.1

package/dist/src/components/table/TableBody.astro

@@ -1,16 +0,0 @@
----
-import type { HTMLAttributes } from "astro/types";
-import { tv, type VariantProps } from "tailwind-variants";
-
-type Props = HTMLAttributes<"tbody"> & VariantProps<typeof tableBody>;
-
-export const tableBody = tv({
-  base: "[&_tr:last-child]:border-0",
-});
-
-const { class: className, ...rest } = Astro.props;
----
-
-<tbody data-slot="table-body" class={tableBody({ class: className })} {...rest}>
-  <slot />
-</tbody>

package/dist/src/components/table/TableCaption.astro

@@ -1,16 +0,0 @@
----
-import type { HTMLAttributes } from "astro/types";
-import { tv, type VariantProps } from "tailwind-variants";
-
-type Props = HTMLAttributes<"caption"> & VariantProps<typeof tableCaption>;
-
-export const tableCaption = tv({
-  base: "text-muted-foreground mt-4 text-sm",
-});
-
-const { class: className, ...rest } = Astro.props;
----
-
-<caption data-slot="table-caption" class={tableCaption({ class: className })} {...rest}>
-  <slot />
-</caption>

package/dist/src/components/table/TableCell.astro

@@ -1,16 +0,0 @@
----
-import type { HTMLAttributes } from "astro/types";
-import { tv, type VariantProps } from "tailwind-variants";
-
-type Props = HTMLAttributes<"td"> & VariantProps<typeof tableCell>;
-
-export const tableCell = tv({
-  base: "p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
-});
-
-const { class: className, ...rest } = Astro.props;
----
-
-<td data-slot="table-cell" class={tableCell({ class: className })} {...rest}>
-  <slot />
-</td>

package/dist/src/components/table/TableFoot.astro

@@ -1,16 +0,0 @@
----
-import type { HTMLAttributes } from "astro/types";
-import { tv, type VariantProps } from "tailwind-variants";
-
-type Props = HTMLAttributes<"tfoot"> & VariantProps<typeof tableFoot>;
-
-export const tableFoot = tv({
-  base: "bg-muted/50 border-t font-medium [&>tr]:last:border-b-0",
-});
-
-const { class: className, ...rest } = Astro.props;
----
-
-<tfoot data-slot="table-foot" class={tableFoot({ class: className })} {...rest}>
-  <slot />
-</tfoot>

package/dist/src/components/table/TableHead.astro

@@ -1,16 +0,0 @@
----
-import type { HTMLAttributes } from "astro/types";
-import { tv, type VariantProps } from "tailwind-variants";
-
-type Props = HTMLAttributes<"th"> & VariantProps<typeof tableHead>;
-
-export const tableHead = tv({
-  base: "text-muted-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
-});
-
-const { class: className, ...rest } = Astro.props;
----
-
-<th data-slot="table-head" class={tableHead({ class: className })} {...rest} role="columnheader">
-  <slot />
-</th>

package/dist/src/components/table/TableHeader.astro

@@ -1,16 +0,0 @@
----
-import type { HTMLAttributes } from "astro/types";
-import { tv, type VariantProps } from "tailwind-variants";
-
-type Props = HTMLAttributes<"thead"> & VariantProps<typeof tableHeader>;
-
-export const tableHeader = tv({
-  base: "[&_tr]:border-b",
-});
-
-const { class: className, ...rest } = Astro.props;
----
-
-<thead data-slot="table-header" class={tableHeader({ class: className })} {...rest}>
-  <slot />
-</thead>

package/dist/src/components/table/TableRow.astro

@@ -1,16 +0,0 @@
----
-import type { HTMLAttributes } from "astro/types";
-import { tv, type VariantProps } from "tailwind-variants";
-
-type Props = HTMLAttributes<"tr"> & VariantProps<typeof tableRow>;
-
-export const tableRow = tv({
-  base: "hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors",
-});
-
-const { class: className, ...rest } = Astro.props;
----
-
-<tr data-slot="table-row" class={tableRow({ class: className })} {...rest} role="row">
-  <slot />
-</tr>

package/dist/src/components/table/index.ts

@@ -1,42 +0,0 @@
-import Table, { table } from "./Table.astro";
-import TableBody, { tableBody } from "./TableBody.astro";
-import TableCaption, { tableCaption } from "./TableCaption.astro";
-import TableCell, { tableCell } from "./TableCell.astro";
-import TableFoot, { tableFoot } from "./TableFoot.astro";
-import TableHead, { tableHead } from "./TableHead.astro";
-import TableHeader, { tableHeader } from "./TableHeader.astro";
-import TableRow, { tableRow } from "./TableRow.astro";
-
-const TableVariants = {
-  table,
-  tableBody,
-  tableCaption,
-  tableCell,
-  tableFoot,
-  tableHead,
-  tableHeader,
-  tableRow,
-};
-
-export {
-  Table,
-  TableBody,
-  TableCaption,
-  TableCell,
-  TableFoot,
-  TableHead,
-  TableHeader,
-  TableRow,
-  TableVariants,
-};
-
-export default {
-  Root: Table,
-  Body: TableBody,
-  Caption: TableCaption,
-  Cell: TableCell,
-  Foot: TableFoot,
-  Head: TableHead,
-  Header: TableHeader,
-  Row: TableRow,
-};

package/dist/src/components/tabs/Tabs.astro

@@ -1,271 +0,0 @@
----
-import type { HTMLAttributes } from "astro/types";
-import { tv } from "tailwind-variants";
-
-interface Props extends HTMLAttributes<"div"> {
-  defaultValue?: string;
-  syncKey?: string;
-}
-
-export const tabs = tv({ base: "starwind-tabs" });
-
-const { defaultValue, syncKey, class: className, ...rest } = Astro.props;
----
-
-<div
-  class={tabs({ class: className })}
-  data-default-value={defaultValue}
-  data-sync-key={syncKey}
-  data-slot="tabs"
-  {...rest}
->
-  <slot />
-</div>
-
-<script>
-  type TabValue = string;
-
-  interface TabsSyncEventDetail {
-    value: TabValue;
-  }
-
-  interface TabsSyncEvent extends CustomEvent<TabsSyncEventDetail> {
-    type: `starwind-tabs-sync:${string}`;
-  }
-
-  class TabsHandler {
-    private tabs: HTMLElement;
-    private triggers: HTMLButtonElement[];
-    private contents: HTMLElement[];
-    private currentTabIndex: number = 0;
-    private tabsId: string;
-    private syncKey?: string;
-    private storageKey: string;
-    private valueToTriggerMap: Map<string, HTMLButtonElement>;
-    private valueToContentMap: Map<string, HTMLElement>;
-    private parentHandler: TabsHandler | null = null;
-
-    constructor(tabs: HTMLElement, idx: number, parentHandler: TabsHandler | null = null) {
-      this.tabs = tabs;
-      this.parentHandler = parentHandler;
-      this.triggers = Array.from(
-        tabs.querySelectorAll(":scope > [data-tabs-list] > [data-tabs-trigger]"),
-      );
-      this.contents = Array.from(tabs.querySelectorAll(":scope > [data-tabs-content]"));
-      this.tabsId = `starwind-tabs${idx}`;
-      this.syncKey = tabs.dataset.syncKey;
-      this.storageKey = this.syncKey
-        ? `starwind-tabs-${this.syncKey}`
-        : `starwind-tabs-${this.tabsId}`;
-
-      // Create maps for faster lookups
-      this.valueToTriggerMap = new Map(
-        this.triggers.map((trigger) => [trigger.getAttribute("data-value") ?? "", trigger]),
-      );
-      this.valueToContentMap = new Map(
-        this.contents.map((content) => [content.getAttribute("data-value") ?? "", content]),
-      );
-
-      this.setupIds();
-      this.initializeTab();
-      this.addEventListeners();
-
-      if (this.syncKey) {
-        this.setupSyncListener();
-      }
-    }
-
-    private initializeTab(): void {
-      const value = this.syncKey
-        ? (localStorage.getItem(this.storageKey) ?? this.tabs.dataset.defaultValue)
-        : this.tabs.dataset.defaultValue;
-
-      if (value) {
-        this.showTab(value);
-        this.currentTabIndex = this.triggers.findIndex(
-          (trigger) => trigger.getAttribute("data-value") === value,
-        );
-        this.setTabIndex();
-      }
-    }
-
-    private setupSyncListener(): void {
-      document.addEventListener(`starwind-tabs-sync:${this.syncKey}`, ((e: TabsSyncEvent) => {
-        const value = e.detail.value;
-        const trigger = this.valueToTriggerMap.get(value);
-        const index = trigger ? this.triggers.indexOf(trigger) : -1;
-
-        if (index !== -1) {
-          this.showTab(value);
-          this.currentTabIndex = index;
-          this.setTabIndex();
-        }
-      }) as EventListener);
-    }
-
-    private setupIds(): void {
-      this.triggers.forEach((trigger, idx) => {
-        const triggerId = `${this.tabsId}-t${idx}`;
-        const contentId = `${this.tabsId}-c${idx}`;
-        const value = trigger.getAttribute("data-value");
-
-        trigger.id = triggerId;
-
-        if (value) {
-          trigger.setAttribute("aria-controls", contentId);
-          const content = this.valueToContentMap.get(value);
-          if (content) {
-            content.id = contentId;
-            content.setAttribute("aria-labelledby", triggerId);
-          }
-        }
-      });
-    }
-
-    private setTabIndex(): void {
-      this.triggers.forEach((trigger, index) => {
-        trigger.setAttribute("tabindex", index === this.currentTabIndex ? "0" : "-1");
-      });
-    }
-
-    private dispatchSyncEvent(value: TabValue): void {
-      if (!this.syncKey) return;
-
-      document.dispatchEvent(
-        new CustomEvent(`starwind-tabs-sync:${this.syncKey}`, { detail: { value } }),
-      );
-
-      localStorage.setItem(this.storageKey, value);
-    }
-
-    private handleKeyNavigation = (e: KeyboardEvent): void => {
-      const key = e.key;
-      let newIndex = this.currentTabIndex;
-
-      switch (key) {
-        case "ArrowRight": {
-          for (let i = 1; i < this.triggers.length; i++) {
-            const index = (this.currentTabIndex + i) % this.triggers.length;
-            if (!this.triggers[index].disabled) {
-              newIndex = index;
-              break;
-            }
-          }
-          break;
-        }
-        case "ArrowLeft": {
-          for (let i = 1; i < this.triggers.length; i++) {
-            const index = (this.currentTabIndex - i + this.triggers.length) % this.triggers.length;
-            if (!this.triggers[index].disabled) {
-              newIndex = index;
-              break;
-            }
-          }
-          break;
-        }
-        case "Home": {
-          for (let i = 0; i < this.triggers.length; i++) {
-            if (!this.triggers[i].disabled) {
-              newIndex = i;
-              break;
-            }
-          }
-          break;
-        }
-        case "End": {
-          for (let i = this.triggers.length - 1; i >= 0; i--) {
-            if (!this.triggers[i].disabled) {
-              newIndex = i;
-              break;
-            }
-          }
-          break;
-        }
-        default:
-          return;
-      }
-
-      e.preventDefault();
-      const newTrigger = this.triggers[newIndex];
-      const value = newTrigger.getAttribute("data-value");
-      if (value) {
-        this.showTab(value);
-        this.currentTabIndex = newIndex;
-        this.setTabIndex();
-        newTrigger.focus();
-        this.dispatchSyncEvent(value);
-      }
-    };
-
-    private handleClick = (trigger: HTMLElement, index: number): void => {
-      const value = trigger.getAttribute("data-value");
-      if (value) {
-        this.showTab(value);
-        this.currentTabIndex = index;
-        this.setTabIndex();
-        trigger.focus();
-        this.dispatchSyncEvent(value);
-      }
-    };
-
-    private addEventListeners(): void {
-      this.triggers.forEach((trigger, index) => {
-        trigger.addEventListener("click", () => this.handleClick(trigger, index));
-        trigger.addEventListener("keydown", (e) => this.handleKeyNavigation(e));
-      });
-    }
-
-    private showTab(value: TabValue): void {
-      const trigger = this.valueToTriggerMap.get(value);
-      const content = this.valueToContentMap.get(value);
-
-      if (!trigger || !content) return;
-
-      // Update all triggers and contents
-      this.triggers.forEach((t) => {
-        const isActive = t === trigger;
-        t.setAttribute("data-state", isActive ? "active" : "inactive");
-        t.setAttribute("aria-selected", isActive.toString());
-      });
-
-      this.contents.forEach((c) => {
-        const isActive = c === content;
-        c.setAttribute("data-state", isActive ? "active" : "inactive");
-        c.hidden = !isActive;
-      });
-
-      // Initialize any nested tabs in the active content
-      if (content.hasAttribute("data-state") && content.getAttribute("data-state") === "active") {
-        const nestedTabs = content.querySelectorAll<HTMLElement>(".starwind-tabs");
-
-        nestedTabs.forEach((nestedTab, nestedIdx) => {
-          // Skip tabs that already have instances
-          if (!tabInstances.has(nestedTab)) {
-            const uniqueIdx = 1000 + nestedIdx;
-            const handler = new TabsHandler(nestedTab, uniqueIdx, this);
-            tabInstances.set(nestedTab, handler);
-          }
-        });
-      }
-    }
-  }
-
-  // Store instances in a WeakMap to avoid memory leaks
-  const tabInstances = new WeakMap<HTMLElement, TabsHandler>();
-  let tabCounter = 0;
-
-  const setupTabs = () => {
-    // First handle top-level tabs
-    document.querySelectorAll<HTMLElement>(".starwind-tabs").forEach((tabs) => {
-      // Skip tabs that are nested within other tab contents
-      const isNested = !!tabs.closest("[data-tabs-content]");
-      if (!isNested && !tabInstances.has(tabs)) {
-        tabInstances.set(tabs, new TabsHandler(tabs, tabCounter++));
-      }
-    });
-  };
-
-  setupTabs();
-  document.addEventListener("astro:after-swap", setupTabs);
-  document.addEventListener("starwind:init", setupTabs);
-</script>

package/dist/src/components/tabs/TabsContent.astro

@@ -1,28 +0,0 @@
----
-import type { HTMLAttributes } from "astro/types";
-import { tv } from "tailwind-variants";
-
-interface Props extends Omit<HTMLAttributes<"div">, "id" | "role" | "tabindex" | "hidden"> {
-  value: string;
-}
-
-export const tabsContent = tv({
-  base: "mt-2 focus-visible:outline-2 focus-visible:outline-offset-2",
-});
-
-const { value, class: className, ...rest } = Astro.props;
----
-
-<div
-  class={tabsContent({ class: className })}
-  data-slot="tabs-content"
-  data-tabs-content
-  data-value={value}
-  data-state="inactive"
-  role="tabpanel"
-  tabindex="0"
-  hidden
-  {...rest}
->
-  <slot />
-</div>

package/dist/src/components/tabs/TabsList.astro

@@ -1,22 +0,0 @@
----
-import type { HTMLAttributes } from "astro/types";
-import { tv } from "tailwind-variants";
-
-type Props = Omit<HTMLAttributes<"div">, "role">;
-
-export const tabsList = tv({
-  base: "bg-muted text-muted-foreground inline-flex w-fit items-center justify-center rounded-md p-1",
-});
-
-const { class: className, ...rest } = Astro.props;
----
-
-<div
-  class={tabsList({ class: className })}
-  data-slot="tabs-list"
-  data-tabs-list
-  role="tablist"
-  {...rest}
->
-  <slot />
-</div>

package/dist/src/components/tabs/TabsTrigger.astro

@@ -1,34 +0,0 @@
----
-import type { HTMLAttributes } from "astro/types";
-import { tv } from "tailwind-variants";
-
-interface Props extends Omit<HTMLAttributes<"button">, "type" | "id" | "role"> {
-  value: string;
-}
-
-export const tabsTrigger = tv({
-  base: [
-    "inline-flex grow items-center justify-center gap-2 rounded-sm border border-transparent px-3 py-1.5 font-medium whitespace-nowrap transition-[color,box-shadow]",
-    "data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm",
-    "dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 dark:text-muted-foreground",
-    "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-    "focus-visible:border-outline focus-visible:ring-outline/50 focus-visible:outline-outline focus-visible:ring-3 focus-visible:outline-1",
-    "disabled:pointer-events-none disabled:opacity-50",
-  ],
-});
-
-const { value, class: className, ...rest } = Astro.props;
----
-
-<button
-  class={tabsTrigger({ class: className })}
-  data-slot="tabs-trigger"
-  data-tabs-trigger
-  data-value={value}
-  data-state="inactive"
-  role="tab"
-  aria-selected="false"
-  {...rest}
->
-  <slot />
-</button>

package/dist/src/components/tabs/index.ts

@@ -1,20 +0,0 @@
-import Tabs, { tabs } from "./Tabs.astro";
-import TabsContent, { tabsContent } from "./TabsContent.astro";
-import TabsList, { tabsList } from "./TabsList.astro";
-import TabsTrigger, { tabsTrigger } from "./TabsTrigger.astro";
-
-const TabsVariants = {
-  tabs,
-  tabsContent,
-  tabsList,
-  tabsTrigger,
-};
-
-export { Tabs, TabsContent, TabsList, TabsTrigger, TabsVariants };
-
-export default {
-  Root: Tabs,
-  Content: TabsContent,
-  List: TabsList,
-  Trigger: TabsTrigger,
-};

package/dist/src/components/textarea/Textarea.astro

@@ -1,29 +0,0 @@
----
-import type { HTMLAttributes } from "astro/types";
-import { tv, type VariantProps } from "tailwind-variants";
-
-type Props = HTMLAttributes<"textarea"> & VariantProps<typeof textarea>;
-
-export const textarea = tv({
-  base: [
-    "border-input dark:bg-input/30 text-foreground ring-offset-background min-h-10 w-full rounded-md border bg-transparent shadow-xs",
-    "focus-visible:border-outline focus-visible:ring-outline/50 transition-[color,box-shadow] focus-visible:ring-3",
-    "file:text-foreground file:border-0 file:bg-transparent file:text-sm file:font-medium",
-    "disabled:cursor-not-allowed disabled:opacity-50",
-    "aria-invalid:border-error aria-invalid:focus-visible:ring-error/40",
-    "peer placeholder:text-muted-foreground",
-  ],
-  variants: {
-    size: {
-      sm: "min-h-9 px-2 py-1 text-sm",
-      md: "min-h-10 px-3 py-2 text-base",
-      lg: "min-h-12 px-4 py-3 text-lg",
-    },
-  },
-  defaultVariants: { size: "md" },
-});
-
-const { size, class: className, ...rest } = Astro.props;
----
-
-<textarea class={textarea({ size, class: className })} data-slot="textarea" {...rest}></textarea>

package/dist/src/components/textarea/index.ts

@@ -1,9 +0,0 @@
-import Textarea, { textarea } from "./Textarea.astro";
-
-const TextareaVariants = {
-  textarea,
-};
-
-export { Textarea, TextareaVariants };
-
-export default Textarea;

package/dist/src/components/toast/ToastDescription.astro

@@ -1,21 +0,0 @@
----
-import type { HTMLAttributes } from "astro/types";
-import { tv } from "tailwind-variants";
-
-export const toastDescription = tv({
-  base: "starwind-toast-description text-muted-foreground text-sm",
-});
-
-type Props = HTMLAttributes<"div">;
-
-const { class: className, ...rest } = Astro.props;
----
-
-<div
-  class={toastDescription({ class: className })}
-  data-slot="toast-description"
-  data-toast-description
-  {...rest}
->
-  <slot />
-</div>

package/dist/src/components/toast/ToastItem.astro

@@ -1,54 +0,0 @@
----
-import X from "@tabler/icons/outline/x.svg";
-import type { HTMLAttributes } from "astro/types";
-import { tv } from "tailwind-variants";
-
-export const toastItem = tv({
-  base: "starwind-toast bg-popover text-popover-foreground pointer-events-auto absolute inset-x-0 bottom-0 flex w-full origin-bottom flex-col gap-1 overflow-hidden rounded-lg border bg-clip-padding p-4 pr-10 shadow-lg transition-[transform,opacity] duration-300 ease-[cubic-bezier(0.22,1,0.36,1)] data-limited:pointer-events-none data-limited:opacity-0",
-  variants: {
-    variant: {
-      default: "border-border",
-      success: "border-success/80",
-      error: "border-error/80",
-      warning: "border-warning/80",
-      info: "border-info/80",
-    },
-  },
-  defaultVariants: {
-    variant: "default",
-  },
-});
-
-type Variant = "default" | "success" | "error" | "warning" | "info";
-
-type Props = HTMLAttributes<"div"> & {
-  variant?: Variant;
-};
-
-const { class: className, variant = "default", ...rest } = Astro.props;
----
-
-<div
-  class={toastItem({ variant, class: className })}
-  data-slot="toast"
-  data-variant={variant}
-  data-state="open"
-  role="dialog"
-  aria-modal="false"
-  {...rest}
->
-  <div
-    class="starwind-toast-content grid gap-1 transition-opacity duration-200 data-behind:opacity-0 data-expanded:opacity-100"
-    data-slot="toast-content"
-  >
-    <slot />
-  </div>
-  <button
-    type="button"
-    class="starwind-toast-close text-muted-foreground hover:text-foreground absolute top-2 right-2 rounded-md p-1 opacity-70 transition-opacity hover:opacity-100 focus-visible:ring-2 focus-visible:outline-none"
-    data-slot="toast-close"
-    aria-label="Close notification"
-  >
-    <X class="size-4" />
-  </button>
-</div>

package/dist/src/components/toast/ToastTemplate.astro

@@ -1,25 +0,0 @@
----
-import ToastDescription from "./ToastDescription.astro";
-import ToastItem from "./ToastItem.astro";
-import ToastTitle from "./ToastTitle.astro";
-
-type Variant = "default" | "success" | "error" | "warning" | "info" | "loading";
-
-interface Props {
-  variant: Variant;
-}
-
-const { variant } = Astro.props;
-
-// Loading variant uses default item styling but loading title styling
-const itemVariant = variant === "loading" ? "default" : variant;
----
-
-<template data-toast-template={variant}>
-  <slot>
-    <ToastItem variant={itemVariant}>
-      <ToastTitle variant={variant}>Title</ToastTitle>
-      <ToastDescription>Description</ToastDescription>
-    </ToastItem>
-  </slot>
-</template>