@techsio/ui-kit 0.46.0 → 0.48.0

package/dist/internal/molecules/vertical-navigation.context.js

@@ -0,0 +1,15 @@
+import { createContext, useContext } from "react";
+const VerticalNavigationContext = createContext(null);
+const VerticalNavigationDepthContext = createContext(0);
+const VerticalNavigationBranchContext = createContext(null);
+function useVerticalNavigationContext() {
+    const context = useContext(VerticalNavigationContext);
+    if (!context) throw new Error("VerticalNavigation parts must be used within VerticalNavigation.Root");
+    return context;
+}
+function useVerticalNavigationBranchContext() {
+    const context = useContext(VerticalNavigationBranchContext);
+    if (!context) throw new Error("VerticalNavigation branch parts must be used within VerticalNavigation.Branch");
+    return context;
+}
+export { VerticalNavigationBranchContext, VerticalNavigationContext, VerticalNavigationDepthContext, useVerticalNavigationBranchContext, useVerticalNavigationContext };

package/dist/internal/molecules/vertical-navigation.styles.js

@@ -0,0 +1,68 @@
+import { tv } from "../../utils.js";
+const verticalNavigationStyles = tv({
+    slots: {
+        root: "min-w-0 text-vertical-navigation-fg",
+        list: "flex min-w-0 list-none flex-col gap-vertical-navigation-list",
+        item: "min-w-0",
+        row: "vertical-navigation-row flex min-w-0 items-start gap-vertical-navigation-row rounded-vertical-navigation-item bg-vertical-navigation-item-bg data-current-path:font-vertical-navigation-path",
+        link: "vertical-navigation-control focus-visible:vertical-navigation-focus flex min-w-0 flex-1 items-center justify-start gap-vertical-navigation-row whitespace-normal rounded-vertical-navigation-item bg-vertical-navigation-item-bg text-start text-inherit hover:bg-vertical-navigation-item-bg-hover data-current:bg-vertical-navigation-item-bg-current data-current-path:font-vertical-navigation-path data-current:font-vertical-navigation-current data-current:text-vertical-navigation-item-fg-current data-disabled:text-vertical-navigation-item-fg-disabled data-disabled:hover:bg-vertical-navigation-item-bg",
+        trigger: "vertical-navigation-control focus-visible:vertical-navigation-focus flex w-full min-w-0 items-center justify-between whitespace-normal rounded-vertical-navigation-item bg-vertical-navigation-item-bg text-start text-inherit hover:bg-vertical-navigation-item-bg-hover disabled:text-vertical-navigation-item-fg-disabled disabled:hover:bg-vertical-navigation-item-bg",
+        indicator: "inline-flex shrink-0 data-[state=open]:rotate-180",
+        content: "data-guide:vertical-navigation-guide min-w-0 rounded-vertical-navigation-group py-vertical-navigation-group data-indented:ms-vertical-navigation-indent",
+        group: "flex min-w-0 flex-col gap-vertical-navigation-group rounded-vertical-navigation-group p-vertical-navigation-group",
+        groupLabel: "mb-vertical-navigation-label font-vertical-navigation-label text-vertical-navigation-label-fg text-vertical-navigation-label-sm",
+        separator: "my-vertical-navigation-group h-vertical-navigation-separator border-0 bg-vertical-navigation-separator-bg"
+    },
+    variants: {
+        variant: {
+            primary: {},
+            secondary: {}
+        },
+        size: {
+            sm: {
+                root: "text-vertical-navigation-sm",
+                link: "min-h-vertical-navigation-item-sm px-vertical-navigation-item-x-sm py-vertical-navigation-item-y-sm",
+                trigger: "min-h-vertical-navigation-item-sm px-vertical-navigation-item-x-sm py-vertical-navigation-item-y-sm",
+                indicator: "text-vertical-navigation-icon-sm",
+                groupLabel: "px-vertical-navigation-item-x-sm"
+            },
+            md: {
+                root: "text-vertical-navigation-md",
+                link: "min-h-vertical-navigation-item-md px-vertical-navigation-item-x-md py-vertical-navigation-item-y-md",
+                trigger: "min-h-vertical-navigation-item-md px-vertical-navigation-item-x-md py-vertical-navigation-item-y-md",
+                indicator: "text-vertical-navigation-icon-md",
+                groupLabel: "px-vertical-navigation-item-x-md"
+            }
+        },
+        tone: {
+            plain: {
+                content: "bg-vertical-navigation-group-bg-plain text-vertical-navigation-group-fg-plain",
+                group: "bg-vertical-navigation-group-bg-plain text-vertical-navigation-group-fg-plain"
+            },
+            subtle: {
+                content: "bg-vertical-navigation-group-bg-subtle text-vertical-navigation-group-fg-subtle",
+                group: "bg-vertical-navigation-group-bg-subtle text-vertical-navigation-group-fg-subtle"
+            },
+            accent: {
+                content: "bg-vertical-navigation-group-bg-accent text-vertical-navigation-group-fg-accent",
+                group: "bg-vertical-navigation-group-bg-accent text-vertical-navigation-group-fg-accent"
+            }
+        }
+    },
+    compoundVariants: [
+        {
+            tone: "accent",
+            variant: "secondary",
+            class: {
+                content: "bg-vertical-navigation-group-bg-secondary text-vertical-navigation-group-fg-secondary",
+                group: "bg-vertical-navigation-group-bg-secondary text-vertical-navigation-group-fg-secondary"
+            }
+        }
+    ],
+    defaultVariants: {
+        size: "md",
+        tone: "plain",
+        variant: "primary"
+    }
+});
+export { verticalNavigationStyles };

package/dist/molecules/vertical-navigation.js

@@ -0,0 +1,228 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { mergeProps, normalizeProps, useMachine } from "@zag-js/react";
+import { useContext, useId } from "react";
+import { Button } from "../atoms/button.js";
+import { Icon } from "../atoms/icon.js";
+import { LinkButton } from "../atoms/link-button.js";
+import { VerticalNavigationBranchContext, VerticalNavigationContext, VerticalNavigationDepthContext, useVerticalNavigationBranchContext, useVerticalNavigationContext } from "../internal/molecules/vertical-navigation.context.js";
+import { verticalNavigationStyles } from "../internal/molecules/vertical-navigation.styles.js";
+import * as __rspack_external__zag_js_collapsible_508ff486 from "@zag-js/collapsible";
+function VerticalNavigation({ size = "md", maxIndentDepth = 3, dir, className, children, ...props }) {
+    return /*#__PURE__*/ jsx(VerticalNavigationContext.Provider, {
+        value: {
+            size,
+            maxIndentDepth,
+            dir
+        },
+        children: /*#__PURE__*/ jsx(VerticalNavigationDepthContext.Provider, {
+            value: 0,
+            children: /*#__PURE__*/ jsx(VerticalNavigationBranchContext.Provider, {
+                value: null,
+                children: /*#__PURE__*/ jsx("nav", {
+                    ...props,
+                    className: verticalNavigationStyles({
+                        size
+                    }).root({
+                        className
+                    }),
+                    "data-part": "root",
+                    "data-scope": "vertical-navigation",
+                    dir: dir,
+                    children: children
+                })
+            })
+        })
+    });
+}
+VerticalNavigation.Root = VerticalNavigation;
+VerticalNavigation.List = function({ children, className, ...props }) {
+    useVerticalNavigationContext();
+    const depth = useContext(VerticalNavigationDepthContext);
+    return /*#__PURE__*/ jsx(VerticalNavigationDepthContext.Provider, {
+        value: depth + 1,
+        children: /*#__PURE__*/ jsx("ul", {
+            ...props,
+            className: verticalNavigationStyles().list({
+                className
+            }),
+            "data-depth": depth,
+            "data-part": "list",
+            "data-scope": "vertical-navigation",
+            children: children
+        })
+    });
+};
+VerticalNavigation.Item = function({ className, ...props }) {
+    useVerticalNavigationContext();
+    return /*#__PURE__*/ jsx(VerticalNavigationBranchContext.Provider, {
+        value: null,
+        children: /*#__PURE__*/ jsx("li", {
+            ...props,
+            className: verticalNavigationStyles().item({
+                className
+            }),
+            "data-part": "item",
+            "data-scope": "vertical-navigation"
+        })
+    });
+};
+VerticalNavigation.Row = function({ className, ...props }) {
+    useVerticalNavigationContext();
+    const branch = useContext(VerticalNavigationBranchContext);
+    return /*#__PURE__*/ jsx("div", {
+        ...props,
+        className: verticalNavigationStyles().row({
+            className
+        }),
+        "data-current-path": branch?.containsCurrent || void 0,
+        "data-part": "row",
+        "data-scope": "vertical-navigation"
+    });
+};
+VerticalNavigation.Link = function({ current = false, className, ...props }) {
+    const { size } = useVerticalNavigationContext();
+    const branch = useContext(VerticalNavigationBranchContext);
+    return /*#__PURE__*/ jsx(LinkButton, {
+        ...props,
+        "aria-current": current ? "page" : void 0,
+        className: verticalNavigationStyles({
+            size
+        }).link({
+            className
+        }),
+        "data-current": current || void 0,
+        "data-current-path": branch?.containsCurrent || void 0,
+        "data-part": "link",
+        "data-scope": "vertical-navigation",
+        size: "current",
+        theme: "unstyled"
+    });
+};
+VerticalNavigation.Branch = function({ id, open, defaultOpen, onOpenChange, disabled, getRootNode, containsCurrent = false, children, className, ...props }) {
+    const { dir } = useVerticalNavigationContext();
+    const generatedId = useId();
+    const service = useMachine(__rspack_external__zag_js_collapsible_508ff486.machine, {
+        id: id ?? generatedId,
+        dir,
+        open,
+        defaultOpen,
+        onOpenChange,
+        disabled,
+        getRootNode
+    });
+    const api = __rspack_external__zag_js_collapsible_508ff486.connect(service, normalizeProps);
+    return /*#__PURE__*/ jsx(VerticalNavigationBranchContext.Provider, {
+        value: {
+            api,
+            containsCurrent
+        },
+        children: /*#__PURE__*/ jsx("li", {
+            ...mergeProps(props, api.getRootProps()),
+            className: verticalNavigationStyles().item({
+                className
+            }),
+            "data-current-path": containsCurrent || void 0,
+            "data-part": "branch",
+            "data-scope": "vertical-navigation",
+            children: children
+        })
+    });
+};
+VerticalNavigation.BranchTrigger = function({ className, disabled, ...props }) {
+    const { size } = useVerticalNavigationContext();
+    const { api } = useVerticalNavigationBranchContext();
+    return /*#__PURE__*/ jsx(Button, {
+        ...mergeProps(props, api.getTriggerProps()),
+        className: verticalNavigationStyles({
+            size
+        }).trigger({
+            className
+        }),
+        "data-part": "branch-trigger",
+        "data-scope": "vertical-navigation",
+        disabled: disabled || api.disabled,
+        size: "current",
+        theme: "unstyled"
+    });
+};
+VerticalNavigation.BranchIndicator = function({ className, ...props }) {
+    const { size } = useVerticalNavigationContext();
+    const { api } = useVerticalNavigationBranchContext();
+    return /*#__PURE__*/ jsx("span", {
+        ...mergeProps(props, api.getIndicatorProps()),
+        "aria-hidden": "true",
+        className: verticalNavigationStyles({
+            size
+        }).indicator({
+            className
+        }),
+        "data-part": "branch-indicator",
+        "data-scope": "vertical-navigation",
+        children: /*#__PURE__*/ jsx(Icon, {
+            icon: "token-icon-vertical-navigation-chevron",
+            size: "current"
+        })
+    });
+};
+VerticalNavigation.BranchContent = function({ tone = "plain", variant = "primary", indent = true, showGuide = false, className, ...props }) {
+    const { maxIndentDepth } = useVerticalNavigationContext();
+    const { api } = useVerticalNavigationBranchContext();
+    const depth = useContext(VerticalNavigationDepthContext);
+    return /*#__PURE__*/ jsx("div", {
+        ...mergeProps(props, api.getContentProps()),
+        className: verticalNavigationStyles({
+            tone,
+            variant
+        }).content({
+            className
+        }),
+        "data-guide": showGuide || void 0,
+        "data-indented": indent && depth <= maxIndentDepth || void 0,
+        "data-part": "branch-content",
+        "data-scope": "vertical-navigation",
+        "data-tone": tone,
+        "data-variant": variant
+    });
+};
+VerticalNavigation.Group = function({ tone = "plain", variant = "primary", className, ...props }) {
+    useVerticalNavigationContext();
+    return /*#__PURE__*/ jsx("div", {
+        ...props,
+        className: verticalNavigationStyles({
+            tone,
+            variant
+        }).group({
+            className
+        }),
+        "data-part": "group",
+        "data-scope": "vertical-navigation",
+        "data-tone": tone,
+        "data-variant": variant
+    });
+};
+VerticalNavigation.GroupLabel = function({ className, ...props }) {
+    const { size } = useVerticalNavigationContext();
+    return /*#__PURE__*/ jsx("h2", {
+        ...props,
+        className: verticalNavigationStyles({
+            size
+        }).groupLabel({
+            className
+        }),
+        "data-part": "group-label",
+        "data-scope": "vertical-navigation"
+    });
+};
+VerticalNavigation.Separator = function({ className, ...props }) {
+    useVerticalNavigationContext();
+    return /*#__PURE__*/ jsx("hr", {
+        ...props,
+        className: verticalNavigationStyles().separator({
+            className
+        }),
+        "data-part": "separator",
+        "data-scope": "vertical-navigation"
+    });
+};
+export { VerticalNavigation };

package/dist/organisms/data-table.js

@@ -21,20 +21,20 @@ import { Table } from "./table.js";
 const dataTableVariants = tv({
     slots: {
         wrapper: [
-            "flex w-full flex-col overflow-hidden rounded-table",
-            "border-(length:--border-table-width) border-table-border"
+            "flex w-full flex-col overflow-hidden rounded-data-table",
+            "border-(length:--border-width-data-table) border-data-table-border"
         ],
         toolbar: [
-            "flex items-center justify-between gap-200",
-            "bg-table-header-bg text-table-header-fg",
-            "px-300 py-200",
-            "border-b-(length:--border-table-width) border-table-border"
+            "flex items-center justify-between gap-data-table-toolbar",
+            "bg-data-table-toolbar-bg text-data-table-toolbar-fg",
+            "p-data-table-toolbar",
+            "border-b-(length:--border-width-data-table) border-data-table-border"
         ],
         toolbarSearch: [
             "min-w-0 flex-1"
         ],
         toolbarActions: [
-            "flex shrink-0 items-center gap-200"
+            "flex shrink-0 items-center gap-data-table-toolbar"
         ],
         scroll: [
             "relative w-full overflow-auto"
@@ -48,68 +48,68 @@ const dataTableVariants = tv({
             "data-[disabled=true]:cursor-default"
         ],
         sortIcon: [
-            "text-fg-secondary",
-            "data-[active=true]:text-fg-accent-primary"
+            "text-data-table-sort-icon-fg",
+            "data-[active=true]:text-data-table-sort-icon-fg-active"
         ],
         dragHandle: [
-            "inline-flex cursor-grab items-center rounded-table text-fg-secondary",
+            "inline-flex cursor-grab items-center rounded-data-table text-data-table-drag-handle-fg",
             "opacity-0 transition-opacity duration-200 motion-reduce:transition-none",
-            "hover:bg-table-row-bg-hover hover:opacity-100 focus-visible:opacity-100",
+            "hover:bg-data-table-row-bg-hover hover:opacity-100 focus-visible:opacity-100",
             "group-hover/header:opacity-100 group-hover/row:opacity-100",
             "group-focus-within/header:opacity-100 group-focus-within/row:opacity-100",
             "group-data-dragging/header:opacity-100 group-data-dragging/row:opacity-100",
             "active:cursor-grabbing"
         ],
         resizeHandle: [
-            "absolute end-0 top-0 h-full w-100 cursor-col-resize touch-none select-none",
+            "w-(length:--size-data-table-resize-handle) absolute end-0 top-0 h-full cursor-col-resize touch-none select-none",
             "opacity-0 transition-opacity duration-200 motion-reduce:transition-none",
-            "bg-table-border hover:opacity-100 focus-visible:opacity-100",
+            "bg-data-table-resize-handle-bg hover:opacity-100 focus-visible:opacity-100",
             "group-hover/header:opacity-100"
         ],
         filterRow: [
-            "bg-table-header-bg"
+            "bg-data-table-filter-row-bg"
         ],
         filterCell: [
-            "px-200 py-100",
+            "p-data-table-filter-cell",
             "min-w-fit",
-            "border-b-(length:--border-table-width) border-table-border"
+            "border-b-(length:--border-width-data-table) border-data-table-border"
         ],
         filterControl: [
-            "flex flex-wrap items-center gap-100"
+            "flex flex-wrap items-center gap-data-table-filter-control"
         ],
         editorControl: [
-            "flex flex-col gap-50"
+            "flex flex-col gap-data-table-editor"
         ],
         editorError: [
-            "text-danger-fg text-table-sm"
+            "text-data-table-editor-error-fg text-data-table-sm"
         ],
         actionsCell: [
             "flex items-center justify-end gap-100"
         ],
         empty: [
             "flex flex-col items-center justify-center gap-200",
-            "p-700 text-center text-fg-secondary"
+            "p-data-table-empty text-center text-data-table-empty-fg"
         ],
         paginationBar: [
-            "flex flex-wrap items-center justify-between gap-300",
-            "bg-table-header-bg text-table-header-fg",
-            "px-300 py-200",
-            "border-t-(length:--border-table-width) border-table-border"
+            "flex flex-wrap items-center justify-between gap-data-table-pagination",
+            "bg-data-table-pagination-bg text-data-table-pagination-fg",
+            "p-data-table-pagination",
+            "border-t-(length:--border-width-data-table) border-data-table-border"
         ],
         detailBox: [
-            "w-full p-300"
+            "w-full p-data-table-detail"
         ],
         paginationInfo: [
-            "whitespace-nowrap text-table-sm"
+            "whitespace-nowrap text-data-table-sm"
         ],
         paginationControls: [
-            "flex items-center gap-300"
+            "flex items-center gap-data-table-pagination"
         ]
     },
     variants: {
         outlined: {
             true: {
-                wrapper: "shadow-table-outline"
+                wrapper: "shadow-data-table-outline"
             }
         }
     }
@@ -245,9 +245,9 @@ const BUILTIN_COLUMN_IDS = new Set([
 function pinClass(column, kind) {
     if (!column.getIsPinned()) return;
     return [
-        "header" === kind ? "bg-table-header-bg" : "data-table-frozen-cell",
-        isLastStartPinned(column) ? "border-e-(length:--border-table-width) border-table-border" : "",
-        isFirstEndPinned(column) ? "border-s-(length:--border-table-width) border-table-border" : ""
+        "header" === kind ? "bg-data-table-header-bg" : "data-table-frozen-cell",
+        isLastStartPinned(column) ? "border-e-(length:--border-width-data-table) border-data-table-border" : "",
+        isFirstEndPinned(column) ? "border-s-(length:--border-width-data-table) border-data-table-border" : ""
     ].join(" ");
 }
 function HeaderDragHandle({ styles, setActivatorNodeRef, listeners, attributes, label }) {
@@ -392,21 +392,26 @@ function rowDragClass(dnd, opts) {
     return [
         "group/row",
         "focus-visible:outline-(style:--default-ring-style) focus-visible:outline-(length:--default-ring-width) focus-visible:outline-primary",
-        "data-[selected=true]:[--dt-row-tint:var(--color-table-row-bg-selected)]",
-        "group-hover/row:[--dt-row-tint:var(--color-table-row-bg-hover)]",
-        "hover:[--dt-row-tint:var(--color-table-row-bg-hover)]",
-        striped ? `${(rowIndex ?? 0) % 2 === 0 ? "bg-table-row-striped-primary [--dt-row-tint:var(--color-table-row-striped-primary)]" : "bg-table-row-striped-secondary [--dt-row-tint:var(--color-table-row-striped-secondary)]"} border-b-0` : "",
+        "data-[selected=true]:[--dt-row-tint:var(--color-data-table-row-bg-selected)]",
+        "group-hover/row:[--dt-row-tint:var(--color-data-table-row-bg-hover)]",
+        "hover:[--dt-row-tint:var(--color-data-table-row-bg-hover)]",
+        striped ? `${(rowIndex ?? 0) % 2 === 0 ? "bg-data-table-row-bg-striped-primary [--dt-row-tint:var(--color-data-table-row-bg-striped-primary)]" : "bg-data-table-row-bg-striped-secondary [--dt-row-tint:var(--color-data-table-row-bg-striped-secondary)]"} border-b-0` : "",
         tintNestedRows ? "data-[depth]:data-table-row-nested-tint" : "",
-        dnd?.isDragging ? "shadow-table-outline" : "",
+        dnd?.isDragging ? "shadow-data-table-outline" : "",
         dnd?.dropSide === "top" ? "border-primary border-t-2" : "",
         dnd?.dropSide === "bottom" ? "border-primary border-b-2" : "",
         className ?? ""
     ].filter(Boolean).join(" ");
 }
-const OPAQUE_HEADER_BG = {
-    backgroundColor: "var(--color-table-bg)",
-    backgroundImage: "linear-gradient(var(--color-table-header-bg), var(--color-table-header-bg))"
-};
+function opaqueSurface(tint) {
+    return {
+        backgroundColor: "var(--color-data-table-bg)",
+        backgroundImage: `linear-gradient(var(${tint}), var(${tint}))`
+    };
+}
+const OPAQUE_HEADER_BG = opaqueSurface("--color-data-table-header-bg");
+const OPAQUE_FILTER_ROW_BG = opaqueSurface("--color-data-table-filter-row-bg");
+const OPAQUE_PAGINATION_BG = opaqueSurface("--color-data-table-pagination-bg");
 function sortState(column, enableSorting) {
     if (!(enableSorting && column.getCanSort())) return;
     const sorted = column.getIsSorted();
@@ -1094,7 +1099,7 @@ function DataTable(props) {
                             className: `${styles.filterCell()} ${pinClass(column, "header") ?? ""}`,
                             "data-pinned": column.getIsPinned() || void 0,
                             style: {
-                                ...OPAQUE_HEADER_BG,
+                                ...OPAQUE_FILTER_ROW_BG,
                                 ...getPinningStyles(column, "header"),
                                 ...stickyHeader ? {
                                     position: "sticky",
@@ -1111,9 +1116,9 @@ function DataTable(props) {
                             })
                         }, column.id)),
                     hasActionsColumn && /*#__PURE__*/ jsx("td", {
-                        className: stickyActions ? `${styles.filterCell()} sticky end-0 bg-table-header-bg` : styles.filterCell(),
+                        className: stickyActions ? `${styles.filterCell()} sticky end-0 bg-data-table-filter-row-bg` : styles.filterCell(),
                         style: {
-                            ...OPAQUE_HEADER_BG,
+                            ...OPAQUE_FILTER_ROW_BG,
                             ...stickyHeader ? {
                                 position: "sticky",
                                 top: headerHeight
@@ -1368,7 +1373,7 @@ function DataTable(props) {
                         children: translations.emptyTitle
                     }),
                     /*#__PURE__*/ jsx("p", {
-                        className: "text-table-sm",
+                        className: "text-data-table-sm",
                         children: translations.emptyDescription
                     })
                 ]
@@ -1424,7 +1429,7 @@ function DataTable(props) {
                             children: header.isPlaceholder ? null : flexRender(header.column.columnDef.footer, header.getContext())
                         }, header.id)),
                     hasActionsColumn && /*#__PURE__*/ jsx(Table.Cell, {
-                        className: stickyActions ? "sticky end-0 bg-table-footer-bg" : void 0,
+                        className: stickyActions ? "sticky end-0 bg-data-table-footer-bg" : void 0,
                         numeric: true,
                         style: stickyActions ? {
                             zIndex: DATA_TABLE_Z.stickyActionsCell
@@ -1686,7 +1691,7 @@ DataTable.Pagination = function() {
         }));
     return /*#__PURE__*/ jsxs("div", {
         className: styles.paginationBar(),
-        style: OPAQUE_HEADER_BG,
+        style: OPAQUE_PAGINATION_BG,
         children: [
             /*#__PURE__*/ jsx("span", {
                 className: styles.paginationInfo(),

package/dist/src/internal/molecules/vertical-navigation.context.d.ts

@@ -0,0 +1,25 @@
+import type { Api } from "@zag-js/collapsible";
+import type { PropTypes } from "@zag-js/react";
+export type VerticalNavigationSize = "sm" | "md";
+export type VerticalNavigationTone = "plain" | "subtle" | "accent";
+export type VerticalNavigationVariant = "primary" | "secondary";
+export declare const VerticalNavigationContext: import("react").Context<{
+    size: VerticalNavigationSize;
+    maxIndentDepth: number;
+    dir?: "ltr" | "rtl";
+} | null>;
+export declare const VerticalNavigationDepthContext: import("react").Context<number>;
+export declare const VerticalNavigationBranchContext: import("react").Context<{
+    api: Api<PropTypes>;
+    containsCurrent: boolean;
+} | null>;
+export declare function useVerticalNavigationContext(): {
+    size: VerticalNavigationSize;
+    maxIndentDepth: number;
+    dir?: "ltr" | "rtl";
+};
+export declare function useVerticalNavigationBranchContext(): {
+    api: Api<PropTypes>;
+    containsCurrent: boolean;
+};
+//# sourceMappingURL=vertical-navigation.context.d.ts.map

package/dist/src/internal/molecules/vertical-navigation.context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"vertical-navigation.context.d.ts","sourceRoot":"","sources":["../../../../src/internal/molecules/vertical-navigation.context.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAA;AAC9C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AAG9C,MAAM,MAAM,sBAAsB,GAAG,IAAI,GAAG,IAAI,CAAA;AAChD,MAAM,MAAM,sBAAsB,GAAG,OAAO,GAAG,QAAQ,GAAG,QAAQ,CAAA;AAClE,MAAM,MAAM,yBAAyB,GAAG,SAAS,GAAG,WAAW,CAAA;AAE/D,eAAO,MAAM,yBAAyB;UAC9B,sBAAsB;oBACZ,MAAM;UAChB,KAAK,GAAG,KAAK;SACN,CAAA;AACf,eAAO,MAAM,8BAA8B,iCAAmB,CAAA;AAC9D,eAAO,MAAM,+BAA+B;SACrC,GAAG,CAAC,SAAS,CAAC;qBACF,OAAO;SACX,CAAA;AAEf,wBAAgB,4BAA4B;UAVpC,sBAAsB;oBACZ,MAAM;UAChB,KAAK,GAAG,KAAK;EAgBpB;AAED,wBAAgB,kCAAkC;SAd3C,GAAG,CAAC,SAAS,CAAC;qBACF,OAAO;EAqBzB"}