@things-factory/reference-app 6.0.27 → 6.0.28

package/dist-client/helps/board-modeller/data-binding.zh.md

@@ -0,0 +1,89 @@
+# Data Binding
+
+## Concept
+
+- 每个组件都有其自己的数据属性。
+- 可以如下设置组件的数据属性。
+  - 初始数据：建模人员可以在建模过程中设置初始数据。
+  - 对于数据源组件：将从数据源接收的结果设置为自己的数据。
+  - 对于基于 UI 的组件：通过用户交互更改的值设置为数据。
+  - 数据传播：可以通过设置其他组件的数据绑定来设置。
+- 可以根据设置的数据绑定模型来更改目标组件的属性，以响应组件数据的更改。
+
+## Identifier
+
+### ID
+
+- 组件的唯一名称
+
+### class
+
+- 组件类别
+- 可以设置多个用空格分割的类
+- 每个类可以在发送数据时被指定为目标。
+
+### template prefix
+
+- 可以在将组件指定为模板时设置。
+- 设置为模板的组件不会显示。
+- 指何时通过克隆使用模板动态创建组件。
+
+### no data no show
+
+- 在 Viewer 模式下操作时，如果在组件中没有数据，则不显示。
+
+### intent sensitive
+
+- 更改源组件的数据时，数据传播有效。 换句话说，即使重新设置了数据，除非实际更改该值，否则数据传播将不起作用。 这是一种提高监视目的效率的方法。
+- 但是，当打开 intent sensitive 设置时，即使数据没有更改，即该值实际上并未更改，也可以进行数据传播。
+- 此属性也对源组件的 value 属性的配置动作发生作用。
+
+## Initial Data
+
+- 设置组件的初始数据。
+- 数据可以设置为字符串，数字或 JSON 对象类型之一。
+
+## Data Spread
+
+- 此设置根据源组件的数据值更改目标组件的属性。
+- 如果源组件更改了目标组件的数据属性，则目标组件的数据传播功能将连续运行，因此该功能称为数据传播。
+- 可以进行多种数据传播设置
+
+### accessor
+
+- 它是根据源组件的数据值更改目标组件的属性的设置。
+- 设置方法遵循[JSONATO 文档](http://docs.jsonata.org/overview.html)。
+
+### target
+
+- 指定用于数据传播的目标组件。
+- 由 ID 指定：#id
+- 指定为类：.class
+- 基于数据的目标指定 -（key）：以数据对象的键值为 id 的组件将成为目标组件。 -[property]：将数据对象的属性值作为 ID 的组件将成为目标组件。
+
+### property
+
+- 指定要传播数据值的目标组件的属性。
+
+### rule
+
+指定如何将要传播的数据应用于目标组件属性。
+
+- value
+  - 值本身被设置为组件的目标属性。
+- map
+  - 在目标组件的属性中设置数据属性的值。
+- range
+  - 在目标组件的属性中设置包含该值的范围的映射值。
+- eval
+  - eval 代码可以用 JavaScript 语法编写。
+  - eval 代码的 context (this)是源组件。
+  - eval 代码的参数具有 value 和 targets。
+    - value：源组件的数据中 accessor 对应的值
+    - targets：目标组件列表
+
+### 无数据不传播(No Data No Spreading)
+
+- 只有当根据规则类型的最终结果值不是空值时，才会传播数据。
+  - 如果结果值为 undefined、null、NaN 或空白 ('')，则不会展开。
+  - 否则，即使结果是数字零，数据也会被传播。

package/dist-client/helps/board-modeller/data-spread.ko.md

@@ -0,0 +1,57 @@
+# 데이타 바인딩
+
+[데이타바인딩 소개](./data-binding.md)
+
+## 데이타 전파 (Data Spread)
+
+- 소스 컴포넌트의 data 값을 기반으로 대상 컴포넌트의 속성을 변경시키는 설정이다.
+- 만일, 소스 컴포넌트가 대상 컴포넌트의 data속성을 변경시키는 경우, 대상 컴포넌트의 Data Spread 기능이 연속적으로 동작하므로, 이 기능을 데이타 전파라고 한다.
+- 여러개의 데이타 전파 설정이 가능하다
+
+### 복사, 붙여넣기 그리고 삭제
+
+- 데이타전파와 관련한 반복적인 설정이 번거러울 수 있기 때문에, 복사, 붙여넣기 그리고 삭제 기능을 제공한다.
+- 복사-붙여넣기 : 컴포넌트의 전체 데이타전파 설정을 복사하여, 다른 컴포넌트의 데이타전파 설정에 붙여넣기할 수 있다. 붙여넣기는 대상 컴포넌트의 데이타전파 설정을 모두 교체하므로 주의가 필요하다.
+- 삭제 : 컴포넌트의 데이타전파 설정 중에서 현재 탭의 설정만을 삭제한다.
+
+### 접근자 (accessor)
+
+- 소스 컴포넌트의 data 객체 중에서, 일부분만 전파하거나 변환된 데이타를 전파하고자 하는 경우에 설정한다.
+- 설정 방법은 [JSONATO 도큐먼트](http://docs.jsonata.org/overview.html)를 따른다.
+
+### 대상 (target)
+
+- 데이타 전파 대상 컴포넌트를 지정한다.
+- id로 지정 : #id
+- class로 지정 : .class
+- data에 기반한 대상 지정
+  - (key) : data 객체의 키값을 id로 하는 컴포넌트들이 대상 컴포넌트가 된다.
+  - [property] : data 객체의 property의 값을 id로 하는 컴포넌트들이 대상 컴포넌트가 된다.
+
+### 속성 (property)
+
+- 전파될 데이타 값이 적용될 대상 컴포넌트의 속성을 지정한다.
+- 속성 값을 '(action)'으로 설정하면, 타겟 컴포넌트(들)의 어떤 속성에도 적용되지 않는다. '(action)' 속성은 주로 데이타 전파 시점에 스크립트 동작만을 시키고 싶을 때 사용된다.
+
+### 규칙 타입 (rule)
+
+전파될 데이타가 대상 컴포넌트 속성에 적용되는 방법을 지정한다.
+
+- 값 (value)
+  - 값 자체가 그대로 대상 컴포넌트의 속성에 설정된다.
+- 매핑 (map)
+  - 값을 키로 하는 매핑값이 대상 컴포넌트의 속성에 설정된다.
+- 범위 (range)
+  - 값이 포함된 범위의 매핑값이 대상 컴포넌트의 속성에 설정된다.
+- 함수 (eval)
+  - eval 코드는 자바스크립트 문법으로 작성할 수 있다.
+  - eval 코드의 context (this)는 소스 컴포넌트이다.
+  - eval 코드의 parameter 는 value와 targets가 있다.
+    - value : 소스 컴포넌트의 data에 accessor가 적용된 값
+    - targets : 타겟 컴포넌트 리스트
+
+### No Data No Spreading
+
+- 규칙 타입에 따른 최종 결과값이 빈 값이 아닌 경우에만 전파한다.
+  - 결과값이 undefined, null, NaN, 공백('')인 경우에는 전파하지 않는다.
+  - 결과값이 숫자 0인 경우에는 전파한다.

package/dist-client/helps/board-modeller/data-spread.md

@@ -0,0 +1,57 @@
+# Data Binding
+
+[About Data Binding](./data-binding.md)
+
+## Data Spread
+
+- This setting changes the properties of the target component based on the data value of the source component.
+- If the source component changes the data property of the target component, the Data Spread function of the target component operates continuously, so this function is called data propagation.
+- Multiple data propagation settings are possible
+
+### Copy, Paste and Delete
+
+- Because repetitive settings related to data spreading can be cumbersome, copy, paste and delete functions are provided.
+- Copy-Paste: You can copy the entire data spreading setting of a component and paste it into the data spreading setting of another component. Caution is required because pasting replaces all data spreading settings of the target component.
+- Delete: Deletes only the settings of the current tab among the data spreading settings of the component.
+
+### accessor
+
+- Set when you want to propagate only a part of the data object of the source component or the transformed data.
+- The setting method follows [JSONATO document](http://docs.jsonata.org/overview.html).
+
+### target
+
+- Designate the target component for data propagation.
+- Designated by id: #id
+- Designated as class: .class
+- Target designation based on data
+  - (key): Components with the key value of the data object as the id become target components.
+  - [property]: Components that have the property value of the data object as the id become the target component.
+
+### property
+
+- Designates the properties of the target component to which the data value to be propagated is applied.
+- If the property value is set to '(action)', it is not applied to any properties of the target component(s). The '(action)' property is mainly used when you want to execute only script actions at the time of data propagation.
+
+### rule
+
+Specifies how the data to be propagated is applied to the target component properties.
+
+- value
+  - the value itself is set as the target attribute of the component.
+- map
+  - mapping the value of the key value is set in the properties of the target component.
+- range
+  - The mapping value of the range including the value is set in the properties of the target component.
+- eval
+  - The eval code can be written in JavaScript grammar.
+  - The context (this) of the eval code is a source component.
+  - The parameter of eval code has value and targets.
+    - value: The value to which the accessor is applied to the data of the source component
+    - targets: list of target components
+
+### No Data No Spreading
+
+- Data will be spreaded only when the final result value according to the rule type is not an empty value.
+  - If the result value is undefined, null, NaN, or blank (''), it will not be spreaded.
+  - Otherwise, data will be spreaded, even if the result is the number zero.

package/dist-client/helps/board-modeller/data-spread.zh.md

@@ -0,0 +1,55 @@
+# Data Binding
+
+[About Data Binding](./data-binding.md)
+
+## Data Spread
+
+- 此设置根据源组件的数据值更改目标组件的属性。
+- 如果源组件更改了目标组件的数据属性，则目标组件的数据传播功能将连续运行，因此该功能称为数据传播。
+- 可以进行多种数据传播设置
+
+### 复制、粘贴和删除
+
+- 由于与“数据传播”相关的重复设置可能很麻烦，因此提供了复制、粘贴和删除功能。
+- 复制粘贴：您可以复制一个组件的整个“数据传播”设置并将其粘贴到另一个组件的“数据传播”设置中。 请小心，因为粘贴会替换目标组件的所有“数据传播”设置。
+- 删除：仅删除组件“数据传播”设置中当前选项卡的设置。
+
+### accessor
+
+- 它是根据源组件的数据值更改目标组件的属性的设置。
+- 设置方法遵循[JSONATO 文档](http://docs.jsonata.org/overview.html)。
+
+### target
+
+- 指定用于数据传播的目标组件。
+- 由 ID 指定：#id
+- 指定为类：.class
+- 基于数据的目标指定 -（key）：以数据对象的键值为 id 的组件将成为目标组件。 -[property]：将数据对象的属性值作为 ID 的组件将成为目标组件。
+
+### property
+
+- 指定要传播数据值的目标组件的属性。
+- 如果属性值设置为“(action)”，则它不会应用于目标组件的任何属性。 '(action)' 属性主要用于在数据传播时只执行脚本操作的情况。
+
+### rule
+
+指定如何将要传播的数据应用于目标组件属性。
+
+- value
+  - 值本身被设置为组件的目标属性。
+- map
+  - 在目标组件的属性中设置数据属性的值。
+- range
+  - 在目标组件的属性中设置包含该值的范围的映射值。
+- eval
+  - eval 代码可以用 JavaScript 语法编写。
+  - eval 代码的 context (this)是源组件。
+  - eval 代码的参数具有 value 和 targets。
+    - value：源组件的数据中 accessor 对应的值
+    - targets：目标组件列表
+
+### 无数据不传播(No Data No Spreading)
+
+- 只有当根据规则类型的最终结果值不是空值时，才会传播数据。
+  - 如果结果值为 undefined、null、NaN 或空白 ('')，则不会展开。
+  - 否则，即使结果是数字零，数据也会被传播。

package/dist-client/helps/board-modeller/effects/animation.ko.md

@@ -0,0 +1,46 @@
+# 애니메이션
+![animation-01][animation-01]  
+미리보기와 모니터링 모드로 변환될 시 동작할 컴포넌트의 애니메이션들을 설정할 수 있다.  
+  - 이벤트 시점
+  1. onCreate - 뷰 모드가 실행되는 순간부터 애니메이션 동작.
+  1. onChange - 컴포넌트의 데이터가 변경이 되었을 때 동작.
+  - 애니메이션 종류  
+  1. Rotation-CW  
+  ![animation-02][animation-02]  
+  1. Rotation-CWW  
+  ![animation-03][animation-03]  
+  1. Vibration  
+  ![animation-04][animation-04]  
+  1. Hearbeat  
+  ![animation-05][animation-05]  
+  1. Moving-Right  
+  ![animation-06][animation-07]  
+  1. Moving-Left  
+  ![animation-07][animation-06]  
+  1. Moving-Bottom  
+  ![animation-08][animation-09]  
+  1. Moving-Top  
+  ![animation-09][animation-08]  
+  1. Outline  
+  ![animation-10][animation-10]
+
+
+[animation-01]:../images/animation-01.gif
+
+[animation-02]:../images/animation-02.gif
+
+[animation-03]:../images/animation-03.gif
+
+[animation-04]:../images/animation-04.gif
+
+[animation-05]:../images/animation-05.gif
+
+[animation-06]:../images/animation-06.gif
+
+[animation-07]:../images/animation-07.gif
+
+[animation-08]:../images/animation-08.gif
+
+[animation-09]:../images/animation-09.gif
+
+[animation-10]:../images/animation-10.gif

package/dist-client/helps/board-modeller/effects/animation.md

@@ -0,0 +1,47 @@
+# Animation
+
+![animation-01][animation-01]  
+You can set the animations of component which will run when converts to preview and monitoring mode.
+  - Event point
+  1. onCreate - Operate animation from the moment of running view mode.
+  1. onChange - Operate when the data of component has been changed.
+  - Animation type
+  1. Rotation-CW  
+  ![animation-02][animation-02]  
+  1. Rotation-CWW  
+  ![animation-03][animation-03]  
+  1. Vibration  
+  ![animation-04][animation-04]  
+  1. Hearbeat  
+  ![animation-05][animation-05]  
+  1. Moving-Right  
+  ![animation-06][animation-07]  
+  1. Moving-Left  
+  ![animation-07][animation-06]  
+  1. Moving-Bottom  
+  ![animation-08][animation-09]  
+  1. Moving-Top  
+  ![animation-09][animation-08]  
+  1. Outline  
+  ![animation-10][animation-10]  
+
+
+[animation-01]:../images/animation-01.gif
+
+[animation-02]:../images/animation-02.gif
+
+[animation-03]:../images/animation-03.gif
+
+[animation-04]:../images/animation-04.gif
+
+[animation-05]:../images/animation-05.gif
+
+[animation-06]:../images/animation-06.gif
+
+[animation-07]:../images/animation-07.gif
+
+[animation-08]:../images/animation-08.gif
+
+[animation-09]:../images/animation-09.gif
+
+[animation-10]:../images/animation-10.gif

package/dist-client/helps/board-modeller/effects/animation.zh.md

@@ -0,0 +1,47 @@
+# 动画
+![animation-01][animation-01]  
+可以设置当转换为预览和监控模式时的组件的动画。
+  - 事件时点
+  1. onCreate - 从运行视图模式的瞬间开始，操作动画。
+  1. onChange - 当组件的数据发生变更时，将会操作动画。
+  - 动画类型
+  1. 旋转-顺时针  
+  ![animation-02][animation-02]  
+  1. 旋转-逆时针  
+  ![animation-03][animation-03]  
+  1. 震动  
+  ![animation-04][animation-04]  
+  1. 心搏  
+  ![animation-05][animation-05]  
+  1. 向右移动  
+  ![animation-06][animation-07]  
+  1. 向左移动  
+  ![animation-07][animation-06]  
+  1. 向下移动  
+  ![animation-08][animation-09]  
+  1. 向上移动  
+  ![animation-09][animation-08]  
+  1. 轮廓  
+  ![animation-10][animation-10]  
+
+
+ 
+[animation-01]:../images/animation-01.gif
+
+[animation-02]:../images/animation-02.gif
+
+[animation-03]:../images/animation-03.gif
+
+[animation-04]:../images/animation-04.gif
+
+[animation-05]:../images/animation-05.gif
+
+[animation-06]:../images/animation-06.gif
+
+[animation-07]:../images/animation-07.gif
+
+[animation-08]:../images/animation-08.gif
+
+[animation-09]:../images/animation-09.gif
+
+[animation-10]:../images/animation-10.gif

package/dist-client/helps/board-modeller/effects/hover-event.ko.md

@@ -0,0 +1,55 @@
+# hover event
+
+컴포넌트위로 마우스를 호버되었을 때의 동작을 정의한다.
+
+## 동작
+
+### 강조
+
+컴포넌트 테두리가 강조되는 효과를 만들어낸다.
+
+### 동작
+
+- popup target board
+  - 타겟으로 지정한 대상 보드를 팝업창에 보인다.
+  - 팝업창의 위치는 팝업 대상 보드의 크기와 호버된 컴포넌트의 위치를 감안해서 다음의 위치중 한 곳에 보여진다.
+    - top-left, top-right, bottom-left, bottom-right, center
+  - 팝업창의 크기는 현재 보드의 크기보다 커서는 안된다. 팝업 대상 보드의 크기가 현재 보드보다 크면, 팝업 대상 보드의 모든 내용을 보기 힘들게 된다.
+  - 팝업창을 닫기 위해서는 팝업창 우측 상단의 'X' 클로즈 버튼을 누르거나, 대상 보드의 특정 컴포넌트의 탭이벤트가 'close current board'로 설정되어있다면, 해당 컴포넌트를 클릭해서 닫을 수 있다.
+  - 'restore on leave(나갈 때 원상태로 복구)' 설정에 영향을 받지 않는다.
+  - 파라미터
+    - target : 팝업창으로 보여줄 대상 보드를 보드목록에서 지정한다.
+- open infowindow
+  - 'info-window' 컴포넌트에 설정된 내용으로 호버된 포인트에 근접한 위치에 인포윈도우를 띄워준다.
+  - 'restore on leave(나갈 때 원상태로 복구)' 설정이 되어있으면, 마우스 포인트가 컴포넌트에서 벗어날 때 인포윈도우도 클로즈된다.
+  - 파라미터
+    - target : 대상 인포윈도우의 아이디를 지정한다.
+- toggle target component data
+  - 대상 컴포넌트의 현재 데이타를 기준으로 불린값 true/false 순서로 데이타를 토글시킨다.
+  - 파라미터
+    - target : 데이타를 토글시킬 대상 컴포넌트
+- tristate(0/1/2) target component data
+  - 대상 컴포넌트의 현재 데이타를 기준으로 숫자 0/1/2 순서로 데이타를 순환시킨다.
+  - 파라미터
+    - target : 데이타를 순환시킬 대상 컴포넌트
+- set value to target component data
+  - 설정한 값으로 대상 컴포넌트의 'data'를 변경한다.
+  - 보통 컴포넌트의 data를 변화시키는 것은 대상 컴포넌트에 지정된 데이타 스프레드를 트리거링하는 효과를 발휘한다.
+  - 파라미터
+    - target : data를 변경할 대상 컴포넌트
+    - value : 대상 컴포넌트에 설정될 값 (문자열, 숫자 또는 오브젝트 타입을 지정할 수 있다)
+- set value to target component value
+  - 설정한 값으로 대상 컴포넌트의 'value'를 변경한다.
+  - 보통 컴포넌트의 value를 변화시키는 것은 대상 컴포넌트의 지정된 동작을 트리거링하는 효과를 발휘한다.
+  - 파라미터
+    - target : value를 변경할 대상 컴포넌트
+    - value : 대상 컴포넌트에 설정될 값 (문자열, 숫자 또는 오브젝트 타입을 지정할 수 있다)
+
+## restore on leave (나갈 때 원상태로 복구)
+
+마우스가 해당 컴포넌트를 벗어날 때, 다음의 효과는 취소되게 하는 설정이다.
+
+- 강조
+- open infowindow
+- toggle target component data
+- tristate(0/1/2) target component data

package/dist-client/helps/board-modeller/effects/hover-event.md

@@ -0,0 +1,57 @@
+# hover event
+
+Defines the behavior when the mouse is hovered over the component.
+
+## Description
+
+### Emphasize
+
+Creates the effect of highlighting the component borders.
+
+### Action
+
+- popup target board
+  - The target board will be displayed in a pop-up window.
+  - the position of the pop-up window is in view of the size and location of the components of the hover pop-up target board is shown in one of the following locations.
+    - top-left, top-right, bottom-left, bottom-right, center
+  - The size of the pop-up window should not be larger than the size of the current board. If the size of the pop-up target board is larger than the current board, it becomes difficult to see all the contents of the pop-up target board.
+  - To close the pop-up window, press the'X' close button at the top right of the pop-up window, or if the tab event of a specific component of the target board is set to'close current board', you can click the component to close it.
+  - Not affected by setting of 'restore on leave'
+  - parameter
+    - target : Specify the target board to show from list on the board.
+- open infowindow
+  - 'info-window' With the content set in the component, the info window is opened at a location close to the hovered point.
+  - When the mouse point leaves the component, the info window is also closed with setting of 'restore on leave'
+  - parameter
+    - target : Specifies the ID of the target info window.
+- toggle target component data
+  - Toggles data in the order of Boolean value true/false based on the current data of the target component.
+  - parameter
+    - target : Target component to toggle data
+- tristate(0/1/2) target component data
+  - Based on the current data of the target component, data will be cycled in the order of number 0/1/2.
+  - parameter
+    - target : Target component to rotate data
+- set value to target component data
+  - Change the 'data' of the target component with the set value.
+  - Usually, changing the data of a component has the effect of triggering a data spread assigned to the target component.
+  - parameter
+    - target : Target component to change data
+    - value : Value to be set in the target component (string, number or object type can be specified)
+- set value to target component value
+  - Change the 'value' of the target component with the set value.
+  - Usually, changing the value of a component has the effect of triggering a specified action of the target component.
+  - parameter
+    - target :  Target component to change value
+    - value : Value to be set in the target component (string, number or object type can be specified)
+
+### target
+- The target board or component, target editor will be changed by selected action, it can be 'board list' or 'component drop down'
+### restore on leave
+
+When the mouse leaves the component, the following effect is a setting to cancel.
+
+- 강조
+- open infowindow
+- toggle target component data
+- tristate(0/1/2) target component data

package/dist-client/helps/board-modeller/effects/hover-event.zh.md

@@ -0,0 +1,55 @@
+# 悬停事件
+
+定义将鼠标悬停在组件上时的行为。
+
+## 동작
+
+### 강조
+
+产生突出显示组件边框的效果。
+
+### 동작
+
+- popup target board
+  - 타겟으로 지정한 대상 보드를 팝업창에 보인다.
+  - 팝업창의 위치는 팝업 대상 보드의 크기와 호버된 컴포넌트의 위치를 감안해서 다음의 위치중 한 곳에 보여진다.
+    - top-left, top-right, bottom-left, bottom-right, center
+  - 팝업창의 크기는 현재 보드의 크기보다 커서는 안된다. 팝업 대상 보드의 크기가 현재 보드보다 크면, 팝업 대상 보드의 모든 내용을 보기 힘들게 된다.
+  - 팝업창을 닫기 위해서는 팝업창 우측 상단의 'X' 클로즈 버튼을 누르거나, 대상 보드의 특정 컴포넌트의 탭이벤트가 'close current board'로 설정되어있다면, 해당 컴포넌트를 클릭해서 닫을 수 있다.
+  - 'restore on leave(나갈 때 원상태로 복구)' 설정에 영향을 받지 않는다.
+  - 파라미터
+    - target : 팝업창으로 보여줄 대상 보드를 보드목록에서 지정한다.
+- open infowindow
+  - 'info-window' 컴포넌트에 설정된 내용으로 호버된 포인트에 근접한 위치에 인포윈도우를 띄워준다.
+  - 'restore on leave(나갈 때 원상태로 복구)' 설정이 되어있으면, 마우스 포인트가 컴포넌트에서 벗어날 때 인포윈도우도 클로즈된다.
+  - 파라미터
+    - target : 대상 인포윈도우의 아이디를 지정한다.
+- toggle target component data
+  - 대상 컴포넌트의 현재 데이타를 기준으로 불린값 true/false 순서로 데이타를 토글시킨다.
+  - 파라미터
+    - target : 데이타를 토글시킬 대상 컴포넌트
+- tristate(0/1/2) target component data
+  - 대상 컴포넌트의 현재 데이타를 기준으로 숫자 0/1/2 순서로 데이타를 순환시킨다.
+  - 파라미터
+    - target : 데이타를 순환시킬 대상 컴포넌트
+- set value to target component data
+  - 설정한 값으로 대상 컴포넌트의 'data'를 변경한다.
+  - 보통 컴포넌트의 data를 변화시키는 것은 대상 컴포넌트에 지정된 데이타 스프레드를 트리거링하는 효과를 발휘한다.
+  - 파라미터
+    - target : data를 변경할 대상 컴포넌트
+    - value : 대상 컴포넌트에 설정될 값 (문자열, 숫자 또는 오브젝트 타입을 지정할 수 있다)
+- set value to target component value
+  - 설정한 값으로 대상 컴포넌트의 'value'를 변경한다.
+  - 보통 컴포넌트의 value를 변화시키는 것은 대상 컴포넌트의 지정된 동작을 트리거링하는 효과를 발휘한다.
+  - 파라미터
+    - target : value를 변경할 대상 컴포넌트
+    - value : 대상 컴포넌트에 설정될 값 (문자열, 숫자 또는 오브젝트 타입을 지정할 수 있다)
+
+## restore on leave (나갈 때 원상태로 복구)
+
+마우스가 해당 컴포넌트를 벗어날 때, 다음의 효과는 취소되게 하는 설정이다.
+
+- 강조
+- open infowindow
+- toggle target component data
+- tristate(0/1/2) target component data

package/dist-client/helps/board-modeller/effects/retention.ko.md

@@ -0,0 +1,4 @@
+# 유지기간 (Retention)
+
+컴포넌트가 보드에서 유지되는 시간. 즉, 이 유지기간이 종료되면 컴포넌트는 보드에서 사라진다.  
+단, 유지기간 내에 컴포넌트 속성에 변화가 발생하면 유지기간의 시점이 리셋된다.

package/dist-client/helps/board-modeller/effects/retention.md

@@ -0,0 +1,4 @@
+# Retention
+
+The length of time that the component remains on the board. That is, when the retention ends, the component disappears from the board.  
+However, when a change occurs in the component property within the retention, the moment of the retention will be reset.

package/dist-client/helps/board-modeller/effects/retention.zh.md

@@ -0,0 +1,4 @@
+# 保存期间
+
+组件保持在Board上的时间。也就是说，当该保持期间结束时，组件将会从Board上消失。  
+但是，如果组件属性在保持期间内发生变更，保持期间的时点就会被重置。

package/dist-client/helps/board-modeller/effects/shadow.ko.md

@@ -0,0 +1,18 @@
+# 그림자
+![shadow-02][shadow-02]  
+컴포넌트의 그림자 효과를 설정. 그림자의 위치와 번짐도, 색상 등을 조절할 수 있다.
+1. X, Y 좌표(Number) - 컴포넌트를 기준으로 그림자가 위치할 좌표를 조정  
+![shadow-03][shadow-03]
+2. 크기(Number) - 그림자의 번지는 정도를 조정
+![shadow-04][shadow-04]
+3. 색상(Number) - 그림자의 색상을 조정
+![shadow-05][shadow-05]
+
+
+[shadow-02]: ../images/shadow-02.png
+
+[shadow-03]: ../images/shadow-03.png
+
+[shadow-04]: ../images/shadow-04.png
+
+[shadow-05]: ../images/shadow-05.png

package/dist-client/helps/board-modeller/effects/shadow.md

@@ -0,0 +1,21 @@
+# Shadow
+
+![shadow-02][shadow-02]  
+Set the shadow effect of component. It can adjust the location, blurring effect and color of shadow.
+1. X, Y coordinates (Number) - Adjust the coordinates for a location of shadow based on component.
+![shadow-03][shadow-03]
+2. Size(Number) - Adjust the blurring effect of shadow.
+![shadow-04][shadow-04]
+3. Color(Number) - Adjust the color of shadow.
+![shadow-05][shadow-05]
+
+
+
+
+[shadow-02]: ../images/shadow-02.png
+
+[shadow-03]: ../images/shadow-03.png
+
+[shadow-04]: ../images/shadow-04.png
+
+[shadow-05]: ../images/shadow-05.png

package/dist-client/helps/board-modeller/effects/shadow.zh.md

@@ -0,0 +1,19 @@
+# 阴影
+
+![shadow-02][shadow-02]  
+设置组件的阴影效果。可以调整阴影的位置和模糊效应、颜色等。
+1. X、Y坐标(Number) - 基于组件，调整阴影位置的坐标。
+![shadow-03][shadow-03]
+1. 大小(Number) - 调整阴影的模糊程度。
+![shadow-04][shadow-04]
+1. 颜色(Number) - 调整阴影的颜色。
+![shadow-05][shadow-05]
+
+
+[shadow-02]: ../images/shadow-02.png
+
+[shadow-03]: ../images/shadow-03.png
+
+[shadow-04]: ../images/shadow-04.png
+
+[shadow-05]: ../images/shadow-05.png