@flowgram.ai/fixed-layout-core 0.3.6 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/esm/index.js CHANGED
@@ -1781,24 +1781,59 @@ var MultiInputsRegistry = {
1781
1781
  };
1782
1782
 
1783
1783
  // src/activities/slot/slot.ts
1784
- import { FlowNodeBaseType as FlowNodeBaseType28 } from "@flowgram.ai/document";
1784
+ import { FlowNodeBaseType as FlowNodeBaseType28, getDefaultSpacing as getDefaultSpacing13 } from "@flowgram.ai/document";
1785
1785
 
1786
1786
  // src/activities/slot/utils/transition.ts
1787
1787
  import { Point as Point7 } from "@flowgram.ai/utils";
1788
1788
  import {
1789
1789
  FlowTransitionLineEnum as FlowTransitionLineEnum7,
1790
- FlowTransitionLabelEnum as FlowTransitionLabelEnum15
1790
+ FlowTransitionLabelEnum as FlowTransitionLabelEnum15,
1791
+ getDefaultSpacing as getDefaultSpacing10
1791
1792
  } from "@flowgram.ai/document";
1792
1793
 
1793
1794
  // src/activities/slot/constants.ts
1794
1795
  import { FlowRendererKey as FlowRendererKey5 } from "@flowgram.ai/renderer";
1795
1796
  var RENDER_SLOT_ADDER_KEY = FlowRendererKey5.SLOT_ADDER;
1796
- var RENDER_SLOT_COLLAPSE_KEY = FlowRendererKey5.SLOT_COLLPASE;
1797
- var SLOT_BLOCK_DISTANCE = 60;
1798
- var SLOT_COLLAPSE_MARGIN = 20;
1797
+ var RENDER_SLOT_LABEL_KEY = FlowRendererKey5.SLOT_LABEL;
1798
+ var RENDER_SLOT_COLLAPSE_KEY = FlowRendererKey5.SLOT_COLLAPSE;
1799
+ var SlotSpacingKey = {
1800
+ /**
1801
+ * = Next Node - Slot END
1802
+ */
1803
+ SLOT_SPACING: "SLOT_SPACING",
1804
+ /**
1805
+ * = Slot Start Line - Slot Icon Right
1806
+ */
1807
+ SLOT_START_DISTANCE: "SLOT_START_DISTANCE",
1808
+ /**
1809
+ * = Slot Radius
1810
+ */
1811
+ SLOT_RADIUS: "SLOT_RADIUS",
1812
+ /**
1813
+ * = Slot Port - Slot Start
1814
+ */
1815
+ SLOT_PORT_DISTANCE: "SLOT_PORT_DISTANCE",
1816
+ /**
1817
+ * = Slot Label - Slot Start
1818
+ */
1819
+ SLOT_LABEL_DISTANCE: "SLOT_LABEL_DISTANCE",
1820
+ /**
1821
+ * = Slot Block - Slot Port
1822
+ */
1823
+ SLOT_BLOCK_PORT_DISTANCE: "SLOT_BLOCK_PORT_DISTANCE",
1824
+ /**
1825
+ * Vertical Layout: Slot Block - Slot Block
1826
+ */
1827
+ SLOT_BLOCK_VERTICAL_SPACING: "SLOT_BLOCK_VERTICAL_SPACING"
1828
+ };
1829
+ var SLOT_START_DISTANCE = 16;
1830
+ var SLOT_PORT_DISTANCE = 100;
1831
+ var SLOT_LABEL_DISTANCE = 32;
1832
+ var SLOT_BLOCK_PORT_DISTANCE = 32.5;
1833
+ var SLOT_RADIUS = 16;
1799
1834
  var SLOT_SPACING = 32;
1835
+ var SLOT_BLOCK_VERTICAL_SPACING = 32.5;
1800
1836
  var SLOT_NODE_LAST_SPACING = 10;
1801
- var SLOT_INLINE_BLOCKS_DELTA = SLOT_COLLAPSE_MARGIN + SLOT_BLOCK_DISTANCE * 2;
1802
1837
 
1803
1838
  // src/activities/slot/typings.ts
1804
1839
  import { FlowNodeBaseType as FlowNodeBaseType23 } from "@flowgram.ai/document";
@@ -1825,14 +1860,19 @@ var getSlotChildLineStartPoint = (iconTransform) => {
1825
1860
  if (!iconTransform) {
1826
1861
  return { x: 0, y: 0 };
1827
1862
  }
1863
+ const startDistance = getDefaultSpacing10(
1864
+ iconTransform.entity,
1865
+ SlotSpacingKey.SLOT_START_DISTANCE,
1866
+ SLOT_START_DISTANCE
1867
+ );
1828
1868
  if (!iconTransform.entity.isVertical) {
1829
1869
  return {
1830
1870
  x: iconTransform?.bounds.center.x,
1831
- y: iconTransform?.bounds.bottom + SLOT_COLLAPSE_MARGIN
1871
+ y: iconTransform?.bounds.bottom + startDistance
1832
1872
  };
1833
1873
  }
1834
1874
  return {
1835
- x: iconTransform?.bounds.right + SLOT_COLLAPSE_MARGIN,
1875
+ x: iconTransform?.bounds.right + startDistance,
1836
1876
  y: iconTransform?.bounds.center.y
1837
1877
  };
1838
1878
  };
@@ -1919,19 +1959,26 @@ var drawCollapseLabel = (transition) => {
1919
1959
  }
1920
1960
  ];
1921
1961
  };
1922
- var drawCollapseLine = (transition) => [
1923
- {
1924
- type: FlowTransitionLineEnum7.STRAIGHT_LINE,
1925
- from: getSlotChildLineStartPoint(transition.transform),
1926
- to: Point7.move(
1927
- getSlotChildLineStartPoint(transition.transform),
1928
- transition.entity.isVertical ? { x: -SLOT_COLLAPSE_MARGIN, y: 0 } : { x: 0, y: -SLOT_COLLAPSE_MARGIN }
1929
- ),
1930
- style: {
1931
- strokeDasharray: "5 5"
1962
+ var drawCollapseLine = (transition) => {
1963
+ const startDistance = getDefaultSpacing10(
1964
+ transition.transform.entity,
1965
+ SlotSpacingKey.SLOT_START_DISTANCE,
1966
+ SLOT_START_DISTANCE
1967
+ );
1968
+ return [
1969
+ {
1970
+ type: FlowTransitionLineEnum7.STRAIGHT_LINE,
1971
+ from: getSlotChildLineStartPoint(transition.transform),
1972
+ to: Point7.move(
1973
+ getSlotChildLineStartPoint(transition.transform),
1974
+ transition.entity.isVertical ? { x: -startDistance, y: 0 } : { x: 0, y: -startDistance }
1975
+ ),
1976
+ style: {
1977
+ strokeDasharray: "5 5"
1978
+ }
1932
1979
  }
1933
- }
1934
- ];
1980
+ ];
1981
+ };
1935
1982
  var drawStraightAdder = (transition) => {
1936
1983
  const toPoint = getTransitionToPoint(transition);
1937
1984
  const fromPoint = transition.transform.firstChild.outputPoint;
@@ -2050,7 +2097,7 @@ var SlotIconRegistry = {
2050
2097
  };
2051
2098
 
2052
2099
  // src/activities/slot/extends/slot-inline-blocks.ts
2053
- import { FlowNodeBaseType as FlowNodeBaseType26 } from "@flowgram.ai/document";
2100
+ import { FlowNodeBaseType as FlowNodeBaseType26, getDefaultSpacing as getDefaultSpacing11 } from "@flowgram.ai/document";
2054
2101
  import { FlowNodeTransformData as FlowNodeTransformData3 } from "@flowgram.ai/document";
2055
2102
  var SlotInlineBlocksRegistry = {
2056
2103
  type: "slotInlineBlocks" /* SlotInlineBlocks */,
@@ -2092,21 +2139,37 @@ var SlotInlineBlocksRegistry = {
2092
2139
  if (!icon) {
2093
2140
  return { x: 0, y: 0 };
2094
2141
  }
2142
+ const startDistance = getDefaultSpacing11(
2143
+ transform.entity,
2144
+ SlotSpacingKey.SLOT_START_DISTANCE,
2145
+ SLOT_START_DISTANCE
2146
+ );
2147
+ const portDistance = getDefaultSpacing11(
2148
+ transform.entity,
2149
+ SlotSpacingKey.SLOT_PORT_DISTANCE,
2150
+ SLOT_PORT_DISTANCE
2151
+ );
2152
+ const portBlockDistance = getDefaultSpacing11(
2153
+ transform.entity,
2154
+ SlotSpacingKey.SLOT_BLOCK_PORT_DISTANCE,
2155
+ SLOT_BLOCK_PORT_DISTANCE
2156
+ );
2095
2157
  if (!transform.entity.isVertical) {
2096
2158
  const noChildren = transform?.children?.every?.((_port) => !_port.children.length);
2097
2159
  if (noChildren) {
2098
2160
  return {
2099
- x: SLOT_BLOCK_DISTANCE - icon.localBounds.width / 2,
2100
- y: icon.localBounds.bottom + SLOT_COLLAPSE_MARGIN
2161
+ x: portDistance - icon.localBounds.width / 2,
2162
+ y: icon.localBounds.bottom + startDistance
2101
2163
  };
2102
2164
  }
2103
2165
  return {
2104
- x: 2 * SLOT_BLOCK_DISTANCE - icon.localBounds.width / 2,
2105
- y: icon.localBounds.bottom + SLOT_COLLAPSE_MARGIN
2166
+ x: portDistance + portBlockDistance - icon.localBounds.width / 2,
2167
+ y: icon.localBounds.bottom + startDistance
2106
2168
  };
2107
2169
  }
2170
+ const slotInlineBlockDelta = startDistance + portDistance + portBlockDistance;
2108
2171
  return {
2109
- x: icon.localBounds.right + SLOT_INLINE_BLOCKS_DELTA,
2172
+ x: icon.localBounds.right + slotInlineBlockDelta,
2110
2173
  y: -icon.localBounds.height
2111
2174
  };
2112
2175
  }
@@ -2117,7 +2180,8 @@ import { mean as mean2 } from "lodash";
2117
2180
  import {
2118
2181
  FlowNodeBaseType as FlowNodeBaseType27,
2119
2182
  FlowTransitionLabelEnum as FlowTransitionLabelEnum16,
2120
- FlowTransitionLineEnum as FlowTransitionLineEnum8
2183
+ FlowTransitionLineEnum as FlowTransitionLineEnum8,
2184
+ getDefaultSpacing as getDefaultSpacing12
2121
2185
  } from "@flowgram.ai/document";
2122
2186
  import { FlowNodeTransformData as FlowNodeTransformData4 } from "@flowgram.ai/document";
2123
2187
  var SlotBlockRegistry = {
@@ -2130,7 +2194,11 @@ var SlotBlockRegistry = {
2130
2194
  if (!transform.entity.isVertical && transform.size.width === 0) {
2131
2195
  return 90;
2132
2196
  }
2133
- return 30;
2197
+ return getDefaultSpacing12(
2198
+ transform.entity,
2199
+ SlotSpacingKey.SLOT_BLOCK_VERTICAL_SPACING,
2200
+ SLOT_BLOCK_VERTICAL_SPACING
2201
+ );
2134
2202
  },
2135
2203
  isInlineBlocks: (node) => !node.isVertical
2136
2204
  },
@@ -2138,22 +2206,53 @@ var SlotBlockRegistry = {
2138
2206
  const icon = transition.transform.parent?.pre;
2139
2207
  const start = getSlotChildLineStartPoint(icon);
2140
2208
  const portPoint = transition.transform.inputPoint;
2209
+ const radius = getDefaultSpacing12(
2210
+ transition.transform.entity,
2211
+ SlotSpacingKey.SLOT_RADIUS,
2212
+ SLOT_RADIUS
2213
+ );
2214
+ let startPortVertices = [{ x: start.x, y: portPoint.y }];
2215
+ if (transition.entity.isVertical) {
2216
+ const deltaY = Math.abs(portPoint.y - start.y);
2217
+ let deltaX = radius;
2218
+ let isTruncated = false;
2219
+ if (deltaY < radius * 2) {
2220
+ isTruncated = true;
2221
+ if (deltaY < radius) {
2222
+ deltaX = Math.sqrt(radius ** 2 - (radius - deltaY) ** 2);
2223
+ }
2224
+ }
2225
+ startPortVertices = [
2226
+ {
2227
+ x: start.x + deltaX,
2228
+ y: start.y,
2229
+ radiusX: radius,
2230
+ radiusY: radius,
2231
+ radiusOverflow: "truncate"
2232
+ },
2233
+ {
2234
+ x: start.x + deltaX,
2235
+ y: portPoint.y,
2236
+ ...isTruncated ? { radiusX: 0, radiusY: 0 } : {}
2237
+ }
2238
+ ];
2239
+ }
2141
2240
  return [
2142
2241
  {
2143
2242
  type: FlowTransitionLineEnum8.ROUNDED_LINE,
2144
2243
  from: start,
2145
2244
  to: portPoint,
2146
- vertices: [{ x: start.x, y: portPoint.y }],
2245
+ vertices: startPortVertices,
2147
2246
  style: {
2148
2247
  strokeDasharray: "5 5"
2149
2248
  },
2150
- radius: 5
2249
+ radius
2151
2250
  },
2152
2251
  ...transition.transform.children.map((_child) => {
2153
2252
  const childInput = getPortChildInput(_child);
2154
2253
  return {
2155
2254
  type: FlowTransitionLineEnum8.ROUNDED_LINE,
2156
- radius: 5,
2255
+ radius,
2157
2256
  from: portPoint,
2158
2257
  to: childInput,
2159
2258
  vertices: [{ x: portPoint.x, y: childInput.y }],
@@ -2165,6 +2264,8 @@ var SlotBlockRegistry = {
2165
2264
  ];
2166
2265
  },
2167
2266
  getLabels(transition) {
2267
+ const icon = transition.transform.parent?.pre;
2268
+ const start = getSlotChildLineStartPoint(icon);
2168
2269
  const portPoint = transition.transform.inputPoint;
2169
2270
  return [
2170
2271
  {
@@ -2174,6 +2275,22 @@ var SlotBlockRegistry = {
2174
2275
  node: transition.entity
2175
2276
  },
2176
2277
  offset: portPoint
2278
+ },
2279
+ {
2280
+ type: FlowTransitionLabelEnum16.CUSTOM_LABEL,
2281
+ renderKey: RENDER_SLOT_LABEL_KEY,
2282
+ props: {
2283
+ node: transition.entity
2284
+ },
2285
+ offset: {
2286
+ x: start.x + getDefaultSpacing12(
2287
+ transition.entity,
2288
+ SlotSpacingKey.SLOT_LABEL_DISTANCE,
2289
+ SLOT_LABEL_DISTANCE
2290
+ ),
2291
+ y: portPoint.y
2292
+ },
2293
+ origin: [0, 0.5]
2177
2294
  }
2178
2295
  ];
2179
2296
  },
@@ -2188,7 +2305,7 @@ var SlotBlockRegistry = {
2188
2305
  ]);
2189
2306
  }
2190
2307
  return {
2191
- x: start.x + SLOT_BLOCK_DISTANCE,
2308
+ x: start.x + getDefaultSpacing12(transform.entity, SlotSpacingKey.SLOT_PORT_DISTANCE, SLOT_PORT_DISTANCE),
2192
2309
  y: inputY
2193
2310
  };
2194
2311
  },
@@ -2231,10 +2348,10 @@ var SlotRegistry = {
2231
2348
  // Slot 节点内部暂时不允许拖拽
2232
2349
  draggable: (node) => !insideSlot(node),
2233
2350
  hidden: true,
2234
- spacing: SLOT_SPACING,
2351
+ spacing: (node) => getDefaultSpacing13(node.entity, SlotSpacingKey.SLOT_SPACING, SLOT_SPACING),
2235
2352
  padding: (node) => ({
2236
2353
  left: 0,
2237
- right: node.collapsed ? SLOT_COLLAPSE_MARGIN : 0,
2354
+ right: node.collapsed ? getDefaultSpacing13(node.entity, SlotSpacingKey.SLOT_START_DISTANCE, SLOT_START_DISTANCE) : 0,
2238
2355
  bottom: !insideSlot(node.entity) && node.isLast ? SLOT_NODE_LAST_SPACING : 0,
2239
2356
  top: 0
2240
2357
  }),
@@ -2409,6 +2526,7 @@ var FixedLayoutRegistries = {
2409
2526
  };
2410
2527
  export {
2411
2528
  FixedLayoutContainerModule,
2412
- FixedLayoutRegistries
2529
+ FixedLayoutRegistries,
2530
+ SlotSpacingKey
2413
2531
  };
2414
2532
  //# sourceMappingURL=index.js.map