Restructure omni services and add Chatwoot research snapshot

research/chatwoot/app/javascript/shared/components/CardButton.vue

@@ -0,0 +1,72 @@
+<script>
+import { mapGetters } from 'vuex';
+import { getContrastingTextColor } from '@chatwoot/utils';
+import { IFrameHelper } from 'widget/helpers/utils';
+
+export default {
+  components: {},
+  props: {
+    action: {
+      type: Object,
+      default: () => {},
+    },
+  },
+  computed: {
+    ...mapGetters({
+      widgetColor: 'appConfig/getWidgetColor',
+    }),
+    textColor() {
+      return getContrastingTextColor(this.widgetColor);
+    },
+    isLink() {
+      return this.action.type === 'link';
+    },
+  },
+  methods: {
+    onClick() {
+      if (this.action.type === 'postback') {
+        // Send message to parent iframe
+        if (IFrameHelper.isIFrame()) {
+          IFrameHelper.sendMessage({
+            event: 'postback',
+            data: { payload: this.action.payload },
+          });
+        }
+      }
+    },
+  },
+};
+</script>
+
+<template>
+  <a
+    v-if="isLink"
+    :key="action.uri"
+    class="action-button button"
+    :href="action.uri"
+    :style="{
+      background: widgetColor,
+      borderColor: widgetColor,
+      color: textColor,
+    }"
+    target="_blank"
+    rel="noopener nofollow noreferrer"
+  >
+    {{ action.text }}
+  </a>
+  <button
+    v-else
+    :key="action.payload"
+    class="action-button button !bg-n-background dark:!bg-n-alpha-black1 text-n-brand"
+    :style="{ borderColor: widgetColor, color: widgetColor }"
+    @click="onClick"
+  >
+    {{ action.text }}
+  </button>
+</template>
+
+<style scoped lang="scss">
+.action-button {
+  @apply items-center rounded-lg flex font-medium justify-center mt-1 p-0 w-full;
+}
+</style>