@dashforge/tw 1.0.0 → 1.1.1

package/src/index.ts

@@ -1,388 +0,0 @@
-/**
- * @dashforge/tw
- *
- * Tailwind-rendered UI components for the Dashforge ecosystem.
- *
- * Architectural contract (plan v2 — 2026-05-15):
- *  - **Props-driven**: each Tailwind utility that matters for the public
- *    API becomes a typed prop. `sx` + `slotProps` are escape hatches.
- *  - **Tokens as source of truth**: components reference colors /
- *    spacing / radius / fontSize through `@dashforge/tw-tokens` via the
- *    `dashforgePreset()` from `@dashforge/tw-theme`.
- *  - **Shared bridge with MUI side**: both ecosystems consume
- *    `@dashforge/forms` + `@dashforge/ui-core` + `@dashforge/rbac`.
- *    No styling code is shared.
- *  - **Variant API**: `tailwind-variants` (TV) with `slots` +
- *    `compoundVariants`.
- *
- * F3 surface (tier-1, this release):
- *  - `<Button>` (action, RBAC only, `asChild` polymorphism)
- *  - `<TextField>` (bridge-integrated, 7 slots)
- *  - `<Checkbox>` (bridge-integrated, Radix Checkbox primitive)
- *  - `<Switch>` (bridge-integrated, Radix Switch primitive)
- *
- * @module @dashforge/tw
- */
-
-// ───── Components ─────
-export { Button } from './components/Button/Button.js';
-export type { ButtonProps } from './components/Button/button.types.js';
-export { buttonVariants } from './components/Button/button.variants.js';
-
-export { TextField } from './components/TextField/TextField.js';
-export type {
-  TextFieldProps,
-  TextFieldSlotProps,
-} from './components/TextField/textField.types.js';
-export { textFieldVariants } from './components/TextField/textField.variants.js';
-
-export { Checkbox } from './components/Checkbox/Checkbox.js';
-export type {
-  CheckboxProps,
-  CheckboxSlotProps,
-} from './components/Checkbox/checkbox.types.js';
-export { checkboxVariants } from './components/Checkbox/checkbox.variants.js';
-
-export { Switch } from './components/Switch/Switch.js';
-export type {
-  SwitchProps,
-  SwitchSlotProps,
-} from './components/Switch/switch.types.js';
-export { switchVariants } from './components/Switch/switch.variants.js';
-
-// F4 tier-2: bridge-integrated multi-choice + multi-line input
-
-export { RadioGroup } from './components/RadioGroup/RadioGroup.js';
-export type {
-  RadioGroupProps,
-  RadioGroupOption,
-  RadioGroupSlotProps,
-} from './components/RadioGroup/radioGroup.types.js';
-export { radioGroupVariants } from './components/RadioGroup/radioGroup.variants.js';
-
-export { Textarea } from './components/Textarea/Textarea.js';
-export type {
-  TextareaProps,
-  TextareaSlotProps,
-} from './components/Textarea/textarea.types.js';
-export { textareaVariants } from './components/Textarea/textarea.variants.js';
-
-// F4-B tier-2 final: numeric input + segmented OTP
-
-export { NumberField } from './components/NumberField/NumberField.js';
-export type {
-  NumberFieldProps,
-  NumberFieldSlotProps,
-} from './components/NumberField/numberField.types.js';
-export { numberFieldVariants } from './components/NumberField/numberField.variants.js';
-
-export { OTPField } from './components/OTPField/OTPField.js';
-export type {
-  OTPFieldProps,
-  OTPFieldSlotProps,
-  OTPFieldMode,
-} from './components/OTPField/otpField.types.js';
-export { otpFieldVariants } from './components/OTPField/otpField.variants.js';
-
-// F5-A tier-3: AAA-grade single-select combobox via React Aria
-
-export { Autocomplete } from './components/Autocomplete/Autocomplete.js';
-export type {
-  AutocompleteProps,
-  AutocompleteOption,
-  AutocompleteSlotProps,
-  AutocompleteValue,
-} from './components/Autocomplete/autocomplete.types.js';
-export { autocompleteVariants } from './components/Autocomplete/autocomplete.variants.js';
-
-// Custom calendar suite — Calendar primitive + bridge-integrated DatePicker /
-// TimePicker / DateTimePicker / DateRangePicker, all built on the shared
-// headless `@dashforge/calendar-core` engine.
-
-export { Calendar } from './components/Calendar/Calendar.js';
-export type {
-  CalendarProps,
-  CalendarSlotProps,
-} from './components/Calendar/calendar.types.js';
-export {
-  calendarVariants,
-  calendarDayVariants,
-} from './components/Calendar/calendar.variants.js';
-
-export { DatePicker } from './components/DatePicker/DatePicker.js';
-export type {
-  DatePickerProps,
-  DatePickerSlotProps,
-} from './components/DatePicker/datePicker.types.js';
-export { datePickerVariants } from './components/DatePicker/datePicker.variants.js';
-
-export { TimePicker } from './components/TimePicker/TimePicker.js';
-export type {
-  TimePickerProps,
-  TimePickerSlotProps,
-} from './components/TimePicker/timePicker.types.js';
-export { timePickerVariants } from './components/TimePicker/timePicker.variants.js';
-
-export { DateTimePicker } from './components/DateTimePicker/DateTimePicker.js';
-export type {
-  DateTimePickerProps,
-  DateTimePickerSlotProps,
-} from './components/DateTimePicker/dateTimePicker.types.js';
-export { dateTimePickerVariants } from './components/DateTimePicker/dateTimePicker.variants.js';
-
-export { DateRangePicker } from './components/DateRangePicker/DateRangePicker.js';
-export type {
-  DateRangePickerProps,
-  DateRangePickerSlotProps,
-} from './components/DateRangePicker/dateRangePicker.types.js';
-export {
-  dateRangePickerVariants,
-  dateRangeDayVariants,
-} from './components/DateRangePicker/dateRangePicker.variants.js';
-
-// F6 layout: router-agnostic navigation primitives.
-
-export { Breadcrumbs } from './components/Breadcrumbs/Breadcrumbs.js';
-export type {
-  BreadcrumbsProps,
-  BreadcrumbItem,
-  BreadcrumbsSlotProps,
-  BreadcrumbLinkComponent,
-} from './components/Breadcrumbs/breadcrumbs.types.js';
-export { breadcrumbsVariants } from './components/Breadcrumbs/breadcrumbs.variants.js';
-
-export { LeftNav } from './components/LeftNav/LeftNav.js';
-export type {
-  LeftNavProps,
-  LeftNavNode,
-  LeftNavItem,
-  LeftNavGroup,
-  LeftNavSlotProps,
-  LeftNavLinkComponent,
-} from './components/LeftNav/leftNav.types.js';
-export { leftNavVariants } from './components/LeftNav/leftNav.variants.js';
-
-export { TopBar } from './components/TopBar/TopBar.js';
-export type {
-  TopBarProps,
-  TopBarSlotProps,
-} from './components/TopBar/topBar.types.js';
-export { topBarVariants } from './components/TopBar/topBar.variants.js';
-
-export { AppShell } from './components/AppShell/AppShell.js';
-export type {
-  AppShellProps,
-  AppShellSlotProps,
-} from './components/AppShell/appShell.types.js';
-export { appShellVariants } from './components/AppShell/appShell.variants.js';
-
-// F7 providers: imperative dialogs + transient notifications.
-
-export {
-  ConfirmDialogProvider,
-  useConfirm,
-} from './components/ConfirmDialog/ConfirmDialog.js';
-export type {
-  ConfirmDialogProviderProps,
-  ConfirmDialogSlotProps,
-  ConfirmFn,
-  ConfirmOptions,
-  ConfirmSeverity,
-} from './components/ConfirmDialog/confirmDialog.types.js';
-export { confirmDialogVariants } from './components/ConfirmDialog/confirmDialog.variants.js';
-
-export {
-  SnackbarProvider,
-  useSnackbar,
-} from './components/Snackbar/Snackbar.js';
-export type {
-  SnackbarProviderProps,
-  SnackbarApi,
-  SnackbarOptions,
-  SnackbarRecord,
-  SnackbarSeverity,
-  SnackbarPosition,
-  SnackbarSlotProps,
-} from './components/Snackbar/snackbar.types.js';
-export { snackbarVariants } from './components/Snackbar/snackbar.variants.js';
-
-// F9 foundation: typography + layout primitives. These sit BENEATH
-// every other component (Button's label, TextField's helper text, the
-// surface of an AppShell card) and are what app-level code reaches for
-// before it reaches for any specific UI atom.
-
-export { Typography } from './components/Typography/Typography.js';
-export type { TypographyProps } from './components/Typography/typography.types.js';
-export { typographyVariants } from './components/Typography/typography.variants.js';
-
-export { Box } from './components/Box/Box.js';
-export type { BoxProps } from './components/Box/box.types.js';
-export { boxVariants } from './components/Box/box.variants.js';
-
-export { Stack } from './components/Stack/Stack.js';
-export type { StackProps } from './components/Stack/stack.types.js';
-export { stackVariants } from './components/Stack/stack.variants.js';
-
-export { Grid } from './components/Grid/Grid.js';
-export type {
-  GridProps,
-  GridContainerProps,
-  GridItemProps,
-  ColSpan,
-  GridSpacingStep,
-} from './components/Grid/grid.types.js';
-export { gridVariants } from './components/Grid/grid.variants.js';
-
-// F10 foundation completions: Container, Divider, AspectRatio, VisuallyHidden.
-// The page-root chrome + visual separators + content-shape primitives +
-// the a11y baseline. With these, the foundation layer matches what
-// Chakra/Mantine/Joy ship for layout-level primitives.
-
-export { Container } from './components/Container/Container.js';
-export type { ContainerProps } from './components/Container/container.types.js';
-export { containerVariants } from './components/Container/container.variants.js';
-
-export { Divider } from './components/Divider/Divider.js';
-export type { DividerProps } from './components/Divider/divider.types.js';
-export {
-  dividerVariants,
-  dividerLineVariants,
-} from './components/Divider/divider.variants.js';
-
-export { AspectRatio } from './components/AspectRatio/AspectRatio.js';
-export type { AspectRatioProps } from './components/AspectRatio/aspectRatio.types.js';
-
-export { VisuallyHidden } from './components/VisuallyHidden/VisuallyHidden.js';
-export type { VisuallyHiddenProps } from './components/VisuallyHidden/visuallyHidden.types.js';
-
-// F11 tier-4: overlay + disclosure primitives.
-
-export { Dialog } from './components/Dialog/Dialog.js';
-export type {
-  DialogProps,
-  DialogSlotProps,
-} from './components/Dialog/dialog.types.js';
-export { dialogVariants } from './components/Dialog/dialog.variants.js';
-
-export { Tabs } from './components/Tabs/Tabs.js';
-export type {
-  TabsProps,
-  TabsSlotProps,
-  TabItem,
-} from './components/Tabs/tabs.types.js';
-export { tabsVariants } from './components/Tabs/tabs.variants.js';
-
-export { Tooltip } from './components/Tooltip/Tooltip.js';
-export type {
-  TooltipProps,
-  TooltipSlotProps,
-} from './components/Tooltip/tooltip.types.js';
-export { tooltipVariants } from './components/Tooltip/tooltip.variants.js';
-
-export { Popover } from './components/Popover/Popover.js';
-export type {
-  PopoverProps,
-  PopoverSlotProps,
-} from './components/Popover/popover.types.js';
-export { popoverVariants } from './components/Popover/popover.variants.js';
-
-export { Accordion } from './components/Accordion/Accordion.js';
-export type {
-  AccordionProps,
-  AccordionSlotProps,
-  AccordionItem,
-} from './components/Accordion/accordion.types.js';
-export { accordionVariants } from './components/Accordion/accordion.variants.js';
-
-// F12 utilities: loading placeholder + pagination control.
-
-export { Skeleton } from './components/Skeleton/Skeleton.js';
-export type {
-  SkeletonProps,
-  SkeletonSlotProps,
-} from './components/Skeleton/skeleton.types.js';
-export { skeletonVariants } from './components/Skeleton/skeleton.variants.js';
-
-export { Pagination } from './components/Pagination/Pagination.js';
-export type {
-  PaginationProps,
-  PaginationSlotProps,
-  PaginationLabels,
-} from './components/Pagination/pagination.types.js';
-export { paginationVariants } from './components/Pagination/pagination.variants.js';
-
-// F13 tier-5: market-grounded Table (Stripe-style visuals, Pencil&Paper
-// UX research, W3C WAI a11y). DataGrid (with virtualization) ships in
-// Sprint 4.2.
-
-export { Table } from './components/Table/Table.js';
-export type {
-  TableProps,
-  TableColumn,
-  TableColumnInferredType,
-  TableCellContext,
-  TableSortDirection,
-  TableSortItem,
-  TableSortModel,
-  TableFilterItem,
-  TableFilterModel,
-  TableFilterOperator,
-  TableFilterType,
-  TableRowSelectionMode,
-  TableExpandableConfig,
-  TableLabels,
-  TableSlotProps,
-  NestedKeyOf,
-} from './components/Table/table.types.js';
-export { tableVariants } from './components/Table/table.variants.js';
-// Cell renderer library
-export {
-  RenderText,
-  RenderTwoLine,
-  RenderChip,
-  RenderButton,
-  RowActionsMenu,
-} from './components/Table/cells/index.js';
-export type {
-  RenderTextProps,
-  RenderTwoLineProps,
-  RenderChipProps,
-  RenderButtonProps,
-  RowActionsMenuProps,
-  TableRowAction,
-} from './components/Table/cells/index.js';
-// Helpers (exported for power users building custom Table-like
-// components on top of the same primitives).
-export { getNestedValue } from './components/_shared/data/getNestedValue.js';
-
-// F14 tier-5: virtualized data grid for large data sets. Companion to
-// `<Table>` — same column model, sort/search/filter/selection logic
-// (shared via `_shared/data/` helpers) but uses homemade
-// virtualization (`IntersectionObserver` + scroll-event +
-// `requestAnimationFrame` — zero new runtime deps).
-
-export { DataGrid } from './components/DataGrid/DataGrid.js';
-export type {
-  DataGridProps,
-  DataGridSlotProps,
-  DataGridSelectAllScope,
-  DataGridServerSideFlags,
-  DataGridPaginationConfig,
-} from './components/DataGrid/dataGrid.types.js';
-export { dataGridVariants } from './components/DataGrid/dataGrid.variants.js';
-
-// ───── Hooks ─────
-export { useAccessState } from './hooks/useAccessState.js';
-
-// ───── Utilities ─────
-export { cn } from './utils/cn.js';
-
-// Re-export tailwind-variants for consumers building app-level variants
-// against the same canonical version used by the library.
-export { tv } from 'tailwind-variants';
-export type { VariantProps } from 'tailwind-variants';
-
-/**
- * Package version (synced with `package.json` at publish time).
- */
-export const VERSION = '0.11.0-beta';

package/src/utils/cn.spec.ts

@@ -1,16 +0,0 @@
-import { describe, it, expect } from 'vitest';
-import { cn } from './cn.js';
-
-describe('cn (clsx wrapper)', () => {
-  it('joins truthy class values', () => {
-    expect(cn('a', 'b')).toBe('a b');
-  });
-
-  it('drops falsy values', () => {
-    expect(cn('a', false, null, undefined, '', 'b')).toBe('a b');
-  });
-
-  it('flattens conditional objects', () => {
-    expect(cn('a', { b: true, c: false }, 'd')).toBe('a b d');
-  });
-});

package/src/utils/cn.ts

@@ -1,29 +0,0 @@
-import clsx, { type ClassValue } from 'clsx';
-import { twMerge } from 'tailwind-merge';
-
-/**
- * className composition helper for Dashforge TW components.
- *
- * Wraps `clsx` (for boolean / object / array compaction) with
- * `tailwind-merge` (for last-wins conflict resolution between
- * conflicting Tailwind utilities). This is the override contract
- * that powers `sx` and `slotProps`:
- *
- * ```tsx
- * cn(buttonVariants({ variant: 'solid', color: 'primary' }), sx)
- * // sx="bg-red-500" beats the variant's `bg-primary-500`.
- * ```
- *
- * Without `tailwind-merge`, Tailwind's stylesheet output order decides
- * who wins, which is unpredictable for consumers and breaks the
- * documented "override always wins" semantics.
- *
- * @example
- * ```tsx
- * <button className={cn('px-4 py-2', isPrimary && 'bg-primary-500')}>
- * cn(['inline-flex', { 'opacity-50': disabled }], extra);
- * ```
- */
-export function cn(...inputs: ClassValue[]): string {
-  return twMerge(clsx(inputs));
-}

package/test-output/vitest/coverage/base.css

@@ -1,224 +0,0 @@
-body, html {
-  margin:0; padding: 0;
-  height: 100%;
-}
-body {
-    font-family: Helvetica Neue, Helvetica, Arial;
-    font-size: 14px;
-    color:#333;
-}
-.small { font-size: 12px; }
-*, *:after, *:before {
-  -webkit-box-sizing:border-box;
-     -moz-box-sizing:border-box;
-          box-sizing:border-box;
-  }
-h1 { font-size: 20px; margin: 0;}
-h2 { font-size: 14px; }
-pre {
-    font: 12px/1.4 Consolas, "Liberation Mono", Menlo, Courier, monospace;
-    margin: 0;
-    padding: 0;
-    -moz-tab-size: 2;
-    -o-tab-size:  2;
-    tab-size: 2;
-}
-a { color:#0074D9; text-decoration:none; }
-a:hover { text-decoration:underline; }
-.strong { font-weight: bold; }
-.space-top1 { padding: 10px 0 0 0; }
-.pad2y { padding: 20px 0; }
-.pad1y { padding: 10px 0; }
-.pad2x { padding: 0 20px; }
-.pad2 { padding: 20px; }
-.pad1 { padding: 10px; }
-.space-left2 { padding-left:55px; }
-.space-right2 { padding-right:20px; }
-.center { text-align:center; }
-.clearfix { display:block; }
-.clearfix:after {
-  content:'';
-  display:block;
-  height:0;
-  clear:both;
-  visibility:hidden;
-  }
-.fl { float: left; }
-@media only screen and (max-width:640px) {
-  .col3 { width:100%; max-width:100%; }
-  .hide-mobile { display:none!important; }
-}
-
-.quiet {
-  color: #7f7f7f;
-  color: rgba(0,0,0,0.5);
-}
-.quiet a { opacity: 0.7; }
-
-.fraction {
-  font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace;
-  font-size: 10px;
-  color: #555;
-  background: #E8E8E8;
-  padding: 4px 5px;
-  border-radius: 3px;
-  vertical-align: middle;
-}
-
-div.path a:link, div.path a:visited { color: #333; }
-table.coverage {
-  border-collapse: collapse;
-  margin: 10px 0 0 0;
-  padding: 0;
-}
-
-table.coverage td {
-  margin: 0;
-  padding: 0;
-  vertical-align: top;
-}
-table.coverage td.line-count {
-    text-align: right;
-    padding: 0 5px 0 20px;
-}
-table.coverage td.line-coverage {
-    text-align: right;
-    padding-right: 10px;
-    min-width:20px;
-}
-
-table.coverage td span.cline-any {
-    display: inline-block;
-    padding: 0 5px;
-    width: 100%;
-}
-.missing-if-branch {
-    display: inline-block;
-    margin-right: 5px;
-    border-radius: 3px;
-    position: relative;
-    padding: 0 4px;
-    background: #333;
-    color: yellow;
-}
-
-.skip-if-branch {
-    display: none;
-    margin-right: 10px;
-    position: relative;
-    padding: 0 4px;
-    background: #ccc;
-    color: white;
-}
-.missing-if-branch .typ, .skip-if-branch .typ {
-    color: inherit !important;
-}
-.coverage-summary {
-  border-collapse: collapse;
-  width: 100%;
-}
-.coverage-summary tr { border-bottom: 1px solid #bbb; }
-.keyline-all { border: 1px solid #ddd; }
-.coverage-summary td, .coverage-summary th { padding: 10px; }
-.coverage-summary tbody { border: 1px solid #bbb; }
-.coverage-summary td { border-right: 1px solid #bbb; }
-.coverage-summary td:last-child { border-right: none; }
-.coverage-summary th {
-  text-align: left;
-  font-weight: normal;
-  white-space: nowrap;
-}
-.coverage-summary th.file { border-right: none !important; }
-.coverage-summary th.pct { }
-.coverage-summary th.pic,
-.coverage-summary th.abs,
-.coverage-summary td.pct,
-.coverage-summary td.abs { text-align: right; }
-.coverage-summary td.file { white-space: nowrap;  }
-.coverage-summary td.pic { min-width: 120px !important;  }
-.coverage-summary tfoot td { }
-
-.coverage-summary .sorter {
-    height: 10px;
-    width: 7px;
-    display: inline-block;
-    margin-left: 0.5em;
-    background: url(sort-arrow-sprite.png) no-repeat scroll 0 0 transparent;
-}
-.coverage-summary .sorted .sorter {
-    background-position: 0 -20px;
-}
-.coverage-summary .sorted-desc .sorter {
-    background-position: 0 -10px;
-}
-.status-line {  height: 10px; }
-/* yellow */
-.cbranch-no { background: yellow !important; color: #111; }
-/* dark red */
-.red.solid, .status-line.low, .low .cover-fill { background:#C21F39 }
-.low .chart { border:1px solid #C21F39 }
-.highlighted,
-.highlighted .cstat-no, .highlighted .fstat-no, .highlighted .cbranch-no{
-  background: #C21F39 !important;
-}
-/* medium red */
-.cstat-no, .fstat-no, .cbranch-no, .cbranch-no { background:#F6C6CE }
-/* light red */
-.low, .cline-no { background:#FCE1E5 }
-/* light green */
-.high, .cline-yes { background:rgb(230,245,208) }
-/* medium green */
-.cstat-yes { background:rgb(161,215,106) }
-/* dark green */
-.status-line.high, .high .cover-fill { background:rgb(77,146,33) }
-.high .chart { border:1px solid rgb(77,146,33) }
-/* dark yellow (gold) */
-.status-line.medium, .medium .cover-fill { background: #f9cd0b; }
-.medium .chart { border:1px solid #f9cd0b; }
-/* light yellow */
-.medium { background: #fff4c2; }
-
-.cstat-skip { background: #ddd; color: #111; }
-.fstat-skip { background: #ddd; color: #111 !important; }
-.cbranch-skip { background: #ddd !important; color: #111; }
-
-span.cline-neutral { background: #eaeaea; }
-
-.coverage-summary td.empty {
-    opacity: .5;
-    padding-top: 4px;
-    padding-bottom: 4px;
-    line-height: 1;
-    color: #888;
-}
-
-.cover-fill, .cover-empty {
-  display:inline-block;
-  height: 12px;
-}
-.chart {
-  line-height: 0;
-}
-.cover-empty {
-    background: white;
-}
-.cover-full {
-    border-right: none !important;
-}
-pre.prettyprint {
-    border: none !important;
-    padding: 0 !important;
-    margin: 0 !important;
-}
-.com { color: #999 !important; }
-.ignore-none { color: #999; font-weight: normal; }
-
-.wrapper {
-  min-height: 100%;
-  height: auto !important;
-  height: 100%;
-  margin: 0 auto -48px;
-}
-.footer, .push {
-  height: 48px;
-}