@fugood/bricks-project 2.22.0-beta.3 → 2.22.0-beta.30

package/types/bricks/QrCode.ts

@@ -0,0 +1,109 @@
+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'
+
+interface BrickQrcodeDef {
+  /*
+Default property:
+{
+  "value": "",
+  "positiveColor": "#1e252a",
+  "negativeColor": "transparent",
+  "padding": 0,
+  "linearGradientEnabled": false,
+  "linearGradientStart": "black",
+  "linearGradientEnd": "black",
+  "linearGradientDirection": [
+    "0%",
+    "0%",
+    "100%",
+    "100%"
+  ],
+  "logoSize": 20,
+  "logoBackgroundColor": "transparent"
+}
+  */
+  property?: BrickBasicProperty & {
+    /* The QRCode content */
+    value?: string | DataLink
+    /* The foreground color of QRCode */
+    positiveColor?: string | DataLink
+    /* The background color of QRCode */
+    negativeColor?: string | DataLink
+    /* Quiet zone around the qr */
+    padding?: number | DataLink
+    /* Enables or disables linear gradient */
+    linearGradientEnabled?: boolean | DataLink
+    /* Linear gradient start color */
+    linearGradientStart?: string | DataLink
+    /* Linear gradient end color */
+    linearGradientEnd?: string | DataLink
+    /* Linear gradient direction ('0%', '0%', '100%', '100%') */
+    linearGradientDirection?: Array<string | DataLink> | DataLink
+    /* Logo image source */
+    logoPath?: string | DataLink
+    /* The checksum of logo file */
+    md5?: string | DataLink
+    /* Logo image size (% of QRCode) */
+    logoSize?: number | DataLink
+    /* The logo gets a filled quadratic background with this color. */
+    logoBackgroundColor?: string | DataLink
+  }
+  events?: BrickBasicEvents & {
+    /* Event of the brick press */
+    onPress?: Array<EventAction>
+    /* Event of the brick press in */
+    onPressIn?: Array<EventAction>
+    /* Event of the brick press out */
+    onPressOut?: Array<EventAction>
+    /* Event of the brick focus (Use TV Device with controller) */
+    onFocus?: Array<EventAction>
+    /* Event of the brick blur (Use TV Device with controller) */
+    onBlur?: Array<EventAction>
+  }
+  outlets?: {
+    /* Brick is pressing */
+    brickPressing?: () => Data
+    /* Brick is focusing (Use TV Device with controller) */
+    brickFocusing?: () => Data
+  }
+  animation?: AnimationBasicEvents & {
+    onPress?: Animation
+    onPressIn?: Animation
+    onPressOut?: Animation
+    onFocus?: Animation
+    onBlur?: Animation
+  }
+}
+
+/* QRCode brick ([Tutorial](https://intercom.help/bricks-dag-inc/articles/5378579-qr-code)) */
+export type BrickQrcode = Brick &
+  BrickQrcodeDef & {
+    templateKey: 'BRICK_QRCODE'
+    switches: Array<
+      SwitchDef &
+        BrickQrcodeDef & {
+          conds?: Array<{
+            method: '==' | '!=' | '>' | '<' | '>=' | '<='
+            cond:
+              | SwitchCondInnerStateCurrentCanvas
+              | SwitchCondData
+              | {
+                  __typename: 'SwitchCondInnerStateOutlet'
+                  outlet: 'brickPressing' | 'brickFocusing'
+                  value: any
+                }
+          }>
+        }
+    >
+  }

package/types/bricks/Rect.ts

@@ -0,0 +1,107 @@
+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'
+
+interface BrickRectDef {
+  /*
+Default property:
+{
+  "linearGradientEnabled": false,
+  "linearGradientColors": [
+    "#000000",
+    "#FFFFFF"
+  ],
+  "linearGradientStart": {
+    "x": 0,
+    "y": 0
+  },
+  "linearGradientEnd": {
+    "x": 1,
+    "y": 1
+  },
+  "linearGradientLocations": [
+    0,
+    1
+  ]
+}
+  */
+  property?: BrickBasicProperty & {
+    /* Enables or disables linear gradient */
+    linearGradientEnabled?: boolean | DataLink
+    /* An array of at least two color values that represent gradient colors */
+    linearGradientColors?: Array<string | DataLink> | DataLink
+    /* An optional object of the following type: { x: number, y: number } */
+    linearGradientStart?:
+      | DataLink
+      | {
+          x?: number | DataLink
+          y?: number | DataLink
+        }
+    /* Same as start, but for the end of the gradient */
+    linearGradientEnd?:
+      | DataLink
+      | {
+          x?: number | DataLink
+          y?: number | DataLink
+        }
+    /* An optional array of numbers defining the location of each gradient color stop */
+    linearGradientLocations?: Array<number | DataLink> | DataLink
+  }
+  events?: BrickBasicEvents & {
+    /* Event of the brick press */
+    onPress?: Array<EventAction>
+    /* Event of the brick press in */
+    onPressIn?: Array<EventAction>
+    /* Event of the brick press out */
+    onPressOut?: Array<EventAction>
+    /* Event of the brick focus (Use TV Device with controller) */
+    onFocus?: Array<EventAction>
+    /* Event of the brick blur (Use TV Device with controller) */
+    onBlur?: Array<EventAction>
+  }
+  outlets?: {
+    /* Brick is pressing */
+    brickPressing?: () => Data
+    /* Brick is focusing (Use TV Device with controller) */
+    brickFocusing?: () => Data
+  }
+  animation?: AnimationBasicEvents & {
+    onPress?: Animation
+    onPressIn?: Animation
+    onPressOut?: Animation
+    onFocus?: Animation
+    onBlur?: Animation
+  }
+}
+
+/* Rect brick ([Tutorial](https://intercom.help/bricks-dag-inc/articles/5378573-rect)) */
+export type BrickRect = Brick &
+  BrickRectDef & {
+    templateKey: 'BRICK_RECT'
+    switches: Array<
+      SwitchDef &
+        BrickRectDef & {
+          conds?: Array<{
+            method: '==' | '!=' | '>' | '<' | '>=' | '<='
+            cond:
+              | SwitchCondInnerStateCurrentCanvas
+              | SwitchCondData
+              | {
+                  __typename: 'SwitchCondInnerStateOutlet'
+                  outlet: 'brickPressing' | 'brickFocusing'
+                  value: any
+                }
+          }>
+        }
+    >
+  }

package/types/bricks/RichText.ts

@@ -0,0 +1,120 @@
+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'
+
+interface BrickRichTextDef {
+  /*
+Default property:
+{
+  "content": "",
+  "renderImage": false,
+  "color": "#000",
+  "fontWeight": "normal",
+  "fontStyle": "normal",
+  "fontSizes": {
+    "base": 3,
+    "h1": 6.857142857142857,
+    "h2": 5.714285714285714,
+    "h3": 4.011428571428572,
+    "h4": 3.428571428571429,
+    "h5": 2.845714285714286,
+    "h6": 2.285714285714286
+  }
+}
+  */
+  property?: BrickBasicProperty & {
+    /* The text content */
+    content?: string | DataLink
+    /* Render Image */
+    renderImage?: boolean | DataLink
+    /* The text color */
+    color?: string | DataLink
+    /* Specifies font weight.  The values 'normal' and are supported for most fonts.  Not all fonts have a variant for each of the numeric values,  in that case the closest one is chosen. */
+    fontWeight?:
+      | 'normal'
+      | 'bold'
+      | '100'
+      | '200'
+      | '300'
+      | '400'
+      | '500'
+      | '600'
+      | '700'
+      | '800'
+      | '900'
+      | DataLink
+    /* The text font style */
+    fontStyle?: 'normal' | 'italic' | DataLink
+    /* The text font family */
+    fontFamily?: string | DataLink
+    /* The text font size definition (base and headers) */
+    fontSizes?:
+      | DataLink
+      | {
+          base?: number | DataLink // BRICKS Grid unit
+          h1?: number | DataLink // BRICKS Grid unit
+          h2?: number | DataLink // BRICKS Grid unit
+          h3?: number | DataLink // BRICKS Grid unit
+          h4?: number | DataLink // BRICKS Grid unit
+          h5?: number | DataLink // BRICKS Grid unit
+          h6?: number | DataLink // BRICKS Grid unit
+        }
+  }
+  events?: BrickBasicEvents & {
+    /* Event of the brick press */
+    onPress?: Array<EventAction>
+    /* Event of the brick press in */
+    onPressIn?: Array<EventAction>
+    /* Event of the brick press out */
+    onPressOut?: Array<EventAction>
+    /* Event of the brick focus (Use TV Device with controller) */
+    onFocus?: Array<EventAction>
+    /* Event of the brick blur (Use TV Device with controller) */
+    onBlur?: Array<EventAction>
+  }
+  outlets?: {
+    /* Brick is pressing */
+    brickPressing?: () => Data
+    /* Brick is focusing (Use TV Device with controller) */
+    brickFocusing?: () => Data
+  }
+  animation?: AnimationBasicEvents & {
+    onPress?: Animation
+    onPressIn?: Animation
+    onPressOut?: Animation
+    onFocus?: Animation
+    onBlur?: Animation
+  }
+}
+
+/* RichText brick */
+export type BrickRichText = Brick &
+  BrickRichTextDef & {
+    templateKey: 'BRICK_RICH_TEXT'
+    switches: Array<
+      SwitchDef &
+        BrickRichTextDef & {
+          conds?: Array<{
+            method: '==' | '!=' | '>' | '<' | '>=' | '<='
+            cond:
+              | SwitchCondInnerStateCurrentCanvas
+              | SwitchCondData
+              | {
+                  __typename: 'SwitchCondInnerStateOutlet'
+                  outlet: 'brickPressing' | 'brickFocusing'
+                  value: any
+                }
+          }>
+        }
+    >
+  }

package/types/bricks/Rive.ts

@@ -0,0 +1,209 @@
+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 animation */
+export type BrickRiveActionPlay = ActionWithParams & {
+  __actionName: 'BRICK_RIVE_PLAY'
+  params?: Array<
+    | {
+        input: 'animationName'
+        value?: string | DataLink | EventProperty
+        mapping?: string
+      }
+    | {
+        input: 'loop'
+        value?: 'auto' | 'oneShot' | 'loop' | 'pingPong' | DataLink | EventProperty
+        mapping?: string
+      }
+    | {
+        input: 'direction'
+        value?: 'auto' | 'backwards' | 'forwards' | DataLink | EventProperty
+        mapping?: string
+      }
+    | {
+        input: 'isStateMachine'
+        value?: boolean | DataLink | EventProperty
+        mapping?: string
+      }
+  >
+}
+
+/* Pause animation */
+export type BrickRiveActionPause = Action & {
+  __actionName: 'BRICK_RIVE_PAUSE'
+}
+
+/* Stop animation */
+export type BrickRiveActionStop = Action & {
+  __actionName: 'BRICK_RIVE_STOP'
+}
+
+/* Reset animation */
+export type BrickRiveActionReset = Action & {
+  __actionName: 'BRICK_RIVE_RESET'
+}
+
+/* Fire state */
+export type BrickRiveActionFireState = ActionWithParams & {
+  __actionName: 'BRICK_RIVE_FIRE_STATE'
+  params?: Array<
+    | {
+        input: 'stateMachineName'
+        value?: string | DataLink | EventProperty
+        mapping?: string
+      }
+    | {
+        input: 'inputName'
+        value?: string | DataLink | EventProperty
+        mapping?: string
+      }
+  >
+}
+
+/* Set input state */
+export type BrickRiveActionSetInputState = ActionWithParams & {
+  __actionName: 'BRICK_RIVE_SET_INPUT_STATE'
+  params?: Array<
+    | {
+        input: 'stateMachineName'
+        value?: string | DataLink | EventProperty
+        mapping?: string
+      }
+    | {
+        input: 'inputName'
+        value?: string | DataLink | EventProperty
+        mapping?: string
+      }
+    | {
+        input: 'value'
+        value?: any | EventProperty
+        mapping?: string
+      }
+  >
+}
+
+/* Set text run value. Text Run name need to defined as unique name in Rive file. (Ref: https://rive.app/community/doc/text/docn2E6y1lXo) */
+export type BrickRiveActionSetTextRunValue = ActionWithParams & {
+  __actionName: 'BRICK_RIVE_SET_TEXT_RUN_VALUE'
+  params?: Array<
+    | {
+        input: 'textRunName'
+        value?: string | DataLink | EventProperty
+        mapping?: string
+      }
+    | {
+        input: 'value'
+        value?: any | EventProperty
+        mapping?: string
+      }
+  >
+}
+
+interface BrickRiveDef {
+  /*
+Default property:
+{
+  "autoplay": true,
+  "alignment": "center",
+  "fit": "contain"
+}
+  */
+  property?: BrickBasicProperty & {
+    /* Rive file url */
+    url?: string | DataLink
+    /* The checksum of `url` */
+    md5?: string | DataLink
+    /* Autoplay the animation */
+    autoplay?: boolean | DataLink
+    /* Alignment of the animation */
+    alignment?:
+      | 'topLeft'
+      | 'topCenter'
+      | 'topRight'
+      | 'centerLeft'
+      | 'center'
+      | 'centerRight'
+      | 'bottomLeft'
+      | 'bottomCenter'
+      | 'bottomRight'
+      | DataLink
+    /* Fit mode of the animation */
+    fit?:
+      | 'cover'
+      | 'contain'
+      | 'fill'
+      | 'fitWidth'
+      | 'fitHeight'
+      | 'none'
+      | 'scaleDown'
+      | 'layout'
+      | DataLink
+    /* Artboard name */
+    artboardName?: string | DataLink
+    /* Animation name */
+    animationName?: string | DataLink
+    /* State machine name */
+    stateMachineName?: string | DataLink
+  }
+  events?: BrickBasicEvents & {
+    /* Event of animation play */
+    onPlay?: Array<EventAction>
+    /* Event of animation pause */
+    onPause?: Array<EventAction>
+    /* Event of animation stop */
+    onStop?: Array<EventAction>
+    /* Event of animation loop end */
+    onLoopEnd?: Array<EventAction>
+    /* Event of state changed */
+    onStateChanged?: Array<EventAction>
+    /* Event of error */
+    onError?: Array<EventAction>
+    /* Event of Rive general event received */
+    onRiveGeneralEvent?: Array<EventAction>
+    /* Event of Rive open-url event received */
+    onRiveOpenUrlEvent?: Array<EventAction>
+  }
+  animation?: AnimationBasicEvents & {
+    onPlay?: Animation
+    onPause?: Animation
+    onStop?: Animation
+    onLoopEnd?: Animation
+    onStateChanged?: Animation
+    onError?: Animation
+    onRiveGeneralEvent?: Animation
+    onRiveOpenUrlEvent?: Animation
+  }
+}
+
+/* Rive file component */
+export type BrickRive = Brick &
+  BrickRiveDef & {
+    templateKey: 'BRICK_RIVE'
+    switches: Array<
+      SwitchDef &
+        BrickRiveDef & {
+          conds?: Array<{
+            method: '==' | '!=' | '>' | '<' | '>=' | '<='
+            cond:
+              | SwitchCondInnerStateCurrentCanvas
+              | SwitchCondData
+              | {
+                  __typename: 'SwitchCondInnerStateOutlet'
+                  outlet: ''
+                  value: any
+                }
+          }>
+        }
+    >
+  }

package/types/bricks/Slideshow.ts

@@ -0,0 +1,155 @@
+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'
+
+/* Jump to a specific index in the slideshow */
+export type BrickSlideshowActionJumpToIndex = ActionWithParams & {
+  __actionName: 'BRICK_SLIDESHOW_JUMP_TO_INDEX'
+  params?: Array<
+    | {
+        input: 'index'
+        value?: number | DataLink | EventProperty
+        mapping?: string
+      }
+    | {
+        input: 'reset'
+        value?: boolean | DataLink | EventProperty
+        mapping?: string
+      }
+    | {
+        input: 'shuffle'
+        value?: boolean | DataLink | EventProperty
+        mapping?: string
+      }
+  >
+}
+
+interface BrickSlideshowDef {
+  /*
+Default property:
+{
+  "countdown": 2000,
+  "loop": true,
+  "shuffle": false,
+  "videoVolume": 100,
+  "emptyViewText": "no available image item to show",
+  "emptyViewTextSize": 44,
+  "emptyViewTextColor": "#fff",
+  "blurBackgroundRadius": 8
+}
+  */
+  property?: BrickBasicProperty & {
+    /* The time interval of show for each photo */
+    countdown?: number | DataLink
+    /* The slideshow media path list (File, URL) */
+    paths?:
+      | Array<
+          | DataLink
+          | {
+              url?: string | DataLink
+              mediaType?: 'video' | 'video-streaming' | 'photo' | DataLink
+              photoResizeMode?: 'contain' | 'cover' | 'stretch' | 'center' | 'repeat' | DataLink
+              photoLoadSystemIos?: 'auto' | 'sdwebimage' | 'default' | DataLink
+              photoLoadSystemAndroid?: 'auto' | 'glide' | 'fresco' | DataLink
+              videoResizeMode?: 'contain' | 'cover' | 'stretch' | DataLink
+              videoAutoAspectRatio?: boolean | DataLink
+              videoAspectRatio?: string | DataLink
+              videoVolume?: number | DataLink
+              videoMuted?: boolean | DataLink
+              videoRenderMode?: 'auto' | 'texture' | 'surface' | DataLink
+            }
+        >
+      | DataLink
+    /* Multiple slideshow media path lists to combine (Array of path arrays) */
+    pathsList?: Array<Array<any> | DataLink | DataLink> | DataLink
+    /* Loop the slideshow */
+    loop?: boolean | DataLink
+    /* Shuffle the slideshow */
+    shuffle?: boolean | DataLink
+    /* Slideshow Photo resize mode */
+    photoResizeMode?: 'contain' | 'cover' | 'stretch' | 'center' | 'repeat' | DataLink
+    /* [iOS] The use priority of image loading system (Auto: sdwebimage, fallback to default if failed) */
+    photoLoadSystemIos?: 'auto' | 'sdwebimage' | 'default' | DataLink
+    /* [Android] The use priority of image loading system (Auto: glide, fallback to fresco if failed) */
+    photoLoadSystemAndroid?: 'auto' | 'glide' | 'fresco' | DataLink
+    /* Slideshow Video resize mode */
+    videoResizeMode?: 'contain' | 'cover' | 'stretch' | DataLink
+    /* Video Auto Aspect Ratio for use Video Streaming */
+    videoAutoAspectRatio?: boolean | DataLink
+    /* Video Aspect Ratio for use Video Streaming */
+    videoAspectRatio?: string | DataLink
+    /* Video Volume */
+    videoVolume?: number | DataLink
+    /* Video Muted */
+    videoMuted?: boolean | DataLink
+    /* [Android only] Use what view type for render video (Auto / Texture or Surface).  Notice: Although using surface has better performance, it also affects the Animation & Standby Transition used by itself */
+    videoRenderMode?: 'auto' | 'texture' | 'surface' | DataLink
+    /* The photo fade duration */
+    fadeDuration?: number | DataLink
+    /* Show text content if path list is empty */
+    emptyViewText?: string | DataLink
+    /* The font size of shown text content if path list is empty */
+    emptyViewTextSize?: number | DataLink
+    /* The color of shown text content if path list is empty */
+    emptyViewTextColor?: string | DataLink
+    /* Show emptyViewText when timeout and paths is empty */
+    emptyViewTimeout?: number | DataLink
+    /* The blur radius of the blur filter added to the image */
+    blurRadius?: number | DataLink
+    /* Add blurred image at background if photo is not full */
+    enableBlurBackground?: boolean | DataLink
+    /* The blur radius of the blur filter added to the image background */
+    blurBackgroundRadius?: number | DataLink
+  }
+  events?: BrickBasicEvents & {
+    /* Event of the next slideshow on change start */
+    changeStart?: Array<EventAction>
+    /* Event of the next slideshow on change end */
+    changeEnd?: Array<EventAction>
+    /* Event on paths change */
+    contentChange?: Array<EventAction>
+    /* Event on plays of paths are end */
+    roundEnd?: Array<EventAction>
+    /* Event of the slideshow on load */
+    mediaOnLoad?: Array<EventAction>
+  }
+  animation?: AnimationBasicEvents & {
+    changeStart?: Animation
+    changeEnd?: Animation
+    contentChange?: Animation
+    roundEnd?: Animation
+    mediaOnLoad?: Animation
+  }
+}
+
+/* Slideshow brick ([Tutorial](https://intercom.help/bricks-dag-inc/articles/5378580-slideshow)) */
+export type BrickSlideshow = Brick &
+  BrickSlideshowDef & {
+    templateKey: 'BRICK_SLIDESHOW'
+    switches: Array<
+      SwitchDef &
+        BrickSlideshowDef & {
+          conds?: Array<{
+            method: '==' | '!=' | '>' | '<' | '>=' | '<='
+            cond:
+              | SwitchCondInnerStateCurrentCanvas
+              | SwitchCondData
+              | {
+                  __typename: 'SwitchCondInnerStateOutlet'
+                  outlet: ''
+                  value: any
+                }
+          }>
+        }
+    >
+  }