@camunda/ccma-saas-frontend 0.0.31

package/lib/esm/components/c4-management-settings/c4-management-settings.js

@@ -0,0 +1,131 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/*
+ * Copyright Camunda Services GmbH and/or licensed to Camunda Services GmbH
+ * under one or more contributor license agreements. Licensed under a commercial license.
+ * You may not use this file except in compliance with the commercial license.
+ */
+import { C3DataTable, C3EmptyState, } from '@camunda/camunda-composite-components';
+import { Button, Link, Stack, StaticNotification, StructuredListSkeleton, } from '@carbon/react';
+import { ConnectionSend, Renew, TrashCan } from '@carbon/react/icons/index.esm.js';
+import { C4ExternalLink } from '../c4-external-link/c4-external-link.js';
+import { C4Toggle } from '../c4-toggle/c4-toggle.js';
+export const C4ManagementSettings = ({ orgId: _orgId, organizationName: _organizationName, hasAcceptedBetaTerms, suppressDropDisks, earlyAccessFeatures, recentlyAcceptedBeta, loading, error, permissions, onLeaveOrganization, onDeleteOrganization, onToggleSuppressDropDisks, onToggleEarlyAccessFeature, onOptInToBeta, onOpenFeatureOptIn, onShareFeedback, onRetry, text, earlyAccessDocsUrl, }) => {
+    const canBeToggled = (feature) => {
+        return !feature.requiresClickwrap || feature.hasAcceptedFeatureTerms;
+    };
+    const headers = [
+        {
+            label: text.earlyAccess.columns.name,
+            key: 'name',
+            type: {
+                type: 'wrapper',
+                options: {
+                    wrapperOptions: {
+                        wrapper: (row) => (_jsx("strong", { children: row.name })),
+                    },
+                },
+            },
+            sorting: (a, b) => {
+                return a.name.localeCompare(b.name);
+            },
+        },
+        {
+            label: text.earlyAccess.columns.availableIn,
+            key: 'availableIn',
+        },
+        {
+            label: text.earlyAccess.columns.description,
+            key: 'description',
+        },
+        {
+            label: text.earlyAccess.columns.documentation,
+            key: 'documentationLink',
+            type: {
+                type: 'wrapper',
+                options: {
+                    wrapperOptions: {
+                        wrapper: (row) => (_jsx(Link, { className: 'cds--link', href: row.documentationLink, target: '_blank', children: text.earlyAccess.viewDocsLabel })),
+                    },
+                },
+            },
+        },
+        {
+            label: text.earlyAccess.columns.status,
+            key: 'enabled',
+            type: {
+                type: 'wrapper',
+                options: {
+                    wrapperOptions: {
+                        wrapper: (row) => {
+                            const feature = earlyAccessFeatures.find((f) => f.id === row.id);
+                            if (!feature)
+                                return null;
+                            if (canBeToggled(feature)) {
+                                return (_jsx(C4Toggle, { id: row.id, supported: hasAcceptedBetaTerms, enabled: row.enabled, title: '', notices: [], onClick: () => {
+                                        onToggleEarlyAccessFeature(row.id);
+                                    }, permissions: {
+                                        mayToggle: permissions.mayToggleEarlyAccessFeatures,
+                                    } }));
+                            }
+                            else {
+                                return (_jsx(Button, { kind: 'ghost', disabled: !hasAcceptedBetaTerms, size: 'sm', onClick: () => {
+                                        onOpenFeatureOptIn(row.id);
+                                    }, children: text.earlyAccess.optInToEnableLabel }));
+                            }
+                        },
+                    },
+                },
+            },
+        },
+    ];
+    if (loading) {
+        return _jsx(StructuredListSkeleton, { rowCount: 6 });
+    }
+    // Transform early access features to include originalIndex for C3DataTable
+    const tableData = earlyAccessFeatures.map((feature, index) => ({
+        ...feature,
+        originalIndex: index,
+    }));
+    const component = (_jsxs(Stack, { gap: 6, children: [permissions.mayLeaveOrganization && (_jsx("div", { style: { marginTop: '10px' }, children: _jsxs("div", { style: {
+                        backgroundColor: 'var(--cds-layer)',
+                        padding: '20px',
+                    }, children: [_jsx("h4", { children: text.leaveOrganization.title }), _jsx("p", { style: { marginTop: '8px', color: 'var(--cds-text-helper)' }, children: text.leaveOrganization.consequence }), _jsx("p", { style: { color: 'var(--cds-text-helper)' }, children: text.leaveOrganization.regainAccess }), _jsx(Button, { style: { marginTop: '24px' }, onClick: onLeaveOrganization, size: 'md', kind: 'danger--tertiary', renderIcon: ConnectionSend, children: text.leaveOrganization.buttonLabel })] }) })), permissions.maySuppressDropDisks && (_jsx("div", { children: _jsxs("div", { style: {
+                        backgroundColor: 'var(--cds-layer)',
+                        padding: '20px',
+                    }, children: [_jsx("h4", { children: text.suppressDropDisks.title }), _jsx("p", { style: { marginTop: '8px', color: 'var(--cds-text-helper)' }, children: text.suppressDropDisks.description }), _jsx(C4Toggle, { id: 'suppress-drop-disks-toggle', supported: true, enabled: suppressDropDisks, title: '', notices: [], onClick: onToggleSuppressDropDisks, permissions: {
+                                mayToggle: true,
+                            } })] }) })), permissions.mayDeleteOrganization && (_jsx("div", { children: _jsxs("div", { style: {
+                        backgroundColor: 'var(--cds-layer)',
+                        padding: '20px',
+                    }, children: [_jsx("h4", { children: text.deleteOrganization.title }), _jsx("p", { style: { marginTop: '8px', color: 'var(--cds-text-helper)' }, children: text.deleteOrganization.consequence }), _jsx(Button, { style: { marginTop: '24px' }, renderIcon: TrashCan, kind: 'danger', size: 'md', iconDescription: text.deleteOrganization.buttonLabel, onClick: onDeleteOrganization, children: text.deleteOrganization.buttonLabel })] }) })), permissions.mayToggleEarlyAccessFeatures && earlyAccessFeatures && (_jsx("div", { children: _jsxs("div", { style: {
+                        backgroundColor: 'var(--cds-layer)',
+                        padding: '20px',
+                    }, children: [_jsx("h4", { children: text.earlyAccess.title }), _jsx("p", { style: { marginTop: '12px', color: 'var(--cds-text-helper)' }, children: text.earlyAccess.description0 }), _jsxs("p", { style: {
+                                marginBottom: '18px',
+                                color: 'var(--cds-text-helper)',
+                            }, children: [text.earlyAccess.description1, ' ', _jsx(C4ExternalLink, { id: 'docs-link', label: text.earlyAccess.learnMoreLabel, href: earlyAccessDocsUrl, target: '_blank' })] }), _jsxs(Stack, { children: [recentlyAcceptedBeta && (_jsx(StaticNotification, { lowContrast: true, titleId: 'optInNotification-feedback', "aria-describedby": 'optInNotification-feedback', title: text.earlyAccess.optInNotificationTitle, subtitle: text.earlyAccess.optInNotificationText, actionButtonLabel: text.earlyAccess.optInNotificationFeedback, onActionButtonClick: onShareFeedback, kind: 'success', style: {
+                                        maxWidth: '100%',
+                                        marginBottom: '12px',
+                                    } }, 'optin-notification')), error ? (_jsx(C3EmptyState, { icon: {
+                                        path: `../../../assets/fatalError.svg`,
+                                        altText: 'errorIcon',
+                                    }, heading: text.earlyAccess.errorTitle, description: text.earlyAccess.errorMessage, button: {
+                                        onClick: onRetry,
+                                        disabled: false,
+                                        label: text.earlyAccess.errorButton,
+                                        icon: Renew,
+                                    }, link: {
+                                        href: '',
+                                        label: '',
+                                    } })) : earlyAccessFeatures.length === 0 ? (_jsx("div", { style: {
+                                        borderTop: '1px solid var(--cds-border-subtle)',
+                                    }, children: _jsx("p", { style: {
+                                            marginTop: '12px',
+                                            color: 'var(--cds-text-helper)',
+                                        }, children: text.earlyAccess.emptyState }) })) : (_jsx("div", { style: {
+                                        display: 'flex',
+                                        flexDirection: 'column',
+                                        overflowX: 'auto',
+                                    }, children: _jsx(C3DataTable, { headers: headers, data: tableData, isLoading: false, queryPrefix: 'management-settings' }) })), !hasAcceptedBetaTerms && permissions.mayOptInToBeta && (_jsx(Button, { style: { marginTop: '16px' }, onClick: onOptInToBeta, size: 'md', children: text.earlyAccess.optInButton }))] })] }) }))] }));
+    return component;
+};

package/lib/esm/components/c4-management-settings/c4-management-settings.types.d.ts

@@ -0,0 +1,77 @@
+export interface EarlyAccessFeature {
+    id: string;
+    name: string;
+    description: string;
+    documentationLink: string;
+    availableIn: string;
+    enabled: boolean;
+    requiresClickwrap: boolean;
+    hasAcceptedFeatureTerms: boolean;
+    clickwrapId?: string;
+}
+export interface C4ManagementSettingsProps {
+    orgId: string;
+    organizationName: string;
+    hasAcceptedBetaTerms: boolean;
+    suppressDropDisks: boolean;
+    earlyAccessFeatures: EarlyAccessFeature[];
+    recentlyAcceptedBeta: boolean;
+    loading: boolean;
+    error: boolean;
+    permissions: {
+        mayLeaveOrganization: boolean;
+        mayDeleteOrganization: boolean;
+        maySuppressDropDisks: boolean;
+        mayToggleEarlyAccessFeatures: boolean;
+        mayOptInToBeta: boolean;
+    };
+    onLeaveOrganization: () => void;
+    onDeleteOrganization: () => void;
+    onToggleSuppressDropDisks: () => void;
+    onToggleEarlyAccessFeature: (featureId: string) => void;
+    onOptInToBeta: () => void;
+    onOpenFeatureOptIn: (featureId: string) => void;
+    onShareFeedback: () => void;
+    onRetry: () => void;
+    text: {
+        leaveOrganization: {
+            title: string;
+            consequence: string;
+            regainAccess: string;
+            buttonLabel: string;
+        };
+        suppressDropDisks: {
+            title: string;
+            description: string;
+        };
+        deleteOrganization: {
+            title: string;
+            consequence: string;
+            buttonLabel: string;
+        };
+        earlyAccess: {
+            title: string;
+            description0: string;
+            description1: string;
+            learnMoreLabel: string;
+            optInButton: string;
+            optInNotificationTitle: string;
+            optInNotificationText: string;
+            optInNotificationFeedback: string;
+            emptyState: string;
+            errorTitle: string;
+            errorMessage: string;
+            errorButton: string;
+            viewDocsLabel: string;
+            optInToEnableLabel: string;
+            columns: {
+                name: string;
+                availableIn: string;
+                description: string;
+                documentation: string;
+                status: string;
+            };
+        };
+    };
+    earlyAccessDocsUrl: string;
+}

package/lib/esm/components/c4-management-settings/c4-management-settings.types.js

@@ -0,0 +1,6 @@
+/*
+ * Copyright Camunda Services GmbH and/or licensed to Camunda Services GmbH
+ * under one or more contributor license agreements. Licensed under a commercial license.
+ * You may not use this file except in compliance with the commercial license.
+ */
+export {};

package/lib/esm/components/c4-management-users/c4-management-users.d.ts

@@ -0,0 +1,3 @@
+import type { JSX } from 'react';
+import type { C4ManagementUsersProps } from './c4-management-users.types';
+export declare const C4ManagementUsers: ({ users, loading, headers, actions, toolbar, banner, }: C4ManagementUsersProps) => JSX.Element;

package/lib/esm/components/c4-management-users/c4-management-users.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/*
+ * Copyright Camunda Services GmbH and/or licensed to Camunda Services GmbH
+ * under one or more contributor license agreements. Licensed under a commercial license.
+ * You may not use this file except in compliance with the commercial license.
+ */
+import { C3DataTable } from '@camunda/camunda-composite-components';
+import { Stack } from '@carbon/react';
+import { C4ActionableNotification } from '../c4-actionable-notification/c4-actionable-notification.js';
+export const C4ManagementUsers = ({ users, loading, headers, actions, toolbar, banner, }) => {
+    const bannerNotification = banner.show ? (_jsx(C4ActionableNotification, { kind: 'info', title: '', subtitle: banner.subtitle, actionButtonLabel: banner.actionButtonLabel, onActionButtonClick: banner.onActionClick, lowContrast: false })) : null;
+    const dataTable = (_jsx(C3DataTable, { headers: headers, data: users, actions: actions, toolbar: toolbar, title: 'Users', isLoading: loading, options: {
+            actionsUseOverflowMenuMinItems: 2,
+        }, queryPrefix: 'management-users' }));
+    const component = (_jsxs(Stack, { gap: 3, children: [bannerNotification, _jsx("div", { style: { display: 'flex', flexDirection: 'column', overflowX: 'auto' }, children: dataTable })] }));
+    return component;
+};

package/lib/esm/components/c4-management-users/c4-management-users.types.d.ts

@@ -0,0 +1,23 @@
+import type { C3DataTableActionProps, C3DataTableHeadersProps, C3DataTableToolbarProps, RowBaseProps } from '@camunda/camunda-composite-components';
+export interface UserDataTableRow extends RowBaseProps {
+    name: string;
+    email: string;
+    roles: string;
+    rolesArray: string[];
+    userId: string | null;
+    inviteId?: string;
+    pendingInvite: boolean;
+}
+export interface C4ManagementUsersProps {
+    users: UserDataTableRow[];
+    loading: boolean;
+    headers: C3DataTableHeadersProps<UserDataTableRow>[];
+    actions: C3DataTableActionProps<UserDataTableRow>[];
+    toolbar: C3DataTableToolbarProps<UserDataTableRow>[];
+    banner: {
+        show: boolean;
+        subtitle: string;
+        actionButtonLabel: string;
+        onActionClick: () => void;
+    };
+}

package/lib/esm/components/c4-management-users/c4-management-users.types.js

@@ -0,0 +1,6 @@
+/*
+ * Copyright Camunda Services GmbH and/or licensed to Camunda Services GmbH
+ * under one or more contributor license agreements. Licensed under a commercial license.
+ * You may not use this file except in compliance with the commercial license.
+ */
+export {};

package/lib/esm/components/c4-multi-step-modal/c4-multi-step-modal.d.ts

@@ -0,0 +1,3 @@
+import { type JSX } from 'react';
+import type { C4MultiStepModalProps } from './c4-multi-step-modal.types';
+export declare const C4MultiStepModal: ({ title, subtitle, steps, isOpen, onClose, preventCloseOnClickOutside, }: C4MultiStepModalProps) => JSX.Element;

package/lib/esm/components/c4-multi-step-modal/c4-multi-step-modal.js

@@ -0,0 +1,48 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/*
+ * Copyright Camunda Services GmbH and/or licensed to Camunda Services GmbH
+ * under one or more contributor license agreements. Licensed under a commercial license.
+ * You may not use this file except in compliance with the commercial license.
+ */
+import { Button, ComposedModal, InlineLoading, InlineNotification, ModalBody, ModalFooter, ModalHeader, ProgressIndicator, ProgressStep, Stack, } from '@carbon/react';
+import { useState } from 'react';
+export const C4MultiStepModal = ({ title, subtitle, steps, isOpen, onClose, preventCloseOnClickOutside, }) => {
+    const [step, setStep] = useState(0);
+    const [error, setError] = useState('');
+    const [asyncWork, setAsyncWork] = useState(false);
+    const currentStep = steps[step];
+    const { primary, secondary } = currentStep.actions;
+    const component = (_jsxs(ComposedModal, { open: isOpen, onClose: onClose, preventCloseOnClickOutside: preventCloseOnClickOutside ?? false, children: [_jsx(ModalHeader, { title: title, label: subtitle }), _jsx(ModalBody, { children: _jsxs(Stack, { gap: 8, children: [_jsx(ProgressIndicator, { currentIndex: step, spaceEqually: true, children: steps.map((step, index) => (_jsx(ProgressStep, { label: step.title, secondaryLabel: step.subtitle }, index))) }), currentStep.content, error.length > 0 && (_jsx(InlineNotification, { kind: 'error', title: 'Error', subtitle: error }))] }) }), _jsxs(ModalFooter, { children: [_jsx(Button, { kind: secondary.kind, disabled: asyncWork || secondary.disabled, onClick: () => {
+                            if (step > 0) {
+                                setError('');
+                                setStep(step - 1);
+                            }
+                            secondary.onClick(step);
+                        }, children: secondary.label }), _jsx(Button, { kind: primary.kind, disabled: asyncWork || primary.disabled, onClick: async () => {
+                            const valid = primary.validate
+                                ? primary.validate()
+                                : { isValid: true, message: '' };
+                            if (valid.isValid) {
+                                setError('');
+                                if (primary.isAsync) {
+                                    setAsyncWork(true);
+                                }
+                                try {
+                                    await primary.onClick(step);
+                                    if (primary.isAsync) {
+                                        setAsyncWork(false);
+                                    }
+                                    if (step < steps.length - 1) {
+                                        setStep(step + 1);
+                                    }
+                                }
+                                catch (error) {
+                                    setError(String(error));
+                                }
+                            }
+                            else {
+                                setError(valid.message);
+                            }
+                        }, children: asyncWork ? _jsx(InlineLoading, {}) : primary.label })] })] }));
+    return component;
+};

package/lib/esm/components/c4-multi-step-modal/c4-multi-step-modal.types.d.ts

@@ -0,0 +1,31 @@
+import type { JSX } from 'react';
+interface C4MultiStepModalAction {
+    label: string;
+    kind: any;
+    onClick: (step: number) => Promise<void>;
+    isAsync?: boolean;
+    validate?: () => {
+        isValid: boolean;
+        message: string;
+    };
+    disabled?: boolean;
+}
+export interface C4MultiStepModalContent {
+    title: string;
+    subtitle?: string;
+    content: JSX.Element;
+    actions: {
+        primary: C4MultiStepModalAction;
+        secondary: C4MultiStepModalAction;
+        tertiary?: C4MultiStepModalAction;
+    };
+}
+export interface C4MultiStepModalProps {
+    title: string;
+    subtitle?: string;
+    isOpen: boolean;
+    steps: C4MultiStepModalContent[];
+    onClose: () => void;
+    preventCloseOnClickOutside?: boolean;
+}
+export {};

package/lib/esm/components/c4-multi-step-modal/c4-multi-step-modal.types.js

@@ -0,0 +1,6 @@
+/*
+ * Copyright Camunda Services GmbH and/or licensed to Camunda Services GmbH
+ * under one or more contributor license agreements. Licensed under a commercial license.
+ * You may not use this file except in compliance with the commercial license.
+ */
+export {};

package/lib/esm/components/c4-multi-step-modal-ugly/c4-multi-step-modal-ugly.d.ts

@@ -0,0 +1,2 @@
+import type { C4MultiStepUglyModalProps } from './c4-multi-step-modal-ugly.types';
+export declare const C4MultiStepUglyModal: ({ open, steps, onClose, }: C4MultiStepUglyModalProps) => import("react/jsx-runtime").JSX.Element | null;

package/lib/esm/components/c4-multi-step-modal-ugly/c4-multi-step-modal-ugly.js

@@ -0,0 +1,45 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/*
+ * Copyright Camunda Services GmbH and/or licensed to Camunda Services GmbH
+ * under one or more contributor license agreements. Licensed under a commercial license.
+ * You may not use this file except in compliance with the commercial license.
+ */
+import { Button, ButtonSet, ComposedModal, InlineLoading, InlineNotification, ModalBody, ModalFooter, ModalHeader, } from '@carbon/react';
+import { useState } from 'react';
+export const C4MultiStepUglyModal = ({ open, steps, onClose, }) => {
+    const [currentStep, setCurrentStep] = useState(1);
+    const [error, setError] = useState('');
+    const [loadingStatus, setLoadingStatus] = useState('inactive');
+    const [activeButtonClickIndex, setActiveButtonClickIndex] = useState(-1);
+    const step = steps[currentStep - 1];
+    if (!step) {
+        return null;
+    }
+    const buttons = step?.buttons ?? [];
+    return (_jsxs(ComposedModal, { open: open, size: 'sm', onClose: onClose, preventCloseOnClickOutside: true, children: [_jsx(ModalHeader, { title: step.title, label: typeof step.label === 'function'
+                    ? step.label(currentStep)
+                    : step.label }), _jsxs(ModalBody, { children: [step.content, error.length > 0 && (_jsx(InlineNotification, { kind: 'error', title: 'Error', subtitle: error }))] }), _jsx(ModalFooter, { children: _jsx(ButtonSet, { style: { width: '100%' }, children: buttons.map((button, index) => {
+                        return (_jsx(Button, { kind: button.kind, onClick: async () => {
+                                setError('');
+                                setLoadingStatus('active');
+                                setActiveButtonClickIndex(index);
+                                let step = currentStep;
+                                try {
+                                    step = await button.onClick(currentStep);
+                                    setLoadingStatus('inactive');
+                                }
+                                catch (e) {
+                                    setError(String(e));
+                                    setLoadingStatus('error');
+                                }
+                                finally {
+                                    setCurrentStep(Math.min(Math.max(step, 1), steps.length));
+                                    setActiveButtonClickIndex(-1);
+                                }
+                            }, disabled: button.disabled || loadingStatus === 'active', size: 'xl', style: {
+                                flex: 1,
+                                maxInlineSize: '100%',
+                            }, children: loadingStatus === 'active' &&
+                                activeButtonClickIndex === index ? (_jsx(InlineLoading, {})) : (button.label) }, index));
+                    }) }) })] }));
+};

package/lib/esm/components/c4-multi-step-modal-ugly/c4-multi-step-modal-ugly.types.d.ts

@@ -0,0 +1,18 @@
+export type C4MultiStepButton = {
+    label: string;
+    onClick: (currentStep: number) => number;
+    kind: string;
+    disabled?: boolean;
+    type?: string;
+};
+export type Step = {
+    content: React.ReactNode;
+    buttons: C4MultiStepButton[];
+    title?: string;
+    label?: ((currentStep: number) => string) | string;
+};
+export type C4MultiStepUglyModalProps = {
+    steps: Step[];
+    open: boolean;
+    onClose: () => void;
+};

package/lib/esm/components/c4-multi-step-modal-ugly/c4-multi-step-modal-ugly.types.js

@@ -0,0 +1,6 @@
+/*
+ * Copyright Camunda Services GmbH and/or licensed to Camunda Services GmbH
+ * under one or more contributor license agreements. Licensed under a commercial license.
+ * You may not use this file except in compliance with the commercial license.
+ */
+export {};

package/lib/esm/components/c4-number-input/c4-number-input.d.ts

@@ -0,0 +1,2 @@
+import type { C4NumberInputProps } from './c4-number-input.types';
+export declare const C4NumberInput: ({ label, min, max, step, value, invalid, invalidText, disabled, onChange, }: C4NumberInputProps) => import("react/jsx-runtime").JSX.Element;

package/lib/esm/components/c4-number-input/c4-number-input.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/*
+ * Copyright Camunda Services GmbH and/or licensed to Camunda Services GmbH
+ * under one or more contributor license agreements. Licensed under a commercial license.
+ * You may not use this file except in compliance with the commercial license.
+ */
+import { NumberInput } from '@carbon/react';
+import { useEffect, useState } from 'react';
+export const C4NumberInput = ({ label, min, max, step, value, invalid, invalidText, disabled, onChange, }) => {
+    const [internalValue, setInternalValue] = useState(value ?? '');
+    useEffect(() => {
+        setInternalValue(value ?? '');
+    }, [value]);
+    return (_jsx(NumberInput, { "data-modal-primary-focus": true, id: `limit-input-${Math.floor(Math.random() * 1000)}`, label: label ?? '', iconDescription: '', min: min, max: max, step: step, invalid: invalid, invalidText: invalid ? (invalidText ?? '') : '', disabled: disabled, allowEmpty: true, value: internalValue, onChange: (_value, changeData) => {
+            const data = changeData;
+            setInternalValue(data.value ?? '');
+            if (data.value !== '') {
+                onChange(data.value);
+            }
+        } }));
+};

package/lib/esm/components/c4-number-input/c4-number-input.types.d.ts

@@ -0,0 +1,11 @@
+export interface C4NumberInputProps {
+    label: string;
+    min?: number;
+    max?: number;
+    invalid?: boolean;
+    invalidText?: string;
+    disabled?: boolean;
+    step: number;
+    value: number;
+    onChange: (value: number) => void;
+}

package/lib/esm/components/c4-number-input/c4-number-input.types.js

@@ -0,0 +1,6 @@
+/*
+ * Copyright Camunda Services GmbH and/or licensed to Camunda Services GmbH
+ * under one or more contributor license agreements. Licensed under a commercial license.
+ * You may not use this file except in compliance with the commercial license.
+ */
+export {};

package/lib/esm/components/c4-old-dashboard/c4-old-dashboard.d.ts

@@ -0,0 +1,3 @@
+import type { JSX } from 'react';
+import type { C4OldDashboardProps } from './c4-old-dashboard.types';
+export declare const C4OldDashboard: ({ usersAmount, invitationsAmount, clustersAmount, healthyClustersAmount, updateAvailable, permissions, actions, urls, texts, displayFirstCTA, }: C4OldDashboardProps) => JSX.Element;

package/lib/esm/components/c4-old-dashboard/c4-old-dashboard.js

@@ -0,0 +1,62 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/*
+ * Copyright Camunda Services GmbH and/or licensed to Camunda Services GmbH
+ * under one or more contributor license agreements. Licensed under a commercial license.
+ * You may not use this file except in compliance with the commercial license.
+ */
+import { C3ResponsiveStack } from '@camunda/camunda-composite-components';
+import { Button, Link, ListItem, OrderedList, Stack, Tile } from '@carbon/react';
+export const C4OldDashboard = ({ usersAmount, invitationsAmount, clustersAmount, healthyClustersAmount, updateAvailable, permissions, actions, urls, texts, displayFirstCTA = true, }) => {
+    const welcomeTile = (_jsx(Tile, { children: _jsxs(Stack, { gap: 6, children: [_jsxs("h3", { children: [texts.welcome.title, _jsx("span", { id: 'welcomeHeader' })] }), _jsx("div", { dangerouslySetInnerHTML: { __html: texts.welcome.text } }), _jsxs(OrderedList, { style: { marginLeft: '3rem' }, children: [_jsx(ListItem, { children: _jsx("div", { dangerouslySetInnerHTML: { __html: texts.welcome.item1 } }) }), _jsx(ListItem, { children: _jsx("div", { dangerouslySetInnerHTML: { __html: texts.welcome.item2 } }) }), _jsx(ListItem, { children: _jsx("div", { dangerouslySetInnerHTML: { __html: texts.welcome.item3 } }) })] }), _jsx("div", { children: _jsxs(C3ResponsiveStack, { orientation: 'horizontal', gap: 6, children: [displayFirstCTA && (_jsx(Button, { onClick: actions.onModelProcess, id: 'modelAProcess', children: texts.welcome.cta })), _jsx(Button, { onClick: actions.onGettingStartedGuide, id: 'gettingStartedGuide', kind: 'tertiary', children: texts.welcome.gsg }), _jsx(Button, { onClick: actions.onWatchDemo, id: 'gettingStartedAcademy', kind: 'tertiary', children: texts.welcome.watchADemo })] }) })] }) }));
+    const usersTile = permissions.showUsers && (_jsx(Tile, { style: {
+            height: '100%',
+        }, children: _jsxs(Stack, { gap: 6, children: [_jsxs("div", { style: {
+                        display: 'grid',
+                        justifyContent: 'space-between',
+                        gridAutoFlow: 'column',
+                        alignItems: 'center',
+                    }, children: [_jsx("h3", { children: texts.users.title }), permissions.showMembersLink && (_jsx(Link, { href: urls.users, onClick: (e) => {
+                                e.preventDefault();
+                                actions.onNavigateToUsers();
+                            }, title: texts.users.viewAll, children: texts.users.viewAll }))] }), _jsx("div", { children: usersAmount <= 1 ? (_jsx("div", { children: _jsx("div", { dangerouslySetInnerHTML: {
+                                __html: texts.users.alone
+                                    .replace('<1>', '<button type="button" class="cds--btn cds--btn--tertiary cds--btn--md">')
+                                    .replace('</1>', '</button>'),
+                            }, onClick: (e) => {
+                                if (e.target.tagName === 'BUTTON') {
+                                    actions.onInviteUser();
+                                }
+                            } }) })) : (_jsx("div", { children: texts.users.text
+                            .replace('{{usersAmount}}', usersAmount.toString())
+                            .replace('{{pluralize}}', usersAmount === 1 ? texts.users.user : texts.users.users) })) }), _jsx("p", { children: usersAmount > 1 ? (invitationsAmount === 0 ? (texts.users.noInvitations) : invitationsAmount === 1 ? (texts.users.oneInvitation) : (texts.users.multipleInvitations.replace('{{amount}}', invitationsAmount.toString()))) : (_jsx(_Fragment, {})) })] }) }));
+    const clustersTile = (_jsx(Tile, { children: _jsxs(Stack, { gap: 6, children: [_jsxs("div", { style: {
+                        display: 'grid',
+                        justifyContent: 'space-between',
+                        gridAutoFlow: 'column',
+                        alignItems: 'center',
+                    }, children: [_jsx("h3", { children: texts.clusters.title }), _jsx(Link, { href: urls.clusters, onClick: (e) => {
+                                e.preventDefault();
+                                actions.onNavigateToClusters();
+                            }, title: texts.clusters.viewAll, children: texts.clusters.viewAll })] }), _jsx("p", { children: clustersAmount === 0
+                        ? texts.clusters.noClusters
+                        : clustersAmount === 1
+                            ? texts.clusters.oneCluster
+                            : texts.clusters.multipleClusters.replace('{{variable}}', clustersAmount.toString()) }), clustersAmount === 0 ? (_jsx("div", { children: _jsx(Button, { kind: 'tertiary', size: 'md', onClick: actions.onCreateCluster, children: texts.clusters.createACluster }) })) : (_jsx(_Fragment, {})), clustersAmount > 0 ? (_jsx("p", { dangerouslySetInnerHTML: {
+                        __html: texts.clusters.status
+                            .replace('<0>', '<strong>')
+                            .replace('</0>', '</strong>')
+                            .replace('{{variable}}', healthyClustersAmount === clustersAmount
+                            ? texts.clusters.all
+                            : healthyClustersAmount.toString()),
+                    } })) : null, updateAvailable ? (_jsx(Button, { kind: 'tertiary', size: 'md', onClick: actions.onNavigateToClusters, children: texts.clusters.updateAvailable })) : null] }) }));
+    const component = (_jsxs("div", { style: {
+            display: 'flex',
+            flexDirection: 'column',
+            gap: '30px',
+        }, children: [welcomeTile, _jsxs("div", { style: {
+                    display: 'grid',
+                    gridTemplateColumns: 'repeat(auto-fit, minmax(320px, calc(50% - 15px)))',
+                    gap: '30px',
+                }, children: [usersTile, clustersTile] })] }));
+    return component;
+};

package/lib/esm/components/c4-old-dashboard/c4-old-dashboard.types.d.ts

@@ -0,0 +1,60 @@
+export interface C4OldDashboardProps {
+    usersAmount: number;
+    invitationsAmount: number;
+    clustersAmount: number;
+    healthyClustersAmount: number;
+    updateAvailable: boolean;
+    permissions: {
+        showUsers: boolean;
+        showMembersLink: boolean;
+    };
+    actions: {
+        onModelProcess: () => void;
+        onGettingStartedGuide: () => void;
+        onWatchDemo: () => void;
+        onInviteUser: () => void;
+        onCreateCluster: () => void;
+        onNavigateToClusters: () => void;
+        onNavigateToUsers: () => void;
+    };
+    urls: {
+        users: string;
+        clusters: string;
+    };
+    texts: {
+        welcome: {
+            title: string;
+            text: string;
+            item1: string;
+            item2: string;
+            item3: string;
+            cta: string;
+            gsg: string;
+            watchADemo: string;
+        };
+        users: {
+            title: string;
+            viewAll: string;
+            alone: string;
+            text: string;
+            user: string;
+            users: string;
+            noInvitations: string;
+            oneInvitation: string;
+            multipleInvitations: string;
+        };
+        clusters: {
+            title: string;
+            viewAll: string;
+            amount: string;
+            status: string;
+            all: string;
+            updateAvailable: string;
+            createACluster: string;
+            noClusters: string;
+            oneCluster: string;
+            multipleClusters: string;
+        };
+    };
+    displayFirstCTA?: boolean;
+}

package/lib/esm/components/c4-old-dashboard/c4-old-dashboard.types.js

@@ -0,0 +1,6 @@
+/*
+ * Copyright Camunda Services GmbH and/or licensed to Camunda Services GmbH
+ * under one or more contributor license agreements. Licensed under a commercial license.
+ * You may not use this file except in compliance with the commercial license.
+ */
+export {};