@sewadah/selaras 0.1.1

package/dist/runtime/theme/content-surround.d.ts

@@ -0,0 +1,53 @@
+export declare const contentSurroundTheme: import("tailwind-variants").TVReturnType<{
+    align: {
+        start: {
+            link: string;
+            label: string;
+        };
+        end: {
+            link: string;
+            label: string;
+        };
+    };
+}, {
+    root: string;
+    link: string;
+    label: string;
+    icon: string;
+    title: string;
+}, undefined, {
+    align: {
+        start: {
+            link: string;
+            label: string;
+        };
+        end: {
+            link: string;
+            label: string;
+        };
+    };
+}, {
+    root: string;
+    link: string;
+    label: string;
+    icon: string;
+    title: string;
+}, import("tailwind-variants").TVReturnTypeLike<{
+    align: {
+        start: {
+            link: string;
+            label: string;
+        };
+        end: {
+            link: string;
+            label: string;
+        };
+    };
+}, {
+    root: string;
+    link: string;
+    label: string;
+    icon: string;
+    title: string;
+}>>;
+export type ContentSurroundThemeSlots = keyof (typeof contentSurroundTheme)['slots'];

package/dist/runtime/theme/content-surround.js

@@ -0,0 +1,22 @@
+import { tv } from "tailwind-variants";
+export const contentSurroundTheme = tv({
+  slots: {
+    root: "grid grid-cols-2 gap-4 border-t border-[var(--ui-border)] pt-6",
+    link: "group flex flex-col gap-1 rounded-[var(--ui-radius-md)] border border-[var(--ui-border)] p-4 transition-colors hover:border-[var(--ui-border-hover)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)]",
+    label: "flex items-center gap-1 text-xs font-medium text-[var(--ui-text-muted)]",
+    icon: "size-3.5 shrink-0 rtl:rotate-180",
+    title: "text-sm font-medium text-[var(--ui-text)] transition-colors group-hover:text-[var(--ui-primary)]"
+  },
+  variants: {
+    // `next` right-aligns its own text and flips the label's icon+text
+    // order (icon trailing, not leading) - `prev`/`next` read as mirror
+    // images of each other, not two copies of the same layout.
+    align: {
+      start: { link: "items-start text-start", label: "flex-row" },
+      end: { link: "col-start-2 items-end text-end", label: "flex-row-reverse" }
+    }
+  },
+  defaultVariants: {
+    align: "start"
+  }
+});

package/dist/runtime/theme/content-toc.d.ts

@@ -0,0 +1,56 @@
+export declare const contentTocTheme: import("tailwind-variants").TVReturnType<{
+    active: {
+        true: {
+            link: string;
+        };
+    };
+}, {
+    root: string;
+    title: string;
+    railWrap: string;
+    list: string;
+    item: string;
+    link: string;
+    content: string;
+    railContainer: string;
+    railTrack: string;
+    railSegments: string;
+    railSegment: string;
+}, undefined, {
+    active: {
+        true: {
+            link: string;
+        };
+    };
+}, {
+    root: string;
+    title: string;
+    railWrap: string;
+    list: string;
+    item: string;
+    link: string;
+    content: string;
+    railContainer: string;
+    railTrack: string;
+    railSegments: string;
+    railSegment: string;
+}, import("tailwind-variants").TVReturnTypeLike<{
+    active: {
+        true: {
+            link: string;
+        };
+    };
+}, {
+    root: string;
+    title: string;
+    railWrap: string;
+    list: string;
+    item: string;
+    link: string;
+    content: string;
+    railContainer: string;
+    railTrack: string;
+    railSegments: string;
+    railSegment: string;
+}>>;
+export type ContentTocThemeSlots = keyof (typeof contentTocTheme)['slots'];

package/dist/runtime/theme/content-toc.js

@@ -0,0 +1,41 @@
+import { tv } from "tailwind-variants";
+export const contentTocTheme = tv({
+  slots: {
+    root: "flex flex-col gap-2 text-sm",
+    title: "font-medium text-[var(--ui-text)]",
+    // relative + start padding reserves room for the rail (an absolutely
+    // positioned box, sized/placed entirely by ContentToc.vue's JS
+    // measurement - this only wraps the <ul>, not the title, matching the
+    // reference's own layout).
+    railWrap: "relative ps-7",
+    list: "flex flex-col gap-1",
+    item: "flex flex-col",
+    // A lighter touch than the main sidebar's - this is a secondary,
+    // supplementary "on this page" list, not primary navigation - but
+    // still meaningfully bigger than the original py-0.5. No left
+    // border/padding for the indicator anymore - the rail owns that job.
+    link: "block py-1.5 text-[var(--ui-text-muted)] transition-colors hover:text-[var(--ui-text)] focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--ui-primary)]",
+    content: "ms-3 flex flex-col gap-1",
+    // The rail is a single continuous "wire" connecting every heading
+    // (not just the active one), drawn as an SVG path and applied as a
+    // CSS mask - see ContentToc.vue's buildDepthPath/buildMaskUrl. The
+    // path itself is always built in a fixed left-to-right coordinate
+    // space, so under RTL the container mirrors horizontally via a
+    // transform rather than the path math being rebuilt per direction.
+    // Two masked divs share that same path shape:
+    railContainer: "absolute start-0 top-0 rtl:-scale-x-100",
+    // - a faint always-visible track (the full path, every heading).
+    railTrack: "absolute inset-0 bg-[var(--ui-text-muted)]/25",
+    // - a primary-colored overlay, masked identically, whose own child
+    //   blocks (railSegment, one per contiguous run of active headings)
+    //   only paint where they fall within the path - so the "lit"
+    //   portion follows the same curves as the track under it.
+    railSegments: "absolute inset-0",
+    railSegment: "absolute w-full bg-[var(--ui-primary)] transition-[top,height] duration-200 ease-out"
+  },
+  variants: {
+    active: {
+      true: { link: "text-[var(--ui-primary)]" }
+    }
+  }
+});

package/dist/runtime/theme/context-menu.d.ts

@@ -0,0 +1,38 @@
+export declare const contextMenuTheme: import("tailwind-variants").TVReturnType<{
+    destructive: {
+        true: {
+            item: string;
+            icon: string;
+        };
+    };
+}, {
+    content: string;
+    item: string;
+    icon: string;
+    separator: string;
+}, undefined, {
+    destructive: {
+        true: {
+            item: string;
+            icon: string;
+        };
+    };
+}, {
+    content: string;
+    item: string;
+    icon: string;
+    separator: string;
+}, import("tailwind-variants").TVReturnTypeLike<{
+    destructive: {
+        true: {
+            item: string;
+            icon: string;
+        };
+    };
+}, {
+    content: string;
+    item: string;
+    icon: string;
+    separator: string;
+}>>;
+export type ContextMenuThemeSlots = keyof (typeof contextMenuTheme)['slots'];

package/dist/runtime/theme/context-menu.js

@@ -0,0 +1,21 @@
+import { tv } from "tailwind-variants";
+export const contextMenuTheme = tv({
+  slots: {
+    // Same transient-popover layering tier as Dropdown - --ui-z-dropdown,
+    // not a separate token of its own.
+    content: "z-[var(--ui-z-dropdown)] min-w-40 rounded-[var(--ui-radius-md)] bg-[var(--ui-bg)] p-1 shadow-[var(--ui-shadow-md)] ring-1 ring-[var(--ui-border)] data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2",
+    item: "flex items-center gap-2 rounded-[var(--ui-radius-sm)] px-2 py-1.5 text-sm text-[var(--ui-text)] cursor-pointer select-none outline-none data-[highlighted]:bg-[var(--ui-bg-elevated)] data-[disabled]:opacity-50 data-[disabled]:pointer-events-none",
+    icon: "size-4 shrink-0 text-[var(--ui-text-muted)]",
+    separator: "-mx-1 my-1 h-px bg-[var(--ui-border)]"
+  },
+  variants: {
+    // For a delete/remove-style action - same single flag Dropdown's own
+    // theme uses, rather than the full 7-color palette Badge/Chip expose.
+    destructive: {
+      true: {
+        item: "text-[var(--ui-danger)] data-[highlighted]:bg-[var(--ui-danger-soft)]",
+        icon: "text-[var(--ui-danger)]"
+      }
+    }
+  }
+});

package/dist/runtime/theme/dashboard-group.d.ts

@@ -0,0 +1,26 @@
+export declare const dashboardGroupTheme: import("tailwind-variants").TVReturnType<{
+    [key: string]: {
+        [key: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {
+    [x: string]: {
+        [x: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {}, {
+    root: string;
+}, undefined, {
+    [key: string]: {
+        [key: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {}, {
+    root: string;
+}, import("tailwind-variants").TVReturnTypeLike<unknown, {
+    root: string;
+}>>;
+export type DashboardGroupThemeSlots = keyof (typeof dashboardGroupTheme)['slots'];

package/dist/runtime/theme/dashboard-group.js

@@ -0,0 +1,9 @@
+import { tv } from "tailwind-variants";
+export const dashboardGroupTheme = tv({
+  slots: {
+    // Same class works for both the desktop SplitterGroup and the mobile
+    // plain-div fallback - a horizontal flex row either way, just without
+    // Splitter's own inline flex-basis styling driving the split on mobile.
+    root: "flex h-full w-full overflow-hidden"
+  }
+});

package/dist/runtime/theme/dashboard-navbar.d.ts

@@ -0,0 +1,44 @@
+export declare const dashboardNavbarTheme: import("tailwind-variants").TVReturnType<{
+    [key: string]: {
+        [key: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+            right?: import("tailwind-variants").ClassValue;
+            left?: import("tailwind-variants").ClassValue;
+            title?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {
+    [x: string]: {
+        [x: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+            right?: import("tailwind-variants").ClassValue;
+            left?: import("tailwind-variants").ClassValue;
+            title?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {}, {
+    root: string;
+    left: string;
+    title: string;
+    right: string;
+}, undefined, {
+    [key: string]: {
+        [key: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+            right?: import("tailwind-variants").ClassValue;
+            left?: import("tailwind-variants").ClassValue;
+            title?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {}, {
+    root: string;
+    left: string;
+    title: string;
+    right: string;
+}, import("tailwind-variants").TVReturnTypeLike<unknown, {
+    root: string;
+    left: string;
+    title: string;
+    right: string;
+}>>;
+export type DashboardNavbarThemeSlots = keyof (typeof dashboardNavbarTheme)['slots'];

package/dist/runtime/theme/dashboard-navbar.js

@@ -0,0 +1,9 @@
+import { tv } from "tailwind-variants";
+export const dashboardNavbarTheme = tv({
+  slots: {
+    root: "flex h-14 shrink-0 items-center justify-between gap-4 border-b border-[var(--ui-border)] bg-[var(--ui-bg)] px-4",
+    left: "flex min-w-0 items-center gap-2",
+    title: "truncate font-medium text-[var(--ui-text)]",
+    right: "flex shrink-0 items-center gap-2"
+  }
+});

package/dist/runtime/theme/dashboard-panel.d.ts

@@ -0,0 +1,26 @@
+export declare const dashboardPanelTheme: import("tailwind-variants").TVReturnType<{
+    [key: string]: {
+        [key: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {
+    [x: string]: {
+        [x: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {}, {
+    root: string;
+}, undefined, {
+    [key: string]: {
+        [key: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {}, {
+    root: string;
+}, import("tailwind-variants").TVReturnTypeLike<unknown, {
+    root: string;
+}>>;
+export type DashboardPanelThemeSlots = keyof (typeof dashboardPanelTheme)['slots'];

package/dist/runtime/theme/dashboard-panel.js

@@ -0,0 +1,6 @@
+import { tv } from "tailwind-variants";
+export const dashboardPanelTheme = tv({
+  slots: {
+    root: "flex min-w-0 flex-1 flex-col overflow-hidden"
+  }
+});

package/dist/runtime/theme/dashboard-resize-handle.d.ts

@@ -0,0 +1,26 @@
+export declare const dashboardResizeHandleTheme: import("tailwind-variants").TVReturnType<{
+    [key: string]: {
+        [key: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {
+    [x: string]: {
+        [x: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {}, {
+    root: string;
+}, undefined, {
+    [key: string]: {
+        [key: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {}, {
+    root: string;
+}, import("tailwind-variants").TVReturnTypeLike<unknown, {
+    root: string;
+}>>;
+export type DashboardResizeHandleThemeSlots = keyof (typeof dashboardResizeHandleTheme)['slots'];

package/dist/runtime/theme/dashboard-resize-handle.js

@@ -0,0 +1,17 @@
+import { tv } from "tailwind-variants";
+export const dashboardResizeHandleTheme = tv({
+  slots: {
+    // SplitterResizeHandle's own hit area is deliberately wider than its
+    // visible line (a comfortable grab target, invisible padding on
+    // either side) - harmless when both adjacent panels share one
+    // background, but once DashboardSidebar's own root reads as
+    // --ui-bg-elevated (a step apart from DashboardPanel's own plain
+    // --ui-bg), that "invisible" padding stops being invisible: it reads
+    // as a sliver of the wrong background bleeding through right at the
+    // sidebar's own edge. A background split exactly down the middle -
+    // matching each side's real background - makes the hit area blend
+    // into whichever panel it happens to be sitting over instead of
+    // showing through as its own separate strip.
+    root: "bg-[linear-gradient(to_right,var(--ui-bg-elevated)_50%,var(--ui-bg)_50%)]"
+  }
+});

package/dist/runtime/theme/dashboard-sidebar.d.ts

@@ -0,0 +1,50 @@
+export declare const dashboardSidebarTheme: import("tailwind-variants").TVReturnType<{
+    [key: string]: {
+        [key: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+            header?: import("tailwind-variants").ClassValue;
+            body?: import("tailwind-variants").ClassValue;
+            footer?: import("tailwind-variants").ClassValue;
+            scrollArea?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {
+    [x: string]: {
+        [x: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+            header?: import("tailwind-variants").ClassValue;
+            body?: import("tailwind-variants").ClassValue;
+            footer?: import("tailwind-variants").ClassValue;
+            scrollArea?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {}, {
+    root: string;
+    header: string;
+    scrollArea: string;
+    body: string;
+    footer: string;
+}, undefined, {
+    [key: string]: {
+        [key: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+            header?: import("tailwind-variants").ClassValue;
+            body?: import("tailwind-variants").ClassValue;
+            footer?: import("tailwind-variants").ClassValue;
+            scrollArea?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {}, {
+    root: string;
+    header: string;
+    scrollArea: string;
+    body: string;
+    footer: string;
+}, import("tailwind-variants").TVReturnTypeLike<unknown, {
+    root: string;
+    header: string;
+    scrollArea: string;
+    body: string;
+    footer: string;
+}>>;
+export type DashboardSidebarThemeSlots = keyof (typeof dashboardSidebarTheme)['slots'];

package/dist/runtime/theme/dashboard-sidebar.js

@@ -0,0 +1,40 @@
+import { tv } from "tailwind-variants";
+export const dashboardSidebarTheme = tv({
+  slots: {
+    // flex flex-col so header/body/footer stack correctly regardless of
+    // which root element renders (SplitterPanel on desktop, Drawer's own
+    // content area on mobile) - both need the same internal layout. No
+    // border of its own on the end edge - DashboardResizeHandle's own
+    // line already draws that divider on desktop, and doubling it up
+    // here just reads as two parallel lines a couple pixels apart.
+    // transition-[flex-grow] animates the collapse/expand triggered via
+    // DashboardNavbar's toggle button - a live drag updates flex-grow on
+    // every pointermove instead, frequently enough that a short duration
+    // like this reads as smoothed-out tracking rather than lag, not a
+    // rubber-band fight against the cursor.
+    // --ui-bg-elevated (not the base --ui-bg the main content area sits
+    // on) - a step darker/lighter than the page background, the same
+    // token hover states elsewhere already use for "a surface slightly
+    // apart from the page" - gives the sidebar a genuine, real contrast
+    // against DashboardPanel's own content instead of both areas reading
+    // as one contiguous white/dark surface with only the resize-handle's
+    // thin line between them.
+    root: "flex h-full flex-col overflow-hidden bg-[var(--ui-bg-elevated)] transition-[flex-grow] duration-200 ease-out",
+    // No border, no height lock to DashboardNavbar's own h-14 - an
+    // earlier version of this tried exactly that (to fix a real reported
+    // bug: the two areas' bottom borders landing a few px apart), but
+    // coupling this slot's height to a sibling it has no relationship to
+    // is fragile in the wrong direction - it only stays aligned for
+    // whatever header content happens to fit in 56px, and actively
+    // clips anything taller (a logo plus a tagline, a search box). Sized
+    // to its own content via plain padding instead, the same as footer
+    // below - the sidebar's header and the navbar are independent areas
+    // that don't need a shared horizontal datum line; a consumer who
+    // wants a border under their own header content can add one via
+    // `:ui="{ header: 'border-b ...' }"`.
+    header: "shrink-0 p-4",
+    scrollArea: "flex-1 min-h-0",
+    body: "p-2",
+    footer: "shrink-0 border-t border-[var(--ui-border)] p-4"
+  }
+});

package/dist/runtime/theme/date-picker.d.ts

@@ -0,0 +1,119 @@
+export declare const datePickerTheme: import("tailwind-variants").TVReturnType<{
+    size: {
+        sm: {
+            field: string;
+        };
+        md: {
+            field: string;
+        };
+        lg: {
+            field: string;
+        };
+    };
+    invalid: {
+        true: {
+            field: string;
+        };
+    };
+    range: {
+        true: {
+            cell: string;
+        };
+    };
+}, {
+    root: string;
+    field: string;
+    segment: string;
+    separator: string;
+    content: string;
+    mobileContent: string;
+    header: string;
+    heading: string;
+    grids: string;
+    grid: string;
+    gridHead: string;
+    headCell: string;
+    cell: string;
+    viewGrid: string;
+    timeSection: string;
+    arrow: string;
+}, undefined, {
+    size: {
+        sm: {
+            field: string;
+        };
+        md: {
+            field: string;
+        };
+        lg: {
+            field: string;
+        };
+    };
+    invalid: {
+        true: {
+            field: string;
+        };
+    };
+    range: {
+        true: {
+            cell: string;
+        };
+    };
+}, {
+    root: string;
+    field: string;
+    segment: string;
+    separator: string;
+    content: string;
+    mobileContent: string;
+    header: string;
+    heading: string;
+    grids: string;
+    grid: string;
+    gridHead: string;
+    headCell: string;
+    cell: string;
+    viewGrid: string;
+    timeSection: string;
+    arrow: string;
+}, import("tailwind-variants").TVReturnTypeLike<{
+    size: {
+        sm: {
+            field: string;
+        };
+        md: {
+            field: string;
+        };
+        lg: {
+            field: string;
+        };
+    };
+    invalid: {
+        true: {
+            field: string;
+        };
+    };
+    range: {
+        true: {
+            cell: string;
+        };
+    };
+}, {
+    root: string;
+    field: string;
+    segment: string;
+    separator: string;
+    content: string;
+    mobileContent: string;
+    header: string;
+    heading: string;
+    grids: string;
+    grid: string;
+    gridHead: string;
+    headCell: string;
+    cell: string;
+    viewGrid: string;
+    timeSection: string;
+    arrow: string;
+}>>;
+export type DatePickerThemeSlots = keyof (typeof datePickerTheme)['slots'];