@eifi1/ui-kit 0.26.0 → 0.27.0

package/dist/rhf/fields.d.ts

@@ -1,7 +1,7 @@
 import * as react from 'react';
 import { ReactNode, ReactElement } from 'react';
 import { FieldValues, FieldPath, ControllerProps, ControllerRenderProps, ControllerFieldState } from 'react-hook-form';
-import { bK as IbanInputProps, c5 as PhoneInputProps, c9 as SelectProps, bU as InputProps, cu as TextareaProps } from '../feedback-BXKH-ToU.js';
+import { d6 as IbanInputProps, du as PhoneInputProps, dy as SelectProps, dg as InputProps, dT as TextareaProps } from '../kit-labels-DQg82eHB.js';
 import { NumberFieldProps } from '../components/number-field.js';
 import { DatePickerProps, DateRangePickerProps } from '../components/date-picker.js';
 import { TimeInputProps } from '../components/time-input.js';
@@ -12,10 +12,7 @@ import { CheckboxProps } from '../components/checkbox.js';
 import { EntityComboboxProps } from '../components/entity-combobox.js';
 import { InlineEntityComboboxProps, ComboboxProps } from '../components/combobox.js';
 import { ComboClearValue } from '../components/combobox-core.js';
-import '../components/tooltip.js';
-import '../hooks/use-anchored-rect.js';
-import '../lib/clipping.js';
-import '../data-table-labels-Cdn1QS2k.js';
+import '../data-table-labels-DUELeXpa.js';
 import '../components/data-table-sort.js';
 import '../components/swipeable-row.js';
 import '../components/mini-calendar.js';
@@ -24,6 +21,9 @@ import '../components/popover.js';
 import '../components/chip.js';
 import 'lucide-react';
 import '../components/field-sync.js';
+import '../components/tooltip.js';
+import '../hooks/use-anchored-rect.js';
+import '../lib/clipping.js';
 import '../wizard/types.js';
 import '../tour/tour.js';
 import '../search/command-palette.js';
@@ -43,19 +43,23 @@ import '../components/dialog-frame.js';
 import '../components/modal.js';
 import '../hooks/use-search-param-state.js';
 import '../components/measured-grid.js';
-import '../components/account-settings-labels.js';
+import '../components/user-avatar.js';
+import '../components/status-dot.js';
+import '../components/progress-bar.js';
+import '../components/signed-amount.js';
+import '../shell/topbar-action-menu.js';
+import '../components/menu-item.js';
 import '../components/floating-panel.js';
+import '../hooks/use-authed-src.js';
+import '../components/account-settings-labels.js';
 import '../components/bulk-action-bar.js';
 import '../components/list.js';
-import '../components/signed-amount.js';
 import '../components/breadcrumbs.js';
 import '../components/toast.js';
 import '../components/description-list.js';
 import '../components/line-items.js';
-import '../components/progress-bar.js';
 import '../components/error-boundary.js';
 import '../components/authed-image.js';
-import '../hooks/use-authed-src.js';
 import '../components/image-grid.js';
 import '../components/lightbox.js';
 import '../components/write-lock.js';

package/dist/rhf/form.d.ts

@@ -2,11 +2,8 @@ import * as react from 'react';
 import { ReactElement, ComponentProps } from 'react';
 import * as react_hook_form from 'react-hook-form';
 import { FieldValues, FieldPath, ControllerProps } from 'react-hook-form';
-import { b$ as LabelProps } from '../feedback-BXKH-ToU.js';
-import '../components/tooltip.js';
-import '../hooks/use-anchored-rect.js';
-import '../lib/clipping.js';
-import '../data-table-labels-Cdn1QS2k.js';
+import { dn as LabelProps } from '../kit-labels-DQg82eHB.js';
+import '../data-table-labels-DUELeXpa.js';
 import '../components/data-table-sort.js';
 import '../components/swipeable-row.js';
 import '../components/mini-calendar.js';
@@ -15,6 +12,9 @@ import '../components/popover.js';
 import '../components/chip.js';
 import 'lucide-react';
 import '../components/field-sync.js';
+import '../components/tooltip.js';
+import '../hooks/use-anchored-rect.js';
+import '../lib/clipping.js';
 import '../wizard/types.js';
 import '../tour/tour.js';
 import '../search/command-palette.js';
@@ -35,19 +35,23 @@ import '../components/dialog-frame.js';
 import '../components/modal.js';
 import '../hooks/use-search-param-state.js';
 import '../components/measured-grid.js';
-import '../components/account-settings-labels.js';
+import '../components/user-avatar.js';
+import '../components/status-dot.js';
+import '../components/progress-bar.js';
+import '../components/signed-amount.js';
+import '../shell/topbar-action-menu.js';
+import '../components/menu-item.js';
 import '../components/floating-panel.js';
+import '../hooks/use-authed-src.js';
+import '../components/account-settings-labels.js';
 import '../components/bulk-action-bar.js';
 import '../components/list.js';
-import '../components/signed-amount.js';
 import '../components/breadcrumbs.js';
 import '../components/toast.js';
 import '../components/description-list.js';
 import '../components/line-items.js';
-import '../components/progress-bar.js';
 import '../components/error-boundary.js';
 import '../components/authed-image.js';
-import '../hooks/use-authed-src.js';
 import '../components/image-grid.js';
 import '../components/lightbox.js';
 import '../components/write-lock.js';

package/dist/rhf.d.ts

@@ -4,11 +4,8 @@ export { RhfCheckbox, RhfCheckboxProps, RhfCombobox, RhfComboboxProps, RhfCountr
 export { RhfLineItemCellContext, RhfLineItems, RhfLineItemsColumn, RhfLineItemsProps } from './rhf/line-items.js';
 import 'react';
 import 'react-hook-form';
-import './feedback-BXKH-ToU.js';
-import './components/tooltip.js';
-import './hooks/use-anchored-rect.js';
-import './lib/clipping.js';
-import './data-table-labels-Cdn1QS2k.js';
+import './kit-labels-DQg82eHB.js';
+import './data-table-labels-DUELeXpa.js';
 import './components/data-table-sort.js';
 import './components/swipeable-row.js';
 import './components/mini-calendar.js';
@@ -17,6 +14,9 @@ import './components/popover.js';
 import './components/chip.js';
 import 'lucide-react';
 import './components/field-sync.js';
+import './components/tooltip.js';
+import './hooks/use-anchored-rect.js';
+import './lib/clipping.js';
 import './wizard/types.js';
 import './tour/tour.js';
 import './search/command-palette.js';
@@ -37,19 +37,23 @@ import './components/dialog-frame.js';
 import './components/modal.js';
 import './hooks/use-search-param-state.js';
 import './components/measured-grid.js';
-import './components/account-settings-labels.js';
+import './components/user-avatar.js';
+import './components/status-dot.js';
+import './components/progress-bar.js';
+import './components/signed-amount.js';
+import './shell/topbar-action-menu.js';
+import './components/menu-item.js';
 import './components/floating-panel.js';
+import './hooks/use-authed-src.js';
+import './components/account-settings-labels.js';
 import './components/bulk-action-bar.js';
 import './components/list.js';
-import './components/signed-amount.js';
 import './components/breadcrumbs.js';
 import './components/toast.js';
 import './components/description-list.js';
 import './components/line-items.js';
-import './components/progress-bar.js';
 import './components/error-boundary.js';
 import './components/authed-image.js';
-import './hooks/use-authed-src.js';
 import './components/image-grid.js';
 import './components/lightbox.js';
 import './components/write-lock.js';

package/dist/shell/app-shell.d.ts

@@ -1,11 +1,8 @@
 import * as react from 'react';
 import { ComponentPropsWithoutRef, ReactNode } from 'react';
 import { LucideIcon } from 'lucide-react';
-import { bX as KitLinkComponent } from '../feedback-BXKH-ToU.js';
-import '../components/tooltip.js';
-import '../hooks/use-anchored-rect.js';
-import '../lib/clipping.js';
-import '../data-table-labels-Cdn1QS2k.js';
+import { dj as KitLinkComponent } from '../kit-labels-DQg82eHB.js';
+import '../data-table-labels-DUELeXpa.js';
 import '../components/data-table-sort.js';
 import '../components/swipeable-row.js';
 import '../components/mini-calendar.js';
@@ -13,6 +10,9 @@ import '../components/calendar-heatmap.js';
 import '../components/popover.js';
 import '../components/chip.js';
 import '../components/field-sync.js';
+import '../components/tooltip.js';
+import '../hooks/use-anchored-rect.js';
+import '../lib/clipping.js';
 import '../wizard/types.js';
 import '../tour/tour.js';
 import '../search/command-palette.js';
@@ -33,19 +33,23 @@ import '../components/dialog-frame.js';
 import '../components/modal.js';
 import '../hooks/use-search-param-state.js';
 import '../components/measured-grid.js';
-import '../components/account-settings-labels.js';
+import '../components/user-avatar.js';
+import '../components/status-dot.js';
+import '../components/progress-bar.js';
+import '../components/signed-amount.js';
+import './topbar-action-menu.js';
+import '../components/menu-item.js';
 import '../components/floating-panel.js';
+import '../hooks/use-authed-src.js';
+import '../components/account-settings-labels.js';
 import '../components/bulk-action-bar.js';
 import '../components/list.js';
-import '../components/signed-amount.js';
 import '../components/breadcrumbs.js';
 import '../components/toast.js';
 import '../components/description-list.js';
 import '../components/line-items.js';
-import '../components/progress-bar.js';
 import '../components/error-boundary.js';
 import '../components/authed-image.js';
-import '../hooks/use-authed-src.js';
 import '../components/image-grid.js';
 import '../components/lightbox.js';
 import '../components/write-lock.js';

package/dist/shell/top-bar-brand.d.ts

@@ -1,10 +1,7 @@
 import * as react from 'react';
 import { ReactNode } from 'react';
-import { bY as KitLinkProps, bX as KitLinkComponent } from '../feedback-BXKH-ToU.js';
-import '../components/tooltip.js';
-import '../hooks/use-anchored-rect.js';
-import '../lib/clipping.js';
-import '../data-table-labels-Cdn1QS2k.js';
+import { dk as KitLinkProps, dj as KitLinkComponent } from '../kit-labels-DQg82eHB.js';
+import '../data-table-labels-DUELeXpa.js';
 import '../components/data-table-sort.js';
 import '../components/swipeable-row.js';
 import '../components/mini-calendar.js';
@@ -13,6 +10,9 @@ import '../components/popover.js';
 import '../components/chip.js';
 import 'lucide-react';
 import '../components/field-sync.js';
+import '../components/tooltip.js';
+import '../hooks/use-anchored-rect.js';
+import '../lib/clipping.js';
 import '../wizard/types.js';
 import '../tour/tour.js';
 import '../search/command-palette.js';
@@ -33,19 +33,23 @@ import '../components/dialog-frame.js';
 import '../components/modal.js';
 import '../hooks/use-search-param-state.js';
 import '../components/measured-grid.js';
-import '../components/account-settings-labels.js';
+import '../components/user-avatar.js';
+import '../components/status-dot.js';
+import '../components/progress-bar.js';
+import '../components/signed-amount.js';
+import './topbar-action-menu.js';
+import '../components/menu-item.js';
 import '../components/floating-panel.js';
+import '../hooks/use-authed-src.js';
+import '../components/account-settings-labels.js';
 import '../components/bulk-action-bar.js';
 import '../components/list.js';
-import '../components/signed-amount.js';
 import '../components/breadcrumbs.js';
 import '../components/toast.js';
 import '../components/description-list.js';
 import '../components/line-items.js';
-import '../components/progress-bar.js';
 import '../components/error-boundary.js';
 import '../components/authed-image.js';
-import '../hooks/use-authed-src.js';
 import '../components/image-grid.js';
 import '../components/lightbox.js';
 import '../components/write-lock.js';

package/dist/shell.d.ts

@@ -13,11 +13,8 @@ import './theme/theme-store.js';
 import 'zustand/middleware';
 import 'zustand';
 import 'lucide-react';
-import './feedback-BXKH-ToU.js';
-import './components/tooltip.js';
-import './hooks/use-anchored-rect.js';
-import './lib/clipping.js';
-import './data-table-labels-Cdn1QS2k.js';
+import './kit-labels-DQg82eHB.js';
+import './data-table-labels-DUELeXpa.js';
 import './components/data-table-sort.js';
 import './components/swipeable-row.js';
 import './components/mini-calendar.js';
@@ -25,6 +22,9 @@ import './components/calendar-heatmap.js';
 import './components/popover.js';
 import './components/chip.js';
 import './components/field-sync.js';
+import './components/tooltip.js';
+import './hooks/use-anchored-rect.js';
+import './lib/clipping.js';
 import './wizard/types.js';
 import './tour/tour.js';
 import './search/command-palette.js';
@@ -45,19 +45,21 @@ import './components/dialog-frame.js';
 import './components/modal.js';
 import './hooks/use-search-param-state.js';
 import './components/measured-grid.js';
-import './components/account-settings-labels.js';
+import './components/user-avatar.js';
+import './components/status-dot.js';
+import './components/progress-bar.js';
+import './components/signed-amount.js';
 import './components/floating-panel.js';
+import './hooks/use-authed-src.js';
+import './components/account-settings-labels.js';
 import './components/bulk-action-bar.js';
 import './components/list.js';
-import './components/signed-amount.js';
 import './components/breadcrumbs.js';
 import './components/toast.js';
 import './components/description-list.js';
 import './components/line-items.js';
-import './components/progress-bar.js';
 import './components/error-boundary.js';
 import './components/authed-image.js';
-import './hooks/use-authed-src.js';
 import './components/image-grid.js';
 import './components/lightbox.js';
 import './components/write-lock.js';
@@ -79,5 +81,3 @@ import './lib/column-mapping.js';
 import './lib/table-text.js';
 import './components/field-parts.js';
 import './components/menu-item.js';
-import './components/user-avatar.js';
-import './components/status-dot.js';

package/dist/wizard/stepper-nav.d.ts

@@ -1,11 +1,8 @@
 import * as react from 'react';
 import { ReactNode, ReactElement } from 'react';
-import { f as ButtonVariant } from '../feedback-BXKH-ToU.js';
+import { bA as ButtonVariant } from '../kit-labels-DQg82eHB.js';
 import { UseWizardReturn, WizardLabels } from './types.js';
-import '../components/tooltip.js';
-import '../hooks/use-anchored-rect.js';
-import '../lib/clipping.js';
-import '../data-table-labels-Cdn1QS2k.js';
+import '../data-table-labels-DUELeXpa.js';
 import '../components/data-table-sort.js';
 import '../components/swipeable-row.js';
 import '../components/mini-calendar.js';
@@ -14,6 +11,9 @@ import '../components/popover.js';
 import '../components/chip.js';
 import 'lucide-react';
 import '../components/field-sync.js';
+import '../components/tooltip.js';
+import '../hooks/use-anchored-rect.js';
+import '../lib/clipping.js';
 import '../tour/tour.js';
 import '../search/command-palette.js';
 import '../search/global-search.js';
@@ -33,19 +33,23 @@ import '../components/dialog-frame.js';
 import '../components/modal.js';
 import '../hooks/use-search-param-state.js';
 import '../components/measured-grid.js';
-import '../components/account-settings-labels.js';
+import '../components/user-avatar.js';
+import '../components/status-dot.js';
+import '../components/progress-bar.js';
+import '../components/signed-amount.js';
+import '../shell/topbar-action-menu.js';
+import '../components/menu-item.js';
 import '../components/floating-panel.js';
+import '../hooks/use-authed-src.js';
+import '../components/account-settings-labels.js';
 import '../components/bulk-action-bar.js';
 import '../components/list.js';
-import '../components/signed-amount.js';
 import '../components/breadcrumbs.js';
 import '../components/toast.js';
 import '../components/description-list.js';
 import '../components/line-items.js';
-import '../components/progress-bar.js';
 import '../components/error-boundary.js';
 import '../components/authed-image.js';
-import '../hooks/use-authed-src.js';
 import '../components/image-grid.js';
 import '../components/lightbox.js';
 import '../components/write-lock.js';

package/dist/wizard.d.ts

@@ -6,11 +6,8 @@ export { WizardStep, WizardStepProps } from './wizard/wizard-step.js';
 export { WizardSummary } from './wizard/wizard-summary.js';
 export { StepperNav } from './wizard/stepper-nav.js';
 import 'react';
-import './feedback-BXKH-ToU.js';
-import './components/tooltip.js';
-import './hooks/use-anchored-rect.js';
-import './lib/clipping.js';
-import './data-table-labels-Cdn1QS2k.js';
+import './kit-labels-DQg82eHB.js';
+import './data-table-labels-DUELeXpa.js';
 import './components/data-table-sort.js';
 import './components/swipeable-row.js';
 import './components/mini-calendar.js';
@@ -19,6 +16,9 @@ import './components/popover.js';
 import './components/chip.js';
 import 'lucide-react';
 import './components/field-sync.js';
+import './components/tooltip.js';
+import './hooks/use-anchored-rect.js';
+import './lib/clipping.js';
 import './tour/tour.js';
 import './search/command-palette.js';
 import './search/global-search.js';
@@ -38,19 +38,23 @@ import './components/dialog-frame.js';
 import './components/modal.js';
 import './hooks/use-search-param-state.js';
 import './components/measured-grid.js';
-import './components/account-settings-labels.js';
+import './components/user-avatar.js';
+import './components/status-dot.js';
+import './components/progress-bar.js';
+import './components/signed-amount.js';
+import './shell/topbar-action-menu.js';
+import './components/menu-item.js';
 import './components/floating-panel.js';
+import './hooks/use-authed-src.js';
+import './components/account-settings-labels.js';
 import './components/bulk-action-bar.js';
 import './components/list.js';
-import './components/signed-amount.js';
 import './components/breadcrumbs.js';
 import './components/toast.js';
 import './components/description-list.js';
 import './components/line-items.js';
-import './components/progress-bar.js';
 import './components/error-boundary.js';
 import './components/authed-image.js';
-import './hooks/use-authed-src.js';
 import './components/image-grid.js';
 import './components/lightbox.js';
 import './components/write-lock.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eifi1/ui-kit",
-  "version": "0.26.0",
+  "version": "0.27.0",
   "type": "module",
   "description": "App-agnostic shared design system: domain-free React components, theme and tokens.",
   "_sideEffects": "The barrel (src/index.ts) re-exports EVERY component, including components/chart, which statically imports recharts. Without this field a bundler must assume each of those modules has side effects, so it cannot drop the unused ones: importing a Button from '@eifi1/ui-kit' dragged all 433KB of recharts into the consumer's ENTRY chunk, and Keksdose was preloading it on every page load, login included. Nothing in src/ imports for side effects (no bare imports, no CSS imports from JS, no module-level global writes) — the token stylesheet is its own './tokens.css' export — so this is safe. CSS is still listed so any future stylesheet survives. Re-checked when `flag-icons` left `dependencies` and tsup started emitting a `\"use client\"` banner: neither touches this. The flag stylesheet was never imported from JS in the first place (that was the finding), and a directive prologue is a string literal every bundler lifts out before it decides whether a module is inert.",
@@ -99,6 +99,7 @@
   },
   "peerDependencies": {
     "lucide-react": ">=0.400.0 <2",
+    "modern-screenshot": "^4.7.0",
     "react": ">=19",
     "react-dom": ">=19",
     "react-hook-form": "^7.55.0",
@@ -107,6 +108,9 @@
     "sonner": ">=2"
   },
   "peerDependenciesMeta": {
+    "modern-screenshot": {
+      "optional": true
+    },
     "react-hook-form": {
       "optional": true
     },
@@ -142,6 +146,7 @@
     "husky": "^9.1.7",
     "jsdom": "^30.0.1",
     "lucide-react": "^1.47.0",
+    "modern-screenshot": "^4.7.0",
     "react-hook-form": "^7.88.0",
     "react-router": "^8.3.0",
     "recharts": "^3.8.1",

package/src/components/data-table.tsx

@@ -399,6 +399,11 @@ export interface DataTableProps<T> {
    * key/value rows) with a compact custom layout, while keeping the shared
    * clickable/expandable row wrapper. Use when the stacked label/value grid
    * wastes space (feedback #317). Desktop is unaffected.
+   *
+   * It replaces the WHOLE body, `mobilePrimary` included: a column's
+   * `mobilePrimary` cell is not drawn when `mobileCard` is set, so anything that
+   * cell carried (keksdose's environment and rework chips, 0.27) must be drawn by
+   * the card itself — as `FeedbackMobileCard` does.
    */
   mobileCard?: (row: T) => ReactNode;
   /**

package/src/feedback/feedback-attachment.tsx

@@ -65,16 +65,32 @@ export interface FeedbackAttachmentFieldLabels {
   attachmentUploadFailed?: (name: string) => string;
 }
 
+/**
+ * English, in the feedback contract's wording since 0.27.0 (docs/feedback-harmonization.md
+ * §4.2: keksdose's `feedback.*` keys are the canon, and the kit owns them now). Three
+ * strings moved with it:
+ *
+ * - `attachmentAdd` "Attach image" → **"Add attachment"**: the field takes a PDF or a text
+ *   log as well wherever the app passes `FEEDBACK_ATTACHMENT_ACCEPT` (keksdose feedback
+ *   #87), and a button that says "image" over a picker that offers a PDF is wrong in one
+ *   of the two places.
+ * - `attachmentPaste` → keksdose's longer line, which says WHY one would paste — a region
+ *   snip shows one corner rather than the whole page (Steering Design feedback #39).
+ * - `attachmentLimit` for one: "remove **it**", as keksdose's `attachments_full_one`;
+ *   "remove one" of a single file read oddly.
+ */
 export const DEFAULT_FEEDBACK_ATTACHMENT_LABELS: FeedbackAttachmentFieldLabels = {
-  attachmentAdd: "Attach image",
+  attachmentAdd: "Add attachment",
   attachmentCapture: "Capture screenshot",
-  attachmentPaste: "…or paste a screenshot from the clipboard.",
+  attachmentPaste: "…or paste a screenshot straight from the clipboard, so you can show one corner rather than the whole page.",
   attachmentRemove: "Remove attachment",
   attachmentList: "Attachments",
   attachmentScreenshot: "Screenshot",
   attachmentRemoveFile: (name) => `Remove ${name}`,
   attachmentLimit: (max) =>
-    `Up to ${max} ${max === 1 ? "attachment" : "attachments"} — remove one to add another.`,
+    max === 1
+      ? "Up to 1 attachment — remove it to add another."
+      : `Up to ${max} attachments — remove one to add another.`,
   attachmentUploading: "Uploading…",
   attachmentUploadFailed: (name) => `“${name}” could not be uploaded`,
 };