@muchbetteradventures/consent-manager 5.7.1-beta.1 → 5.7.1-beta.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@muchbetteradventures/consent-manager",
-  "version": "5.7.1-beta.1",
+  "version": "5.7.1-beta.2",
   "description": "Drop-in consent management plugin for analytics.js",
   "keywords": [
     "gdpr",

package/types/src/__tests__/consent-manager-builder/analytics.test.d.ts

@@ -0,0 +1 @@
+export {};

package/types/src/__tests__/consent-manager-builder/fetch-destinations.test.d.ts

@@ -0,0 +1 @@
+export {};

package/types/src/__tests__/consent-manager-builder/preferences.test.d.ts

@@ -0,0 +1 @@
+export {};

package/types/src/__tests__/index.test.d.ts

@@ -0,0 +1 @@
+export {};

package/types/src/consent-manager/banner.d.ts

@@ -0,0 +1,20 @@
+import React, { PureComponent } from 'react';
+import { CloseBehavior, CloseBehaviorFunction } from './container';
+import { BannerMode } from '../types';
+interface Props {
+    innerRef: (node: HTMLElement | null) => void;
+    onClose: (forceCloseBehaviour?: CloseBehavior | CloseBehaviorFunction) => void;
+    onChangePreferences: () => void;
+    content: React.ReactNode;
+    subContent: React.ReactNode;
+    backgroundColor: string;
+    textColor: string;
+    showRejectAll: boolean;
+    bannerMode: BannerMode;
+}
+export default class Banner extends PureComponent<Props> {
+    static displayName: string;
+    componentDidMount(): void;
+    render(): JSX.Element;
+}
+export {};

package/types/src/consent-manager/buttons.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+/// <reference types="emotion" />
+/// <reference types="@emotion/core" />
+export declare const DefaultButton: import("react-emotion").StyledComponent<unknown, any, import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & {
+    innerRef?: string | ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
+}>;
+export declare const TextButton: import("react-emotion").StyledComponent<unknown, any, import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & {
+    innerRef?: string | ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
+}>;
+export declare const GreenButton: import("react-emotion").StyledComponent<unknown, any, import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & {
+    innerRef?: string | ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
+}>;
+export declare const RedButton: import("react-emotion").StyledComponent<unknown, any, import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & {
+    innerRef?: string | ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
+}>;

package/types/src/consent-manager/categories.d.ts

@@ -0,0 +1,3 @@
+export declare const MARKETING_AND_ANALYTICS_CATEGORIES: string[];
+export declare const ADVERTISING_CATEGORIES: string[];
+export declare const FUNCTIONAL_CATEGORIES: string[];

package/types/src/consent-manager/container.d.ts

@@ -0,0 +1,36 @@
+import React from 'react';
+import { Destination, CategoryPreferences, CustomCategories, DefaultDestinationBehavior, BannerMode } from '../types';
+export declare function openDialog(): void;
+export declare const enum CloseBehavior {
+    ACCEPT = "accept",
+    DENY = "deny",
+    DISMISS = "dismiss"
+}
+export interface CloseBehaviorFunction {
+    (categories: CategoryPreferences): CategoryPreferences;
+}
+interface ContainerProps {
+    setPreferences: (prefs: CategoryPreferences) => void;
+    saveConsent: (newPreferences?: CategoryPreferences, shouldReload?: boolean) => void;
+    resetPreferences: () => void;
+    closeBehavior?: CloseBehavior | CloseBehaviorFunction;
+    destinations: Destination[];
+    customCategories?: CustomCategories | undefined;
+    newDestinations: Destination[];
+    preferences: CategoryPreferences;
+    havePreferencesChanged: boolean;
+    isConsentRequired: boolean;
+    implyConsentOnInteraction: boolean;
+    bannerContent: React.ReactNode;
+    bannerSubContent: React.ReactNode;
+    bannerTextColor: string;
+    bannerBackgroundColor: string;
+    preferencesDialogTitle: React.ReactNode;
+    preferencesDialogContent: React.ReactNode;
+    workspaceAddedNewDestinations?: boolean;
+    defaultDestinationBehavior?: DefaultDestinationBehavior;
+    showRejectAll: boolean;
+    bannerMode: BannerMode;
+}
+declare const Container: React.FC<ContainerProps>;
+export default Container;

package/types/src/consent-manager/dialog.d.ts

@@ -0,0 +1,29 @@
+import React, { PureComponent } from 'react';
+interface DialogProps {
+    innerRef: (element: HTMLElement | null) => void;
+    onCancel?: () => void;
+    onSubmit: (e: React.FormEvent<HTMLFormElement>) => void;
+    title: React.ReactNode;
+    buttons: React.ReactNode;
+    width?: string;
+}
+export default class Dialog extends PureComponent<DialogProps, {}> {
+    static displayName: string;
+    private titleId;
+    private container;
+    private root;
+    private form;
+    static defaultProps: {
+        onCancel: undefined;
+        width: string;
+    };
+    constructor(props: DialogProps);
+    render(): React.ReactPortal;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    handleRootRef: (node: HTMLElement) => void;
+    handleFormRef: (node: HTMLFormElement) => void;
+    handleOverlayClick: (e: any) => void;
+    handleEsc: (e: KeyboardEvent) => void;
+}
+export {};

package/types/src/consent-manager/font-styles.d.ts

@@ -0,0 +1,2 @@
+declare const _default: string;
+export default _default;

package/types/src/consent-manager/index.d.ts

@@ -0,0 +1,26 @@
+import { PureComponent } from 'react';
+import { CategoryPreferences, Destination, ConsentManagerProps } from '../types';
+export default class ConsentManager extends PureComponent<ConsentManagerProps, {}> {
+    static displayName: string;
+    static defaultProps: {
+        otherWriteKeys: never[];
+        shouldRequireConsent: () => boolean;
+        implyConsentOnInteraction: boolean;
+        onError: undefined;
+        cookieDomain: undefined;
+        customCategories: undefined;
+        bannerTextColor: string;
+        bannerSubContent: string;
+        bannerBackgroundColor: string;
+        preferencesDialogTitle: string;
+        defaultDestinationBehavior: string;
+        showRejectAll: boolean;
+        bannerMode: "blocking";
+    };
+    render(): JSX.Element;
+    getInitialPreferences: () => {};
+    handleMapCustomPreferences: (destinations: Destination[], preferences: CategoryPreferences) => {
+        destinationPreferences: {};
+        customPreferences: {};
+    };
+}

package/types/src/consent-manager/preference-dialog.d.ts

@@ -0,0 +1,33 @@
+import React, { PureComponent } from 'react';
+import { Destination, CustomCategories, CategoryPreferences } from '../types';
+import { CloseBehavior, CloseBehaviorFunction } from './container';
+interface PreferenceDialogProps {
+    innerRef: (element: HTMLElement | null) => void;
+    onCancel: () => void;
+    onSave: () => void;
+    onChange: (name: string, value: boolean) => void;
+    onClose: (forceCloseBehaviour?: CloseBehavior | CloseBehaviorFunction) => void;
+    marketingDestinations: Destination[];
+    advertisingDestinations: Destination[];
+    functionalDestinations: Destination[];
+    marketingAndAnalytics?: boolean | null;
+    advertising?: boolean | null;
+    functional?: boolean | null;
+    customCategories?: CustomCategories;
+    destinations: Destination[];
+    preferences: CategoryPreferences;
+    title: React.ReactNode;
+    content: React.ReactNode;
+}
+export default class PreferenceDialog extends PureComponent<PreferenceDialogProps, {}> {
+    static displayName: string;
+    static defaultProps: {
+        marketingAndAnalytics: null;
+        advertising: null;
+        functional: null;
+    };
+    render(): JSX.Element;
+    handleChange: (e: any) => void;
+    handleSubmit: (e: React.FormEvent<HTMLFormElement>) => void;
+}
+export {};

package/types/src/consent-manager-builder/analytics.d.ts

@@ -0,0 +1,12 @@
+import { CategoryPreferences, DefaultDestinationBehavior, Destination } from '../types';
+interface AnalyticsParams {
+    writeKey: string;
+    destinations: Destination[];
+    destinationPreferences: CategoryPreferences | null | undefined;
+    isConsentRequired: boolean;
+    shouldReload?: boolean;
+    defaultDestinationBehavior?: DefaultDestinationBehavior;
+    categoryPreferences: CategoryPreferences | null | undefined;
+}
+export default function conditionallyLoadAnalytics({ writeKey, destinations, destinationPreferences, isConsentRequired, shouldReload, defaultDestinationBehavior, categoryPreferences }: AnalyticsParams): void;
+export {};

package/types/src/consent-manager-builder/fetch-destinations.d.ts

@@ -0,0 +1,2 @@
+import { Destination } from '../types';
+export default function fetchDestinations(cdnHost: string, writeKeys: string[]): Promise<Destination[]>;

package/types/src/consent-manager-builder/index.d.ts

@@ -0,0 +1,101 @@
+/// <reference types="emotion" />
+/// <reference types="@emotion/core" />
+import { Component } from 'react';
+import { Destination, CategoryPreferences, CustomCategories, DefaultDestinationBehavior } from '../types';
+interface Props {
+    /** Your Segment Write key for your website */
+    writeKey: string;
+    /** A list of other write keys you may want to provide */
+    otherWriteKeys?: string[];
+    cookieDomain?: string;
+    /**
+     * An initial selection of Preferences
+     */
+    initialPreferences?: CategoryPreferences;
+    /**
+     * Provide a function to define whether or not consent should be required
+     */
+    shouldRequireConsent?: () => Promise<boolean> | boolean;
+    /**
+     * Render props for the Consent Manager builder
+     */
+    children: (props: RenderProps) => React.ReactElement;
+    /**
+     * Allows for customizing how to show different categories of consent.
+     */
+    mapCustomPreferences?: (destinations: Destination[], preferences: CategoryPreferences) => {
+        destinationPreferences: CategoryPreferences;
+        customPreferences: CategoryPreferences;
+    };
+    /**
+     * Allows for adding custom consent categories by mapping a custom category to Segment integrations
+     */
+    customCategories?: CustomCategories;
+    /**
+     * Specified default behavior for when new destinations are detected on the source(s) of this consent manager.
+     */
+    defaultDestinationBehavior?: DefaultDestinationBehavior;
+    /**
+     * A callback for dealing with errors in the Consent Manager
+     */
+    onError?: (err: Error) => void | Promise<void>;
+    /**
+     * CDN to fetch list of integrations from
+     */
+    cdnHost?: string;
+}
+interface RenderProps {
+    destinations: Destination[];
+    newDestinations: Destination[];
+    preferences: CategoryPreferences;
+    destinationPreferences: CategoryPreferences;
+    isConsentRequired: boolean;
+    customCategories?: CustomCategories;
+    havePreferencesChanged: boolean;
+    workspaceAddedNewDestinations: boolean;
+    setPreferences: (newPreferences: CategoryPreferences) => void;
+    resetPreferences: () => void;
+    saveConsent: (newPreferences?: CategoryPreferences | boolean, shouldReload?: boolean) => void;
+}
+interface State {
+    isLoading: boolean;
+    destinations: Destination[];
+    newDestinations: Destination[];
+    preferences?: CategoryPreferences;
+    destinationPreferences?: CategoryPreferences;
+    isConsentRequired: boolean;
+    havePreferencesChanged: boolean;
+    workspaceAddedNewDestinations: boolean;
+}
+export default class ConsentManagerBuilder extends Component<Props, State> {
+    static displayName: string;
+    static defaultProps: {
+        otherWriteKeys: never[];
+        onError: undefined;
+        shouldRequireConsent: () => boolean;
+        initialPreferences: {};
+        cdnHost: string;
+    };
+    state: {
+        isLoading: boolean;
+        destinations: never[];
+        newDestinations: never[];
+        preferences: {};
+        destinationPreferences: {};
+        isConsentRequired: boolean;
+        havePreferencesChanged: boolean;
+        workspaceAddedNewDestinations: boolean;
+    };
+    render(): import("react").ReactElement<any, string | ((props: any) => import("react").ReactElement<any, string | any | (new (props: any) => Component<any, any, any>)> | null) | (new (props: any) => Component<any, any, any>)> | null;
+    componentDidMount(): Promise<void>;
+    initialise: () => Promise<void>;
+    handleSetPreferences: (newPreferences: CategoryPreferences) => void;
+    handleResetPreferences: () => void;
+    handleSaveConsent: (newPreferences: CategoryPreferences | undefined, shouldReload: boolean) => void;
+    mergePreferences: (args: {
+        destinations: Destination[];
+        existingPreferences?: CategoryPreferences | undefined;
+        newPreferences?: CategoryPreferences | undefined;
+    }) => CategoryPreferences;
+}
+export {};

package/types/src/consent-manager-builder/preferences.d.ts

@@ -0,0 +1,30 @@
+/// <reference types="node" />
+import { Preferences } from '../types';
+import { EventEmitter } from 'events';
+export interface PreferencesManager {
+    loadPreferences(): Preferences;
+    onPreferencesSaved(listener: (prefs: Preferences) => void): void;
+    onWillShowBanner(listener: (prefs: Preferences) => void): void;
+    savePreferences(prefs: SavePreferences): void;
+}
+export declare function loadPreferences(): Preferences;
+declare type SavePreferences = Preferences & {
+    cookieDomain?: string;
+};
+export declare const emitter: EventEmitter;
+/**
+ * Subscribes to consent preferences changing over time and returns
+ * a cleanup function that can be invoked to remove the instantiated listener.
+ *
+ * @param listener a function to be invoked when ConsentPreferences are saved
+ */
+export declare function onPreferencesSaved(listener: (prefs: Preferences) => void): () => EventEmitter;
+/**
+ * Subscribes to consent preferences changing over time and returns
+ * a cleanup function that can be invoked to remove the instantiated listener.
+ *
+ * @param listener a function to be invoked when ConsentPreferences are saved
+ */
+export declare function onWillShowBanner(listener: (prefs: Preferences) => void): () => EventEmitter;
+export declare function savePreferences({ destinationPreferences, customPreferences, cookieDomain }: SavePreferences): void;
+export {};

package/types/src/hooks.d.ts

@@ -0,0 +1 @@
+export declare const applyIntegrationHooks: (integrations: any) => any;

package/types/src/index.d.ts

@@ -0,0 +1,7 @@
+import CMB from './consent-manager-builder';
+import CM from './consent-manager';
+export { openDialog as openConsentManager } from './consent-manager/container';
+export { loadPreferences, savePreferences, onPreferencesSaved } from './consent-manager-builder/preferences';
+export declare const ConsentManagerBuilder: typeof CMB;
+export declare const ConsentManager: typeof CM;
+export declare function doNotTrack(): boolean | null;

package/types/src/standalone.d.ts

@@ -0,0 +1,5 @@
+import inEU from '@segment/in-eu';
+import { openConsentManager, doNotTrack } from '.';
+import * as preferences from './consent-manager-builder/preferences';
+export declare const version: string | undefined;
+export { openConsentManager, doNotTrack, inEU, preferences };

package/types/src/types.d.ts

@@ -0,0 +1,87 @@
+/// <reference types="react" />
+/// <reference types="segment-analytics" />
+import { CloseBehavior, CloseBehaviorFunction } from './consent-manager/container';
+import { PreferencesManager } from './consent-manager-builder/preferences';
+declare type AJS = SegmentAnalytics.AnalyticsJS & {
+    initialized: boolean;
+    track: (event: string, properties: {
+        [key: string]: any;
+    }) => void;
+    addSourceMiddleware: (middleware: Middleware) => void;
+};
+export declare type Middleware = (input: MiddlewareInput) => void;
+interface MiddlewareInput {
+    payload: {
+        obj: Record<string, any>;
+        [key: string]: any;
+    };
+    integrations?: Record<string, boolean>;
+    next: (payload: MiddlewareInput['payload']) => void;
+}
+export declare type WindowWithAJS = Window & typeof globalThis & {
+    analytics?: AJS;
+};
+export declare type WindowWithConsentManagerConfig = Window & typeof globalThis & {
+    consentManagerConfig?: (args: StandaloneConsentManagerParams) => ConsentManagerInput | ConsentManagerInput;
+};
+export declare type ConsentManagerInput = ConsentManagerProps & {
+    container: string;
+};
+export declare type DefaultDestinationBehavior = 'enable' | 'disable' | 'imply' | 'ask';
+export declare type BannerMode = 'blocking' | 'floating';
+interface StandaloneConsentManagerParams {
+    React: unknown;
+    version?: string;
+    openConsentManager: () => void;
+    doNotTrack: () => boolean | null;
+    inEU: () => boolean;
+    preferences: PreferencesManager;
+    inRegions: (regions: string[]) => () => boolean;
+}
+export interface Preferences {
+    destinationPreferences?: CategoryPreferences;
+    customPreferences?: CategoryPreferences;
+}
+export interface Destination {
+    id: string;
+    name: string;
+    creationName: string;
+    description: string;
+    website: string;
+    category: string;
+}
+export interface CategoryPreferences {
+    functional?: boolean | null | undefined;
+    marketingAndAnalytics?: boolean | null | undefined;
+    advertising?: boolean | null | undefined;
+    [category: string]: boolean | null | undefined;
+}
+export interface CustomCategories {
+    [key: string]: CustomCategory;
+}
+interface CustomCategory {
+    integrations: string[];
+    purpose: string;
+}
+export interface ConsentManagerProps {
+    writeKey: string;
+    otherWriteKeys?: string[];
+    shouldRequireConsent?: () => Promise<boolean> | boolean;
+    implyConsentOnInteraction?: boolean;
+    cookieDomain?: string;
+    bannerContent: React.ReactNode;
+    bannerSubContent?: string;
+    bannerTextColor?: string;
+    bannerBackgroundColor?: string;
+    preferencesDialogTitle?: React.ReactNode;
+    preferencesDialogContent: React.ReactNode;
+    onError?: (error: Error | undefined) => void;
+    closeBehavior?: CloseBehavior | CloseBehaviorFunction;
+    initialPreferences?: CategoryPreferences;
+    customCategories?: CustomCategories;
+    defaultDestinationBehavior?: DefaultDestinationBehavior;
+    cdnHost?: string;
+    showRejectAll: boolean;
+    bannerMode?: BannerMode;
+}
+export {};

package/types/stories/0-consent-manager.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/types/stories/0.1-consent-manager-close-interaction.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/types/stories/1-standalone.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/types/stories/1.1-standalone-custom.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/types/stories/2-category-based.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/types/stories/3-tool-based.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/types/stories/4-custom-consent.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/types/stories/5-custom-categories.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/types/stories/6-ccpa-gdpr-example.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/types/stories/7-default-destination-behavior.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/types/stories/8-floating-banner.stories.d.ts

@@ -0,0 +1 @@
+export {};

package/types/stories/ImplyConsentOnInteraction.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const ImplyConsentOnInteraction: () => JSX.Element;

package/types/stories/components/CookieView.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const CookieView: () => JSX.Element;
+export default CookieView;

package/types/stories/components/common-react.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare const bannerContent: JSX.Element;
+export declare const bannerSubContent = "You can manage your preferences here!";
+export declare const preferencesDialogTitle = "Website Data Collection Preferences";
+export declare const preferencesDialogContent: JSX.Element;

package/types/stories/components/destination-tile.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import PropTypes from 'prop-types';
+declare function Destination({ destination, preferences, setPreferences }: {
+    destination: any;
+    preferences: any;
+    setPreferences: any;
+}): JSX.Element;
+declare namespace Destination {
+    var propTypes: {
+        destination: PropTypes.Validator<object>;
+        preferences: PropTypes.Validator<object>;
+        setPreferences: PropTypes.Validator<(...args: any[]) => any>;
+    };
+}
+export default Destination;