@originallyus/feedback-rn-sdk 4.0.0-beta.6 → 4.0.0-beta.8

package/src/component/YesNoButtons.tsx

@@ -1,236 +0,0 @@
-import {useMemo} from 'react'
-import {View, Text, StyleSheet, type TextStyle, type ViewStyle} from 'react-native'
-import ButtonSubmit from '@component/ButtonSubmit'
-import {
-	BG_DEFAULT,
-	BG_SECONDARY,
-	BORDER_DEFAULT,
-	BORDER_SELECTED,
-	ERROR_COLOR,
-	PRESSED_COLOR,
-	PRIMARY_COLOR,
-	TEXT_DARK,
-	TEXT_WHITE,
-} from '@utils/constants'
-
-/**
- * Value type for `YesNoButtons`.
- *
- * - `'yes'` – Yes selected.
- * - `'no'` – No selected.
- * - `null` – no selection.
- */
-export type YesNoValue = 'yes' | 'no' | null
-
-/**
- * Visual variant for the selected state of `YesNoButtons`.
- *
- * - `'primary'` – solid primary background with white text.
- * - `'secondary'` – light background with border and dark text.
- */
-export type YesNoSelectedVariant = 'primary' | 'secondary'
-
-/**
- * Props for the `YesNoButtons` component.
- *
- * Renders a question label and two `ButtonSubmit` instances for Yes/No selection.
- */
-export interface YesNoButtonsProps {
-	/**
-	 * Question text displayed above the buttons.
-	 */
-	question: string
-	/**
-	 * Current selection value.
-	 */
-	value: YesNoValue
-	/**
-	 * Called when user selects Yes or No.
-	 */
-	onSelect: (value: 'yes' | 'no') => void
-	/**
-	 * Visual variant for the selected button.
-	 *
-	 * @default 'primary'
-	 */
-	selectedVariant?: YesNoSelectedVariant
-	/**
-	 * Label for the Yes button.
-	 *
-	 * @default 'Yes'
-	 */
-	yesLabel?: string
-	/**
-	 * Label for the No button.
-	 *
-	 * @default 'No'
-	 */
-	noLabel?: string
-	/**
-	 * Error message; when present, shown below the buttons with an "!" icon.
-	 */
-	error?: string
-	/**
-	 * App width, passed to the underlying `ButtonSubmit` components.
-	 */
-	appWidth: number
-	/**
-	 * Override background color when an option is selected (secondary variant).
-	 */
-	selectedBackgroundColor?: string
-	/**
-	 * Override border color when an option is selected (secondary variant).
-	 */
-	selectedBorderColor?: string
-	/**
-	 * Override text color when an option is selected (secondary variant).
-	 */
-	selectedTextColor?: string
-	/**
-	 * Style for the question text.
-	 */
-	questionStyle?: TextStyle
-	/**
-	 * Style for the error text.
-	 */
-	errorStyle?: TextStyle
-	/**
-	 * Color for the error text and "!" icon.
-	 *
-	 * @default red (`ERROR_COLOR`)
-	 */
-	errorColor?: string
-	/**
-	 * Style for the outer wrapper view.
-	 */
-	style?: ViewStyle
-}
-
-function YesNoButtons({
-	question,
-	value,
-	onSelect,
-	selectedVariant = 'primary',
-	yesLabel = 'Yes',
-	noLabel = 'No',
-	error,
-	appWidth,
-	selectedBackgroundColor,
-	selectedBorderColor,
-	selectedTextColor,
-	questionStyle,
-	errorStyle,
-	errorColor = ERROR_COLOR,
-	style,
-}: YesNoButtonsProps) {
-	const hasError = error != null && error !== ''
-
-	const isPrimarySelected = selectedVariant === 'primary'
-	const variantStyles = useMemo(
-		() =>
-			({
-				primary: {
-					selectedBg: PRIMARY_COLOR,
-					selectedBorder: undefined,
-					selectedText: TEXT_WHITE,
-				},
-				secondary: {
-					selectedBg: selectedBackgroundColor ?? BG_SECONDARY,
-					selectedBorder: selectedBorderColor ?? BORDER_SELECTED,
-					selectedText: selectedTextColor ?? TEXT_DARK,
-				},
-			}[selectedVariant]),
-		[selectedVariant, selectedBackgroundColor, selectedBorderColor, selectedTextColor],
-	)
-
-	const {selectedBg, selectedBorder, selectedText} = variantStyles
-
-	const buttonStyles = useMemo(() => {
-		const getStyles = (option: 'yes' | 'no') => {
-			const isSelected = value === option
-			return {
-				variant: isSelected && isPrimarySelected ? 'primary' : 'secondary',
-				backgroundColor: isSelected ? selectedBg : BG_DEFAULT,
-				textColor: isSelected ? selectedText : hasError ? errorColor : TEXT_DARK,
-				borderColor: isSelected ? selectedBorder : hasError ? errorColor : BORDER_DEFAULT,
-			}
-		}
-
-		return {
-			yes: getStyles('yes'),
-			no: getStyles('no'),
-		}
-	}, [value, isPrimarySelected, selectedBg, selectedText, hasError, errorColor, selectedBorder])
-
-	const renderButton = (option: 'yes' | 'no') => {
-		const stylesBtn = buttonStyles[option]
-		const label = option === 'yes' ? yesLabel : noLabel
-		return (
-			<ButtonSubmit
-				appWidth={appWidth}
-				title={label}
-				onPress={() => onSelect(option)}
-				variant={stylesBtn.variant as any}
-				fullWidth
-				backgroundColor={stylesBtn.backgroundColor}
-				textColor={stylesBtn.textColor}
-				borderColor={stylesBtn.borderColor}
-				pressedColor={PRESSED_COLOR}
-				containerStyle={styles.buttonContainer}
-			/>
-		)
-	}
-
-	return (
-		<View style={[styles.wrapper, style]}>
-			{question != null && question !== '' && <Text style={[styles.question, questionStyle]}>{question}</Text>}
-			<View style={styles.row}>
-				<View style={styles.buttonSlot}>{renderButton('yes')}</View>
-				<View style={styles.buttonSlot}>{renderButton('no')}</View>
-			</View>
-			{hasError && (
-				<View style={styles.errorRow}>
-					<Text style={[styles.errorIcon, {color: errorColor}]}>!</Text>
-					<Text style={[styles.errorText, {color: errorColor}, errorStyle]}>{error}</Text>
-				</View>
-			)}
-		</View>
-	)
-}
-
-export default YesNoButtons
-
-const styles = StyleSheet.create({
-	wrapper: {
-		width: '100%',
-	},
-	question: {
-		fontSize: 16,
-		fontWeight: '600',
-		color: '#000000',
-		marginBottom: 12,
-	},
-	row: {
-		flexDirection: 'row',
-		gap: 12,
-	},
-	buttonSlot: {
-		flex: 1,
-	},
-	buttonContainer: {
-		marginTop: 0,
-	},
-	errorRow: {
-		flexDirection: 'row',
-		alignItems: 'center',
-		marginTop: 8,
-		gap: 6,
-	},
-	errorIcon: {
-		fontSize: 14,
-		fontWeight: '700',
-	},
-	errorText: {
-		fontSize: 12,
-	},
-})

package/src/index.tsx

@@ -1,33 +0,0 @@
-export {Button} from '@component/Button'
-export type {ButtonProps} from '@component/Button'
-
-export {default as RatingNumber} from '@component/RatingNumber'
-export type {RatingNumberProps, RatingNumberSize} from '@component/RatingNumber'
-
-export {default as Rating} from '@component/Rating'
-export type {RatingProps} from '@component/Rating'
-
-export {default as Textarea} from '@component/Textarea'
-export type {TextareaProps} from '@component/Textarea'
-
-export {default as Input} from '@component/Input'
-export type {InputProps} from '@component/Input'
-
-export {default as ButtonSubmit} from '@component/ButtonSubmit'
-export type {ButtonSubmitProps, ButtonSubmitVariant} from '@component/ButtonSubmit'
-
-export {default as YesNoButtons} from '@component/YesNoButtons'
-export type {YesNoButtonsProps, YesNoValue, YesNoSelectedVariant} from '@component/YesNoButtons'
-
-export {default as MultiSelectButtons} from '@component/MultiSelectButtons'
-export type {
-	MultiSelectButtonsProps,
-	MultiSelectOption,
-	MultiSelectSelectedVariant,
-} from '@component/MultiSelectButtons'
-
-export {default as AIAFeedback} from './AIAFeedback'
-export type {AIAFeedbackProps, AIAFeedbackRef} from './AIAFeedback'
-
-export {default as AIAContentUsefulness} from './AIAContentUsefulness'
-export type {AIAContentUsefulnessProps} from './AIAContentUsefulness'

package/src/service/feedbackService.ts

@@ -1,108 +0,0 @@
-import {customFetch} from '@/utils/networking'
-import {type InitOptions} from '@/utils/constants'
-
-export interface SubmitFormData {
-	slug: string
-	debug: boolean
-	event_tag: string
-	metadata: any
-	request_id: string
-	rating: number
-	selected_options: string
-	free_text: string
-}
-
-export interface SubmitSelectionData {
-	slug: string
-	debug: boolean
-	event_tag: string
-	metadata: any
-	rating: number
-	request_id: string
-}
-
-export interface ShowOptions {
-	forceModal?: boolean
-	initialData?: any
-}
-
-type ShowListener = (slug: string, options?: ShowOptions) => boolean
-
-const showListeners: ShowListener[] = []
-
-export const feedbackService = {
-	onShow: (callback: ShowListener) => {
-		showListeners.push(callback)
-		return () => {
-			const index = showListeners.indexOf(callback)
-			if (index > -1) showListeners.splice(index, 1)
-		}
-	},
-
-	emitShow: (slug: string, options?: ShowOptions): boolean => {
-		let handled = false
-		for (const listener of showListeners) {
-			if (listener(slug, options)) handled = true
-		}
-		return handled
-	},
-
-	requestForm: (options: InitOptions, callback: (response: any) => void) => {
-		customFetch({
-			_shouldRetry: true,
-			_url: '8vs2qwFD1rlSFWIa13Wc',
-			_data: {
-				slug: options.formSlug,
-				debug: options.debug,
-				event_tag: options.eventTag,
-				metadata: options.metadata,
-			},
-			_callback: callback,
-			options: options,
-		})
-	},
-
-	submitForm: async (formData: SubmitFormData, options: InitOptions): Promise<any> => {
-		return new Promise((resolve, reject) => {
-			customFetch({
-				_shouldRetry: true,
-				_url: 'LXvcFSTTOqxxmJX9qQar',
-				_data: formData,
-				_callback: (res: any) => {
-					if (!res) {
-						reject(new Error('Empty response'))
-						return
-					}
-					if (res.error) {
-						reject(new Error(res.error))
-						return
-					}
-					resolve(res)
-				},
-				options: options,
-			})
-		})
-	},
-
-	submitSelection: async (selectionData: SubmitSelectionData, options: InitOptions): Promise<any> => {
-		return new Promise((resolve, reject) => {
-			customFetch({
-				_shouldRetry: true,
-				_url: 'LXvcFSTTOqxxmJX9qQar',
-				_data: selectionData,
-				_callback: (res: any) => {
-					if (!res) {
-						reject(new Error('Empty response'))
-						return
-					}
-					if (res.error) {
-						reject(new Error(res.error))
-						return
-					}
-					resolve(res)
-				},
-				options: options,
-			})
-		})
-	},
-}

package/src/utils/common.ts

@@ -1,241 +0,0 @@
-import {Dimensions, I18nManager, Platform, Settings, NativeModules} from 'react-native'
-
-const isExpo = !NativeModules || Object.keys(NativeModules).length === 0 || !NativeModules.RNDeviceInfo
-
-type DeviceInfoLike = {
-	getUniqueId: () => string | Promise<string>
-	getSystemVersion: () => string | Promise<string>
-	getVersion: () => string | Promise<string>
-	getBuildNumber: () => string | Promise<string>
-	getModel: () => string | Promise<string>
-	getBundleId: () => string | Promise<string>
-	getManufacturer: () => string | Promise<string>
-	getDeviceType: () => string | Promise<string>
-	getDeviceId: () => string | Promise<string>
-	getBrand: () => string | Promise<string>
-	isTablet: () => boolean
-}
-
-let DeviceInfo: DeviceInfoLike = {
-	getUniqueId: function getUniqueIdDefault() {
-		return ''
-	},
-	getSystemVersion: function getSystemVersionDefault() {
-		return ''
-	},
-	getVersion: function getVersionDefault() {
-		return ''
-	},
-	getBuildNumber: function getBuildNumberDefault() {
-		return ''
-	},
-	getModel: function getModelDefault() {
-		return ''
-	},
-	getBundleId: function getBundleIdDefault() {
-		return ''
-	},
-	getManufacturer: function getManufacturerDefault() {
-		return ''
-	},
-	getDeviceType: function getDeviceTypeDefault() {
-		return ''
-	},
-	getDeviceId: function getDeviceIdDefault() {
-		return ''
-	},
-	getBrand: function getBrandDefault() {
-		return ''
-	},
-	isTablet: function isTabletDefault() {
-		return false
-	},
-}
-
-if (isExpo) {
-	const expoDevice = require('expo-device')
-
-	const expoApplication = require('expo-application')
-
-	DeviceInfo = {
-		getUniqueId: function getUniqueIdForExpo() {
-			if (Platform.OS === 'android') {
-				return expoApplication.getAndroidId()
-			}
-			return expoApplication.getIosIdForVendorAsync()
-		},
-		getSystemVersion: function getSystemVersionForExpo() {
-			return expoDevice.osVersion || ''
-		},
-		getVersion: function getVersionForExpo() {
-			return expoApplication.nativeApplicationVersion || ''
-		},
-		getBuildNumber: function getBuildNumberForExpo() {
-			return expoApplication.nativeBuildVersion || ''
-		},
-		getModel: function getModelForExpo() {
-			return expoDevice.modelName || ''
-		},
-		getBundleId: function getBundleIdForExpo() {
-			return expoApplication.applicationId || ''
-		},
-		getManufacturer: function getManufacturerForExpo() {
-			if (expoDevice.getManufacturerAsync) {
-				return expoDevice.getManufacturerAsync()
-			}
-
-			return expoDevice.manufacturer || ''
-		},
-		getDeviceType: function getDeviceTypeForExpo() {
-			if (expoDevice.deviceType) {
-				return String(expoDevice.deviceType)
-			}
-
-			return ''
-		},
-		getDeviceId: function getDeviceIdForExpo() {
-			if (expoDevice.modelId) {
-				return expoDevice.modelId
-			}
-
-			if (expoDevice.modelName) {
-				return expoDevice.modelName
-			}
-
-			return ''
-		},
-		getBrand: function getBrandForExpo() {
-			return expoDevice.brand || ''
-		},
-		isTablet: function isTabletForExpo() {
-			if (expoDevice.deviceType === 'tablet' || expoDevice.deviceType === 2) {
-				return true
-			}
-
-			return false
-		},
-	}
-}
-if (!isExpo) {
-	const rnDeviceInfo = require('react-native-device-info') as DeviceInfoLike
-	DeviceInfo = rnDeviceInfo
-}
-
-export const isTablet: boolean = DeviceInfo.isTablet()
-const {width, height} = Dimensions.get('window')
-
-export function isObject(value: unknown): value is object {
-	const type = typeof value
-	return value != null && (type === 'object' || type === 'function')
-}
-
-export function sample<T>(array: T[] | null | undefined): T | undefined {
-	const length = array == null ? 0 : array.length
-	const timestampSeconds = Math.floor(Date.now() / 1000)
-	return length && array ? array[timestampSeconds % length] : undefined
-}
-
-export function isNil(value: unknown): value is null | undefined {
-	return value == null
-}
-
-export function w_p(widthVal: number, paddingNumber: number): number {
-	return (paddingNumber / 375) * widthVal
-}
-
-export function w_p21(widthVal: number): number {
-	return (21 / 375) * widthVal
-}
-
-export function w_p16(widthVal: number): number {
-	return (16 / 375) * widthVal
-}
-
-export function h_p21(heightVal: number): number {
-	return (21 / 667) * heightVal
-}
-
-export function h_p16(heightVal: number): number {
-	return (16 / 667) * heightVal
-}
-
-export function getAppWidth(isIntrusive: boolean): number {
-	let appWidth = width
-	if (isTablet) {
-		appWidth = isIntrusive ? 768 : 375
-	}
-	return appWidth
-}
-
-export function getAppHeight(isIntrusive: boolean): number {
-	let appHeight = height
-	if (isTablet) {
-		appHeight = isIntrusive ? (height * 3) / 4 : 450
-	}
-	return appHeight
-}
-
-export const getUniqueID = async (): Promise<string> => {
-	const result = DeviceInfo.getUniqueId()
-	return typeof result === 'object' ? await result : result
-}
-
-export const getSystemVersion = async (): Promise<string> => {
-	const result = DeviceInfo.getSystemVersion()
-	return typeof result === 'object' ? await result : result
-}
-
-export const getVersion = async (): Promise<string> => {
-	const result = DeviceInfo.getVersion()
-	return typeof result === 'object' ? await result : result
-}
-
-export const getBuildNumber = async (): Promise<string> => {
-	const result = DeviceInfo.getBuildNumber()
-	return typeof result === 'object' ? await result : result
-}
-
-export const getModel = async (): Promise<string> => {
-	const result = DeviceInfo.getModel()
-	return typeof result === 'object' ? await result : result
-}
-
-export const getBundleId = async (): Promise<string> => {
-	const result = DeviceInfo.getBundleId()
-	return typeof result === 'object' ? await result : result
-}
-
-export const getManufacturer = async (): Promise<string> => {
-	const result = DeviceInfo.getManufacturer()
-	return typeof result === 'object' ? await result : result
-}
-
-export const getDeviceType = async (): Promise<string> => {
-	const result = DeviceInfo.getDeviceType()
-	return typeof result === 'object' ? await result : result
-}
-
-export const getDeviceId = async (): Promise<string> => {
-	const result = DeviceInfo.getDeviceId()
-	return typeof result === 'object' ? await result : result
-}
-
-export const getBrand = async (): Promise<string> => {
-	const result = DeviceInfo.getBrand()
-	return typeof result === 'object' ? await result : result
-}
-
-export const getLocale = async (): Promise<string> => {
-	let currentLocale = 'en'
-
-	if (Platform.OS === 'ios') {
-		const settings = Settings.get('AppleLocale') as string | undefined
-		const locale = settings
-		if (locale) currentLocale = typeof locale === 'string' ? locale : String(locale)
-	} else {
-		const locale = I18nManager.getConstants().localeIdentifier
-		if (locale) currentLocale = locale
-	}
-
-	return currentLocale
-}

package/src/utils/constants.ts

@@ -1,60 +0,0 @@
-// Brand Colors
-export const PRIMARY_COLOR = 'rgba(224, 8, 66, 1)'
-export const PRESSED_COLOR = 'hsl(344, 92.90%, 38.40%)'
-export const ERROR_COLOR = '#D40C74'
-
-// Background Colors
-export const BG_DEFAULT = '#FFFFFF'
-export const BG_SECONDARY = '#EBEDF3'
-export const BG_DISABLED = 'rgba(224, 224, 224, 1)'
-export const BG_DISABLED_SECONDARY = 'rgba(240, 240, 240, 1)'
-export const BG_BUTTON_SECONDARY = 'rgba(255, 237, 241, 1)'
-
-export const BG_SELECTED = '#ebedf3'
-// Border Colors
-export const BORDER_DEFAULT = '#858b91'
-export const BORDER_SECONDARY = 'rgba(133, 139, 145, 1)'
-export const BORDER_FOCUS = '#082065'
-export const BORDER_SELECTED = '#082065'
-
-// Text Colors
-export const TEXT_DEFAULT = '#082065'
-export const TEXT_DARK = '#000000'
-export const TEXT_WHITE = '#FFFFFF'
-export const TEXT_PLACEHOLDER = '#9E9E9E'
-export const TEXT_NOTE = '#757575'
-export const TEXT_DISABLED = 'rgba(168, 168, 168, 1)'
-
-// Component Specific Colors
-export const COLOR_STAR_NORMAL = '#D0D0D0'
-export const COLOR_STAR_SELECTED = '#F7C926'
-
-export interface InitOptions {
-	language?: string
-	userId?: string | null
-	formSlug?: string
-	debug?: boolean
-	eventTag?: string
-	metadata?: any
-	appSec?: string
-	packageId?: string
-	deviceUuid?: string
-	[key: string]: any
-}
-
-export const OUS_VARS: any = {
-	ratingStars: 0,
-	fonts: null,
-	theme: null,
-	sdkCallbackFunction: null,
-	version: '4.0.0.beta.16', // Aligning with web version for compatibility
-	uuid: '',
-	language: 'en',
-	options: null,
-	ENDPOINTS: ['VlAI2Q1FDHvASMhqTXe0', 'rNwrNi5Iw36epJS9gprO', 'Ij8Ji87IpdZTXSw1kAFV'],
-	API_URL: 'https://aia-dfs.originally.us/backend',
-}
-
-export const xmlsUrl = 'http://www.w3.org/2000/svg'
-export const containerId = 'sdk_view_container'
-export const inlineComponentId = 'sdk_inline_view_container'