@cardenelabs/cdl 0.46.0 → 0.48.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/CHANGELOG.md +64 -1
- package/dist/index.cjs +135 -23
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +29 -3
- package/dist/index.d.ts +29 -3
- package/dist/index.js +133 -24
- package/dist/index.js.map +1 -1
- package/dist/react.cjs +131 -23
- package/dist/react.cjs.map +1 -1
- package/dist/react.d.cts +1 -1
- package/dist/react.d.ts +1 -1
- package/dist/react.js +131 -23
- package/dist/react.js.map +1 -1
- package/dist/{render-UGswDfAh.d.cts → render-C53-PeJZ.d.cts} +25 -1
- package/dist/{render-UGswDfAh.d.ts → render-C53-PeJZ.d.ts} +25 -1
- package/package.json +1 -1
- package/src/index.ts +6 -0
- package/src/layout/edges.ts +95 -23
- package/src/layout.ts +1 -0
- package/src/render/edges.tsx +19 -0
- package/src/render/nodes.tsx +40 -1
- package/src/render/relation-focus.ts +40 -0
- package/src/render/stage.tsx +55 -2
- package/src/types.ts +27 -0
package/dist/index.d.cts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { C as CdlDiagram, S as Signal, a as CdlInput, b as CdlLane, c as CdlNode, T as Tone, d as Side, E as EdgeStyle, e as EdgeRole, f as EdgeHead, g as EdgeHeadFill, h as CdlState, i as CdlEventTarget, j as Computed, k as CdlDerivedValue, l as CdlScrollTrigger, L as LaidDiagram, m as CdlDiagramViewProps, n as LaidEdge, o as LaidNode, p as CdlEdge, B as BBox, R as RowMark, N as NodeKind, J as JourneyEmotion, Q as QuadrantKey } from './render-
|
|
2
|
-
export { q as CdlDiagramView, r as CdlEventBinding, s as CdlEventKind, t as CdlFormula, u as CdlPhase, v as ChartPieForm, w as ChartSlopeForm, x as EDGE_HEADS, y as EDGE_HEAD_DEFAULT, z as EDGE_HEAD_FILLS, A as EDGE_HEAD_FILL_DEFAULT, D as EDGE_REVEALS, F as EDGE_REVEAL_DEFAULT, G as EDGE_STYLES, H as EdgeReveal, I as InteractiveHandlerMap, K as InteractiveSignalsAccessor, M as LaidLane, O as NODE_KINDS, P as
|
|
1
|
+
import { C as CdlDiagram, S as Signal, a as CdlInput, b as CdlLane, c as CdlNode, T as Tone, d as Side, E as EdgeStyle, e as EdgeRole, f as EdgeHead, g as EdgeHeadFill, h as CdlState, i as CdlEventTarget, j as Computed, k as CdlDerivedValue, l as CdlScrollTrigger, L as LaidDiagram, m as CdlDiagramViewProps, n as LaidEdge, o as LaidNode, p as CdlEdge, B as BBox, R as RowMark, N as NodeKind, J as JourneyEmotion, Q as QuadrantKey } from './render-C53-PeJZ.cjs';
|
|
2
|
+
export { q as CdlDiagramView, r as CdlEventBinding, s as CdlEventKind, t as CdlFormula, u as CdlPhase, v as ChartPieForm, w as ChartSlopeForm, x as EDGE_HEADS, y as EDGE_HEAD_DEFAULT, z as EDGE_HEAD_FILLS, A as EDGE_HEAD_FILL_DEFAULT, D as EDGE_REVEALS, F as EDGE_REVEAL_DEFAULT, G as EDGE_STYLES, H as EdgeReveal, I as InteractiveHandlerMap, K as InteractiveSignalsAccessor, M as LaidLane, O as NODE_KINDS, P as RELATION_FOCUSES, U as RELATION_FOCUS_DEFAULT, V as RelationFocus, W as ScrollProgressHandle, X as TONES, Y as computeEventBindingKey, Z as computeFormulaKey, _ as computeInputSignalKey, $ as computeScrollTriggerKey, a0 as computed, a1 as createInteractiveSignalsAccessor, a2 as createScrollProgressHandle, a3 as createScrollProgressSignals, a4 as hasInteractivePrimitives, a5 as sequenceBoardMetrics, a6 as sequenceStepId, a7 as signal } from './render-C53-PeJZ.cjs';
|
|
3
3
|
import { JSX } from 'react';
|
|
4
4
|
|
|
5
5
|
declare function effect(fn: () => void | (() => void)): () => void;
|
|
@@ -3869,6 +3869,32 @@ type StateMachine2Builder = {
|
|
|
3869
3869
|
*/
|
|
3870
3870
|
declare function stateMachine2(preset: StateMachine2Preset): StateMachine2Builder;
|
|
3871
3871
|
|
|
3872
|
+
/**
|
|
3873
|
+
* 触れた箱から「光らせる集合」 を作る (#806)。
|
|
3874
|
+
*
|
|
3875
|
+
* クラス図と ER 図は順番を持たない図で、段を追う見せ方は読み手の問い
|
|
3876
|
+
* (この箱はどこと繋がっているか) に答えない。 触れた箱の関係だけを光らせれば、
|
|
3877
|
+
* 問いにその場で答えられる。
|
|
3878
|
+
*
|
|
3879
|
+
* 集合は 3 つで作る = 触れた箱 / その箱に繋がる線 / 線の相手の箱。
|
|
3880
|
+
* **線の向きは問わない** = クラス図の「継ぐ」 は子から親へ、 ER の「持つ」 は親から子へ向くが、
|
|
3881
|
+
* 読み手にとってはどちらも「この箱の関係」 で、向きで見え方が変わる理由が無い。
|
|
3882
|
+
*/
|
|
3883
|
+
/** 集合を作るのに要る線の情報だけを取る */
|
|
3884
|
+
interface 関係を持つ線 {
|
|
3885
|
+
readonly id: string;
|
|
3886
|
+
readonly from: string;
|
|
3887
|
+
readonly to: string;
|
|
3888
|
+
}
|
|
3889
|
+
/**
|
|
3890
|
+
* 触れた箱に繋がるものを集める。
|
|
3891
|
+
*
|
|
3892
|
+
* @param edges 図の全ての線
|
|
3893
|
+
* @param nodeId 触れた箱の id
|
|
3894
|
+
* @returns 光らせる id の集合 (触れた箱を必ず含む)
|
|
3895
|
+
*/
|
|
3896
|
+
declare function relatedFocusSet(edges: readonly 関係を持つ線[], nodeId: string): Set<string>;
|
|
3897
|
+
|
|
3872
3898
|
/**
|
|
3873
3899
|
* 全 state の現時点 value を計算 (現在 phase + これまでの phase の最終 tween 値を集約)。
|
|
3874
3900
|
* - set = 即時切替 (phase 到達で value 上書き、 lerp なし)
|
|
@@ -3891,4 +3917,4 @@ declare function computeStateValues(laid: LaidDiagram, phaseIdx: number, progres
|
|
|
3891
3917
|
*/
|
|
3892
3918
|
declare function interpolate(template: string, values: Record<string, string>): string;
|
|
3893
3919
|
|
|
3894
|
-
export { ARROW_ANGLE_MAX_DEG, ARROW_ENDPOINT_CENTER_TOL, type AnimationChain, type AuthorIntentOptions, type AuthorIntentReport, type BinaryOp, CHAIN_MIN_CLEARANCE, CHAIN_SHIFT_MAX_ACCUMULATED, CHAIN_SHIFT_MAX_ITER, CLASS_RELATION_LOOK, CLEARANCE_LABEL_LABEL, CLEARANCE_LANE_LABEL, CLEARANCE_NODE_LABEL, CLEARANCE_PATH_LABEL, COLUMN_GAP_VARIANCE_TOL, CdlDerivedValue, CdlDiagram, CdlDiagramThumbnail, CdlEdge, type CdlEventHandler, CdlEventTarget, CdlInput, CdlLane, CdlNode, CdlScrollTrigger, CdlState, type ChartBuilder, type ChartDatum, type ChartPreset, type ChartType, type ClassDiagramBuilder, type ClassDiagramPreset, type ClassRelationType, Computed, DETOUR_GAP, DETOUR_SLOT_GAP, DIST_LABEL_PATH_MAX, DIST_LABEL_PATH_MIN, type DerivedNotice, type DerivedNoticeKind, type DerivedResult, type DiagramAdapter, type DiagramBuilder, type Discrepancy, type DiscrepancyKind, type DomVerifyReport, EDGE_LABEL_TEXT, EDGE_STUB_OUT, ER_CARDINALITY_HEAD, EdgeHead, EdgeHeadFill, type EdgeLabelLine, type EdgeLabelTextSpec, EdgeStyle, type ErBuilder, type ErColumn, type ErEntity, type ErPreset, type ErRelation, type ErRelationCardinality, type EventAttachHandle, type EventChain, FAN_GAP, FONT_RENDER_TOLERANCE_WORLD, FSM_ACTION_MARK, type FlowBuilder, type FlowPreset, type FlowStepInput, type FlowchartBuilder, type FlowchartEdge, type FlowchartNode, type FlowchartNodeShape, type FlowchartPreset, type FormulaAst, type FormulaContext, type FsmMark, type FsmState, type FsmStateAction, type FsmStateNested, type FsmTransition, type FsmTransitionExt, type FunnelBuilder, type FunnelPreset, type FunnelStage, type GanttBuilder, type GanttPreset, type GanttTask, type GenericDiagramSpec, type GenericDiscrepancy, type GenericDiscrepancyKind, type GenericVerifyOptions, type Rect as GeometryRect, type Segment as GeometrySegment, type InfraConnection, type InfraNode, type InfrastructureBuilder, type InfrastructurePreset, type InputChain, type IntentDiscrepancy, type IntentDiscrepancyKind, JourneyEmotion, type JourneyStep, LABEL_INIT_CLEARANCE, LABEL_INIT_CLEARANCE_DOTTED_FLOW, LABEL_SIZE_TOLERANCE_WORLD, LABEL_TO_PATH_CLEARANCE, LANE_BORDER_CLEARANCE_TOL, LaidDiagram, LaidEdge, LaidNode, type LayoutWithValidationOptions, type LayoutWithValidationResult, MARKER_GLOW_RADIUS, MIN_COLUMN_ALIGNMENT_TOLERANCE, MIN_ROW_ALIGNMENT_TOLERANCE, type MathFnName, type MindBranch, type MindMapBuilder, type MindMapPreset, NEAR_COLLISION_DEFAULT_MIN, NEAR_COLLISION_POLICY, NODE_FRAME_SELECTOR, type NetworkBuilder, type NetworkDevice, type NetworkDeviceKind, type NetworkLink, type NetworkPreset, NodeKind, type OrderEdge, type OrderNode, type OrderResult, type PageLike, type PhaseBuilder, type QuadrantBuilder, type QuadrantItem, type QuadrantPreset, type QuadrantQuadrantLabel, ROW_GAP_VARIANCE_TOL, type ReferenceContainer, RowMark, SEQUENCE_MESSAGE_LOOK, SPEC_CLEARANCE_POLICY, STAGE_SVG_SELECTOR, type SequenceActor, type SequenceBuilder, type SequenceMessageKind, type SequencePreset, type SequenceStep, Side, Signal, type StateMachine2Builder, type StateMachine2Preset, type StateMachineBuilder, type StateMachinePreset, type SweepReport, type SwimlanePreset, TARGET_LABEL_PATH_DIST, Tone, type TopologyBuilder, type TopologyConnection, type TopologyContainer, type TopologyGroupBuilder, type TopologyPreset, type TreeBuilder, type TreeNode, type TreePreset, type UmlClass, type UmlRelation, type UserJourneyBuilder, type UserJourneyPreset, type ValidateOptions, type ValidationProfile, type VerifyOptions, type Violation, type VisualAxis, type VisualValidationReport, WCAG_AA_LARGE, WCAG_AA_NORMAL, applyDerivedValues, assertNever, attachEventHandlers, batch, bboxClearance, bboxDiffWorld, cdlAdapter, chart, classDiagram, compile, computeScrollProgress, computeStateValues, computeViewportScale, countEdgeCrossings, countOrderCrossings, createFormulaComputeds, createInputSignals, diagram, effect, er, evaluate as evaluateFormula, extractIdentifiers, flow, flowchart, funnel, gantt, infrastructure, inputDefaultValue, interpolate, isLargeText, labelInitClearance, layout, layoutWithValidation, mindMap, network, orderNodes, parseFormula, pointRectEdgeDistance, pointToSegmentDistance, predictLabelBBoxWorld, predictNodeBBoxWorld, projectEdgeLabel, projectNode, projectPathSegment, pxToWorld, quadrant, rectRectClearance, rectRectOverlapArea, rendersRows, requiredContrastRatio, requiredNearClearance, requiredRowsHeight, requiredRowsWidth, requiredSpecClearance, resolveEdgeLabelOverlapsWithChain, resolveEdgeLabelOverlapsWithChainAndPropagate, resolveLabelClearanceAfterPathPasses, resolveOverlapsWithChain, resolveTarget, resolveTargetAll, segmentsIntersect, sequence, stateMachine, stateMachine2, swimlane, topology, tree, untrack, userJourney, validate, verifyAllDiagramsDom, verifyAuthorIntent, verifyAuthorIntentAll, verifyDiagramDom, visualValidate, visualValidateAll, visualValidateLaid, withDerivedValues, worldToPx };
|
|
3920
|
+
export { ARROW_ANGLE_MAX_DEG, ARROW_ENDPOINT_CENTER_TOL, type AnimationChain, type AuthorIntentOptions, type AuthorIntentReport, type BinaryOp, CHAIN_MIN_CLEARANCE, CHAIN_SHIFT_MAX_ACCUMULATED, CHAIN_SHIFT_MAX_ITER, CLASS_RELATION_LOOK, CLEARANCE_LABEL_LABEL, CLEARANCE_LANE_LABEL, CLEARANCE_NODE_LABEL, CLEARANCE_PATH_LABEL, COLUMN_GAP_VARIANCE_TOL, CdlDerivedValue, CdlDiagram, CdlDiagramThumbnail, CdlEdge, type CdlEventHandler, CdlEventTarget, CdlInput, CdlLane, CdlNode, CdlScrollTrigger, CdlState, type ChartBuilder, type ChartDatum, type ChartPreset, type ChartType, type ClassDiagramBuilder, type ClassDiagramPreset, type ClassRelationType, Computed, DETOUR_GAP, DETOUR_SLOT_GAP, DIST_LABEL_PATH_MAX, DIST_LABEL_PATH_MIN, type DerivedNotice, type DerivedNoticeKind, type DerivedResult, type DiagramAdapter, type DiagramBuilder, type Discrepancy, type DiscrepancyKind, type DomVerifyReport, EDGE_LABEL_TEXT, EDGE_STUB_OUT, ER_CARDINALITY_HEAD, EdgeHead, EdgeHeadFill, type EdgeLabelLine, type EdgeLabelTextSpec, EdgeStyle, type ErBuilder, type ErColumn, type ErEntity, type ErPreset, type ErRelation, type ErRelationCardinality, type EventAttachHandle, type EventChain, FAN_GAP, FONT_RENDER_TOLERANCE_WORLD, FSM_ACTION_MARK, type FlowBuilder, type FlowPreset, type FlowStepInput, type FlowchartBuilder, type FlowchartEdge, type FlowchartNode, type FlowchartNodeShape, type FlowchartPreset, type FormulaAst, type FormulaContext, type FsmMark, type FsmState, type FsmStateAction, type FsmStateNested, type FsmTransition, type FsmTransitionExt, type FunnelBuilder, type FunnelPreset, type FunnelStage, type GanttBuilder, type GanttPreset, type GanttTask, type GenericDiagramSpec, type GenericDiscrepancy, type GenericDiscrepancyKind, type GenericVerifyOptions, type Rect as GeometryRect, type Segment as GeometrySegment, type InfraConnection, type InfraNode, type InfrastructureBuilder, type InfrastructurePreset, type InputChain, type IntentDiscrepancy, type IntentDiscrepancyKind, JourneyEmotion, type JourneyStep, LABEL_INIT_CLEARANCE, LABEL_INIT_CLEARANCE_DOTTED_FLOW, LABEL_SIZE_TOLERANCE_WORLD, LABEL_TO_PATH_CLEARANCE, LANE_BORDER_CLEARANCE_TOL, LaidDiagram, LaidEdge, LaidNode, type LayoutWithValidationOptions, type LayoutWithValidationResult, MARKER_GLOW_RADIUS, MIN_COLUMN_ALIGNMENT_TOLERANCE, MIN_ROW_ALIGNMENT_TOLERANCE, type MathFnName, type MindBranch, type MindMapBuilder, type MindMapPreset, NEAR_COLLISION_DEFAULT_MIN, NEAR_COLLISION_POLICY, NODE_FRAME_SELECTOR, type NetworkBuilder, type NetworkDevice, type NetworkDeviceKind, type NetworkLink, type NetworkPreset, NodeKind, type OrderEdge, type OrderNode, type OrderResult, type PageLike, type PhaseBuilder, type QuadrantBuilder, type QuadrantItem, type QuadrantPreset, type QuadrantQuadrantLabel, ROW_GAP_VARIANCE_TOL, type ReferenceContainer, RowMark, SEQUENCE_MESSAGE_LOOK, SPEC_CLEARANCE_POLICY, STAGE_SVG_SELECTOR, type SequenceActor, type SequenceBuilder, type SequenceMessageKind, type SequencePreset, type SequenceStep, Side, Signal, type StateMachine2Builder, type StateMachine2Preset, type StateMachineBuilder, type StateMachinePreset, type SweepReport, type SwimlanePreset, TARGET_LABEL_PATH_DIST, Tone, type TopologyBuilder, type TopologyConnection, type TopologyContainer, type TopologyGroupBuilder, type TopologyPreset, type TreeBuilder, type TreeNode, type TreePreset, type UmlClass, type UmlRelation, type UserJourneyBuilder, type UserJourneyPreset, type ValidateOptions, type ValidationProfile, type VerifyOptions, type Violation, type VisualAxis, type VisualValidationReport, WCAG_AA_LARGE, WCAG_AA_NORMAL, applyDerivedValues, assertNever, attachEventHandlers, batch, bboxClearance, bboxDiffWorld, cdlAdapter, chart, classDiagram, compile, computeScrollProgress, computeStateValues, computeViewportScale, countEdgeCrossings, countOrderCrossings, createFormulaComputeds, createInputSignals, diagram, effect, er, evaluate as evaluateFormula, extractIdentifiers, flow, flowchart, funnel, gantt, infrastructure, inputDefaultValue, interpolate, isLargeText, labelInitClearance, layout, layoutWithValidation, mindMap, network, orderNodes, parseFormula, pointRectEdgeDistance, pointToSegmentDistance, predictLabelBBoxWorld, predictNodeBBoxWorld, projectEdgeLabel, projectNode, projectPathSegment, pxToWorld, quadrant, rectRectClearance, rectRectOverlapArea, relatedFocusSet, rendersRows, requiredContrastRatio, requiredNearClearance, requiredRowsHeight, requiredRowsWidth, requiredSpecClearance, resolveEdgeLabelOverlapsWithChain, resolveEdgeLabelOverlapsWithChainAndPropagate, resolveLabelClearanceAfterPathPasses, resolveOverlapsWithChain, resolveTarget, resolveTargetAll, segmentsIntersect, sequence, stateMachine, stateMachine2, swimlane, topology, tree, untrack, userJourney, validate, verifyAllDiagramsDom, verifyAuthorIntent, verifyAuthorIntentAll, verifyDiagramDom, visualValidate, visualValidateAll, visualValidateLaid, withDerivedValues, worldToPx, type 関係を持つ線 };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { C as CdlDiagram, S as Signal, a as CdlInput, b as CdlLane, c as CdlNode, T as Tone, d as Side, E as EdgeStyle, e as EdgeRole, f as EdgeHead, g as EdgeHeadFill, h as CdlState, i as CdlEventTarget, j as Computed, k as CdlDerivedValue, l as CdlScrollTrigger, L as LaidDiagram, m as CdlDiagramViewProps, n as LaidEdge, o as LaidNode, p as CdlEdge, B as BBox, R as RowMark, N as NodeKind, J as JourneyEmotion, Q as QuadrantKey } from './render-
|
|
2
|
-
export { q as CdlDiagramView, r as CdlEventBinding, s as CdlEventKind, t as CdlFormula, u as CdlPhase, v as ChartPieForm, w as ChartSlopeForm, x as EDGE_HEADS, y as EDGE_HEAD_DEFAULT, z as EDGE_HEAD_FILLS, A as EDGE_HEAD_FILL_DEFAULT, D as EDGE_REVEALS, F as EDGE_REVEAL_DEFAULT, G as EDGE_STYLES, H as EdgeReveal, I as InteractiveHandlerMap, K as InteractiveSignalsAccessor, M as LaidLane, O as NODE_KINDS, P as
|
|
1
|
+
import { C as CdlDiagram, S as Signal, a as CdlInput, b as CdlLane, c as CdlNode, T as Tone, d as Side, E as EdgeStyle, e as EdgeRole, f as EdgeHead, g as EdgeHeadFill, h as CdlState, i as CdlEventTarget, j as Computed, k as CdlDerivedValue, l as CdlScrollTrigger, L as LaidDiagram, m as CdlDiagramViewProps, n as LaidEdge, o as LaidNode, p as CdlEdge, B as BBox, R as RowMark, N as NodeKind, J as JourneyEmotion, Q as QuadrantKey } from './render-C53-PeJZ.js';
|
|
2
|
+
export { q as CdlDiagramView, r as CdlEventBinding, s as CdlEventKind, t as CdlFormula, u as CdlPhase, v as ChartPieForm, w as ChartSlopeForm, x as EDGE_HEADS, y as EDGE_HEAD_DEFAULT, z as EDGE_HEAD_FILLS, A as EDGE_HEAD_FILL_DEFAULT, D as EDGE_REVEALS, F as EDGE_REVEAL_DEFAULT, G as EDGE_STYLES, H as EdgeReveal, I as InteractiveHandlerMap, K as InteractiveSignalsAccessor, M as LaidLane, O as NODE_KINDS, P as RELATION_FOCUSES, U as RELATION_FOCUS_DEFAULT, V as RelationFocus, W as ScrollProgressHandle, X as TONES, Y as computeEventBindingKey, Z as computeFormulaKey, _ as computeInputSignalKey, $ as computeScrollTriggerKey, a0 as computed, a1 as createInteractiveSignalsAccessor, a2 as createScrollProgressHandle, a3 as createScrollProgressSignals, a4 as hasInteractivePrimitives, a5 as sequenceBoardMetrics, a6 as sequenceStepId, a7 as signal } from './render-C53-PeJZ.js';
|
|
3
3
|
import { JSX } from 'react';
|
|
4
4
|
|
|
5
5
|
declare function effect(fn: () => void | (() => void)): () => void;
|
|
@@ -3869,6 +3869,32 @@ type StateMachine2Builder = {
|
|
|
3869
3869
|
*/
|
|
3870
3870
|
declare function stateMachine2(preset: StateMachine2Preset): StateMachine2Builder;
|
|
3871
3871
|
|
|
3872
|
+
/**
|
|
3873
|
+
* 触れた箱から「光らせる集合」 を作る (#806)。
|
|
3874
|
+
*
|
|
3875
|
+
* クラス図と ER 図は順番を持たない図で、段を追う見せ方は読み手の問い
|
|
3876
|
+
* (この箱はどこと繋がっているか) に答えない。 触れた箱の関係だけを光らせれば、
|
|
3877
|
+
* 問いにその場で答えられる。
|
|
3878
|
+
*
|
|
3879
|
+
* 集合は 3 つで作る = 触れた箱 / その箱に繋がる線 / 線の相手の箱。
|
|
3880
|
+
* **線の向きは問わない** = クラス図の「継ぐ」 は子から親へ、 ER の「持つ」 は親から子へ向くが、
|
|
3881
|
+
* 読み手にとってはどちらも「この箱の関係」 で、向きで見え方が変わる理由が無い。
|
|
3882
|
+
*/
|
|
3883
|
+
/** 集合を作るのに要る線の情報だけを取る */
|
|
3884
|
+
interface 関係を持つ線 {
|
|
3885
|
+
readonly id: string;
|
|
3886
|
+
readonly from: string;
|
|
3887
|
+
readonly to: string;
|
|
3888
|
+
}
|
|
3889
|
+
/**
|
|
3890
|
+
* 触れた箱に繋がるものを集める。
|
|
3891
|
+
*
|
|
3892
|
+
* @param edges 図の全ての線
|
|
3893
|
+
* @param nodeId 触れた箱の id
|
|
3894
|
+
* @returns 光らせる id の集合 (触れた箱を必ず含む)
|
|
3895
|
+
*/
|
|
3896
|
+
declare function relatedFocusSet(edges: readonly 関係を持つ線[], nodeId: string): Set<string>;
|
|
3897
|
+
|
|
3872
3898
|
/**
|
|
3873
3899
|
* 全 state の現時点 value を計算 (現在 phase + これまでの phase の最終 tween 値を集約)。
|
|
3874
3900
|
* - set = 即時切替 (phase 到達で value 上書き、 lerp なし)
|
|
@@ -3891,4 +3917,4 @@ declare function computeStateValues(laid: LaidDiagram, phaseIdx: number, progres
|
|
|
3891
3917
|
*/
|
|
3892
3918
|
declare function interpolate(template: string, values: Record<string, string>): string;
|
|
3893
3919
|
|
|
3894
|
-
export { ARROW_ANGLE_MAX_DEG, ARROW_ENDPOINT_CENTER_TOL, type AnimationChain, type AuthorIntentOptions, type AuthorIntentReport, type BinaryOp, CHAIN_MIN_CLEARANCE, CHAIN_SHIFT_MAX_ACCUMULATED, CHAIN_SHIFT_MAX_ITER, CLASS_RELATION_LOOK, CLEARANCE_LABEL_LABEL, CLEARANCE_LANE_LABEL, CLEARANCE_NODE_LABEL, CLEARANCE_PATH_LABEL, COLUMN_GAP_VARIANCE_TOL, CdlDerivedValue, CdlDiagram, CdlDiagramThumbnail, CdlEdge, type CdlEventHandler, CdlEventTarget, CdlInput, CdlLane, CdlNode, CdlScrollTrigger, CdlState, type ChartBuilder, type ChartDatum, type ChartPreset, type ChartType, type ClassDiagramBuilder, type ClassDiagramPreset, type ClassRelationType, Computed, DETOUR_GAP, DETOUR_SLOT_GAP, DIST_LABEL_PATH_MAX, DIST_LABEL_PATH_MIN, type DerivedNotice, type DerivedNoticeKind, type DerivedResult, type DiagramAdapter, type DiagramBuilder, type Discrepancy, type DiscrepancyKind, type DomVerifyReport, EDGE_LABEL_TEXT, EDGE_STUB_OUT, ER_CARDINALITY_HEAD, EdgeHead, EdgeHeadFill, type EdgeLabelLine, type EdgeLabelTextSpec, EdgeStyle, type ErBuilder, type ErColumn, type ErEntity, type ErPreset, type ErRelation, type ErRelationCardinality, type EventAttachHandle, type EventChain, FAN_GAP, FONT_RENDER_TOLERANCE_WORLD, FSM_ACTION_MARK, type FlowBuilder, type FlowPreset, type FlowStepInput, type FlowchartBuilder, type FlowchartEdge, type FlowchartNode, type FlowchartNodeShape, type FlowchartPreset, type FormulaAst, type FormulaContext, type FsmMark, type FsmState, type FsmStateAction, type FsmStateNested, type FsmTransition, type FsmTransitionExt, type FunnelBuilder, type FunnelPreset, type FunnelStage, type GanttBuilder, type GanttPreset, type GanttTask, type GenericDiagramSpec, type GenericDiscrepancy, type GenericDiscrepancyKind, type GenericVerifyOptions, type Rect as GeometryRect, type Segment as GeometrySegment, type InfraConnection, type InfraNode, type InfrastructureBuilder, type InfrastructurePreset, type InputChain, type IntentDiscrepancy, type IntentDiscrepancyKind, JourneyEmotion, type JourneyStep, LABEL_INIT_CLEARANCE, LABEL_INIT_CLEARANCE_DOTTED_FLOW, LABEL_SIZE_TOLERANCE_WORLD, LABEL_TO_PATH_CLEARANCE, LANE_BORDER_CLEARANCE_TOL, LaidDiagram, LaidEdge, LaidNode, type LayoutWithValidationOptions, type LayoutWithValidationResult, MARKER_GLOW_RADIUS, MIN_COLUMN_ALIGNMENT_TOLERANCE, MIN_ROW_ALIGNMENT_TOLERANCE, type MathFnName, type MindBranch, type MindMapBuilder, type MindMapPreset, NEAR_COLLISION_DEFAULT_MIN, NEAR_COLLISION_POLICY, NODE_FRAME_SELECTOR, type NetworkBuilder, type NetworkDevice, type NetworkDeviceKind, type NetworkLink, type NetworkPreset, NodeKind, type OrderEdge, type OrderNode, type OrderResult, type PageLike, type PhaseBuilder, type QuadrantBuilder, type QuadrantItem, type QuadrantPreset, type QuadrantQuadrantLabel, ROW_GAP_VARIANCE_TOL, type ReferenceContainer, RowMark, SEQUENCE_MESSAGE_LOOK, SPEC_CLEARANCE_POLICY, STAGE_SVG_SELECTOR, type SequenceActor, type SequenceBuilder, type SequenceMessageKind, type SequencePreset, type SequenceStep, Side, Signal, type StateMachine2Builder, type StateMachine2Preset, type StateMachineBuilder, type StateMachinePreset, type SweepReport, type SwimlanePreset, TARGET_LABEL_PATH_DIST, Tone, type TopologyBuilder, type TopologyConnection, type TopologyContainer, type TopologyGroupBuilder, type TopologyPreset, type TreeBuilder, type TreeNode, type TreePreset, type UmlClass, type UmlRelation, type UserJourneyBuilder, type UserJourneyPreset, type ValidateOptions, type ValidationProfile, type VerifyOptions, type Violation, type VisualAxis, type VisualValidationReport, WCAG_AA_LARGE, WCAG_AA_NORMAL, applyDerivedValues, assertNever, attachEventHandlers, batch, bboxClearance, bboxDiffWorld, cdlAdapter, chart, classDiagram, compile, computeScrollProgress, computeStateValues, computeViewportScale, countEdgeCrossings, countOrderCrossings, createFormulaComputeds, createInputSignals, diagram, effect, er, evaluate as evaluateFormula, extractIdentifiers, flow, flowchart, funnel, gantt, infrastructure, inputDefaultValue, interpolate, isLargeText, labelInitClearance, layout, layoutWithValidation, mindMap, network, orderNodes, parseFormula, pointRectEdgeDistance, pointToSegmentDistance, predictLabelBBoxWorld, predictNodeBBoxWorld, projectEdgeLabel, projectNode, projectPathSegment, pxToWorld, quadrant, rectRectClearance, rectRectOverlapArea, rendersRows, requiredContrastRatio, requiredNearClearance, requiredRowsHeight, requiredRowsWidth, requiredSpecClearance, resolveEdgeLabelOverlapsWithChain, resolveEdgeLabelOverlapsWithChainAndPropagate, resolveLabelClearanceAfterPathPasses, resolveOverlapsWithChain, resolveTarget, resolveTargetAll, segmentsIntersect, sequence, stateMachine, stateMachine2, swimlane, topology, tree, untrack, userJourney, validate, verifyAllDiagramsDom, verifyAuthorIntent, verifyAuthorIntentAll, verifyDiagramDom, visualValidate, visualValidateAll, visualValidateLaid, withDerivedValues, worldToPx };
|
|
3920
|
+
export { ARROW_ANGLE_MAX_DEG, ARROW_ENDPOINT_CENTER_TOL, type AnimationChain, type AuthorIntentOptions, type AuthorIntentReport, type BinaryOp, CHAIN_MIN_CLEARANCE, CHAIN_SHIFT_MAX_ACCUMULATED, CHAIN_SHIFT_MAX_ITER, CLASS_RELATION_LOOK, CLEARANCE_LABEL_LABEL, CLEARANCE_LANE_LABEL, CLEARANCE_NODE_LABEL, CLEARANCE_PATH_LABEL, COLUMN_GAP_VARIANCE_TOL, CdlDerivedValue, CdlDiagram, CdlDiagramThumbnail, CdlEdge, type CdlEventHandler, CdlEventTarget, CdlInput, CdlLane, CdlNode, CdlScrollTrigger, CdlState, type ChartBuilder, type ChartDatum, type ChartPreset, type ChartType, type ClassDiagramBuilder, type ClassDiagramPreset, type ClassRelationType, Computed, DETOUR_GAP, DETOUR_SLOT_GAP, DIST_LABEL_PATH_MAX, DIST_LABEL_PATH_MIN, type DerivedNotice, type DerivedNoticeKind, type DerivedResult, type DiagramAdapter, type DiagramBuilder, type Discrepancy, type DiscrepancyKind, type DomVerifyReport, EDGE_LABEL_TEXT, EDGE_STUB_OUT, ER_CARDINALITY_HEAD, EdgeHead, EdgeHeadFill, type EdgeLabelLine, type EdgeLabelTextSpec, EdgeStyle, type ErBuilder, type ErColumn, type ErEntity, type ErPreset, type ErRelation, type ErRelationCardinality, type EventAttachHandle, type EventChain, FAN_GAP, FONT_RENDER_TOLERANCE_WORLD, FSM_ACTION_MARK, type FlowBuilder, type FlowPreset, type FlowStepInput, type FlowchartBuilder, type FlowchartEdge, type FlowchartNode, type FlowchartNodeShape, type FlowchartPreset, type FormulaAst, type FormulaContext, type FsmMark, type FsmState, type FsmStateAction, type FsmStateNested, type FsmTransition, type FsmTransitionExt, type FunnelBuilder, type FunnelPreset, type FunnelStage, type GanttBuilder, type GanttPreset, type GanttTask, type GenericDiagramSpec, type GenericDiscrepancy, type GenericDiscrepancyKind, type GenericVerifyOptions, type Rect as GeometryRect, type Segment as GeometrySegment, type InfraConnection, type InfraNode, type InfrastructureBuilder, type InfrastructurePreset, type InputChain, type IntentDiscrepancy, type IntentDiscrepancyKind, JourneyEmotion, type JourneyStep, LABEL_INIT_CLEARANCE, LABEL_INIT_CLEARANCE_DOTTED_FLOW, LABEL_SIZE_TOLERANCE_WORLD, LABEL_TO_PATH_CLEARANCE, LANE_BORDER_CLEARANCE_TOL, LaidDiagram, LaidEdge, LaidNode, type LayoutWithValidationOptions, type LayoutWithValidationResult, MARKER_GLOW_RADIUS, MIN_COLUMN_ALIGNMENT_TOLERANCE, MIN_ROW_ALIGNMENT_TOLERANCE, type MathFnName, type MindBranch, type MindMapBuilder, type MindMapPreset, NEAR_COLLISION_DEFAULT_MIN, NEAR_COLLISION_POLICY, NODE_FRAME_SELECTOR, type NetworkBuilder, type NetworkDevice, type NetworkDeviceKind, type NetworkLink, type NetworkPreset, NodeKind, type OrderEdge, type OrderNode, type OrderResult, type PageLike, type PhaseBuilder, type QuadrantBuilder, type QuadrantItem, type QuadrantPreset, type QuadrantQuadrantLabel, ROW_GAP_VARIANCE_TOL, type ReferenceContainer, RowMark, SEQUENCE_MESSAGE_LOOK, SPEC_CLEARANCE_POLICY, STAGE_SVG_SELECTOR, type SequenceActor, type SequenceBuilder, type SequenceMessageKind, type SequencePreset, type SequenceStep, Side, Signal, type StateMachine2Builder, type StateMachine2Preset, type StateMachineBuilder, type StateMachinePreset, type SweepReport, type SwimlanePreset, TARGET_LABEL_PATH_DIST, Tone, type TopologyBuilder, type TopologyConnection, type TopologyContainer, type TopologyGroupBuilder, type TopologyPreset, type TreeBuilder, type TreeNode, type TreePreset, type UmlClass, type UmlRelation, type UserJourneyBuilder, type UserJourneyPreset, type ValidateOptions, type ValidationProfile, type VerifyOptions, type Violation, type VisualAxis, type VisualValidationReport, WCAG_AA_LARGE, WCAG_AA_NORMAL, applyDerivedValues, assertNever, attachEventHandlers, batch, bboxClearance, bboxDiffWorld, cdlAdapter, chart, classDiagram, compile, computeScrollProgress, computeStateValues, computeViewportScale, countEdgeCrossings, countOrderCrossings, createFormulaComputeds, createInputSignals, diagram, effect, er, evaluate as evaluateFormula, extractIdentifiers, flow, flowchart, funnel, gantt, infrastructure, inputDefaultValue, interpolate, isLargeText, labelInitClearance, layout, layoutWithValidation, mindMap, network, orderNodes, parseFormula, pointRectEdgeDistance, pointToSegmentDistance, predictLabelBBoxWorld, predictNodeBBoxWorld, projectEdgeLabel, projectNode, projectPathSegment, pxToWorld, quadrant, rectRectClearance, rectRectOverlapArea, relatedFocusSet, rendersRows, requiredContrastRatio, requiredNearClearance, requiredRowsHeight, requiredRowsWidth, requiredSpecClearance, resolveEdgeLabelOverlapsWithChain, resolveEdgeLabelOverlapsWithChainAndPropagate, resolveLabelClearanceAfterPathPasses, resolveOverlapsWithChain, resolveTarget, resolveTargetAll, segmentsIntersect, sequence, stateMachine, stateMachine2, swimlane, topology, tree, untrack, userJourney, validate, verifyAllDiagramsDom, verifyAuthorIntent, verifyAuthorIntentAll, verifyDiagramDom, visualValidate, visualValidateAll, visualValidateLaid, withDerivedValues, worldToPx, type 関係を持つ線 };
|
package/dist/index.js
CHANGED
|
@@ -13749,6 +13749,8 @@ var EDGE_HEADS = [
|
|
|
13749
13749
|
var EDGE_HEAD_FILL_DEFAULT = "solid";
|
|
13750
13750
|
var EDGE_HEAD_FILLS = ["solid", "hollow"];
|
|
13751
13751
|
var EDGE_REVEALS = ["phase", "all"];
|
|
13752
|
+
var RELATION_FOCUSES = ["off", "hover"];
|
|
13753
|
+
var RELATION_FOCUS_DEFAULT = "off";
|
|
13752
13754
|
var EDGE_REVEAL_DEFAULT = "phase";
|
|
13753
13755
|
|
|
13754
13756
|
// src/kinds/text-width.ts
|
|
@@ -19574,33 +19576,73 @@ function placeAvoidingSiblingPaths(args) {
|
|
|
19574
19576
|
}
|
|
19575
19577
|
};
|
|
19576
19578
|
consider([...wants]);
|
|
19579
|
+
const \u62BC\u3059\u91CF = (idx, side, pos) => {
|
|
19580
|
+
let \u8981\u308B = 0;
|
|
19581
|
+
for (const i of idx) {
|
|
19582
|
+
const box = boxes[i];
|
|
19583
|
+
const rect = { x: box.x, y: pos[i] - box.h / 2, w: box.w, h: box.h };
|
|
19584
|
+
for (const probe of probeSegs[i]) {
|
|
19585
|
+
if (measurePathLabelGapSegs(probe.segs, rect) >= CLEARANCE_PATH_LABEL) continue;
|
|
19586
|
+
let lo = Infinity;
|
|
19587
|
+
let hi = -Infinity;
|
|
19588
|
+
for (const seg of probe.segs) {
|
|
19589
|
+
const c = clipY(seg, box.x, box.x + box.w);
|
|
19590
|
+
if (!c) continue;
|
|
19591
|
+
lo = Math.min(lo, c.lo);
|
|
19592
|
+
hi = Math.max(hi, c.hi);
|
|
19593
|
+
}
|
|
19594
|
+
if (lo > hi) continue;
|
|
19595
|
+
const \u884C\u304D\u5148 = side === "above" ? lo - box.h / 2 - CLEARANCE_PATH_LABEL : hi + box.h / 2 + CLEARANCE_PATH_LABEL;
|
|
19596
|
+
\u8981\u308B = Math.max(\u8981\u308B, side === "above" ? pos[i] - \u884C\u304D\u5148 : \u884C\u304D\u5148 - pos[i]);
|
|
19597
|
+
}
|
|
19598
|
+
}
|
|
19599
|
+
return Math.max(0, \u8981\u308B);
|
|
19600
|
+
};
|
|
19577
19601
|
if (bands.some((b) => b !== null)) {
|
|
19578
19602
|
for (let split = 0; split <= order.length; split++) {
|
|
19579
19603
|
const above = order.slice(0, split);
|
|
19580
19604
|
const below = order.slice(split);
|
|
19581
|
-
const
|
|
19582
|
-
|
|
19583
|
-
[above, "above"],
|
|
19584
|
-
[below, "below"]
|
|
19585
|
-
]) {
|
|
19586
|
-
if (idx.length === 0) continue;
|
|
19587
|
-
const ys = spread(idx);
|
|
19588
|
-
let shift = 0;
|
|
19589
|
-
for (let k = 0; k < idx.length; k++) {
|
|
19590
|
-
const band = bands[idx[k]];
|
|
19591
|
-
if (!band) continue;
|
|
19592
|
-
shift = side === "above" ? Math.min(shift, band.lo - ys[k]) : Math.max(shift, band.hi - ys[k]);
|
|
19593
|
-
}
|
|
19594
|
-
for (let k = 0; k < idx.length; k++) out[idx[k]] = ys[k] + shift;
|
|
19595
|
-
}
|
|
19596
|
-
if (above.length > 0 && below.length > 0) {
|
|
19605
|
+
const \u9593\u3092\u7A7A\u3051\u308B = (out) => {
|
|
19606
|
+
if (above.length === 0 || below.length === 0) return;
|
|
19597
19607
|
const lastIdx = above[above.length - 1];
|
|
19598
19608
|
const firstIdx = below[0];
|
|
19599
19609
|
const need = (sizes[lastIdx] + sizes[firstIdx]) / 2 + CLEARANCE_LABEL_LABEL;
|
|
19600
19610
|
const deficit = need - (out[firstIdx] - out[lastIdx]);
|
|
19601
|
-
if (deficit > 0) for (const i of below) out[i]
|
|
19602
|
-
}
|
|
19603
|
-
|
|
19611
|
+
if (deficit > 0) for (const i of below) out[i] = out[i] + deficit;
|
|
19612
|
+
};
|
|
19613
|
+
const \u5E2F\u3092\u8D8A\u3048\u308B = () => {
|
|
19614
|
+
const out = new Array(members.length);
|
|
19615
|
+
for (const [idx, side] of [
|
|
19616
|
+
[above, "above"],
|
|
19617
|
+
[below, "below"]
|
|
19618
|
+
]) {
|
|
19619
|
+
if (idx.length === 0) continue;
|
|
19620
|
+
const ys = spread(idx);
|
|
19621
|
+
let shift = 0;
|
|
19622
|
+
for (let k = 0; k < idx.length; k++) {
|
|
19623
|
+
const band = bands[idx[k]];
|
|
19624
|
+
if (!band) continue;
|
|
19625
|
+
shift = side === "above" ? Math.min(shift, band.lo - ys[k]) : Math.max(shift, band.hi - ys[k]);
|
|
19626
|
+
}
|
|
19627
|
+
for (let k = 0; k < idx.length; k++) out[idx[k]] = ys[k] + shift;
|
|
19628
|
+
}
|
|
19629
|
+
\u9593\u3092\u7A7A\u3051\u308B(out);
|
|
19630
|
+
return out;
|
|
19631
|
+
};
|
|
19632
|
+
const \u62BC\u3057\u3066\u8D8A\u3048\u308B = () => {
|
|
19633
|
+
const out = \u5E2F\u3092\u8D8A\u3048\u308B();
|
|
19634
|
+
for (let round = 0; round < 4; round += 1) {
|
|
19635
|
+
const a = \u62BC\u3059\u91CF(above, "above", out);
|
|
19636
|
+
const b = \u62BC\u3059\u91CF(below, "below", out);
|
|
19637
|
+
if (a === 0 && b === 0) return out;
|
|
19638
|
+
for (const i of above) out[i] = out[i] - a;
|
|
19639
|
+
for (const i of below) out[i] = out[i] + b;
|
|
19640
|
+
}
|
|
19641
|
+
return \u62BC\u3059\u91CF(above, "above", out) === 0 && \u62BC\u3059\u91CF(below, "below", out) === 0 ? out : null;
|
|
19642
|
+
};
|
|
19643
|
+
consider(\u5E2F\u3092\u8D8A\u3048\u308B());
|
|
19644
|
+
const \u62BC\u3057\u305F = \u62BC\u3057\u3066\u8D8A\u3048\u308B();
|
|
19645
|
+
if (\u62BC\u3057\u305F) consider(\u62BC\u3057\u305F);
|
|
19604
19646
|
}
|
|
19605
19647
|
}
|
|
19606
19648
|
const plain = spread(all);
|
|
@@ -20720,6 +20762,7 @@ function layout(diag) {
|
|
|
20720
20762
|
...diag.derived ? { derived: diag.derived } : {},
|
|
20721
20763
|
// 矢印をいつ出すか (#582)。 描き手が読む欄なので、そのまま持ち越す
|
|
20722
20764
|
...diag.edgeReveal ? { edgeReveal: diag.edgeReveal } : {},
|
|
20765
|
+
...diag.relationFocus ? { relationFocus: diag.relationFocus } : {},
|
|
20723
20766
|
// どの配色で描くか (#1553)。 空文字は書かなかった扱いにする = 空の目印を出すと、
|
|
20724
20767
|
// 消費側の `[data-cdl-palette]` が配色を書いていない図にも当たる。
|
|
20725
20768
|
//
|
|
@@ -22807,7 +22850,8 @@ function CdlEdgeView({
|
|
|
22807
22850
|
active,
|
|
22808
22851
|
drawing,
|
|
22809
22852
|
progress,
|
|
22810
|
-
stateValues
|
|
22853
|
+
stateValues,
|
|
22854
|
+
flowing = false
|
|
22811
22855
|
}) {
|
|
22812
22856
|
const color = edgeColor(edge);
|
|
22813
22857
|
const marker = edgeHeadMarkerName(edge.tone, edge.head, !active, edge.headFill);
|
|
@@ -22825,6 +22869,7 @@ function CdlEdgeView({
|
|
|
22825
22869
|
"data-cdl-from": edge.from,
|
|
22826
22870
|
"data-cdl-to": edge.to,
|
|
22827
22871
|
"data-cdl-active": active ? "true" : "false",
|
|
22872
|
+
"data-cdl-flowing": flowing ? "true" : "false",
|
|
22828
22873
|
"data-cdl-drawing": drawing ? "true" : "false",
|
|
22829
22874
|
"data-cdl-path-d": edge.d,
|
|
22830
22875
|
"data-cdl-label-x": edge.labelX,
|
|
@@ -22877,7 +22922,11 @@ function CdlEdgeView({
|
|
|
22877
22922
|
strokeWidth: 14,
|
|
22878
22923
|
strokeLinecap: "round"
|
|
22879
22924
|
}
|
|
22880
|
-
)
|
|
22925
|
+
),
|
|
22926
|
+
flowing && !isDotted && /* @__PURE__ */ jsxs("g", { "data-cdl-role": "edge-flow", children: [
|
|
22927
|
+
/* @__PURE__ */ jsx("path", { id: glowPathId, d: edge.d, fill: "none", stroke: "none" }),
|
|
22928
|
+
/* @__PURE__ */ jsx(EdgeGlowCircles, { color, edgeId: edge.id })
|
|
22929
|
+
] })
|
|
22881
22930
|
]
|
|
22882
22931
|
}
|
|
22883
22932
|
);
|
|
@@ -30653,7 +30702,8 @@ function CdlNodeView({
|
|
|
30653
30702
|
progress,
|
|
30654
30703
|
stateValues,
|
|
30655
30704
|
currentPhaseId,
|
|
30656
|
-
chartLineScale
|
|
30705
|
+
chartLineScale,
|
|
30706
|
+
\u95A2\u4FC2\u306E\u53D7\u3051\u53E3
|
|
30657
30707
|
}) {
|
|
30658
30708
|
const value = node.value ? interpolate(node.value, stateValues) : void 0;
|
|
30659
30709
|
const rows = (node.rows ?? []).map((r) => interpolate(r, stateValues));
|
|
@@ -30975,6 +31025,23 @@ function CdlNodeView({
|
|
|
30975
31025
|
"data-cdl-eyebrow": resolvedNode.eyebrow ?? "",
|
|
30976
31026
|
"data-cdl-offset-x": offsetX || void 0,
|
|
30977
31027
|
"data-cdl-offset-y": offsetY || void 0,
|
|
31028
|
+
...\u95A2\u4FC2\u306E\u53D7\u3051\u53E3 === void 0 ? {} : {
|
|
31029
|
+
// 読み上げに「押せる」 ことを伝え、 tab でも辿れるようにする。
|
|
31030
|
+
role: "button",
|
|
31031
|
+
tabIndex: 0,
|
|
31032
|
+
"aria-pressed": \u95A2\u4FC2\u306E\u53D7\u3051\u53E3.\u7126\u70B9 === node.id,
|
|
31033
|
+
style: { cursor: "pointer" },
|
|
31034
|
+
onPointerEnter: () => \u95A2\u4FC2\u306E\u53D7\u3051\u53E3.\u89E6\u308C\u305F(node.id),
|
|
31035
|
+
onPointerLeave: () => \u95A2\u4FC2\u306E\u53D7\u3051\u53E3.\u96E2\u308C\u305F(),
|
|
31036
|
+
onFocus: () => \u95A2\u4FC2\u306E\u53D7\u3051\u53E3.\u89E6\u308C\u305F(node.id),
|
|
31037
|
+
onBlur: () => \u95A2\u4FC2\u306E\u53D7\u3051\u53E3.\u96E2\u308C\u305F(),
|
|
31038
|
+
onClick: () => \u95A2\u4FC2\u306E\u53D7\u3051\u53E3.\u62BC\u3057\u305F(node.id),
|
|
31039
|
+
onKeyDown: (e) => {
|
|
31040
|
+
if (e.key !== "Enter" && e.key !== " ") return;
|
|
31041
|
+
e.preventDefault();
|
|
31042
|
+
\u95A2\u4FC2\u306E\u53D7\u3051\u53E3.\u62BC\u3057\u305F(node.id);
|
|
31043
|
+
}
|
|
31044
|
+
},
|
|
30978
31045
|
transform: hasOffset ? `translate(${offsetX}, ${offsetY})` : void 0,
|
|
30979
31046
|
opacity: boundOpacity,
|
|
30980
31047
|
"data-cdl-tone": node.tone,
|
|
@@ -30998,6 +31065,18 @@ function CdlNodeView({
|
|
|
30998
31065
|
}
|
|
30999
31066
|
);
|
|
31000
31067
|
}
|
|
31068
|
+
|
|
31069
|
+
// src/render/relation-focus.ts
|
|
31070
|
+
function relatedFocusSet(edges, nodeId) {
|
|
31071
|
+
const \u96C6\u5408 = /* @__PURE__ */ new Set([nodeId]);
|
|
31072
|
+
for (const e of edges) {
|
|
31073
|
+
if (e.from !== nodeId && e.to !== nodeId) continue;
|
|
31074
|
+
\u96C6\u5408.add(e.id);
|
|
31075
|
+
\u96C6\u5408.add(e.from);
|
|
31076
|
+
\u96C6\u5408.add(e.to);
|
|
31077
|
+
}
|
|
31078
|
+
return \u96C6\u5408;
|
|
31079
|
+
}
|
|
31001
31080
|
function CdlStage({
|
|
31002
31081
|
laid,
|
|
31003
31082
|
currentPhase,
|
|
@@ -31008,7 +31087,35 @@ function CdlStage({
|
|
|
31008
31087
|
compact = false,
|
|
31009
31088
|
svgRef
|
|
31010
31089
|
}) {
|
|
31011
|
-
const
|
|
31090
|
+
const [\u7126\u70B9, set\u7126\u70B9] = useState(null);
|
|
31091
|
+
const \u95A2\u4FC2\u3092\u5149\u3089\u305B\u308B = (laid.relationFocus ?? RELATION_FOCUS_DEFAULT) === "hover";
|
|
31092
|
+
const \u52D5\u304D\u3092\u63A7\u3048\u308B = useReducedMotion();
|
|
31093
|
+
useEffect(() => {
|
|
31094
|
+
if (!\u95A2\u4FC2\u3092\u5149\u3089\u305B\u308B) set\u7126\u70B9(null);
|
|
31095
|
+
}, [\u95A2\u4FC2\u3092\u5149\u3089\u305B\u308B]);
|
|
31096
|
+
useEffect(() => {
|
|
31097
|
+
if (!\u95A2\u4FC2\u3092\u5149\u3089\u305B\u308B || \u7126\u70B9?.\u7559\u3081\u305F !== true) return;
|
|
31098
|
+
const \u62BC\u3057\u305F2 = (e) => {
|
|
31099
|
+
if (e.key === "Escape") set\u7126\u70B9(null);
|
|
31100
|
+
};
|
|
31101
|
+
window.addEventListener("keydown", \u62BC\u3057\u305F2);
|
|
31102
|
+
return () => window.removeEventListener("keydown", \u62BC\u3057\u305F2);
|
|
31103
|
+
}, [\u95A2\u4FC2\u3092\u5149\u3089\u305B\u308B, \u7126\u70B9?.\u7559\u3081\u305F]);
|
|
31104
|
+
const \u89E6\u308C\u305F = useCallback((id) => {
|
|
31105
|
+
set\u7126\u70B9((\u524D) => \u524D?.\u7559\u3081\u305F === true ? \u524D : { id, \u7559\u3081\u305F: false });
|
|
31106
|
+
}, []);
|
|
31107
|
+
const \u96E2\u308C\u305F = useCallback(() => {
|
|
31108
|
+
set\u7126\u70B9((\u524D) => \u524D?.\u7559\u3081\u305F === true ? \u524D : null);
|
|
31109
|
+
}, []);
|
|
31110
|
+
const \u62BC\u3057\u305F = useCallback((id) => {
|
|
31111
|
+
set\u7126\u70B9((\u524D) => \u524D?.id === id && \u524D.\u7559\u3081\u305F ? null : { id, \u7559\u3081\u305F: true });
|
|
31112
|
+
}, []);
|
|
31113
|
+
const \u7126\u70B9\u306E\u96C6\u5408 = useMemo(
|
|
31114
|
+
() => \u95A2\u4FC2\u3092\u5149\u3089\u305B\u308B && \u7126\u70B9 !== null ? relatedFocusSet(laid.edges, \u7126\u70B9.id) : null,
|
|
31115
|
+
[\u95A2\u4FC2\u3092\u5149\u3089\u305B\u308B, \u7126\u70B9, laid.edges]
|
|
31116
|
+
);
|
|
31117
|
+
const activeSet = \u7126\u70B9\u306E\u96C6\u5408 ?? new Set(currentPhase?.activate ?? []);
|
|
31118
|
+
const \u7BB1\u306E\u53D7\u3051\u53E3 = \u95A2\u4FC2\u3092\u5149\u3089\u305B\u308B ? { \u89E6\u308C\u305F, \u96E2\u308C\u305F, \u62BC\u3057\u305F, \u7126\u70B9: \u7126\u70B9?.id ?? null } : void 0;
|
|
31012
31119
|
const \u77E2\u5370\u306E\u51FA\u756A = useMemo(() => {
|
|
31013
31120
|
const \u521D\u51FA = /* @__PURE__ */ new Map();
|
|
31014
31121
|
laid.phases.forEach((p, i) => {
|
|
@@ -31239,6 +31346,7 @@ function CdlStage({
|
|
|
31239
31346
|
{
|
|
31240
31347
|
edge,
|
|
31241
31348
|
active: activeSet.has(edge.id),
|
|
31349
|
+
flowing: \u7126\u70B9\u306E\u96C6\u5408?.has(edge.id) === true && !\u52D5\u304D\u3092\u63A7\u3048\u308B,
|
|
31242
31350
|
drawing: \u77E2\u5370\u306E\u51FA\u756A.\u4F38\u3070\u3059\u304B(edge.id),
|
|
31243
31351
|
progress: \u77E2\u5370\u306E\u51FA\u756A.\u4F38\u3070\u3059\u304B(edge.id) ? \u63CF\u304F\u9032\u307F : progress,
|
|
31244
31352
|
stateValues
|
|
@@ -31252,6 +31360,7 @@ function CdlStage({
|
|
|
31252
31360
|
{
|
|
31253
31361
|
node,
|
|
31254
31362
|
active: activeSet.has(node.id),
|
|
31363
|
+
\u95A2\u4FC2\u306E\u53D7\u3051\u53E3: \u7BB1\u306E\u53D7\u3051\u53E3,
|
|
31255
31364
|
drawing: \u63CF\u304F,
|
|
31256
31365
|
progress: \u63CF\u304F ? \u63CF\u304F\u9032\u307F : progress,
|
|
31257
31366
|
stateValues,
|
|
@@ -32837,6 +32946,6 @@ function slugify(s) {
|
|
|
32837
32946
|
return s.toLowerCase().replace(/[^a-z0-9-ゟ゠-ヿ一-龯]+/g, "-").replace(/^-|-$/g, "");
|
|
32838
32947
|
}
|
|
32839
32948
|
|
|
32840
|
-
export { ARROW_ANGLE_MAX_DEG, ARROW_ENDPOINT_CENTER_TOL, CHAIN_MIN_CLEARANCE, CHAIN_SHIFT_MAX_ACCUMULATED, CHAIN_SHIFT_MAX_ITER, CLASS_RELATION_LOOK, CLEARANCE_LABEL_LABEL, CLEARANCE_LANE_LABEL, CLEARANCE_NODE_LABEL, CLEARANCE_PATH_LABEL, COLUMN_GAP_VARIANCE_TOL, CdlDiagramThumbnail, CdlDiagramView, DETOUR_GAP, DETOUR_SLOT_GAP, DIST_LABEL_PATH_MAX, DIST_LABEL_PATH_MIN, EDGE_HEADS, EDGE_HEAD_DEFAULT, EDGE_HEAD_FILLS, EDGE_HEAD_FILL_DEFAULT, EDGE_LABEL_TEXT, EDGE_REVEALS, EDGE_REVEAL_DEFAULT, EDGE_STUB_OUT, EDGE_STYLES, ER_CARDINALITY_HEAD, FAN_GAP, FONT_RENDER_TOLERANCE_WORLD, FSM_ACTION_MARK, LABEL_INIT_CLEARANCE, LABEL_INIT_CLEARANCE_DOTTED_FLOW, LABEL_SIZE_TOLERANCE_WORLD, LABEL_TO_PATH_CLEARANCE, LANE_BORDER_CLEARANCE_TOL, MARKER_GLOW_RADIUS, MIN_COLUMN_ALIGNMENT_TOLERANCE, MIN_ROW_ALIGNMENT_TOLERANCE, NEAR_COLLISION_DEFAULT_MIN, NEAR_COLLISION_POLICY, NODE_FRAME_SELECTOR, NODE_KINDS, ROW_GAP_VARIANCE_TOL, SEQUENCE_MESSAGE_LOOK, SPEC_CLEARANCE_POLICY, STAGE_SVG_SELECTOR, TARGET_LABEL_PATH_DIST, TONES, WCAG_AA_LARGE, WCAG_AA_NORMAL, applyDerivedValues, assertNever, attachEventHandlers, batch, bboxClearance, bboxDiffWorld, cdlAdapter, chart, classDiagram, compile, computeEventBindingKey, computeFormulaKey, computeInputSignalKey, computeScrollProgress, computeScrollTriggerKey, computeStateValues, computeViewportScale, computed, countEdgeCrossings, countOrderCrossings, createFormulaComputeds, createInputSignals, createInteractiveSignalsAccessor, createScrollProgressHandle, createScrollProgressSignals, diagram, effect, er, evaluate as evaluateFormula, extractIdentifiers, flow, flowchart, funnel, gantt, hasInteractivePrimitives, infrastructure, inputDefaultValue, interpolate, isLargeText, labelInitClearance, layout, layoutWithValidation, mindMap, network, orderNodes, parseFormula, pointRectEdgeDistance, pointToSegmentDistance2 as pointToSegmentDistance, predictLabelBBoxWorld, predictNodeBBoxWorld, projectEdgeLabel, projectNode, projectPathSegment, pxToWorld, quadrant, rectRectClearance, rectRectOverlapArea, rendersRows, requiredContrastRatio, requiredNearClearance, requiredRowsHeight, requiredRowsWidth, requiredSpecClearance, resolveEdgeLabelOverlapsWithChain, resolveEdgeLabelOverlapsWithChainAndPropagate, resolveLabelClearanceAfterPathPasses, resolveOverlapsWithChain, resolveTarget, resolveTargetAll, segmentsIntersect2 as segmentsIntersect, sequence, sequenceBoardMetrics, sequenceStepId, signal, stateMachine, stateMachine2, swimlane, topology, tree, untrack, userJourney, validate, verifyAllDiagramsDom, verifyAuthorIntent, verifyAuthorIntentAll, verifyDiagramDom, visualValidate, visualValidateAll, visualValidateLaid, withDerivedValues, worldToPx };
|
|
32949
|
+
export { ARROW_ANGLE_MAX_DEG, ARROW_ENDPOINT_CENTER_TOL, CHAIN_MIN_CLEARANCE, CHAIN_SHIFT_MAX_ACCUMULATED, CHAIN_SHIFT_MAX_ITER, CLASS_RELATION_LOOK, CLEARANCE_LABEL_LABEL, CLEARANCE_LANE_LABEL, CLEARANCE_NODE_LABEL, CLEARANCE_PATH_LABEL, COLUMN_GAP_VARIANCE_TOL, CdlDiagramThumbnail, CdlDiagramView, DETOUR_GAP, DETOUR_SLOT_GAP, DIST_LABEL_PATH_MAX, DIST_LABEL_PATH_MIN, EDGE_HEADS, EDGE_HEAD_DEFAULT, EDGE_HEAD_FILLS, EDGE_HEAD_FILL_DEFAULT, EDGE_LABEL_TEXT, EDGE_REVEALS, EDGE_REVEAL_DEFAULT, EDGE_STUB_OUT, EDGE_STYLES, ER_CARDINALITY_HEAD, FAN_GAP, FONT_RENDER_TOLERANCE_WORLD, FSM_ACTION_MARK, LABEL_INIT_CLEARANCE, LABEL_INIT_CLEARANCE_DOTTED_FLOW, LABEL_SIZE_TOLERANCE_WORLD, LABEL_TO_PATH_CLEARANCE, LANE_BORDER_CLEARANCE_TOL, MARKER_GLOW_RADIUS, MIN_COLUMN_ALIGNMENT_TOLERANCE, MIN_ROW_ALIGNMENT_TOLERANCE, NEAR_COLLISION_DEFAULT_MIN, NEAR_COLLISION_POLICY, NODE_FRAME_SELECTOR, NODE_KINDS, RELATION_FOCUSES, RELATION_FOCUS_DEFAULT, ROW_GAP_VARIANCE_TOL, SEQUENCE_MESSAGE_LOOK, SPEC_CLEARANCE_POLICY, STAGE_SVG_SELECTOR, TARGET_LABEL_PATH_DIST, TONES, WCAG_AA_LARGE, WCAG_AA_NORMAL, applyDerivedValues, assertNever, attachEventHandlers, batch, bboxClearance, bboxDiffWorld, cdlAdapter, chart, classDiagram, compile, computeEventBindingKey, computeFormulaKey, computeInputSignalKey, computeScrollProgress, computeScrollTriggerKey, computeStateValues, computeViewportScale, computed, countEdgeCrossings, countOrderCrossings, createFormulaComputeds, createInputSignals, createInteractiveSignalsAccessor, createScrollProgressHandle, createScrollProgressSignals, diagram, effect, er, evaluate as evaluateFormula, extractIdentifiers, flow, flowchart, funnel, gantt, hasInteractivePrimitives, infrastructure, inputDefaultValue, interpolate, isLargeText, labelInitClearance, layout, layoutWithValidation, mindMap, network, orderNodes, parseFormula, pointRectEdgeDistance, pointToSegmentDistance2 as pointToSegmentDistance, predictLabelBBoxWorld, predictNodeBBoxWorld, projectEdgeLabel, projectNode, projectPathSegment, pxToWorld, quadrant, rectRectClearance, rectRectOverlapArea, relatedFocusSet, rendersRows, requiredContrastRatio, requiredNearClearance, requiredRowsHeight, requiredRowsWidth, requiredSpecClearance, resolveEdgeLabelOverlapsWithChain, resolveEdgeLabelOverlapsWithChainAndPropagate, resolveLabelClearanceAfterPathPasses, resolveOverlapsWithChain, resolveTarget, resolveTargetAll, segmentsIntersect2 as segmentsIntersect, sequence, sequenceBoardMetrics, sequenceStepId, signal, stateMachine, stateMachine2, swimlane, topology, tree, untrack, userJourney, validate, verifyAllDiagramsDom, verifyAuthorIntent, verifyAuthorIntentAll, verifyDiagramDom, visualValidate, visualValidateAll, visualValidateLaid, withDerivedValues, worldToPx };
|
|
32841
32950
|
//# sourceMappingURL=index.js.map
|
|
32842
32951
|
//# sourceMappingURL=index.js.map
|