@datalayer/core 1.0.24 → 1.1.41

package/lib/models/index.js

@@ -32,28 +32,17 @@
  *
  * @module models
  */
-export * from './Assignment.js';
 export * from './Base.js';
-export * from './Cell.js';
-export * from './CodeBlock.js';
-export * from './CodefeedBlocks.js';
 export * from './Common.js';
 export * from './Contact.js';
 export * from './ContactEvent.js';
 export * from './ContactIAMProvider.js';
 export * from './ContactTags.js';
-export * from './Content.js';
-export * from './Course.js';
 export * from './Credits.js';
 export * from './CreditsDTO.js';
-export * from './Dataset.js';
 export * from './Datasource.js';
 export * from './Dean.js';
-export * from './Document.js';
-export * from './Environment.js';
-export * from './EnvironmentDTO.js';
 export * from './Errors.js';
-export * from './Exercise.js';
 export * from './GrowthKPI.js';
 export * from './IAM.js';
 export * from './IAMProviderLinked.js';
@@ -64,38 +53,19 @@ export * from './IAMToken.js';
 export * from './Inbound.js';
 export * from './Instructor.js';
 export * from './Invite.js';
-export * from './Item.js';
-export * from './ItemDTO.js';
-export * from './ItemType.js';
 export * from './LandingRoles.js';
-export * from './Lesson.js';
-export * from './LexicalDTO.js';
-export * from './Library.js';
 export * from './Member.js';
-export * from './Notebook.js';
-export * from './NotebookDTO.js';
 export * from './Organization.js';
 export * from './OrganizationMember.js';
 export * from './Outbound.js';
-export * from './Page.js';
-export * from './PageTag.js';
 export * from './Profile.js';
 export * from './Role.js';
 export * from './RolesOrganization.js';
 export * from './RolesPlatform.js';
 export * from './RolesTeam.js';
-export * from './Runtime.js';
-export * from './RuntimeDTO.js';
-export * from './CodeSandboxSnapshot.js';
-export * from './CodeSandboxSnapshotDTO.js';
 export * from './School.js';
 export * from './Secret.js';
-export * from './Space.js';
-export * from './SpaceDTO.js';
-export * from './SpaceItem.js';
-export * from './SpaceMember.js';
 export * from './Student.js';
-export * from './StudentItem.js';
 export * from './Survey.js';
 export * from './Team.js';
 export * from './TeamMember.js';

package/lib/routes/index.d.ts

@@ -1 +1,2 @@
 export * from './Routes';
+export * from './publicPaths';

package/lib/routes/index.js

@@ -3,3 +3,4 @@
  * Distributed under the terms of the Modified BSD License.
  */
 export * from './Routes.js';
+export * from './publicPaths.js';

package/lib/routes/publicPaths.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Canonical, single source of truth for the public route prefixes that
+ * anonymous (logged-out) users are allowed to view.
+ *
+ * This list is shared across packages so the various auth gates stay in sync:
+ * - `useUser` (core) must NOT force a navigation to the login page on these.
+ * - The application router uses it to decide whether a route requires auth.
+ *
+ * Keep the entries as normalized prefixes (lowercase, no trailing slash).
+ */
+export declare const PUBLIC_PATH_PREFIXES: readonly string[];
+/**
+ * Normalize a pathname for prefix matching: strip the query string and hash,
+ * trim surrounding whitespace, lowercase, and remove any trailing slash.
+ * Always returns a leading-slash path (defaults to '/').
+ */
+export declare const normalizePathname: (pathname: string) => string;
+/**
+ * Whether the given pathname is under one of the public path prefixes and is
+ * therefore viewable by anonymous users without an authentication redirect.
+ */
+export declare const isPublicPath: (pathname: string) => boolean;
+export default isPublicPath;

package/lib/routes/publicPaths.js

@@ -0,0 +1,74 @@
+/*
+ * Copyright (c) 2023-2025 Datalayer, Inc.
+ * Distributed under the terms of the Modified BSD License.
+ */
+/**
+ * Canonical, single source of truth for the public route prefixes that
+ * anonymous (logged-out) users are allowed to view.
+ *
+ * This list is shared across packages so the various auth gates stay in sync:
+ * - `useUser` (core) must NOT force a navigation to the login page on these.
+ * - The application router uses it to decide whether a route requires auth.
+ *
+ * Keep the entries as normalized prefixes (lowercase, no trailing slash).
+ */
+export const PUBLIC_PATH_PREFIXES = [
+    '/about',
+    '/agents',
+    '/agentspecs',
+    '/blog',
+    '/careers',
+    '/community',
+    '/compare',
+    '/connect',
+    '/contact',
+    '/dataliens',
+    '/docs',
+    '/events',
+    '/features',
+    '/integrations',
+    '/join/confirm/user',
+    '/library',
+    '/outbounds/contacts/unsubscribe',
+    '/outbounds/invites/pages',
+    '/outbounds/invites/unsubscribe',
+    '/outbounds/users/unsubscribe',
+    '/partners',
+    '/password',
+    '/pricing',
+    '/privacy',
+    '/public',
+    '/releases',
+    '/reports',
+    '/research',
+    '/search',
+    '/settings/agentspecs',
+    '/signup/confirm/user',
+    '/support',
+    '/team',
+    '/terms',
+    '/testimonials',
+    '/trust',
+    '/tutorials',
+    '/usecases',
+    '/use-cases',
+];
+/**
+ * Normalize a pathname for prefix matching: strip the query string and hash,
+ * trim surrounding whitespace, lowercase, and remove any trailing slash.
+ * Always returns a leading-slash path (defaults to '/').
+ */
+export const normalizePathname = (pathname) => {
+    const path = (pathname || '').split('?')[0]?.split('#')[0] || '/';
+    const normalized = path.trim().toLowerCase().replace(/\/+$/, '');
+    return normalized || '/';
+};
+/**
+ * Whether the given pathname is under one of the public path prefixes and is
+ * therefore viewable by anonymous users without an authentication redirect.
+ */
+export const isPublicPath = (pathname) => {
+    const normalized = normalizePathname(pathname);
+    return PUBLIC_PATH_PREFIXES.some(prefix => normalized === prefix || normalized.startsWith(`${prefix}/`));
+};
+export default isPublicPath;

package/lib/state/State.d.ts

@@ -1,13 +1,7 @@
 import { coreStore } from './substates/CoreState';
-import { cellStore } from './substates/CellState';
-import { documentStore } from './substates/DocumentState';
-import { gradeStore } from './substates/GradeState';
 import { iamStore } from './substates/IAMState';
-import { runtimesStore } from './substates/RuntimesState';
 import { layoutStore } from './substates/LayoutState';
-import { nbformatStore } from './substates/NbformatState';
 import { organizationStore } from './substates/OrganizationState';
-import { spaceStore } from './substates/SpaceState';
 import { surveysStore } from './substates/SurveysState';
 import { teamStore } from './substates/TeamState';
 export type DatalayerRunState = {
@@ -15,15 +9,9 @@ export type DatalayerRunState = {
     setVersion: (version: string) => void;
     isDev: boolean;
     core: typeof coreStore.getState;
-    cell: typeof cellStore.getState;
-    document: typeof documentStore.getState;
-    grade: typeof gradeStore.getState;
     iam: typeof iamStore.getState;
-    runtimes: typeof runtimesStore.getState;
     layout: typeof layoutStore.getState;
-    nbformat: typeof nbformatStore.getState;
     organization: typeof organizationStore.getState;
-    space: typeof spaceStore.getState;
     success: typeof surveysStore.getState;
     team: typeof teamStore.getState;
 };

package/lib/state/State.js

@@ -5,15 +5,9 @@
 import { createStore } from 'zustand/vanilla';
 import { useStore } from 'zustand';
 import { coreStore } from './substates/CoreState.js';
-import { cellStore } from './substates/CellState.js';
-import { documentStore } from './substates/DocumentState.js';
-import { gradeStore } from './substates/GradeState.js';
 import { iamStore } from './substates/IAMState.js';
-import { runtimesStore } from './substates/RuntimesState.js';
 import { layoutStore } from './substates/LayoutState.js';
-import { nbformatStore } from './substates/NbformatState.js';
 import { organizationStore } from './substates/OrganizationState.js';
-import { spaceStore } from './substates/SpaceState.js';
 import { surveysStore } from './substates/SurveysState.js';
 import { teamStore } from './substates/TeamState.js';
 import { isDevDeployment } from '../utils/index.js';
@@ -26,15 +20,9 @@ export const runStore = createStore((set, get) => ({
     },
     isDev: isDevDeployment(),
     core: coreStore.getState,
-    cell: cellStore.getState,
-    document: documentStore.getState,
-    grade: gradeStore.getState,
     iam: iamStore.getState,
-    runtimes: runtimesStore.getState,
     layout: layoutStore.getState,
-    nbformat: nbformatStore.getState,
     organization: organizationStore.getState,
-    space: spaceStore.getState,
     success: surveysStore.getState,
     team: teamStore.getState,
 }));

package/lib/state/substates/CoreState.js

@@ -4,7 +4,7 @@
  */
 import { createStore } from 'zustand/vanilla';
 import { useStore } from 'zustand';
-import { configLogger } from '../../utils/logger.js';
+import { configLogger } from '../../utils/Logger.js';
 let loadConfigurationFromServer = true;
 let initialConfiguration = {
     runUrl: 'https://prod1.datalayer.run',

package/lib/state/substates/LayoutState.d.ts

@@ -1,5 +1,16 @@
 import { ReactPortal } from 'react';
-import { IAnyOrganization, IAnySpace, IAnyTeam, ISpaceItem } from '../../models';
+import { IAnyOrganization, IAnyTeam } from '../../models';
+/**
+ * Structural placeholder for a space in the layout state. The concrete space
+ * models live in the runtime/content package (`@datalayer/agent-runtimes`);
+ * the core layout store keeps them loosely typed to avoid depending on the
+ * content models.
+ */
+type IAnySpace = Record<string, any>;
+/**
+ * Structural placeholder for a space item in the layout state. See IAnySpace.
+ */
+type ISpaceItem = Record<string, any>;
 export type BannerDisplayVariant = 'danger' | 'info' | 'success' | 'warning';
 export type LeftSidebarVariant = 'codefeed' | 'course' | 'empty' | 'guess-account' | 'guess-space' | 'guess-spaces' | 'organization' | 'organization-space' | 'organization-spaces' | 'organizations' | 'public' | 'unchanged' | 'user' | 'user-space' | 'user-spaces';
 export type BackdropDisplay = {

package/lib/state/substates/index.d.ts

@@ -1,14 +1,7 @@
-export * from './CellState';
 export * from './CoreState';
 export * from './DatasourceState';
-export * from './DocumentState';
-export * from './GradeState';
 export * from './IAMState';
-export * from './JupyterLabState';
 export * from './LayoutState';
-export * from './NbformatState';
 export * from './OrganizationState';
-export * from './RuntimesState';
-export * from './SpaceState';
 export * from './SurveysState';
 export * from './TeamState';

package/lib/state/substates/index.js

@@ -2,17 +2,10 @@
  * Copyright (c) 2023-2025 Datalayer, Inc.
  * Distributed under the terms of the Modified BSD License.
  */
-export * from './CellState.js';
 export * from './CoreState.js';
 export * from './DatasourceState.js';
-export * from './DocumentState.js';
-export * from './GradeState.js';
 export * from './IAMState.js';
-export * from './JupyterLabState.js';
 export * from './LayoutState.js';
-export * from './NbformatState.js';
 export * from './OrganizationState.js';
-export * from './RuntimesState.js';
-export * from './SpaceState.js';
 export * from './SurveysState.js';
 export * from './TeamState.js';

package/lib/utils/Date.d.ts

@@ -6,6 +6,13 @@ export declare const timeSince: (date: Date) => string;
  * Examples: "just now", "15m ago", "3h ago", "2d ago", "4w ago", "1y ago".
  */
 export declare const formatRelativeTime: (value?: Date | string | number, now?: Date) => string | undefined;
+/**
+ * Build a detailed datetime string suitable for tooltips.
+ *
+ * Example:
+ * "2026-06-08T16:15:32.531Z • Jun 8, 2026, 6:15:32 PM CEST (Europe/Paris)"
+ */
+export declare const formatDateTimeDetails: (value?: Date | string | number) => string | undefined;
 /**
  * Format a duration in milliseconds into a human-readable string.
  *

package/lib/utils/Date.js

@@ -76,24 +76,57 @@ export const formatRelativeTime = (value, now = new Date()) => {
     if (Number.isNaN(ts)) {
         return typeof value === 'string' ? value : undefined;
     }
-    const diffMs = Math.max(0, now.getTime() - ts);
-    const seconds = Math.floor(diffMs / 1000);
-    if (seconds < 60)
-        return 'just now';
-    const minutes = Math.floor(seconds / 60);
+    const diffMs = ts - now.getTime();
+    const inFuture = diffMs > 0;
+    const absSeconds = Math.floor(Math.abs(diffMs) / 1000);
+    if (absSeconds < 30)
+        return inFuture ? 'in a few seconds' : 'just now';
+    const withDirection = (value, unit) => {
+        return inFuture ? `in ${value}${unit}` : `${value}${unit} ago`;
+    };
+    if (absSeconds < 60)
+        return withDirection(absSeconds, 's');
+    const minutes = Math.floor(absSeconds / 60);
     if (minutes < 60)
-        return `${minutes}m ago`;
+        return withDirection(minutes, 'm');
     const hours = Math.floor(minutes / 60);
     if (hours < 24)
-        return `${hours}h ago`;
+        return withDirection(hours, 'h');
     const days = Math.floor(hours / 24);
     if (days < 7)
-        return `${days}d ago`;
+        return withDirection(days, 'd');
     const weeks = Math.floor(days / 7);
     if (weeks < 52)
-        return `${weeks}w ago`;
+        return withDirection(weeks, 'w');
     const years = Math.floor(days / 365);
-    return `${years}y ago`;
+    return withDirection(years, 'y');
+};
+/**
+ * Build a detailed datetime string suitable for tooltips.
+ *
+ * Example:
+ * "2026-06-08T16:15:32.531Z • Jun 8, 2026, 6:15:32 PM CEST (Europe/Paris)"
+ */
+export const formatDateTimeDetails = (value) => {
+    if (value === undefined || value === null) {
+        return undefined;
+    }
+    const date = value instanceof Date
+        ? value
+        : typeof value === 'number'
+            ? new Date(value)
+            : new Date(value);
+    const ts = date.getTime();
+    if (Number.isNaN(ts)) {
+        return typeof value === 'string' ? value : undefined;
+    }
+    const iso = date.toISOString();
+    const zone = Intl.DateTimeFormat().resolvedOptions().timeZone || 'local';
+    const local = new Intl.DateTimeFormat(undefined, {
+        dateStyle: 'medium',
+        timeStyle: 'long',
+    }).format(date);
+    return `${iso} • ${local} (${zone})`;
 };
 /**
  * Format a duration in milliseconds into a human-readable string.

package/lib/utils/Handles.js

@@ -22,7 +22,9 @@ export function formatFriendlyHandle(handle) {
         ? 'GitHub'
         : provider === 'google'
             ? 'Google'
-            : providerRaw || 'External';
+            : provider === 'linkedin'
+                ? 'LinkedIn'
+                : providerRaw || 'External';
     const identifier = restParts.join(':').trim();
     if (!identifier) {
         return providerLabel;

package/lib/utils/index.d.ts

@@ -3,7 +3,6 @@ export * from './Avatar';
 export * from './Browser';
 export * from './cli';
 export * from './Cookie';
-export * from './Cells';
 export * from './Date';
 export * from './Download';
 export * from './DownloadFile';
@@ -15,6 +14,7 @@ export * from './Ids';
 export * from './Jwt';
 export * from './Jupyter';
 export * from './Lazy';
+export * from './Logger';
 export * from './Msc';
 export * from './Name';
 export * from './Notebook';

package/lib/utils/index.js

@@ -7,7 +7,6 @@ export * from './Avatar.js';
 export * from './Browser.js';
 export * from './cli/index.js';
 export * from './Cookie.js';
-export * from './Cells.js';
 export * from './Date.js';
 export * from './Download.js';
 export * from './DownloadFile.js';
@@ -19,6 +18,7 @@ export * from './Ids.js';
 export * from './Jwt.js';
 export * from './Jupyter.js';
 export * from './Lazy.js';
+export * from './Logger.js';
 export * from './Msc.js';
 export * from './Name.js';
 export * from './Notebook.js';

package/lib/views/api-keys/APIKeyEdit.d.ts

@@ -0,0 +1,8 @@
+export type APIKeyEditProps = {
+    /** Route to navigate after delete. Defaults to '/settings/iam/api-keys'. */
+    apiKeysListRoute?: string;
+    /** Whether to render the local edit title header. Defaults to true. */
+    showTitle?: boolean;
+};
+export declare const APIKeyEdit: ({ apiKeysListRoute, showTitle, }?: APIKeyEditProps) => import("react/jsx-runtime").JSX.Element;
+export default APIKeyEdit;

package/lib/views/{iam-tokens/IAMTokenEdit.js → api-keys/APIKeyEdit.js}

@@ -10,20 +10,20 @@ import { Box } from '@datalayer/primer-addons';
 import { BoringAvatar } from '../../components/avatars/index.js';
 import { useCache, useNavigate, useToast } from '../../hooks/index.js';
 import { useRunStore } from '../../state/index.js';
-export const IAMTokenEdit = ({ tokensListRoute = '/settings/iam/tokens', } = {}) => {
-    const { tokenId } = useParams();
+export const APIKeyEdit = ({ apiKeysListRoute = '/settings/iam/api-keys', showTitle = true, } = {}) => {
+    const { tokenId: apiKeyId } = useParams();
     const runStore = useRunStore();
     const navigate = useNavigate();
     const { enqueueToast } = useToast();
-    const { useUpdateToken, useToken, useDeleteToken } = useCache();
-    const getTokenQuery = useToken(tokenId);
-    const updateTokenMutation = useUpdateToken();
-    const deleteTokenMutation = useDeleteToken();
-    const [token, setToken] = useState();
+    const { useUpdateToken: useUpdateAPIKey, useToken: useAPIKey, useDeleteToken: useDeleteAPIKey, } = useCache();
+    const getAPIKeyQuery = useAPIKey(apiKeyId);
+    const updateAPIKeyMutation = useUpdateAPIKey();
+    const deleteAPIKeyMutation = useDeleteAPIKey();
+    const [apiKey, setAPIKey] = useState();
     const [formValues, setFormValues] = useState({
-        name: token?.name,
+        name: apiKey?.name,
         nameConfirm: '',
-        description: token?.description,
+        description: apiKey?.description,
     });
     const [validationResult, setValidationResult] = useState({
         name: undefined,
@@ -31,12 +31,12 @@ export const IAMTokenEdit = ({ tokensListRoute = '/settings/iam/tokens', } = {})
         description: undefined,
     });
     useEffect(() => {
-        if (getTokenQuery.data) {
-            const token = getTokenQuery.data;
-            setToken(token);
-            setFormValues({ ...token, nameConfirm: '' });
+        if (getAPIKeyQuery.data) {
+            const key = getAPIKeyQuery.data;
+            setAPIKey(key);
+            setFormValues({ ...key, nameConfirm: '' });
         }
-    }, [getTokenQuery.data]);
+    }, [getAPIKeyQuery.data]);
     const nameNameChange = (event) => {
         setFormValues(prevFormValues => ({
             ...prevFormValues,
@@ -63,7 +63,7 @@ export const IAMTokenEdit = ({ tokensListRoute = '/settings/iam/tokens', } = {})
                 : formValues.name.length > 2
                     ? true
                     : false,
-            nameConfirm: formValues.nameConfirm === token?.name ? true : false,
+            nameConfirm: formValues.nameConfirm === apiKey?.name ? true : false,
             description: formValues.description === undefined
                 ? undefined
                 : formValues.description.length > 2
@@ -71,20 +71,20 @@ export const IAMTokenEdit = ({ tokensListRoute = '/settings/iam/tokens', } = {})
                     : false,
         });
     }, [formValues]);
-    const nameSubmit = async () => {
+    const submitAPIKey = async () => {
         runStore.layout().showBackdrop();
-        const updatedToken = {
-            ...token,
+        const updatedAPIKey = {
+            ...apiKey,
             name: formValues.name,
             description: formValues.description,
         };
-        updateTokenMutation.mutate(updatedToken, {
+        updateAPIKeyMutation.mutate(updatedAPIKey, {
             onSuccess: (resp) => {
                 if (resp.success) {
-                    enqueueToast('The token is successfully updated.', {
+                    enqueueToast('The API key was updated successfully.', {
                         variant: 'success',
                     });
-                    setToken(updatedToken);
+                    setAPIKey(updatedAPIKey);
                 }
             },
             onSettled: () => {
@@ -92,31 +92,31 @@ export const IAMTokenEdit = ({ tokensListRoute = '/settings/iam/tokens', } = {})
             },
         });
     };
-    const handleDelete = async () => {
-        runStore.layout().showBackdrop('Deleting the token...');
-        deleteTokenMutation.mutate(token.id, {
+    const deleteAPIKey = async () => {
+        runStore.layout().showBackdrop('Deleting the API key...');
+        deleteAPIKeyMutation.mutate(apiKey.id, {
             onSuccess: (resp) => {
                 if (resp.success) {
-                    enqueueToast('The token is successfully deleted.', {
+                    enqueueToast('The API key was deleted successfully.', {
                         variant: 'success',
                     });
-                    navigate(tokensListRoute);
+                    navigate(apiKeysListRoute);
                 }
                 else {
-                    enqueueToast(resp.message || 'Failed to delete token.', {
+                    enqueueToast(resp.message || 'Failed to delete API key.', {
                         variant: 'error',
                     });
                 }
             },
             onError: () => {
-                enqueueToast('Failed to delete token.', { variant: 'error' });
+                enqueueToast('Failed to delete API key.', { variant: 'error' });
             },
             onSettled: () => {
                 runStore.layout().hideBackdrop();
             },
         });
     };
-    return (_jsxs(_Fragment, { children: [_jsx(PageHeader, { children: _jsx(Heading, { sx: { fontSize: 3 }, children: "API Key" }) }), _jsxs(Box, { display: "flex", children: [_jsxs(Box, { children: [_jsx(BoringAvatar, { displayName: token?.name, size: 100, style: { paddingRight: 10 } }), _jsx(Text, { as: "h2", sx: { paddingTop: 3 }, children: token?.name }), _jsx(Box, { mt: 3, children: _jsx(Label, { size: "large", children: token?.variant }) })] }), _jsxs(Box, { ml: 10, children: [_jsxs(Box, { sx: { label: { marginTop: 2 } }, children: [_jsxs(FormControl, { children: [_jsx(FormControl.Label, { children: "Name" }), _jsx(TextInput, { block: true, value: formValues.name, onChange: nameNameChange }), validationResult.name === false && (_jsx(FormControl.Validation, { variant: "error", children: "Name must have more than 2 characters." }))] }), _jsxs(FormControl, { children: [_jsx(FormControl.Label, { children: "Description" }), _jsx(Textarea, { block: true, value: formValues.description, onChange: nameDescriptionChange, rows: 5 }), validationResult.description === false && (_jsx(FormControl.Validation, { variant: "error", children: "Description must have more than 2 characters." }))] }), _jsxs(FormControl, { children: [_jsx(FormControl.Label, { children: "Expiration date" }), _jsx(TextInput, { block: true, value: token?.expirationDate.toLocaleDateString(), onChange: nameNameChange, disabled: true })] }), _jsx(Button, { variant: "primary", disabled: !validationResult.name || !validationResult.description, sx: { marginTop: 3 }, onClick: nameSubmit, children: "Update token" })] }), _jsxs(Box, { sx: { marginTop: 3 }, children: [_jsx(Heading, { as: "h2", sx: {
+    return (_jsxs(_Fragment, { children: [showTitle && (_jsx(PageHeader, { children: _jsx(Heading, { sx: { fontSize: 3 }, children: "API Key" }) })), _jsxs(Box, { display: "flex", children: [_jsxs(Box, { children: [_jsx(BoringAvatar, { displayName: apiKey?.name, size: 100, style: { paddingRight: 10 } }), _jsx(Text, { as: "h2", sx: { paddingTop: 3 }, children: apiKey?.name }), _jsx(Box, { mt: 3, children: _jsx(Label, { size: "large", children: apiKey?.variant }) })] }), _jsxs(Box, { ml: 10, children: [_jsxs(Box, { sx: { label: { marginTop: 2 } }, children: [_jsxs(FormControl, { children: [_jsx(FormControl.Label, { children: "Name" }), _jsx(TextInput, { block: true, value: formValues.name, onChange: nameNameChange }), validationResult.name === false && (_jsx(FormControl.Validation, { variant: "error", children: "Name must have more than 2 characters." }))] }), _jsxs(FormControl, { children: [_jsx(FormControl.Label, { children: "Description" }), _jsx(Textarea, { block: true, value: formValues.description, onChange: nameDescriptionChange, rows: 5 }), validationResult.description === false && (_jsx(FormControl.Validation, { variant: "error", children: "Description must have more than 2 characters." }))] }), _jsxs(FormControl, { children: [_jsx(FormControl.Label, { children: "Expiration date" }), _jsx(TextInput, { block: true, value: apiKey?.expirationDate.toLocaleDateString(), onChange: nameNameChange, disabled: true })] }), _jsx(Button, { variant: "primary", disabled: !validationResult.name || !validationResult.description, sx: { marginTop: 3 }, onClick: submitAPIKey, children: "Update API key" })] }), _jsxs(Box, { sx: { marginTop: 3 }, children: [_jsx(Heading, { as: "h2", sx: {
                                             fontSize: 4,
                                             fontWeight: 'normal',
                                             color: 'danger.fg',
@@ -130,6 +130,6 @@ export const IAMTokenEdit = ({ tokensListRoute = '/settings/iam/tokens', } = {})
                                             alignItems: 'center',
                                             justifyContent: 'space-between',
                                             gap: 3,
-                                        }, children: [_jsxs(Box, { sx: { display: 'grid', gap: 1 }, children: [_jsx(Text, { sx: { fontSize: 1, fontWeight: 'bold', color: 'danger.fg' }, children: "Confirm the token name to delete" }), _jsx(FormControl, { children: _jsx(TextInput, { block: true, value: formValues.nameConfirm, onChange: nameConfirmChange }) }), _jsx(Text, { sx: { fontSize: 1, color: 'fg.muted' }, children: "This operation is not reversible." })] }), _jsx(Button, { variant: "danger", disabled: !validationResult.nameConfirm, onClick: handleDelete, children: "Delete token" })] })] })] })] })] }));
+                                        }, children: [_jsxs(Box, { sx: { display: 'grid', gap: 1 }, children: [_jsx(Text, { sx: { fontSize: 1, fontWeight: 'bold', color: 'danger.fg' }, children: "Confirm the API key name to delete" }), _jsx(FormControl, { children: _jsx(TextInput, { block: true, value: formValues.nameConfirm, onChange: nameConfirmChange }) }), _jsx(Text, { sx: { fontSize: 1, color: 'fg.muted' }, children: "This operation is not reversible." })] }), _jsx(Button, { variant: "danger", disabled: !validationResult.nameConfirm, onClick: deleteAPIKey, children: "Delete API key" })] })] })] })] })] }));
 };
-export default IAMTokenEdit;
+export default APIKeyEdit;

package/lib/views/api-keys/APIKeyNew.d.ts

@@ -0,0 +1,8 @@
+export type APIKeyNewProps = {
+    /** Route to navigate when clicking "List my API keys". Defaults to '/settings/iam/api-keys'. */
+    apiKeysListRoute?: string;
+    /** Whether to render the "New API Key" title header in create mode. Defaults to true. */
+    showTitle?: boolean;
+};
+export declare const APIKeyNew: ({ apiKeysListRoute, showTitle, }?: APIKeyNewProps) => import("react/jsx-runtime").JSX.Element;
+export default APIKeyNew;