@charcuterie/ui 2.18.0 → 3.1.0

package/src/index.ts

@@ -65,6 +65,26 @@ export type {
 export { Alert } from "./Alert/Alert.tsx"
 export type { BadgeProps } from "./Badge/Badge.tsx"
 export { Badge } from "./Badge/Badge.tsx"
+export type {
+  BoardMove,
+  BoardProps,
+} from "./Board/Board.tsx"
+export { Board } from "./Board/Board.tsx"
+export type { BoardItem } from "./Board/BoardCard.tsx"
+export type { BoardLane } from "./Board/BoardLaneList.tsx"
+export type {
+  BoardDropLane,
+  BoardDropTarget,
+  BoardPoint,
+  BoardRect,
+} from "./Board/boardMove.ts"
+export {
+  chooseDropIndex,
+  chooseDropTarget,
+  describeMove,
+  getIsMoveMeaningful,
+  toSettledIndex,
+} from "./Board/boardMove.ts"
 export type { ButtonProps } from "./Button/Button.tsx"
 export { Button } from "./Button/Button.tsx"
 export type { ButtonLinkProps } from "./ButtonLink/ButtonLink.tsx"
@@ -86,6 +106,12 @@ export type {
 export { ColorSchemeToggle } from "./ColorSchemeToggle/ColorSchemeToggle.tsx"
 export type { ComboboxProps } from "./Combobox/Combobox.tsx"
 export { Combobox } from "./Combobox/Combobox.tsx"
+export {
+  CATEGORICAL_APPEARANCE_CLASS,
+  CATEGORICAL_CONTENT_CLASS,
+  CATEGORICAL_HOVER_CLASS,
+  CATEGORICAL_SOLID_FILL_CLASS,
+} from "./categoricalStyles.ts"
 export type { BadgeSize } from "./controlStyles.ts"
 export {
   BADGE_SIZE_CLASS,
@@ -97,6 +123,53 @@ export {
   MIN_TOUCH_TARGET_CLASS,
   SPINNER_SIZE_CLASS,
 } from "./controlStyles.ts"
+export type {
+  DataTableColumn,
+  DataTableProps,
+  DataTableSelection,
+  DataTableSort,
+} from "./DataTable/DataTable.tsx"
+export { DataTable } from "./DataTable/DataTable.tsx"
+export type { DatePickerProps } from "./DatePicker/DatePicker.tsx"
+export { DatePicker } from "./DatePicker/DatePicker.tsx"
+export type { DatePreset } from "./DatePicker/datePresets.ts"
+export { DEFAULT_DATE_PRESETS } from "./DatePicker/datePresets.ts"
+export type {
+  DateInputKeywords,
+  DateInputResult,
+  ParseDateInputOptions,
+} from "./DatePicker/parseDateInput.ts"
+export {
+  DEFAULT_DATE_INPUT_KEYWORDS,
+  parseDateInput,
+} from "./DatePicker/parseDateInput.ts"
+export type {
+  DateRange,
+  PlainDate,
+  PlainDateFormatOptions,
+} from "./DatePicker/plainDate.ts"
+export {
+  addDays,
+  addMonths,
+  clampPlainDate,
+  comparePlainDates,
+  formatPlainDate,
+  getDayNumber,
+  getDaysBetween,
+  getDaysInMonth,
+  getFirstDayOfWeek,
+  getIsLeapYear,
+  getIsSameDay,
+  getIsValidPlainDate,
+  getIsWithinRange,
+  getLocalPlainDate,
+  getMonthNames,
+  getPlainDateFromDayNumber,
+  getWeekday,
+  getWeekdayNames,
+  parseIsoDate,
+  toIsoDate,
+} from "./DatePicker/plainDate.ts"
 export type {
   DialogProps,
   DialogSize,
@@ -146,6 +219,22 @@ export type {
 export { LogViewer } from "./LogViewer/LogViewer.tsx"
 export type { MainProps } from "./Main/Main.tsx"
 export { Main } from "./Main/Main.tsx"
+export type {
+  MarkdownEditorProps,
+  MarkdownImageUpload,
+} from "./MarkdownEditor/MarkdownEditor.tsx"
+export { MarkdownEditor } from "./MarkdownEditor/MarkdownEditor.tsx"
+export { toMarkdownImage } from "./MarkdownEditor/markdownCommands.ts"
+export type {
+  MarkdownLine,
+  MarkdownLineKind,
+  MarkdownSpan,
+  MarkdownSpanKind,
+} from "./MarkdownEditor/markdownSpans.ts"
+export {
+  toLineIndex,
+  toMarkdownLines,
+} from "./MarkdownEditor/markdownSpans.ts"
 export type {
   MediaTileProps,
   MediaTileRatio,

package/src/sourceRules.test.ts

@@ -211,9 +211,30 @@ test("a container-query component is never storied in a shrink-to-fit cell", ()
   // inside it.
   expect(containerComponents).toEqual([
     "Alert",
+    // `Board` declares **two** containers and neither is the element
+    // that queries it: the board's own box decides how many lanes are
+    // on screen, and each lane's list — in `BoardLaneList.tsx`, which
+    // is a member rather than a component by the `<Name>/<Name>.tsx`
+    // rule — decides what shape a card is. Only the first of those is
+    // in this list, and that is enough: it is `<Board` a story renders,
+    // so `<Board` is what a shrink-to-fit `StoryCell` would collapse.
+    "Board",
     "Card",
+    // `DataTable` joins them as the first component whose *layout*
+    // is the container query rather than its padding: below `--cq-md`
+    // a row stops being a row and becomes a labelled block, so the
+    // whole point of the component is a query it declares itself.
+    "DataTable",
+    // `DatePicker`'s panel is the container, and it is the first one
+    // here whose container is *not* the element a caller sized. A
+    // portalled panel is clamped to the space floating-ui found for
+    // it, so the calendar reads that and not the window — which is
+    // the case a media query cannot express at all, and the case the
+    // owner is in whenever he browses zoomed in.
+    "DatePicker",
     "EmptyState",
     "Main",
+    "MarkdownEditor",
     "MediaTile",
   ])
 
@@ -374,12 +395,42 @@ test("the barrel is the only place components are re-exported", async () => {
   // the barrel by the `<Name>/<Name>.tsx` rule, exactly as
   // `SegmentedOption` and `ListboxOption` do.
   //
+  // `MarkdownEditor` — Docket's live hybrid editor, a real
+  // `<textarea>` with a painted layer behind it — is +1 -> 46. Its
+  // `markdownSpans.ts` and `markdownCommands.ts` are pure modules
+  // rather than components and stay out of this count by the
+  // `<Name>/<Name>.tsx` rule.
+  //
   // `Picker` — a `Listbox` with its trigger already attached — is +1 ->
   // 45. It is a component rather than a recipe in the docs because the
   // fleet wrote it four separate times (plex-channels' `SelectListbox`,
   // board-games' `SelectMenu`, mux-magic's `ListboxPicker`, and twice
   // inside this package), each with its own hand-rolled chevron.
-  expect(componentNames.length).toBe(45)
+  // `DatePicker` — a typed date field with a calendar dialog — is +1
+  // -> 47. `DateGrid.tsx`, `plainDate.ts` and `parseDateInput.ts` are
+  // its members and stay out of this count by the `<Name>/<Name>.tsx`
+  // rule, exactly as `SegmentedOption` and `ListboxOption` do. The
+  // two `.ts` ones are still exported from the barrel: the calendar
+  // arithmetic and the input grammar are the parts a consumer needs
+  // *outside* the field (Docket counts staleness in days), and they
+  // reach nothing but `Intl`.
+  //
+  // `DataTable` — the reflowing table Docket's task lists, backlog and
+  // search results need — is +1 -> 48. It **composes**
+  // `SortableTableHeader` rather than subsuming it: that component is
+  // already in a published 1.0.0 with a consumer of its own, so
+  // removing it would be a breaking change bought for nothing, and
+  // both stay in this count.
+  //
+  // `Board` — lanes of cards, sized by their container and moved by
+  // keyboard or by pointer — is +1 -> 49. It is the library's first
+  // component whose own operation is a **write** rather than a
+  // selection, and the first to declare two nested containers.
+  // `BoardCard.tsx`, `BoardLaneList.tsx`, `boardMove.ts` and
+  // `useBoardDrag.ts` are its members and stay out of this count and
+  // the barrel by the `<Name>/<Name>.tsx` rule, exactly as
+  // `ToolbarSlot` and `QueryBuilderRow` do.
+  expect(componentNames.length).toBe(49)
 
   for (const name of componentNames) {
     expect(barrel).toContain(`export { ${name} }`)