@knkcs/anker 1.11.1 → 1.13.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CLAUDE-ANKER.md +4 -0
- package/dist/chunk-ZLQ3RBAF.js +3 -0
- package/dist/chunk-ZLQ3RBAF.js.map +1 -0
- package/dist/components/index.d.ts +22 -2
- package/dist/components/index.js +48 -1
- package/dist/components/index.js.map +1 -1
- package/dist/primitives/index.js +2 -1
- package/dist/primitives/index.js.map +1 -1
- package/dist/templates/index.d.ts +51 -29
- package/dist/templates/index.js +89 -8
- package/dist/templates/index.js.map +1 -1
- package/package.json +1 -1
package/CLAUDE-ANKER.md
CHANGED
|
@@ -62,6 +62,10 @@ The full human-facing spec lives at the anker GitHub Pages docs site (linked fro
|
|
|
62
62
|
- **No animations over 300ms.** Outside marketing/onboarding. Why: long animations slow down power users; the design language values immediacy.
|
|
63
63
|
- **No Chakra v2 patterns.** No `extendTheme`, `colorScheme`, `useColorMode` from `@chakra-ui/react`. Use `createSystem`, `colorPalette`, `next-themes`. Why: anker is built on Chakra v3 throughout; v2 patterns either error at build time or silently no-op.
|
|
64
64
|
- **No new color introductions.** If a color isn't in `colors.ts`, it doesn't exist. Why: the palette is closed by design — adding ad-hoc colors fragments the system.
|
|
65
|
+
- **No `maxW` on a Card inside a settings/detail template body.** The template controls width; per-card overrides break visual rhythm and produce orphaned narrow cards on full-width pages. Why: the template is the contract for body width — cards are the contract for content surfacing.
|
|
66
|
+
- **No inline create-forms above a DataTable.** Use a header-action button (or `usePageActions` from a tab) that opens a `Modal`. Why: inline forms steal vertical space, drift from the master pattern, and split form state from the rest of the page.
|
|
67
|
+
- **Don't own `<Tabs.Root>` for an owned-panels tab page.** Use `SettingsPageTemplate.bodyTabs` or `DetailPageTemplate.bodyTabs`. Why: the template enforces `lazyMount unmountOnExit` so `usePageActions` registrations from inactive tabs can't collide with the active tab's. Consumer-owned `<Tabs.Root>` was the cause of the "stuck Add button" bug fixed in anker 1.12. The `tabs` prop on those templates is for nav-mode/filter-mode strips only (Tabs.List, no Tabs.Content).
|
|
68
|
+
- **Don't wrap Card children in `<Box p="N">`.** `<Card>` body has built-in padding via Chakra's CardBody (~24px). Wrapping in `<Box p>` doubles it. Pass content directly (use `<Stack>` for layout). Why: a uniform Card body padding is the visual contract; per-Card overrides break visual rhythm and make Cards look heavier than the rest of the design system.
|
|
65
69
|
|
|
66
70
|
---
|
|
67
71
|
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","file":"chunk-ZLQ3RBAF.js","sourcesContent":[]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export { A as AuthCard, a as AuthCardProps, P as PageHeader, b as PageHeaderBreadcrumb, c as PageHeaderProps } from '../page-header-D-kxNn-f.js';
|
|
2
2
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
3
3
|
import * as React$1 from 'react';
|
|
4
|
-
import React__default, { MouseEventHandler } from 'react';
|
|
4
|
+
import React__default, { ReactNode, MouseEventHandler } from 'react';
|
|
5
5
|
import { CardRootProps, TextProps, IconButtonProps, DrawerRootProps, DialogRootProps, HTMLChakraProps, Timeline, TreeView } from '@chakra-ui/react';
|
|
6
6
|
export { TreeCollection, createTreeCollection } from '@chakra-ui/react';
|
|
7
7
|
import { ColumnDef, RowSelectionState, OnChangeFn, SortingState, Row } from '@tanstack/react-table';
|
|
@@ -425,6 +425,26 @@ declare const DataTable: typeof DataTableInner & {
|
|
|
425
425
|
displayName: string;
|
|
426
426
|
};
|
|
427
427
|
|
|
428
|
+
interface DescriptionListProps {
|
|
429
|
+
orientation?: "horizontal" | "vertical";
|
|
430
|
+
gap?: string;
|
|
431
|
+
children: ReactNode;
|
|
432
|
+
}
|
|
433
|
+
declare function DescriptionList({ orientation, gap, children, }: DescriptionListProps): react_jsx_runtime.JSX.Element;
|
|
434
|
+
declare namespace DescriptionList {
|
|
435
|
+
var displayName: string;
|
|
436
|
+
var Row: typeof DescriptionListRow;
|
|
437
|
+
}
|
|
438
|
+
interface DescriptionListRowProps {
|
|
439
|
+
label: ReactNode;
|
|
440
|
+
mono?: boolean;
|
|
441
|
+
children: ReactNode;
|
|
442
|
+
}
|
|
443
|
+
declare function DescriptionListRow({ label, mono, children, }: DescriptionListRowProps): react_jsx_runtime.JSX.Element;
|
|
444
|
+
declare namespace DescriptionListRow {
|
|
445
|
+
var displayName: string;
|
|
446
|
+
}
|
|
447
|
+
|
|
428
448
|
interface DrawerProps extends Omit<DrawerRootProps, "open" | "onOpenChange"> {
|
|
429
449
|
/** Whether the drawer is open. */
|
|
430
450
|
open: boolean;
|
|
@@ -960,4 +980,4 @@ interface WidgetProps {
|
|
|
960
980
|
}
|
|
961
981
|
declare const Widget: React__default.FC<WidgetProps>;
|
|
962
982
|
|
|
963
|
-
export { ActionCell, type ActionCellAction, type ActionCellProps, BooleanCell, type BooleanCellProps, BulkActionBar, type BulkActionBarProps, type BulkActionProps, type BulkPopoverActionProps, Card, CardList, CardListData, type CardListDataProps, CardListItem, type CardListItemProps, type CardListMenuItem, type CardListProps, type CardProps, ChipPicker, type ChipPickerProps, CodeCell, type CodeCellProps, ColorSwatchCell, type ColorSwatchCellProps, ContextRail, type ContextRailHeaderProps, type ContextRailProps, type ContextRailSectionProps, CountCell, type CountCellProps, DataTable, type DataTableProps, DateCell, type DateCellProps, DeviceCell, type DeviceCellProps, type DrawerProps, DrawerRoot, FactBox, type FactBoxAction, type FactBoxProps, IdentityCell, type IdentityCellProps, InlineCreatableList, type InlineCreatableListProps, LabeledSwitch, type LabeledSwitchProps, LinkCell, type LinkCellProps, MenuCell, type MenuCellAction, type MenuCellProps, Modal, type ModalProps, NumberCell, type NumberCellProps, Pagination, type PaginationProps, SelectableCard, type SelectableCardBodyProps, type SelectableCardFooterProps, type SelectableCardProps, type SelectableCardThumbnailProps, Sidebar, type SidebarItemProps, type SidebarLogoProps, type SidebarSectionProps$1 as SidebarNavSectionProps, type SidebarProps, SidebarSection, type SidebarSectionProps, type SidebarUserMenuItemProps, type SidebarUserMenuProps, SlugCell, type SlugCellProps, StatusBadgeCell, type StatusBadgeCellProps, Stepper, StepperCompleted, StepperContainer, StepperContent, type StepperContentProps, StepperIcon, type StepperIconProps, type StepperProps, StepperProvider, StepperSeparator, type StepperSeparatorProps, StepperStep, type StepperStepProps, StepperStepTitle, StepperSteps, type StepperStepsProps, SwitchCell, type SwitchCellProps, CardList as Table, CardListData as TableData, type CardListDataProps as TableDataProps, CardListItem as TableItem, type CardListItemProps as TableItemProps, type CardListMenuItem as TableMenuItem, type CardListProps as TableProps, TimelineConnector, TimelineContent, TimelineDescription, TimelineIndicator, TimelineItem, type TimelineItemProps, TimelineRoot, type TimelineRootProps, TimelineSeparator, TimelineTitle, Toolbar, type ToolbarFilterChipProps, type ToolbarSearchProps, TreeViewBranch, TreeViewBranchContent, TreeViewBranchControl, TreeViewBranchIndicator, type TreeViewBranchProps, TreeViewBranchText, TreeViewBranchTrigger, TreeViewItem, TreeViewItemIndicator, type TreeViewItemProps, TreeViewItemText, TreeViewLabel, TreeViewNode, TreeViewRoot, type TreeViewRootProps, TreeViewTree, TruncatedTextCell, type TruncatedTextCellProps, UploadDropZone, type UploadDropZoneProps, UrlCell, type UrlCellProps, type UseStepProps, type UseStepperProps, type UseStepperReturn, Widget, type WidgetProps, emptyCellValue, formatUserAgent, parseUserAgent, pluralize, truncateText, useSidebarContext, useStep, useStepper, useStepperContext, useStepperNextButton, useStepperPrevButton };
|
|
983
|
+
export { ActionCell, type ActionCellAction, type ActionCellProps, BooleanCell, type BooleanCellProps, BulkActionBar, type BulkActionBarProps, type BulkActionProps, type BulkPopoverActionProps, Card, CardList, CardListData, type CardListDataProps, CardListItem, type CardListItemProps, type CardListMenuItem, type CardListProps, type CardProps, ChipPicker, type ChipPickerProps, CodeCell, type CodeCellProps, ColorSwatchCell, type ColorSwatchCellProps, ContextRail, type ContextRailHeaderProps, type ContextRailProps, type ContextRailSectionProps, CountCell, type CountCellProps, DataTable, type DataTableProps, DateCell, type DateCellProps, DescriptionList, type DescriptionListProps, type DescriptionListRowProps, DeviceCell, type DeviceCellProps, type DrawerProps, DrawerRoot, FactBox, type FactBoxAction, type FactBoxProps, IdentityCell, type IdentityCellProps, InlineCreatableList, type InlineCreatableListProps, LabeledSwitch, type LabeledSwitchProps, LinkCell, type LinkCellProps, MenuCell, type MenuCellAction, type MenuCellProps, Modal, type ModalProps, NumberCell, type NumberCellProps, Pagination, type PaginationProps, SelectableCard, type SelectableCardBodyProps, type SelectableCardFooterProps, type SelectableCardProps, type SelectableCardThumbnailProps, Sidebar, type SidebarItemProps, type SidebarLogoProps, type SidebarSectionProps$1 as SidebarNavSectionProps, type SidebarProps, SidebarSection, type SidebarSectionProps, type SidebarUserMenuItemProps, type SidebarUserMenuProps, SlugCell, type SlugCellProps, StatusBadgeCell, type StatusBadgeCellProps, Stepper, StepperCompleted, StepperContainer, StepperContent, type StepperContentProps, StepperIcon, type StepperIconProps, type StepperProps, StepperProvider, StepperSeparator, type StepperSeparatorProps, StepperStep, type StepperStepProps, StepperStepTitle, StepperSteps, type StepperStepsProps, SwitchCell, type SwitchCellProps, CardList as Table, CardListData as TableData, type CardListDataProps as TableDataProps, CardListItem as TableItem, type CardListItemProps as TableItemProps, type CardListMenuItem as TableMenuItem, type CardListProps as TableProps, TimelineConnector, TimelineContent, TimelineDescription, TimelineIndicator, TimelineItem, type TimelineItemProps, TimelineRoot, type TimelineRootProps, TimelineSeparator, TimelineTitle, Toolbar, type ToolbarFilterChipProps, type ToolbarSearchProps, TreeViewBranch, TreeViewBranchContent, TreeViewBranchControl, TreeViewBranchIndicator, type TreeViewBranchProps, TreeViewBranchText, TreeViewBranchTrigger, TreeViewItem, TreeViewItemIndicator, type TreeViewItemProps, TreeViewItemText, TreeViewLabel, TreeViewNode, TreeViewRoot, type TreeViewRootProps, TreeViewTree, TruncatedTextCell, type TruncatedTextCellProps, UploadDropZone, type UploadDropZoneProps, UrlCell, type UrlCellProps, type UseStepProps, type UseStepperProps, type UseStepperReturn, Widget, type WidgetProps, emptyCellValue, formatUserAgent, parseUserAgent, pluralize, truncateText, useSidebarContext, useStep, useStepper, useStepperContext, useStepperNextButton, useStepperPrevButton };
|
package/dist/components/index.js
CHANGED
|
@@ -1175,6 +1175,53 @@ function DataTableInner(props) {
|
|
|
1175
1175
|
}
|
|
1176
1176
|
var DataTable = DataTableInner;
|
|
1177
1177
|
DataTable.displayName = "DataTable";
|
|
1178
|
+
var DescriptionListContext = createContext({
|
|
1179
|
+
orientation: "horizontal"
|
|
1180
|
+
});
|
|
1181
|
+
function DescriptionList({
|
|
1182
|
+
orientation = "horizontal",
|
|
1183
|
+
gap = "3",
|
|
1184
|
+
children
|
|
1185
|
+
}) {
|
|
1186
|
+
return /* @__PURE__ */ jsx(DescriptionListContext.Provider, { value: { orientation }, children: /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsx(Flex, { direction: "column", gap, children }) }) });
|
|
1187
|
+
}
|
|
1188
|
+
DescriptionList.displayName = "DescriptionList";
|
|
1189
|
+
function DescriptionListRow({
|
|
1190
|
+
label,
|
|
1191
|
+
mono,
|
|
1192
|
+
children
|
|
1193
|
+
}) {
|
|
1194
|
+
const { orientation } = useContext(DescriptionListContext);
|
|
1195
|
+
if (orientation === "vertical") {
|
|
1196
|
+
return /* @__PURE__ */ jsxs(Box, { children: [
|
|
1197
|
+
/* @__PURE__ */ jsx(Text, { fontSize: "xs", color: "muted", mb: "0.5", children: label }),
|
|
1198
|
+
/* @__PURE__ */ jsx(
|
|
1199
|
+
Text,
|
|
1200
|
+
{
|
|
1201
|
+
fontSize: "sm",
|
|
1202
|
+
fontFamily: mono ? "mono" : void 0,
|
|
1203
|
+
wordBreak: "break-all",
|
|
1204
|
+
children
|
|
1205
|
+
}
|
|
1206
|
+
)
|
|
1207
|
+
] });
|
|
1208
|
+
}
|
|
1209
|
+
return /* @__PURE__ */ jsxs(Flex, { justify: "space-between", align: "baseline", gap: "3", children: [
|
|
1210
|
+
/* @__PURE__ */ jsx(Text, { color: "muted", fontSize: "sm", children: label }),
|
|
1211
|
+
/* @__PURE__ */ jsx(
|
|
1212
|
+
Text,
|
|
1213
|
+
{
|
|
1214
|
+
fontSize: "sm",
|
|
1215
|
+
fontFamily: mono ? "mono" : void 0,
|
|
1216
|
+
textAlign: "right",
|
|
1217
|
+
wordBreak: "break-all",
|
|
1218
|
+
children
|
|
1219
|
+
}
|
|
1220
|
+
)
|
|
1221
|
+
] });
|
|
1222
|
+
}
|
|
1223
|
+
DescriptionListRow.displayName = "DescriptionList.Row";
|
|
1224
|
+
DescriptionList.Row = DescriptionListRow;
|
|
1178
1225
|
var DrawerRoot = ({
|
|
1179
1226
|
children,
|
|
1180
1227
|
title,
|
|
@@ -2647,6 +2694,6 @@ var Widget = ({
|
|
|
2647
2694
|
};
|
|
2648
2695
|
Widget.displayName = "Widget";
|
|
2649
2696
|
|
|
2650
|
-
export { ActionCell, BooleanCell, BulkActionBar, Card, CardList, CardListData, CardListItem, ChipPicker, CodeCell, ColorSwatchCell, ContextRail, CountCell, DataTable, DateCell, DeviceCell, DrawerRoot, FactBox, IdentityCell, 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, formatUserAgent, parseUserAgent, pluralize, truncateText, useSidebarContext, useStep, useStepper, useStepperContext, useStepperNextButton, useStepperPrevButton };
|
|
2697
|
+
export { ActionCell, BooleanCell, BulkActionBar, Card, CardList, CardListData, CardListItem, ChipPicker, CodeCell, ColorSwatchCell, ContextRail, CountCell, DataTable, DateCell, DescriptionList, DeviceCell, DrawerRoot, FactBox, IdentityCell, 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, formatUserAgent, parseUserAgent, pluralize, truncateText, useSidebarContext, useStep, useStepper, useStepperContext, useStepperNextButton, useStepperPrevButton };
|
|
2651
2698
|
//# sourceMappingURL=index.js.map
|
|
2652
2699
|
//# sourceMappingURL=index.js.map
|