@ddd-tool/domain-designer-ui-component 0.1.0-beta.8 → 0.3.0

package/domain/diagram-agg/plugins.d.ts

@@ -0,0 +1,80 @@
+export declare const DIAGRAM_STORAGE_PLUGIN: import('vue-fn/domain').DomainSetupPlugin<
+  import('vue-fn/domain').DomainSingletonAgg<
+    {
+      renderConfig: {
+        ranker: import('./types').Ranker
+        padding: number
+        fontSize: number
+        edges: import('./types').EdgeType
+        bendSize: number
+      }
+      design: import('vue').ComputedRef<
+        import('@ddd-tool/domain-designer-core').DomainDesigner | undefined
+      >
+      designKeys: import('vue').ComputedRef<string[]>
+      designRecords: import('vue').Ref<
+        Record<string, import('@ddd-tool/domain-designer-core').DomainDesigner>,
+        Record<string, import('@ddd-tool/domain-designer-core').DomainDesigner>
+      >
+      code: import('vue').ComputedRef<string>
+      userStories: import('vue').ComputedRef<Record<string, string[]>>
+      workflows: import('vue').ComputedRef<Record<string, string[]>>
+      workflowPlayInterval: import('vue').Ref<number, number>
+      currentWorkflow: import('vue').Ref<string | undefined, string | undefined>
+      currentStory: import('vue').Ref<string, string>
+      currentDesignKey: import('vue').Ref<string | undefined, string | undefined>
+      currentNode: import('vue').Ref<string | undefined, string | undefined>
+      downloadEnabled: import('vue').Ref<boolean, boolean>
+      linkReadModel: import('vue').Ref<boolean, boolean>
+      linkSystem: import('vue').Ref<boolean, boolean>
+      builtinStoryMode: import('vue').Ref<boolean, boolean>
+      customWorkflowNames: import('vue').Ref<string[], string[]>
+    },
+    {
+      focusFlow: {
+        (workflow: undefined, userStory?: undefined): void
+        (workflow: string, userStory: string): void
+      }
+      downloadSvg(): void
+      getFilteredContext(): {
+        aggs: import('@ddd-tool/domain-designer-core').DomainDesignAgg<any>[]
+        commands: import('@ddd-tool/domain-designer-core').DomainDesignCommand<any>[]
+        facadeCommands: import('@ddd-tool/domain-designer-core').DomainDesignFacadeCommand<any>[]
+        events: import('@ddd-tool/domain-designer-core').DomainDesignEvent<any>[]
+        services: import('@ddd-tool/domain-designer-core').DomainDesignService[]
+        actors: import('@ddd-tool/domain-designer-core').DomainDesignActor[]
+        policies: import('@ddd-tool/domain-designer-core').DomainDesignPolicy[]
+        readModels: import('@ddd-tool/domain-designer-core').DomainDesignReadModel<any>[]
+        systems: import('@ddd-tool/domain-designer-core').DomainDesignSystem[]
+        links: Record<string, import('@ddd-tool/domain-designer-core/common').LinkType>
+        getIdMap: () => Record<string, import('@ddd-tool/domain-designer-core').DomainDesignObject>
+      }
+      setBuiltinStoryMode(b: boolean): void
+      setCustomWorkflowNames(v: string[]): void
+      setRenderRanker(v: import('./types').Ranker): void
+      setRenderPadding(v: number): void
+      setRenderFontSize(v: number): void
+      setRenderBendSize(v: number): void
+      setRenderEdgesType(v: import('./types').EdgeType): void
+      setDownloadEnabled(b: boolean): void
+      setWorkflowPlayInterval(i: number): void
+      setDisplayReadModel(b: boolean): void
+      setDisplaySystem(b: boolean): void
+      setCurrentNode(id: string | undefined): void
+      switchDesign(key: string): void
+      getIdMap(): Record<string, import('@ddd-tool/domain-designer-core').DomainDesignObject>
+    },
+    {
+      onFocusNode: import('vue-fn/domain').DomainBroadcastEvent<{
+        id: string | undefined
+      }>
+      onFocusFlow: import('vue-fn/domain').DomainBroadcastEvent<{
+        userStory: string
+        workflow: string | undefined
+        displayReadModel: import('vue').Ref<boolean, boolean>
+        displaySystem: import('vue').Ref<boolean, boolean>
+      }>
+      onDownloadSvg: import('vue-fn/domain').DomainBroadcastEvent<{}>
+    }
+  >
+>

package/domain/diagram-agg/types.d.ts

@@ -0,0 +1,20 @@
+export declare const EMPTY_STORY = '__Empty__'
+export declare const Ranker: Readonly<{
+  readonly NetworkSimplex: 'network-simplex'
+  readonly TightTree: 'tight-tree'
+  readonly LongestPath: 'longest-path'
+}>
+export type Ranker = Enum<typeof Ranker>
+export declare const EdgeType: Readonly<{
+  readonly Rounded: 'rounded'
+  readonly Hard: 'hard'
+}>
+export type EdgeType = Enum<typeof EdgeType>
+export type RenderConfig = {
+  ranker: Ranker
+  padding: number
+  fontSize: number
+  edges: EdgeType
+  bendSize: number
+}
+export declare function defaultRenderConfig(): RenderConfig

package/domain/i18n-agg/index.d.ts

@@ -1,21 +1,25 @@
-import { type ComputedRef } from 'vue';
-import type { I18nMessageKeys } from './message';
-export declare const validLanguages: readonly ["zh-CN", "en-US"];
-export type Language = (typeof validLanguages)[number];
+import { type ComputedRef } from 'vue'
+import type { I18nMessageKeys } from './message'
+export declare const validLanguages: readonly ['zh-CN', 'en-US']
+export type Language = (typeof validLanguages)[number]
 export declare function useI18nAgg(): Readonly<{
-    states: Readonly<{
-        currentLanguage: Readonly<import("vue").Ref<"zh-CN" | "en-US", "zh-CN" | "en-US">>;
-    }>;
-    commands: Readonly<{
-        setLanguage: (lang: Language) => void;
-        t: {
-            (key: I18nMessageKeys, defaultValue?: string): string;
-            (key: I18nMessageKeys, attr: Record<string, string | number>, defaultValue?: string): string;
-        };
-        $t: {
-            (key: I18nMessageKeys, defaultValue?: string): ComputedRef<string>;
-            (key: I18nMessageKeys, attr: Record<string, string | number>, defaultValue?: string): ComputedRef<string>;
-        };
-    }>;
-    events: Readonly<{}>;
-}>;
+  states: Readonly<{
+    currentLanguage: Readonly<import('vue').Ref<'zh-CN' | 'en-US', 'zh-CN' | 'en-US'>>
+  }>
+  commands: Readonly<{
+    setLanguage: (lang: Language) => void
+    t: {
+      (key: I18nMessageKeys, defaultValue?: string): string
+      (key: I18nMessageKeys, attr: Record<string, string | number>, defaultValue?: string): string
+    }
+    $t: {
+      (key: I18nMessageKeys, defaultValue?: string): ComputedRef<string>
+      (
+        key: I18nMessageKeys,
+        attr: Record<string, string | number>,
+        defaultValue?: string,
+      ): ComputedRef<string>
+    }
+  }>
+  events: Readonly<{}>
+}>

package/domain/i18n-agg/locale/en-US.d.ts

@@ -1,3 +1,3 @@
-import { type I18nMessages } from '../message';
-declare const messages: I18nMessages;
-export default messages;
+import { type I18nMessages } from '../message'
+declare const messages: I18nMessages
+export default messages

package/domain/i18n-agg/locale/zh-CN.d.ts

@@ -1,3 +1,3 @@
-import { type I18nMessages } from '../message';
-declare const messages: I18nMessages;
-export default messages;
+import { type I18nMessages } from '../message'
+declare const messages: I18nMessages
+export default messages

package/domain/i18n-agg/message.d.ts

@@ -1,4 +1,42 @@
-export type I18nMessageKeys = 'constant.type' | 'constant.type.id' | 'constant.type.document' | 'constant.type.function' | 'constant.type.valueObject' | 'constant.type.version' | 'constant.relatedTypes' | 'constant.note' | 'constant.empty' | 'constant.others' | 'menu.replayWorkflow' | 'menu.focusOnUserStory' | 'menu.focusOnUserStory.focusNothing' | 'menu.focusOnUserStory.animationDuration' | 'menu.completenessAssist' | 'menu.settings' | 'menu.settings.linkExternalSystem' | 'menu.settings.linkReadModel' | 'menu.settings.language' | 'menu.settings.dataSource' | 'menu.help' | 'menu.help.zoom' | 'menu.help.zoom.content' | 'menu.help.drag' | 'menu.help.drag.content' | 'menu.exportSvg' | 'menu.resetPosition';
+export type I18nMessageKeys =
+  | 'constant.type'
+  | 'constant.type.id'
+  | 'constant.type.document'
+  | 'constant.type.function'
+  | 'constant.type.valueObject'
+  | 'constant.type.version'
+  | 'constant.relatedTypes'
+  | 'constant.note'
+  | 'constant.empty'
+  | 'constant.others'
+  | 'menu.replayWorkflow'
+  | 'menu.focusOnUserStory'
+  | 'menu.focusOnUserStory.focusNothing'
+  | 'menu.focusOnUserStory.animationDuration'
+  | 'menu.completenessAssist'
+  | 'menu.settings'
+  | 'menu.settings.linkExternalSystem'
+  | 'menu.settings.linkReadModel'
+  | 'menu.settings.language'
+  | 'menu.settings.dataSource'
+  | 'menu.settings.render'
+  | 'menu.settings.render.ranker'
+  | 'menu.settings.render.ranker.NetworkSimplex.note'
+  | 'menu.settings.render.ranker.TightTree.note'
+  | 'menu.settings.render.ranker.LongestPath.note'
+  | 'menu.settings.render.padding'
+  | 'menu.settings.render.fontSize'
+  | 'menu.settings.render.edgesType'
+  | 'menu.settings.render.edgesType.rounded'
+  | 'menu.settings.render.edgesType.hard'
+  | 'menu.settings.render.bendSize'
+  | 'menu.help'
+  | 'menu.help.zoom'
+  | 'menu.help.zoom.content'
+  | 'menu.help.drag'
+  | 'menu.help.drag.content'
+  | 'menu.exportSvg'
+  | 'menu.resetPosition'
 export type I18nMessages = {
-    [key in I18nMessageKeys]: string;
-};
+  [key in I18nMessageKeys]: string
+}

package/domain/mount-plugin.d.ts

@@ -0,0 +1 @@
+export {}

package/index.css

@@ -1,127 +1,144 @@
 
-.nomnoml[data-v-ddc71b2c] {
-  height: 100%;
+.nomnoml[data-v-d8ed1f3a] {
+  height: 100%;
   overflow: auto;
-}
+}
 
-.nomnoml text {
+.nomnoml text {
   cursor: pointer;
 }
 @keyframes shining-info {
-from {
-    stroke-width: 1px;
-    stroke-opacity: 0.2;
-    stroke: #000;
+from {
+    stroke-width: 1px;
+    stroke-opacity: 0.2;
+    stroke: #000;
     -webkit-text-stroke-color: #000;
 }
-to {
-    stroke-width: 1px;
-    stroke-opacity: 0.8;
-    stroke: #000;
+to {
+    stroke-width: 1px;
+    stroke-opacity: 0.8;
+    stroke: #000;
     -webkit-text-stroke-color: #000;
 }
 }
 @keyframes shining-node {
-from {
-    stroke-opacity: 0.2;
-    stroke: #33322e;
+from {
+    stroke-opacity: 0.2;
+    stroke: #33322e;
     -webkit-text-stroke-color: #33322e;
 }
-to {
-    stroke-opacity: 1;
-    stroke: #33322e;
+to {
+    stroke-opacity: 1;
+    stroke: #33322e;
     -webkit-text-stroke-color: #33322e;
 }
 }
-.nomnoml .highlight-info:not(.active) text {
-  animation: shining-info 0.6s alternate infinite;
-  -webkit-animation: shining-info 0.6s alternate infinite;
+.nomnoml .highlight-info:not(.active) text {
+  animation: shining-info 0.6s alternate infinite;
+  -webkit-animation: shining-info 0.6s alternate infinite;
   -moz-animation: shining-info 0.6s alternate infinite;
 }
-.nomnoml .highlight-note:not(.active) {
-  animation: shining-info 0.6s alternate infinite;
-  -webkit-animation: shining-info 0.6s alternate infinite;
+.nomnoml .highlight-note:not(.active) {
+  animation: shining-info 0.6s alternate infinite;
+  -webkit-animation: shining-info 0.6s alternate infinite;
   -moz-animation: shining-info 0.6s alternate infinite;
 }
-.nomnoml .highlight-node:not(.active) g:first-child {
-  animation: shining-node 0.6s alternate infinite;
-  -webkit-animation: shining-node 0.6s alternate infinite;
+.nomnoml .highlight-node:not(.active) g:first-child {
+  animation: shining-node 0.6s alternate infinite;
+  -webkit-animation: shining-node 0.6s alternate infinite;
   -moz-animation: shining-node 0.6s alternate infinite;
 }
-.nomnoml g[data-id].active text,
-.nomnoml tspan[data-id].active {
-  stroke-width: 1px;
-  stroke-opacity: 0.8;
-  stroke: #000;
+.nomnoml g[data-id].active text,
+.nomnoml tspan[data-id].active {
+  stroke-width: 1px;
+  stroke-opacity: 0.8;
+  stroke: #000;
   -webkit-text-stroke-color: #000;
 }
-.nomnoml g.node.active {
-  animation: shining-node 0.6s alternate infinite;
-  -webkit-animation: shining-node 0.6s alternate infinite;
+.nomnoml g.node.active {
+  animation: shining-node 0.6s alternate infinite;
+  -webkit-animation: shining-node 0.6s alternate infinite;
   -moz-animation: shining-node 0.6s alternate infinite;
-}
+}
 
-.container {
-  width: 100vw;
-  height: 100vh;
-  background-color: #efefef;
-  overflow: hidden;
+.container {
+  width: 100vw;
+  height: 100vh;
+  background-color: #efefef;
+  overflow: hidden;
   position: relative;
 }
-.draggable {
-  position: absolute;
-  top: 0;
-  left: 0;
-  user-select: none;
+.draggable {
+  position: absolute;
+  top: 0;
+  left: 0;
+  user-select: none;
   transform-origin: 0 0; /* 设置缩放原点为左上角 */
-}
+}
+
+.dock-selector[data-v-419ca8ac] {
+  display: inline-block;
+}
+[data-v-419ca8ac] .p-dock-item {
+  padding: 0;
+}
+[data-v-419ca8ac] .p-dock-item-content > div {
+  padding: 0.5rem;
+}
 
-.p-dock {
-  opacity: 0.4;
+.p-dock {
+  opacity: 0.4;
   transition: 0.5s;
 }
-.p-dock:hover {
+.p-dock:hover {
   opacity: 1;
 }
-.p-dock .p-dock-item:hover {
-  scale: 1.1;
+.p-dock .p-dock-item {
+  transition: 0.5s;
+}
+.p-dock .p-dock-item:hover {
+  scale: 1.2;
 }
-.toolbar-drawer {
+.toolbar-drawer {
   width: 40%;
 }
-.toolbar-drawer .datasource {
+.toolbar-drawer .datasource {
   font-weight: bold;
 }
-.toolbar-drawer .datasource .datasource-item {
-  display: grid;
-  grid-template-columns: 20px 1fr;
-  grid-template-rows: 1fr;
-  margin: 5px 0;
-  line-height: 1.5rem;
-  font-size: 1rem;
+.toolbar-drawer .datasource .datasource-item {
+  display: grid;
+  grid-template-columns: 20px 1fr;
+  grid-template-rows: 1fr;
+  margin: 5px 0;
+  line-height: 1.5rem;
+  font-size: 1rem;
   border-radius: 5px;
 }
-.toolbar-drawer .datasource .datasource-item :hover {
-  cursor: pointer;
+.toolbar-drawer .datasource .datasource-item :hover {
+  cursor: pointer;
   background-image: linear-gradient(to bottom, white, rgb(228, 250, 255), white);
 }
-.toolbar-drawer .datasource .datasource-item label {
+.toolbar-drawer .datasource .datasource-item label {
   padding-left: 5px;
 }
-.root-fieldset {
-  opacity: 0.9;
-  white-space: pre-line;
-  position: absolute;
-  right: 4rem;
-  top: 0;
+.root-fieldset {
+  opacity: 0.7;
+  white-space: pre-line;
+  position: absolute;
+  right: 4rem;
+  top: 0;
   width: 30%;
+  transition: opacity 0.5s ease-out;
 }
-.root-fieldset .note::before {
-  content: '';
-  display: inline-block;
-  height: 1rem;
-  width: 0.5rem;
-  border-radius: 0.25rem;
-  margin-right: 0.5rem;
+.root-fieldset:hover {
+  opacity: 1;
+}
+.root-fieldset .note::before {
+  content: '';
+  display: inline-block;
+  height: 1rem;
+  width: 0.5rem;
+  border-radius: 0.25rem;
+  margin-right: 0.5rem;
   background-color: #4441ff;
-}
+}

package/index.d.ts

@@ -1,5 +1,6 @@
-import Aura from '@primeuix/themes/aura';
-import PrimeVue from 'primevue/config';
-import Tooltip from 'primevue/tooltip';
-import Ui from './UI.vue';
-export { Ui, PrimeVue, Aura, Tooltip };
+import Aura from '@primeuix/themes/aura'
+import PrimeVue from 'primevue/config'
+import Tooltip from 'primevue/tooltip'
+import './domain/mount-plugin'
+import Ui from './UI.vue'
+export { Ui, PrimeVue, Aura, Tooltip }