@formicoidea/labre-ddd-shared 0.29.1 → 0.31.0

package/dist/shared/prefabs.d.ts

@@ -9,7 +9,13 @@ import type { GfxController } from '@formicoidea/labre-core/std/gfx';
 type Surface = NonNullable<GfxController['surface']>;
 /** Group several element ids; returns the group id (or the first id on failure). */
 export declare function groupIds(std: BlockStdScope, ids: string[]): string;
-/** A post-it: faux-shadow rect + coloured face + centred handwriting label, grouped. */
+/**
+ * A post-it: faux-shadow rect + coloured face whose label is the face's OWN
+ * shape text in `contained` fit mode — like a real post-it, the box size is
+ * fixed and the handwriting shrinks to fit. Grouped so shadow and face move
+ * together. (Stickies created before the text-fit feature carry a separate
+ * text element; they keep working untouched.)
+ */
 export declare function addSticky(surface: Surface, std: BlockStdScope, cx: number, cy: number, opts: {
     fill: string;
     text: string;
@@ -17,8 +23,12 @@ export declare function addSticky(surface: Surface, std: BlockStdScope, cx: numb
     shapeType?: 'rect' | 'diamond';
     size?: number;
 }): string;
-/** A Context Map bounded-context bubble (rounded pill + centred label). */
-export declare function addBubble(surface: Surface, std: BlockStdScope, cx: number, cy: number, label: string): string;
+/**
+ * A Context Map bounded-context bubble: a rounded pill whose label is the
+ * pill's own shape text in `overflow` fit mode (fixed pill, fixed font — a
+ * long context name may spill out rather than deform the map).
+ */
+export declare function addBubble(surface: Surface, cx: number, cy: number, label: string): string;
 /** A Core Domain dot (sub-domain / bounded context); optional label to its right. */
 export declare function addDot(surface: Surface, std: BlockStdScope, cx: number, cy: number, fill: string, label?: string): string;
 /** A free-floating label. */

package/dist/shared/prefabs.js

@@ -1,7 +1,8 @@
 import { createGroupCommand } from '@formicoidea/labre-core/gfx/group';
-import { ConnectorMode, FontWeight, PointStyle, ShapeStyle, StrokeStyle, } from '@formicoidea/labre-core/model';
+import { ConnectorMode, FontWeight, PointStyle, ShapeStyle, StrokeStyle, TextFitMode, } from '@formicoidea/labre-core/model';
 import { Bound } from '@formicoidea/labre-core/global/gfx';
-import { CLOUD, CLOUD_VERTICES, CM_BUBBLE, DOT_SIZE, LABEL_COLOR, LABEL_FONT, LABEL_FONT_SIZE, MARKER_SIZE, SHADOW_COLOR, SHADOW_OFFSET, STICKY_FONT, STICKY_FONT_SIZE, STICKY_RADIUS, STICKY_SIZE, } from './consts';
+import * as Y from 'yjs';
+import { CLOUD, CLOUD_VERTICES, CM_BUBBLE, DOT_SIZE, LABEL_COLOR, LABEL_FONT, LABEL_FONT_SIZE, MARKER_SIZE, SHADOW_COLOR, SHADOW_OFFSET, STICKY_FONT, STICKY_FONT_SIZE, STICKY_RADIUS, STICKY_SIZE, } from './consts.js';
 const NO_STROKE = '#00000000';
 /** Group several element ids; returns the group id (or the first id on failure). */
 export function groupIds(std, ids) {
@@ -9,7 +10,7 @@ export function groupIds(std, ids) {
     return result.groupId || ids[0];
 }
 function addShape(surface, x, y, w, h, opts) {
-    const { shapeType = 'rect', fill, stroke = NO_STROKE, strokeWidth = 0, radius = 0 } = opts;
+    const { shapeType = 'rect', fill, stroke = NO_STROKE, strokeWidth = 0, radius = 0, label } = opts;
     return surface.addElement({
         type: 'shape',
         shapeType,
@@ -21,6 +22,16 @@ function addShape(surface, x, y, w, h, opts) {
         roughness: 0,
         radius,
         xywh: new Bound(x, y, w, h).serialize(),
+        ...(label
+            ? {
+                text: new Y.Text(label.text),
+                color: label.color,
+                fontFamily: label.fontFamily,
+                fontSize: label.fontSize,
+                textAlign: 'center',
+                textFitMode: label.fit,
+            }
+            : {}),
     });
 }
 function addText(surface, x, y, w, text, color, fontFamily, fontSize, textAlign = 'center', bold = false) {
@@ -35,7 +46,13 @@ function addText(surface, x, y, w, text, color, fontFamily, fontSize, textAlign
         xywh: new Bound(x, y, w, fontSize + 10).serialize(),
     });
 }
-/** A post-it: faux-shadow rect + coloured face + centred handwriting label, grouped. */
+/**
+ * A post-it: faux-shadow rect + coloured face whose label is the face's OWN
+ * shape text in `contained` fit mode — like a real post-it, the box size is
+ * fixed and the handwriting shrinks to fit. Grouped so shadow and face move
+ * together. (Stickies created before the text-fit feature carry a separate
+ * text element; they keep working untouched.)
+ */
 export function addSticky(surface, std, cx, cy, opts) {
     const { fill, text, label, shapeType = 'rect', size = STICKY_SIZE } = opts;
     const half = size / 2;
@@ -45,21 +62,40 @@ export function addSticky(surface, std, cx, cy, opts) {
         fill: SHADOW_COLOR,
         radius,
     });
-    const face = addShape(surface, cx - half, cy - half, size, size, { shapeType, fill, radius });
-    const lbl = addText(surface, cx - half + 10, cy - STICKY_FONT_SIZE / 2, size - 20, label, text, STICKY_FONT, STICKY_FONT_SIZE);
-    return groupIds(std, [shadow, face, lbl]);
+    const face = addShape(surface, cx - half, cy - half, size, size, {
+        shapeType,
+        fill,
+        radius,
+        label: {
+            text: label,
+            color: text,
+            fontFamily: STICKY_FONT,
+            fontSize: STICKY_FONT_SIZE,
+            fit: TextFitMode.Contained,
+        },
+    });
+    return groupIds(std, [shadow, face]);
 }
-/** A Context Map bounded-context bubble (rounded pill + centred label). */
-export function addBubble(surface, std, cx, cy, label) {
+/**
+ * A Context Map bounded-context bubble: a rounded pill whose label is the
+ * pill's own shape text in `overflow` fit mode (fixed pill, fixed font — a
+ * long context name may spill out rather than deform the map).
+ */
+export function addBubble(surface, cx, cy, label) {
     const { w, h, radius, fill, stroke, text } = CM_BUBBLE;
-    const box = addShape(surface, cx - w / 2, cy - h / 2, w, h, {
+    return addShape(surface, cx - w / 2, cy - h / 2, w, h, {
         fill,
         stroke,
         strokeWidth: 1.5,
         radius,
+        label: {
+            text: label,
+            color: text,
+            fontFamily: LABEL_FONT,
+            fontSize: LABEL_FONT_SIZE,
+            fit: TextFitMode.Overflow,
+        },
     });
-    const lbl = addText(surface, cx - w / 2 + 8, cy - LABEL_FONT_SIZE / 2, w - 16, label, text, LABEL_FONT, LABEL_FONT_SIZE);
-    return groupIds(std, [box, lbl]);
 }
 /** A Core Domain dot (sub-domain / bounded context); optional label to its right. */
 export function addDot(surface, std, cx, cy, fill, label) {

package/dist/templates/components.js

@@ -1,6 +1,6 @@
 import { makeTemplateSnapshot, surfaceText, } from '@formicoidea/labre-core/gfx/template';
 import { ConnectorMode, FontFamily, PointStyle, ShapeStyle, StrokeStyle, TextAlign, } from '@formicoidea/labre-core/model';
-import { CD_SUBDOMAINS, CLOUD, CLOUD_VERTICES, CM_BUBBLE, CM_RELATIONSHIPS, ES_HOTSPOT, ES_STICKIES, MOVEMENT_COLOR, TEAM_TOPOLOGIES, } from '../shared/consts';
+import { CD_SUBDOMAINS, CLOUD, CLOUD_VERTICES, CM_BUBBLE, CM_RELATIONSHIPS, ES_HOTSPOT, ES_STICKIES, MOVEMENT_COLOR, TEAM_TOPOLOGIES, } from '../shared/consts.js';
 /**
  * Every DDD component (the things the three senior menus create) re-expressed as
  * an insertable Template, so the whole toolbox is also available from the

package/dist/toolbar/senior-buttons.js

@@ -26,6 +26,8 @@ export class DddSeniorButtonBase extends EdgelessToolbarToolMixin(SignalWatcher(
       width: 100%;
       height: 64px;
       cursor: pointer;
+      /* no double-tap-zoom / 300ms tap delay on touch screens */
+      touch-action: manipulation;
       display: flex;
       align-items: flex-end;
       justify-content: center;
@@ -44,7 +46,8 @@ export class DddSeniorButtonBase extends EdgelessToolbarToolMixin(SignalWatcher(
       width: 100%;
       height: 100%;
     }
-    .ddd-root:hover .ddd-card {
+    .ddd-root:hover .ddd-card,
+    .ddd-root:active .ddd-card {
       --y: -10px;
       --s: 1.07;
     }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@formicoidea/labre-ddd-shared",
   "description": "Labre ddd-shared — shared building blocks for @formicoidea/labre-core frameworks.",
-  "version": "0.29.1",
+  "version": "0.31.0",
   "type": "module",
   "sideEffects": false,
   "author": "lajola",
@@ -19,7 +19,7 @@
     "dist"
   ],
   "dependencies": {
-    "@formicoidea/labre-core": "0.29.1",
+    "@formicoidea/labre-core": "0.31.0",
     "lit": "^3.2.0"
   }
 }