@liquidcars/atlas-layout 0.1.14 → 0.1.16

package/README.md

@@ -135,6 +135,26 @@ layout:
 ```
 ````
 
+Las etiquetas de los elementos se colocan debajo por defecto. El modelo puede
+cambiar esa política de forma heredable mediante `style.label.anchor`; una
+entidad concreta puede sobrescribirla con la misma propiedad. Los títulos de
+los contenedores conservan su colocación automática salvo que el contenedor
+declare un anclaje explícito:
+
+```yaml
+style:
+  label:
+    anchor: bottom
+entities:
+  - id: source
+    geometry: sphere
+  - id: exceptional
+    geometry: box
+    style:
+      label:
+        anchor: top
+```
+
 Las relaciones admiten el modo visual canónico `directed`, `bidirectional` o `broken`:
 
 ```yaml

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@liquidcars/atlas-layout",
-  "version": "0.1.14",
+  "version": "0.1.16",
   "description": "Declarative layout compiler for LiquidCars Atlas models",
   "type": "module",
   "main": "./src/index.js",

package/spec/ATLAS-LAYOUT-SPEC-v1.md

@@ -5,7 +5,7 @@ The executable projection of this contract is packages/atlas-layout/src/spec.js.
 
 ## Root model
 
-A model may contain version, palette, theme, render, layout, entities and relations.
+A model may contain version, palette, theme, style, render, layout, entities and relations.
 Entities may be declared at the root or nested under children. The compiler normalizes
 nested entities to a flat list with parent references.
 
@@ -189,7 +189,9 @@ in the information panel.
 ## Rendering
 
 palette maps tokens to CSS colours. style.color or c can reference a token or direct
-CSS colour. render can additionally set relationMode, selectionMode, toolbar,
+CSS colour. At model level, `style.label.anchor` supplies the inherited item-label
+position and defaults to `bottom`; an entity may override it. Container titles stay
+automatic unless their entity declares an explicit label anchor. render can additionally set relationMode, selectionMode, toolbar,
 shellLabels (the text-label contrast outline), focus and camera. `render.focus`
 accepts `mode: all|connected`, `effect: dim|hide`, `layout: preserve|reflow`
 and an optional dim `opacity`. Connected focus retains the selection, its directly

package/src/index.js

@@ -6,6 +6,10 @@ import atlasLayoutPackage from "../package.json" with { type: "json" };
 export const ATLAS_LAYOUT_VERSION = atlasLayoutPackage.version;
 
 const DEFAULT_COLOR = "#b9d8eb";
+const DEFAULT_LABEL_ANCHOR = "bottom";
+const DEFAULT_MODEL_STYLE = Object.freeze({
+  label: Object.freeze({ anchor: DEFAULT_LABEL_ANCHOR })
+});
 
 const DEFAULT_SIZES = Object.freeze({
   box: [2.5, 1.2, 2.2],
@@ -284,7 +288,7 @@ function resolveColor(value, inherited, palette, diagnostics, entityId) {
   return palette.default_color;
 }
 
-function resolveStyles(entities, sourceById, childrenById, palette, diagnostics) {
+function resolveStyles(entities, sourceById, childrenById, palette, diagnostics, modelStyle) {
   const byId = new Map(entities.map(entity => [entity.id, entity]));
   const resolved = new Map();
 
@@ -296,12 +300,15 @@ function resolveStyles(entities, sourceById, childrenById, palette, diagnostics)
     style.color = resolveColor(style.color, parentStyle.color, palette, diagnostics, id);
     entity.style = style;
     entity.c = style.color;
+    const authoredLabelAnchor = source.style?.label?.anchor ?? source.labelAnchor ?? source.label_anchor;
+    if (authoredLabelAnchor != null) entity.labelAnchor = String(authoredLabelAnchor);
+    else if (!isContainerType(entity.type) && style.label?.anchor != null) entity.labelAnchor = String(style.label.anchor);
     if (style.radius != null && entity.radius == null) entity.radius = scalar(style.radius, 0);
     resolved.set(id, style);
     for (const childId of childrenById.get(id) || []) visit(childId, style);
   }
 
-  for (const entity of entities) if (!entity.parent) visit(entity.id);
+  for (const entity of entities) if (!entity.parent) visit(entity.id, modelStyle);
   return resolved;
 }
 
@@ -1843,7 +1850,9 @@ function compileResolvedAtlasModel(input, options = {}) {
   if (!flat.entities.length) diagnostic(diagnostics, "fatal", "NO_VALID_ENTITIES", "The model does not contain any valid entities.");
   const validIds = new Set(flat.entities.map(entity => entity.id));
   const relations = normalizeRelations(source.relations, validIds, diagnostics);
-  resolveStyles(flat.entities, flat.sourceById, flat.childrenById, palette, diagnostics);
+  const modelStyle = mergeStyle(DEFAULT_MODEL_STYLE, source.style || {});
+  if (!Object.keys(modelStyle.edges || {}).length) delete modelStyle.edges;
+  resolveStyles(flat.entities, flat.sourceById, flat.childrenById, palette, diagnostics, modelStyle);
   const byId = new Map(flat.entities.map(entity => [entity.id, entity]));
   const graphContext = { relations, byId };
   graphContext.graphOrderHints = globalGraphOrderHints(source, flat, relations, byId);
@@ -1906,6 +1915,7 @@ function compileResolvedAtlasModel(input, options = {}) {
   const output = {
     palette,
     theme: resolveTheme(source),
+    style: modelStyle,
     entities: flat.entities.map(entity => {
       const copy = { ...entity };
       delete copy.style;
@@ -1960,4 +1970,4 @@ export function compileAtlasModelWithDiagnostics(input, options = {}) {
   return { model, diagnostics: model.diagnostics || [] };
 }
 
-export const layoutDefaults = Object.freeze({ defaultColor: DEFAULT_COLOR, sizes: DEFAULT_SIZES, aspectFactors: ASPECT_FACTORS });
+export const layoutDefaults = Object.freeze({ defaultColor: DEFAULT_COLOR, labelAnchor: DEFAULT_LABEL_ANCHOR, sizes: DEFAULT_SIZES, aspectFactors: ASPECT_FACTORS });

package/src/spec.js

@@ -17,6 +17,7 @@ export const ATLAS_LAYOUT_SPEC_V1 = freeze({
         palette: field("Named model colours.", null, { context: "palette" }),
         theme: field("Renderer theme configuration.", null, { context: "theme" }),
         render: field("Renderer configuration.", null, { context: "render" }),
+        style: field("Inherited model appearance defaults.", null, { context: "style" }),
         layout: field("Assisted layout for root entities.", null, { context: "layout" }),
         constraints: field("Equal-size and edge-alignment rules for root siblings.", null, { context: "constraint", sequence: true }),
         entities: field("Top-level entities and containers.", null, { context: "entity", sequence: true }),
@@ -183,7 +184,14 @@ export const ATLAS_LAYOUT_SPEC_V1 = freeze({
         offset: field("Masonry row offset; defaults to half-cell.", ["half-cell"], { type: "string" })
       })
     }),
-    label: freeze({ label: "Label appearance", properties: freeze({ color: field("Label colour.", null, { valueSource: "palette" }), opacity: field("Label opacity.", null, { type: "number" }) }) }),
+    label: freeze({
+      label: "Label appearance",
+      properties: freeze({
+        color: field("Label colour.", null, { valueSource: "palette" }),
+        opacity: field("Label opacity.", null, { type: "number" }),
+        anchor: field("Label placement relative to the geometry.", ["auto", "top", "bottom", "left", "right"])
+      })
+    }),
     edges: freeze({ label: "Edge appearance", properties: freeze({ color: field("Edge colour.", null, { valueSource: "palette" }), opacity: field("Edge opacity.", null, { type: "number" }) }) }),
     background: freeze({ label: "Background", properties: freeze({ color: field("Background colour.", null, { type: "color" }), glow: field("Background glow colour.", null, { type: "color" }) }) }),
     lighting: freeze({ label: "Lighting", properties: freeze({ ambient: field("Ambient intensity.", null, { type: "number" }), directional: field("Directional intensity.", null, { type: "number" }) }) }),