@lotics/ui 13.7.0 → 13.7.1

package/docs/catalog.md

@@ -740,7 +740,8 @@ source (`src/<module>.tsx`/`.ts`) is the API reference.
   `useDialogNavigation`): the centered card over a scrim; BAKES a screen router in
   (`<Dialog><Screen route="">…` — see `screen_router`).
 - **`drawer`** — `Drawer` + `DrawerFooter`: the docked side panel with scrim; the register
-  row's edit surface.
+  row's edit surface. ONE standard width (600px) — pass `width` only for a genuinely
+  exceptional panel; full-width on small screens.
 - **`modal`** — `Modal` + `ModalHeader` + `ModalBody` + `ModalFooter` — the full-bleed,
   edge-to-edge takeover: an OPAQUE surface that COVERS THE WHOLE SCREEN, so unlike Dialog
   (centered card WITH scrim) and Drawer (docked panel WITH scrim) there is nothing behind it

package/examples/tpl_item_list.tsx

@@ -957,7 +957,6 @@ function RecordDrawer({ hs, daThu, onPaid, tasks, onTasksChange, suggestions, on
           hs.khach
         )
       }
-      width={440}
       onPrev={canGoBack ? undefined : onPrev}
       onNext={canGoBack ? undefined : onNext}
       position={canGoBack ? undefined : position}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lotics/ui",
-  "version": "13.7.0",
+  "version": "13.7.1",
   "type": "module",
   "exports": {
     "./vite": {

package/src/drawer.tsx

@@ -13,7 +13,11 @@ export interface DrawerProps {
   onOpenChange: (open: boolean) => void;
   /** Header title. A string renders as the standard title; a node renders as-is. */
   title?: ReactNode;
-  /** Panel width on non-small screens (number = px, or a `%` string). Full-width on small screens. */
+  /**
+   * Panel width on non-small screens (number = px, or a `%` string). Rarely set —
+   * the ONE standard width (600) fits record side-panels and lighter detail alike;
+   * override only for a genuinely exceptional panel. Full-width on small screens.
+   */
   width?: number | `${number}%`;
   /**
    * Record sequencing — step to the previous/next record WITHOUT closing the
@@ -43,8 +47,12 @@ export interface DrawerProps {
  * the scrim and the header close button both dismiss it. The panel goes
  * full-width on small screens.
  */
+/** The ONE standard drawer width — every drawer is this wide unless it passes an
+ *  explicit `width` for a genuinely exceptional case. */
+const DRAWER_WIDTH = 600;
+
 export function Drawer(props: DrawerProps) {
-  const { open, onOpenChange, title, width = 420, onPrev, onNext, position, children, testID } = props;
+  const { open, onOpenChange, title, width = DRAWER_WIDTH, onPrev, onNext, position, children, testID } = props;
   const loc = useLoticsLocale().drawer;
   const screenSize = useScreenSize();
   useOverlayScope(open);