@amazon-devices/vega-carousel 0.1.3

package/dist/utils/CarouselReactNativeUtilities.d.ts

@@ -0,0 +1,108 @@
+/**
+ * Helper constant that is set to `true` when running tests.
+ */
+export declare const isTest: boolean;
+/**
+ * Wrapper function that calls {@link registerGeneratedViewConfig} from the
+ * {@link @amazon-devices/react-native-kepler/Libraries/Utilities} library when not
+ * running tests, and creates a Jest mock on tests.
+ */
+export declare const registerGeneratedViewConfig: any;
+/**
+ * Wrapper function that calls {@link codegenNativeCommands} from the
+ * {@link @amazon-devices/react-native-kepler/Libraries/Utilities} library when not
+ * running tests, and creates a Jest mock on tests.
+ */
+export declare const codegenNativeCommands: any;
+/**
+ * Helper type representing one entry on the `validAttributes` parameter for the
+ * {@link registerGeneratedViewConfig} function.
+ */
+type ValidAttrsType = {
+    [key: string]: boolean;
+};
+/**
+ * Helper function that can create a "valid attributes" object from an object
+ * of default values.
+ *
+ * Since TypeScript can't return a list of properties for a type without it
+ * being instantiated into an object first, you're required to pass an object
+ * with default values for it to traverse.
+ *
+ * @template TypeT The type of the passed object to use to create a "valid
+ *           attributes" map.
+ *
+ * @param {TypeT} defaultValues An object with fields containing any value. Each
+ *        field with a value will have a "valid attribute" generated for it.
+ *
+ * @return {ValidAttrsType} Returns a full map-like object to be used as the
+ *         `validAttributes` parameter for the
+ *         {@link registerGeneratedViewConfig} function.
+ */
+export declare function validAttributesFromDefaults<TypeT extends object>(defaultValues: TypeT): ValidAttrsType;
+/**
+ * Helper type representing one entry of the `directEventTypes` attribute used
+ * with the {@link registerGeneratedViewConfig} function.
+ */
+type EventRegistrationType = {
+    [eventName: string]: {
+        registrationName: string;
+    };
+};
+/**
+ * Helper type representing one entry of the input object required by the
+ * {@link buildDirectEvents} functions.
+ */
+type BuildDirectEventsType = {
+    [key: string]: string;
+};
+/**
+ * Helper function used to build the `directEventType` attribute used with the
+ * {@link registerGeneratedViewConfig} function.
+ *
+ * This function requires a special syntax to be able to produce a valid output.
+ * It requires the `events` argument to be an object in the following format:
+ *
+ * ```ts
+ * const arg = {
+ *   nativeEventName: "typeOfEvent",
+ *   ...
+ * };
+ * ```
+ *
+ * If we used the exact arg showed above, it would mean that the native layer
+ * can emmit a `nativeEventName` event like in the following snipped:
+ *
+ * ```cpp
+ * if (!eventEmitter_) {
+ *   eventEmitter_->emit("nativeEventName");
+ * }
+ * ```
+ *
+ * Then, in the JS layer, if we have the attribute `onNativeEventName` callback,
+ * such a callback would be invoked.
+ *
+ * Also, the generated `directEventType` for the example above would be:
+ *
+ * ```ts
+ * const directEventType = {
+ *   typeOfEventNativeEventName: {
+ *     registrationName: 'onNativeEventName',
+ *   },
+ * }
+ * ```
+ *
+ * @param {BuildDirectEventsType} events The events object to be used to
+ *        generate the `directEventType` attribute used with the
+ *        {@link registerGeneratedViewConfig} function.
+ *
+ * @return {EventRegistrationType} Returns a valid object to be used by the
+ *         {@link registerGeneratedViewConfig} function as the
+ *         `directEventTypes` attribute.
+ *
+ * @see {@link registerGeneratedViewConfig}
+ * @see {@link EventRegistrationType}
+ * @see {@link BuildDirectEventsType}
+ */
+export declare function buildDirectEvents(events: BuildDirectEventsType): EventRegistrationType;
+export {};

package/dist/utils/CarouselReactNativeUtilities.js

@@ -0,0 +1,150 @@
+"use strict";
+/*
+ * Copyright (c) 2024 - 2025 Amazon.com, Inc. or its affiliates. All rights reserved.
+ *
+ * PROPRIETARY/CONFIDENTIAL. USE IS SUBJECT TO LICENSE TERMS.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.buildDirectEvents = exports.validAttributesFromDefaults = exports.codegenNativeCommands = exports.registerGeneratedViewConfig = exports.isTest = void 0;
+/**
+ * Helper constant that is set to `true` when running tests.
+ */
+/* istanbul ignore next */
+exports.isTest = typeof process !== 'undefined' &&
+    typeof process.env !== 'undefined' &&
+    (process.env.JEST_WORKER_ID !== undefined || process.env.NODE_ENV === 'test');
+/**
+ * Wrapper function that calls {@link registerGeneratedViewConfig} from the
+ * {@link @amazon-devices/react-native-kepler/Libraries/Utilities} library when not
+ * running tests, and creates a Jest mock on tests.
+ */
+exports.registerGeneratedViewConfig = exports.isTest
+    ? jest.fn()
+    : /* istanbul ignore next */
+        require('@amazon-devices/react-native-kepler/Libraries/Utilities/registerGeneratedViewConfig');
+/**
+ * Helper function that creates an object with a set of Mock functions to be
+ * used in the {@link codegenNativeCommands} during tests.
+ */
+function createMockCommands(keys) {
+    return keys.reduce((acc, key) => ({
+        ...acc,
+        [key]: jest.fn(),
+    }), {});
+}
+/**
+ * Wrapper function that calls {@link codegenNativeCommands} from the
+ * {@link @amazon-devices/react-native-kepler/Libraries/Utilities} library when not
+ * running tests, and creates a Jest mock on tests.
+ */
+exports.codegenNativeCommands = exports.isTest
+    ? jest.fn((args) => createMockCommands(args.supportedCommands))
+    : /* istanbul ignore next */
+        require('@amazon-devices/react-native-kepler/Libraries/Utilities/codegenNativeCommands')
+            .default;
+/**
+ * Helper function used to "fold" an array of strings into a full object of
+ * {@link ValidAttrsType}.
+ *
+ * This function is not intended to be used standalone, but as an argument in
+ * the {@link Array.reduce} function.
+ *
+ * @param {ValidAttrsType} attrs The cumulative object of all the past valid
+ *        attributes.
+ * @param {string} prop The name of the next valid attribute to be folded.
+ *
+ * @return {ValidAttrsType} Returns the cumulative valid attributes after the
+ *         last value is folded.
+ */
+function foldValidAttrs(attrs, prop) {
+    return {
+        ...attrs,
+        [prop]: true,
+    };
+}
+/**
+ * Helper function that can create a "valid attributes" object from an object
+ * of default values.
+ *
+ * Since TypeScript can't return a list of properties for a type without it
+ * being instantiated into an object first, you're required to pass an object
+ * with default values for it to traverse.
+ *
+ * @template TypeT The type of the passed object to use to create a "valid
+ *           attributes" map.
+ *
+ * @param {TypeT} defaultValues An object with fields containing any value. Each
+ *        field with a value will have a "valid attribute" generated for it.
+ *
+ * @return {ValidAttrsType} Returns a full map-like object to be used as the
+ *         `validAttributes` parameter for the
+ *         {@link registerGeneratedViewConfig} function.
+ */
+function validAttributesFromDefaults(defaultValues) {
+    const propNames = Object.keys(defaultValues);
+    return propNames.reduce(foldValidAttrs, {});
+}
+exports.validAttributesFromDefaults = validAttributesFromDefaults;
+/**
+ * Helper function used to build the `directEventType` attribute used with the
+ * {@link registerGeneratedViewConfig} function.
+ *
+ * This function requires a special syntax to be able to produce a valid output.
+ * It requires the `events` argument to be an object in the following format:
+ *
+ * ```ts
+ * const arg = {
+ *   nativeEventName: "typeOfEvent",
+ *   ...
+ * };
+ * ```
+ *
+ * If we used the exact arg showed above, it would mean that the native layer
+ * can emmit a `nativeEventName` event like in the following snipped:
+ *
+ * ```cpp
+ * if (!eventEmitter_) {
+ *   eventEmitter_->emit("nativeEventName");
+ * }
+ * ```
+ *
+ * Then, in the JS layer, if we have the attribute `onNativeEventName` callback,
+ * such a callback would be invoked.
+ *
+ * Also, the generated `directEventType` for the example above would be:
+ *
+ * ```ts
+ * const directEventType = {
+ *   typeOfEventNativeEventName: {
+ *     registrationName: 'onNativeEventName',
+ *   },
+ * }
+ * ```
+ *
+ * @param {BuildDirectEventsType} events The events object to be used to
+ *        generate the `directEventType` attribute used with the
+ *        {@link registerGeneratedViewConfig} function.
+ *
+ * @return {EventRegistrationType} Returns a valid object to be used by the
+ *         {@link registerGeneratedViewConfig} function as the
+ *         `directEventTypes` attribute.
+ *
+ * @see {@link registerGeneratedViewConfig}
+ * @see {@link EventRegistrationType}
+ * @see {@link BuildDirectEventsType}
+ */
+function buildDirectEvents(events) {
+    let directEvents = {};
+    const lowercase = (str) => str.toLowerCase();
+    const capitalize = (str) => str.charAt(0).toUpperCase() + str.slice(1);
+    for (const event in events) {
+        const eventName = capitalize(event);
+        const eventType = lowercase(events[event]);
+        directEvents = {
+            ...directEvents,
+            [`${eventType}${eventName}`]: { registrationName: `on${eventName}` },
+        };
+    }
+    return directEvents;
+}
+exports.buildDirectEvents = buildDirectEvents;

package/dist/utils/HelperTypes.d.ts

@@ -0,0 +1,5 @@
+/**
+ * This helper type is to indicate that the use of the TS type `any` is
+ *  necessary in an API of this package.
+ */
+export type AnyValue = any;

package/dist/utils/HelperTypes.js

@@ -0,0 +1,7 @@
+"use strict";
+/*
+ * Copyright (c) 2024 Amazon.com, Inc. or its affiliates. All rights reserved.
+ *
+ * PROPRIETARY/CONFIDENTIAL. USE IS SUBJECT TO LICENSE TERMS.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/utils/index.d.ts

@@ -0,0 +1,3 @@
+export * from './HelperTypes';
+export * from './CarouselLogger';
+export * from './CarouselReactNativeUtilities';

package/dist/utils/index.js

@@ -0,0 +1,24 @@
+"use strict";
+/*
+ * Copyright (c) 2024 - 2025 Amazon.com, Inc. or its affiliates. All rights reserved.
+ *
+ * PROPRIETARY/CONFIDENTIAL. USE IS SUBJECT TO LICENSE TERMS.
+ */
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./HelperTypes"), exports);
+__exportStar(require("./CarouselLogger"), exports);
+__exportStar(require("./CarouselReactNativeUtilities"), exports);

package/package.json

@@ -0,0 +1 @@
+{"name": "@amazon-devices/vega-carousel", "version": "0.1.3", "main": "dist/index.js", "types": "dist/index.d.ts", "files": ["dist", "react-native.config.js", "THIRD_PARTY_NOTICES.txt"], "scripts": {"clean": "rm -rf build dist generated logs node_modules", "test:snapshot": "jest --colors --updateSnapshot", "start": "node node_modules/react-native/local-cli/cli.js start", "test": "jest --colors", "lint": "eslint src --ext .ts,.tsx", "lint:fix": "eslint src --ext .ts,.tsx --fix", "lint-staged": "lint-staged --allow-empty", "format": "clang-format -i --glob=\"native/**/*.{cpp,h}\"", "git-commit-template": "git-commit-template .git-commit-template", "compile": "tsc -p tsconfig-build.json", "build": "npm-run-all format compile"}, "dependencies": {"@amazon-devices/react-native-kepler": "^2.0.0", "ansi-colors": "^4.1.3", "react": "^18.2.0", "react-native": "^0.72.0", "recyclerlistview": "4.2.1"}, "devDependencies": {"@babel/core": "^7.20.0", "@babel/plugin-transform-private-methods": "^7.23.3", "@babel/runtime": "^7.20.0", "@bam.tech/jest-junit-reports-merger": "^1.1.0", "@react-native-community/eslint-config": "^3.2.0", "@testing-library/jest-native": "^5.4.3", "@testing-library/react-native": "^11.5.4", "@types/jest": "^28.0.0", "@types/react-test-renderer": "^18.0.0", "@typescript-eslint/eslint-plugin": "^5.18.0", "babel-jest": "^28.0.0", "clang-format": "^1.8.0", "eslint": "^8.19.0", "eslint-plugin-react-native": "^4.1.0", "git-commit-template": "^1.0.5", "lint-staged": "^12.3.7", "jest": "^28.0.0", "jest-junit": "^16.0.0", "metro-react-native-babel-preset": "^0.76.5", "npm-run-all": "^4.1.5", "prettier": "^3.0.0", "react": "^18.2.0", "react-native": "^0.72.0", "react-test-renderer": "18.2.0", "ts-jest": "^28.0.0", "typedoc": "^0.25.7", "typescript": "4.9.5", "@amazon-devices/kepler-cli-platform": "^0", "@react-native-community/cli": "^11.2.0"}, "resolutions": {"@types/react": "^18"}, "peerDependencies": {"react": "^18.2.0", "react-native": "^0.72.0"}, "kepler": {"projectType": "turbomodule", "toolchain": "clang", "targets": ["tv"], "os": ["vega"]}, "eslintConfig": {"extends": "@react-native-community", "parser": "@typescript-eslint/parser", "plugins": ["@typescript-eslint"], "root": true}, "prettier": {"arrowParens": "avoid", "bracketSameLine": true, "bracketSpacing": false, "singleQuote": true, "trailingComma": "all"}, "npm-pretty-much": {"allowUnsafeName": "reason for using a unsafe name"}, "license": "See license in LICENSE"}

package/react-native.config.js

@@ -0,0 +1,22 @@
+module.exports = {
+  dependency: {
+    platforms: {
+      kepler: {
+        autolink: {
+          KeplerCarousel: {
+            uiComponentName: '/com.amazon.keplerscript.carousel',
+            linkDynamic: true,
+            provider: 'application',
+            turbomodules: [],
+            components: [
+              'KeplerScrollable',
+              'KeplerScrollableItemFrame',
+              'CarouselNative',
+              'CarouselNativeItem',
+            ],
+          },
+        },
+      },
+    },
+  },
+};