@fugood/bricks-project 2.22.0-beta.27 → 2.22.0-beta.28

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fugood/bricks-project",
-  "version": "2.22.0-beta.27",
+  "version": "2.22.0-beta.28",
   "main": "index.ts",
   "scripts": {
     "build": "node scripts/build.js"
@@ -14,5 +14,5 @@
     "lodash": "^4.17.4",
     "uuid": "^8.3.1"
   },
-  "gitHead": "6a1bca38b9962ca9d6ec45842b4c9a6426369d78"
+  "gitHead": "4a841001b6190c63368e33084a82ab4cfd1945f2"
 }

package/types/animation.ts

@@ -30,6 +30,7 @@ export type Easing =
   | 'easeInBounce'
   | 'easeOutBounce'
   | 'easeInOutBounce'
+  | string // Support format like 'cubic-bezier(x1, y1, x2, y2)'
 
 export interface AnimationTimingConfig {
   __type: 'AnimationTimingConfig'

package/types/brick-base.ts

@@ -0,0 +1,77 @@
+import type { SwitchCondInnerStateCurrentCanvas, SwitchCondData, SwitchDef } from './switch'
+import type { Data, DataLink } from './data'
+import type { Animation, AnimationBasicEvents } from './animation'
+import type {
+  Brick,
+  EventAction,
+  EventActionForItem,
+  ActionWithDataParams,
+  ActionWithParams,
+  Action,
+  EventProperty,
+} from './common'
+
+export interface BrickBasicProperty {
+  /* The brick opacity (0 ~ 1) */
+  opacity?: number | DataLink
+  /* The brick background color */
+  backgroundColor?: string | DataLink
+  /* The brick border style */
+  borderStyle?: 'solid' | 'dotted' | 'dashed' | DataLink
+  /* The brick border width (top) */
+  borderTopSize?: number | DataLink
+  /* The brick border color (top) */
+  borderTopColor?: string | DataLink
+  /* The brick border radius (top left) */
+  borderTopLeftRadius?: number | DataLink
+  /* The brick border radius (top right) */
+  borderTopRightRadius?: number | DataLink
+  /* The brick border width (bottom) */
+  borderBottomSize?: number | DataLink
+  /* The brick border color (bottom) */
+  borderBottomColor?: string | DataLink
+  /* The brick border radius (bottom left) */
+  borderBottomLeftRadius?: number | DataLink
+  /* The brick border radius (bottom right) */
+  borderBottomRightRadius?: number | DataLink
+  /* The brick border width (left) */
+  borderLeftSize?: number | DataLink
+  /* The brick border color (bottom) */
+  borderLeftColor?: string | DataLink
+  /* The brick border width (right) */
+  borderRightSize?: number | DataLink
+  /* The brick border color (right) */
+  borderRightColor?: string | DataLink
+  /* The brick rotate (deg) */
+  rotate?: number | DataLink
+  /* The brick rotateX (deg) */
+  rotateX?: number | DataLink
+  /* The brick rotateY (deg) */
+  rotateY?: number | DataLink
+  /* The brick shadow color */
+  shadowColor?: string | DataLink
+  /* The brick shadow opacity (0 ~ 1) */
+  shadowOpacity?: number | DataLink
+  /* The brick shadow radius */
+  shadowRadius?: number | DataLink
+  /* The brick shadow offset width */
+  shadowOffsetWidth?: number | DataLink
+  /* The brick shadow offset height */
+  shadowOffsetHeight?: number | DataLink
+  /* Brick pressable.  
+ Disabled: Disabled even if event or animation is set.  
+ Bypass: Disable and bypass the touch event on the brick. */
+  pressable?: 'enabled' | 'disabled' | 'bypass' | DataLink
+}
+
+export interface BrickBasicEvents {
+  showStart?: Array<EventAction>
+  switchUpdate?: Array<EventAction>
+  standby?: Array<EventAction>
+}
+
+export interface BrickBasicEventsForItem {
+  showStart?: Array<EventActionForItem>
+  switchUpdate?: Array<EventActionForItem>
+  standby?: Array<EventActionForItem>
+}

package/types/bricks/3DViewer.ts

@@ -0,0 +1,200 @@
+import type { SwitchCondInnerStateCurrentCanvas, SwitchCondData, SwitchDef } from '../switch'
+import type { Data, DataLink } from '../data'
+import type { Animation, AnimationBasicEvents } from '../animation'
+import type {
+  Brick,
+  EventAction,
+  EventActionForItem,
+  ActionWithDataParams,
+  ActionWithParams,
+  Action,
+  EventProperty,
+} from '../common'
+import type { BrickBasicProperty, BrickBasicEvents, BrickBasicEventsForItem } from '../brick-base'
+
+/* Play object animation */
+export type Brick3DViewerActionAnimationPlay = ActionWithParams & {
+  __actionName: 'BRICK_3D_VIEWER_ANIMATION_PLAY'
+  params?: Array<{
+    input: 'objectIndex'
+    value?: number | DataLink | EventProperty
+    mapping?: string
+  }>
+}
+
+/* Pause object animation */
+export type Brick3DViewerActionAnimationPause = ActionWithParams & {
+  __actionName: 'BRICK_3D_VIEWER_ANIMATION_PAUSE'
+  params?: Array<{
+    input: 'objectIndex'
+    value?: number | DataLink | EventProperty
+    mapping?: string
+  }>
+}
+
+/* Goto object animation progress */
+export type Brick3DViewerActionAnimationGoto = ActionWithParams & {
+  __actionName: 'BRICK_3D_VIEWER_ANIMATION_GOTO'
+  params?: Array<
+    | {
+        input: 'objectIndex'
+        value?: number | DataLink | EventProperty
+        mapping?: string
+      }
+    | {
+        input: 'animationProgress'
+        value?: number | DataLink | EventProperty
+        mapping?: string
+      }
+  >
+}
+
+interface Brick3DViewerDef {
+  /*
+Default property:
+{
+  "showLoadingBox": true,
+  "enableOrbitControls": true
+}
+  */
+  property?: BrickBasicProperty & {
+    /* 3D model list */
+    objects?:
+      | Array<
+          | DataLink
+          | {
+              url?: string | DataLink
+              md5?: string | DataLink
+              type?: 'USDZ' | 'glTF' | DataLink
+              rotation?: number | DataLink | Array<number | DataLink> | DataLink | DataLink
+              scale?: number | DataLink | Array<number | DataLink> | DataLink | DataLink
+              x?: number | DataLink
+              y?: number | DataLink
+              z?: number | DataLink
+              moveable?: boolean | DataLink
+              rotateable?: boolean | DataLink
+              selectable?: boolean | DataLink
+              enableCollision?: boolean | DataLink
+              animationLoopMode?: 'once' | 'repeat' | 'pingpong' | DataLink
+              animationProgress?: number | DataLink
+              animationPaused?: boolean | DataLink
+              boundingBox?:
+                | DataLink
+                | {
+                    min?:
+                      | DataLink
+                      | {
+                          x?: number | DataLink
+                          y?: number | DataLink
+                          z?: number | DataLink
+                        }
+                    max?:
+                      | DataLink
+                      | {
+                          x?: number | DataLink
+                          y?: number | DataLink
+                          z?: number | DataLink
+                        }
+                  }
+            }
+        >
+      | DataLink
+    /* Show loading placeholder box */
+    showLoadingBox?: boolean | DataLink
+    /* Display shadows */
+    shadows?: boolean | DataLink
+    /* Default camera position */
+    camera?:
+      | DataLink
+      | {
+          fov?: number | DataLink
+          aspect?: number | DataLink
+          near?: number | DataLink
+          far?: number | DataLink
+          position?:
+            | DataLink
+            | {
+                x?: number | DataLink
+                y?: number | DataLink
+                z?: number | DataLink
+              }
+          quaternion?:
+            | DataLink
+            | {
+                x?: number | DataLink
+                y?: number | DataLink
+                z?: number | DataLink
+                w?: number | DataLink
+              }
+        }
+    /* Enable orbit controls */
+    enableOrbitControls?: boolean | DataLink
+    /* Camera control options */
+    orbitControls?:
+      | DataLink
+      | {
+          autoRotate?: boolean | DataLink
+          enableZoom?: boolean | DataLink
+          enablePan?: boolean | DataLink
+          enableRotate?: boolean | DataLink
+          enableDamping?: boolean | DataLink
+          dampingFactor?: number | DataLink
+          rotateSpeed?: number | DataLink
+          zoomSpeed?: number | DataLink
+          panSpeed?: number | DataLink
+          minDistance?: number | DataLink
+          maxDistance?: number | DataLink
+          minPolarAngle?: number | DataLink
+          maxPolarAngle?: number | DataLink
+          minAzimuthAngle?: number | DataLink
+          maxAzimuthAngle?: number | DataLink
+        }
+    /* Move controls options */
+    moveControls?:
+      | DataLink
+      | {
+          responsiveness?: number | DataLink
+          rotationRingColor?: string | DataLink
+          rotationRingSize?: number | DataLink
+          showBoundingBox?: boolean | DataLink
+        }
+  }
+  events?: BrickBasicEvents & {
+    /* Event of error occurred */
+    onError?: Array<EventAction>
+    /* Event of object changed position or rotation */
+    onChange?: Array<EventAction>
+    /* Event of object selected */
+    onSelectChange?: Array<EventAction>
+    /* Event of object collision occurred */
+    onCollision?: Array<EventAction>
+  }
+  animation?: AnimationBasicEvents & {
+    onError?: Animation
+    onChange?: Animation
+    onSelectChange?: Animation
+    onCollision?: Animation
+  }
+}
+
+/* 3D viewer brick */
+export type Brick3DViewer = Brick &
+  Brick3DViewerDef & {
+    templateKey: 'BRICK_3D_VIEWER'
+    switches: Array<
+      SwitchDef &
+        Brick3DViewerDef & {
+          conds?: Array<{
+            method: '==' | '!=' | '>' | '<' | '>=' | '<='
+            cond:
+              | SwitchCondInnerStateCurrentCanvas
+              | SwitchCondData
+              | {
+                  __typename: 'SwitchCondInnerStateOutlet'
+                  outlet: ''
+                  value: any
+                }
+          }>
+        }
+    >
+  }

package/types/bricks/Camera.ts

@@ -0,0 +1,195 @@
+import type { SwitchCondInnerStateCurrentCanvas, SwitchCondData, SwitchDef } from '../switch'
+import type { Data, DataLink } from '../data'
+import type { Animation, AnimationBasicEvents } from '../animation'
+import type {
+  Brick,
+  EventAction,
+  EventActionForItem,
+  ActionWithDataParams,
+  ActionWithParams,
+  Action,
+  EventProperty,
+} from '../common'
+import type { BrickBasicProperty, BrickBasicEvents, BrickBasicEventsForItem } from '../brick-base'
+
+/* Take picture on the Camera */
+export type BrickCameraActionTakePicture = ActionWithParams & {
+  __actionName: 'BRICK_CAMERA_TAKE_PICTURE'
+  params?: Array<
+    | {
+        input: 'width'
+        value?: number | DataLink | EventProperty
+        mapping?: string
+      }
+    | {
+        input: 'quality'
+        value?: string | DataLink | EventProperty
+        mapping?: string
+      }
+    | {
+        input: 'base64'
+        value?: boolean | DataLink | EventProperty
+        mapping?: string
+      }
+    | {
+        input: 'mirrorImage'
+        value?: boolean | DataLink | EventProperty
+        mapping?: string
+      }
+  >
+}
+
+/* Record video on the Camera */
+export type BrickCameraActionRecord = ActionWithParams & {
+  __actionName: 'BRICK_CAMERA_RECORD'
+  params?: Array<
+    | {
+        input: 'quality'
+        value?: '4:3' | '288p' | '480p' | '720p' | '1080p' | '2160p' | DataLink | EventProperty
+        mapping?: string
+      }
+    | {
+        input: 'mirrorVideo'
+        value?: boolean | DataLink | EventProperty
+        mapping?: string
+      }
+    | {
+        input: 'videoBitrate'
+        value?: string | DataLink | EventProperty
+        mapping?: string
+      }
+    | {
+        input: 'maxDuration'
+        value?: number | DataLink | EventProperty
+        mapping?: string
+      }
+    | {
+        input: 'maxFileSize'
+        value?: string | DataLink | EventProperty
+        mapping?: string
+      }
+  >
+}
+
+/* Record video on the Camera */
+export type BrickCameraActionStopRecord = Action & {
+  __actionName: 'BRICK_CAMERA_STOP_RECORD'
+}
+
+interface BrickCameraDef {
+  /*
+Default property:
+{
+  "autoFocusEnabled": false,
+  "focusDepth": 0.5,
+  "type": "back",
+  "flashMode": "off",
+  "captureAudio": false,
+  "whiteBalance": "auto",
+  "faceDetectionEnabled": false,
+  "faceDetectionEventMode": "when-detected"
+}
+  */
+  property?: BrickBasicProperty & {
+    /* Camera auto focus */
+    autoFocusEnabled?: boolean | DataLink
+    /* The auto focus feature of the camera to attempt to focus on the part of the image at this coordinate. */
+    focusDepth?: number | DataLink
+    /* Camera type (Ignore it if you are using external camera) */
+    type?: 'back' | 'front' | DataLink
+    /* Camera zoom */
+    zoom?: number | DataLink
+    /* Camera flash mode */
+    flashMode?: 'off' | 'on' | 'torch' | 'auto' | DataLink
+    /* Camera ratio (Unsupported ratio will be ignored) */
+    ratio?: string | DataLink
+    /* Capture audio when start recording */
+    captureAudio?: boolean | DataLink
+    /* Allows you to control the color temperature in your photos by cooling down or warming up the colors. */
+    whiteBalance?:
+      | 'auto'
+      | 'sunny'
+      | 'cloudy'
+      | 'shadow'
+      | 'incandescent'
+      | 'fluorescent'
+      | DataLink
+    /* Enable face detection */
+    faceDetectionEnabled?: boolean | DataLink
+    /* Face detection event mode */
+    faceDetectionEventMode?: 'when-detected' | 'interval' | DataLink
+    /* Quality of take picture */
+    pictureQuality?: number | DataLink
+    /* Take picture format as base64 */
+    pictureBase64?: boolean | DataLink
+    /* Mirror image of take picture */
+    pictureIsMirrorImage?: boolean | DataLink
+    /* Quality of record video */
+    recordQuality?: '4:3' | '288p' | '480p' | '720p' | '1080p' | '2160p' | DataLink
+    /* Bitrate of record video (bit/s) */
+    recordVideoBitrate?: number | DataLink
+    /* Mirror video of record video */
+    recordMirrorVideo?: boolean | DataLink
+    /* Max duration of record video (s) */
+    recordMaxDuration?: number | DataLink
+    /* Max file size of record video (bytes) */
+    recordMaxFileSize?: number | DataLink
+  }
+  events?: BrickBasicEvents & {
+    /* Event of the Camera state change */
+    stateChange?: Array<EventAction>
+    /* Event of the Camera record start */
+    recordStart?: Array<EventAction>
+    /* Event of the Camera record end */
+    recordEnd?: Array<EventAction>
+    /* Event of the Camera barcode read */
+    barcodeRead?: Array<EventAction>
+    /* Event of the Camera picture taken */
+    pictureTaken?: Array<EventAction>
+    /* Event of the Camera record finished */
+    recordFinish?: Array<EventAction>
+    /* Event of the Camera mount error */
+    mountError?: Array<EventAction>
+  }
+  outlets?: {
+    /* Picture taken result */
+    pictureTaken?: () => Data
+    /* Record video result */
+    recordVideo?: () => Data
+    /* Barcode read result */
+    barcodeRead?: () => Data
+    /* Faces detected result */
+    faceDetected?: () => Data
+  }
+  animation?: AnimationBasicEvents & {
+    stateChange?: Animation
+    recordStart?: Animation
+    recordEnd?: Animation
+    barcodeRead?: Animation
+    pictureTaken?: Animation
+    recordFinish?: Animation
+    mountError?: Animation
+  }
+}
+
+/* Camera view brick ([Tutorial](https://intercom.help/bricks-dag-inc/articles/5378589-camera)) */
+export type BrickCamera = Brick &
+  BrickCameraDef & {
+    templateKey: 'BRICK_CAMERA'
+    switches: Array<
+      SwitchDef &
+        BrickCameraDef & {
+          conds?: Array<{
+            method: '==' | '!=' | '>' | '<' | '>=' | '<='
+            cond:
+              | SwitchCondInnerStateCurrentCanvas
+              | SwitchCondData
+              | {
+                  __typename: 'SwitchCondInnerStateOutlet'
+                  outlet: 'pictureTaken' | 'recordVideo' | 'barcodeRead' | 'faceDetected'
+                  value: any
+                }
+          }>
+        }
+    >
+  }