@knkcs/anker 1.8.0 → 1.9.0

package/dist/components/index.js

@@ -4,9 +4,10 @@ import { MenuItem, MenuRoot, MenuTrigger, MenuContent, Tooltip, Table } from '..
 import { Popover, PopoverTrigger, PopoverContent, PopoverBody, Switch } from '../chunk-WQIEF5N3.js';
 import { text_input_default } from '../chunk-OU6H3KU4.js';
 import { Button, IconButton } from '../chunk-JS7ZEZV3.js';
+export { AuthCard, PageHeader } from '../chunk-D5ICTOCW.js';
 import { Box, Flex, Text, Heading, HStack, Grid, GridItem, Code, Link, VStack, Spacer, Stack } from '../chunk-G4QMIXLC.js';
+import { PanelRightOpen, PanelRightClose, ChevronRight, Search, PanelLeftOpen, PanelLeftClose, X, Ellipsis, Plus, ChevronLeft, ArrowUp, ArrowDown, ArrowUpDown, ChevronDown, Check, Upload } from 'lucide-react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { PanelRightOpen, PanelRightClose, ChevronRight, PanelLeftOpen, PanelLeftClose, Search, X, Ellipsis, Plus, ChevronLeft, ArrowUp, ArrowDown, ArrowUpDown, ChevronDown, Check, Upload } from 'lucide-react';
 import { createContext, Timeline, TreeView, Card as Card$1, Menu, Portal, Checkbox, Drawer, ButtonGroup, Dialog, useSlotRecipe, chakra } from '@chakra-ui/react';
 export { createTreeCollection } from '@chakra-ui/react';
 import React3, { createContext as createContext$1, useState, useEffect, useMemo, Children, useRef, useCallback, useContext } from 'react';
@@ -14,106 +15,6 @@ import dayjs from 'dayjs';
 import { Link as Link$1 } from 'react-router-dom';
 import { useReactTable, getSortedRowModel, getCoreRowModel, flexRender } from '@tanstack/react-table';
 
-var SIZE_TO_WIDTH = {
-  md: "440px",
-  lg: "480px"
-};
-var DOT_PATTERN_BG = "radial-gradient(var(--chakra-colors-primary-200) 1px, transparent 1px)";
-var AuthCard = ({
-  logo,
-  topBarRight,
-  hideTopBar = false,
-  hideBackground = false,
-  eyebrow,
-  title,
-  subtitle,
-  size = "md",
-  footer,
-  children
-}) => {
-  return /* @__PURE__ */ jsx(Box, { "data-testid": "auth-card", "data-size": size, minH: "100vh", bg: "bg-canvas", children: /* @__PURE__ */ jsxs(
-    Box,
-    {
-      "data-testid": "auth-card-canvas",
-      "data-background": hideBackground ? "hidden" : "visible",
-      minH: "100vh",
-      bgImage: hideBackground ? void 0 : DOT_PATTERN_BG,
-      bgSize: "24px 24px",
-      children: [
-        !hideTopBar && /* @__PURE__ */ jsxs(
-          Flex,
-          {
-            align: "center",
-            justify: "space-between",
-            px: "8",
-            py: "4",
-            bg: "bg-surface/85",
-            backdropFilter: "blur(4px)",
-            borderBottom: "1px solid",
-            borderColor: "border",
-            children: [
-              /* @__PURE__ */ jsx(Box, { children: logo }),
-              /* @__PURE__ */ jsx(Flex, { gap: "4", fontSize: "xs", color: "muted", children: topBarRight })
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsx(Flex, { justify: "center", pt: "16", px: "4", children: /* @__PURE__ */ jsxs(
-          Box,
-          {
-            w: "full",
-            maxW: SIZE_TO_WIDTH[size],
-            bg: "bg-surface",
-            borderRadius: "lg",
-            shadow: "md",
-            p: "8",
-            children: [
-              eyebrow && /* @__PURE__ */ jsx(
-                Text,
-                {
-                  textStyle: "overline",
-                  color: "muted",
-                  textAlign: "center",
-                  mb: "2",
-                  children: eyebrow
-                }
-              ),
-              title && /* @__PURE__ */ jsx(
-                Heading,
-                {
-                  as: "h3",
-                  size: "2xl",
-                  fontWeight: "semibold",
-                  color: "default",
-                  textAlign: "center",
-                  mb: "2",
-                  letterSpacing: "-0.02em",
-                  children: title
-                }
-              ),
-              subtitle && /* @__PURE__ */ jsx(Text, { color: "muted", textAlign: "center", fontSize: "sm", mb: "6", children: subtitle }),
-              children,
-              footer && /* @__PURE__ */ jsx(
-                Box,
-                {
-                  "data-testid": "auth-card-footer",
-                  mt: "6",
-                  pt: "4",
-                  borderTop: "1px solid",
-                  borderColor: "border",
-                  textAlign: "center",
-                  fontSize: "xs",
-                  color: "emphasized",
-                  children: footer
-                }
-              )
-            ]
-          }
-        ) })
-      ]
-    }
-  ) });
-};
-AuthCard.displayName = "AuthCard";
 var BulkAction = ({
   label,
   icon,
@@ -1614,105 +1515,6 @@ var Modal = ({
   );
 };
 Modal.displayName = "Modal";
-var PageHeader = ({
-  breadcrumbs,
-  title,
-  subtitle,
-  actions,
-  eyebrow
-}) => {
-  const hasCrumbs = !!breadcrumbs && breadcrumbs.length > 0;
-  const hasActions = !!actions;
-  return /* @__PURE__ */ jsxs(
-    Box,
-    {
-      py: "4",
-      px: "8",
-      borderBottomWidth: "1px",
-      borderBottomColor: "border",
-      bg: "bg-surface",
-      children: [
-        eyebrow && /* @__PURE__ */ jsx(
-          Text,
-          {
-            fontSize: "2xs",
-            fontWeight: "semibold",
-            letterSpacing: "wider",
-            textTransform: "uppercase",
-            color: "muted",
-            mb: "1",
-            children: eyebrow
-          }
-        ),
-        hasCrumbs && /* @__PURE__ */ jsx(
-          Flex,
-          {
-            "data-testid": "page-header-breadcrumbs",
-            align: "center",
-            gap: "1",
-            mb: "1",
-            fontSize: "xs",
-            color: "muted",
-            children: breadcrumbs.map((c, idx) => {
-              const isLast = idx === breadcrumbs.length - 1;
-              const sep = !isLast ? /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: " \u203A " }) : null;
-              const node = c.to ? /* @__PURE__ */ jsx(
-                Link,
-                {
-                  href: c.to,
-                  color: "muted",
-                  _hover: { color: "default" },
-                  children: c.label
-                },
-                `crumb-link-${c.label}`
-              ) : /* @__PURE__ */ jsx(
-                Text,
-                {
-                  as: "span",
-                  color: isLast ? "default" : "muted",
-                  fontWeight: isLast ? "medium" : "normal",
-                  children: c.label
-                },
-                `crumb-text-${c.label}`
-              );
-              return /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "1", children: [
-                node,
-                sep
-              ] }, `crumb-wrap-${c.label}`);
-            })
-          }
-        ),
-        /* @__PURE__ */ jsxs(Flex, { align: "center", justify: "space-between", gap: "4", children: [
-          /* @__PURE__ */ jsxs(Box, { flex: "1", minW: "0", children: [
-            /* @__PURE__ */ jsx(
-              Heading,
-              {
-                as: "h1",
-                fontSize: "2xl",
-                fontWeight: "semibold",
-                color: "default",
-                letterSpacing: "-0.02em",
-                children: title
-              }
-            ),
-            subtitle && /* @__PURE__ */ jsx(
-              Text,
-              {
-                "data-testid": "page-header-subtitle",
-                fontSize: "sm",
-                color: "muted",
-                mt: "1",
-                children: subtitle
-              }
-            )
-          ] }),
-          hasActions && /* @__PURE__ */ jsx(Flex, { align: "center", gap: "2", flexShrink: 0, children: actions })
-        ] })
-      ]
-    }
-  );
-};
-PageHeader.displayName = "PageHeader";
 var SelectableCardThumbnail = ({
   height = "160px",
   children
@@ -1839,7 +1641,7 @@ var SidebarRoot = ({
     }),
     [collapsed]
   );
-  return /* @__PURE__ */ jsx(SidebarContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(SidebarContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx(
     Flex,
     {
       "data-testid": "sidebar",
@@ -1853,20 +1655,7 @@ var SidebarRoot = ({
       transition: "width 250ms ease-out",
       overflow: "hidden",
       position: "relative",
-      children: [
-        /* @__PURE__ */ jsx(Flex, { justify: "flex-end", px: "2", pt: "2", children: /* @__PURE__ */ jsx(
-          IconButton,
-          {
-            "data-testid": "sidebar-toggle",
-            "aria-label": collapsed ? "Expand sidebar" : "Collapse sidebar",
-            variant: "ghost",
-            size: "sm",
-            onClick: () => setCollapsed((c) => !c),
-            children: collapsed ? /* @__PURE__ */ jsx(PanelLeftOpen, { size: 16 }) : /* @__PURE__ */ jsx(PanelLeftClose, { size: 16 })
-          }
-        ) }),
-        children
-      ]
+      children
     }
   ) });
 };
@@ -1878,45 +1667,72 @@ SidebarBody.displayName = "Sidebar.Body";
 var SidebarFooter = ({ children }) => /* @__PURE__ */ jsx(Box, { p: "3", borderTopWidth: "1px", borderTopColor: "border", children });
 SidebarFooter.displayName = "Sidebar.Footer";
 var SidebarLogo = ({ wordmark, subtitle }) => {
-  const { collapsed } = useSidebarContext();
+  const { collapsed, toggle } = useSidebarContext();
+  const toggleButton = /* @__PURE__ */ jsx(
+    IconButton,
+    {
+      "data-testid": "sidebar-toggle",
+      "aria-label": collapsed ? "Expand sidebar" : "Collapse sidebar",
+      variant: "ghost",
+      size: "sm",
+      onClick: toggle,
+      children: collapsed ? /* @__PURE__ */ jsx(PanelLeftOpen, { size: 16 }) : /* @__PURE__ */ jsx(PanelLeftClose, { size: 16 })
+    }
+  );
   if (collapsed) {
-    return /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(
-      Heading,
-      {
-        as: "span",
-        fontSize: "lg",
-        fontWeight: "bold",
-        color: "primary.700",
-        letterSpacing: "tight",
-        children: wordmark.charAt(0)
-      }
-    ) });
+    return /* @__PURE__ */ jsxs(Flex, { direction: "column", align: "center", gap: "2", children: [
+      /* @__PURE__ */ jsx(
+        Heading,
+        {
+          as: "span",
+          fontSize: "lg",
+          fontWeight: "bold",
+          color: "primary.700",
+          letterSpacing: "tight",
+          children: wordmark.charAt(0)
+        }
+      ),
+      toggleButton
+    ] });
   }
-  return /* @__PURE__ */ jsxs(Box, { mb: subtitle ? "3" : "0", children: [
-    /* @__PURE__ */ jsx(
-      Heading,
-      {
-        as: "span",
-        fontSize: "lg",
-        fontWeight: "bold",
-        color: "primary.700",
-        letterSpacing: "tight",
-        children: wordmark
-      }
-    ),
-    subtitle && /* @__PURE__ */ jsx(
-      Text,
-      {
-        fontSize: "2xs",
-        fontWeight: "semibold",
-        letterSpacing: "wider",
-        textTransform: "uppercase",
-        color: "muted",
-        mt: "0.5",
-        children: subtitle
-      }
-    )
-  ] });
+  return /* @__PURE__ */ jsxs(
+    Flex,
+    {
+      direction: "row",
+      align: "center",
+      justify: "space-between",
+      gap: "2",
+      w: "full",
+      children: [
+        /* @__PURE__ */ jsxs(Box, { mb: subtitle ? "0" : "0", children: [
+          /* @__PURE__ */ jsx(
+            Heading,
+            {
+              as: "span",
+              fontSize: "lg",
+              fontWeight: "bold",
+              color: "primary.700",
+              letterSpacing: "tight",
+              children: wordmark
+            }
+          ),
+          subtitle && /* @__PURE__ */ jsx(
+            Text,
+            {
+              fontSize: "2xs",
+              fontWeight: "semibold",
+              letterSpacing: "wider",
+              textTransform: "uppercase",
+              color: "muted",
+              mt: "0.5",
+              children: subtitle
+            }
+          )
+        ] }),
+        toggleButton
+      ]
+    }
+  );
 };
 SidebarLogo.displayName = "Sidebar.Logo";
 var SidebarSlot = ({ children }) => /* @__PURE__ */ jsx(Box, { mt: "3", children });
@@ -2736,6 +2552,6 @@ var Widget = ({
 };
 Widget.displayName = "Widget";
 
-export { ActionCell, AuthCard, BooleanCell, BulkActionBar, Card, CardList, CardListData, CardListItem, ChipPicker, CodeCell, ColorSwatchCell, ContextRail, CountCell, DataTable, DateCell, DrawerRoot, FactBox, InlineCreatableList, LabeledSwitch, LinkCell, MenuCell, Modal, NumberCell, PageHeader, Pagination, SelectableCard, Sidebar, SidebarSection2 as SidebarSection, SlugCell, StatusBadgeCell, Stepper, StepperCompleted, StepperContainer, StepperContent, StepperIcon, StepperProvider, StepperSeparator, StepperStep, StepperStepTitle, StepperSteps, SwitchCell, CardList as Table, CardListData as TableData, CardListItem as TableItem, TimelineConnector, TimelineContent, TimelineDescription, TimelineIndicator, TimelineItem, TimelineRoot, TimelineSeparator, TimelineTitle, Toolbar, TreeViewBranch, TreeViewBranchContent, TreeViewBranchControl, TreeViewBranchIndicator, TreeViewBranchText, TreeViewBranchTrigger, TreeViewItem, TreeViewItemIndicator, TreeViewItemText, TreeViewLabel, TreeViewNode, TreeViewRoot, TreeViewTree, TruncatedTextCell, UploadDropZone, UrlCell, Widget, emptyCellValue, pluralize, truncateText, useSidebarContext, useStep, useStepper, useStepperContext, useStepperNextButton, useStepperPrevButton };
+export { ActionCell, BooleanCell, BulkActionBar, Card, CardList, CardListData, CardListItem, ChipPicker, CodeCell, ColorSwatchCell, ContextRail, CountCell, DataTable, DateCell, DrawerRoot, FactBox, InlineCreatableList, LabeledSwitch, LinkCell, MenuCell, Modal, NumberCell, Pagination, SelectableCard, Sidebar, SidebarSection2 as SidebarSection, SlugCell, StatusBadgeCell, Stepper, StepperCompleted, StepperContainer, StepperContent, StepperIcon, StepperProvider, StepperSeparator, StepperStep, StepperStepTitle, StepperSteps, SwitchCell, CardList as Table, CardListData as TableData, CardListItem as TableItem, TimelineConnector, TimelineContent, TimelineDescription, TimelineIndicator, TimelineItem, TimelineRoot, TimelineSeparator, TimelineTitle, Toolbar, TreeViewBranch, TreeViewBranchContent, TreeViewBranchControl, TreeViewBranchIndicator, TreeViewBranchText, TreeViewBranchTrigger, TreeViewItem, TreeViewItemIndicator, TreeViewItemText, TreeViewLabel, TreeViewNode, TreeViewRoot, TreeViewTree, TruncatedTextCell, UploadDropZone, UrlCell, Widget, emptyCellValue, pluralize, truncateText, useSidebarContext, useStep, useStepper, useStepperContext, useStepperNextButton, useStepperPrevButton };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map