@plitzi/plitzi-builder 0.37.9 → 0.38.1

package/dist/config/index.d.ts

@@ -1,6 +1,2 @@
 import { Server } from '@plitzi/sdk-shared';
 export declare const getEnvironmentServer: (server?: Partial<Server>) => Server;
-declare const featureFlag: {
-    assistanceAI: boolean;
-};
-export { featureFlag };

package/dist/index.html

@@ -41,6 +41,8 @@
       <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet" />
     </noscript>
 
+    <link href="https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&family=Geist+Mono:wght@400;500&display=swap" rel="stylesheet" />
+
     <link href="/plitzi-builder.css" rel="preload" as="style" />
     <link href="/plitzi-builder.css" rel="stylesheet" />
   </head>

package/dist/modules/AI/components/ChatMessage/components/{AITemplatePreview/AITemplatePreview.d.ts → AISnippetPreview/AISnippetPreview.d.ts}

@@ -1,6 +1,6 @@
 import { Schema, Style } from '@plitzi/sdk-shared';
 import { AiMode } from '../../../../types';
-export type AITemplatePreviewProps = {
+export type AISnippetPreviewProps = {
     baseElementId: string;
     schema?: Pick<Schema, 'flat'>;
     style?: Pick<Style, 'platform' | 'cache'>;
@@ -8,5 +8,5 @@ export type AITemplatePreviewProps = {
     mode?: AiMode;
     version?: number;
 };
-declare const AITemplatePreview: ({ baseElementId, schema, style, html, mode, version }: AITemplatePreviewProps) => import('react').JSX.Element;
-export default AITemplatePreview;
+declare const AISnippetPreview: ({ baseElementId, schema, style, html, mode, version }: AISnippetPreviewProps) => import('react').JSX.Element;
+export default AISnippetPreview;

package/dist/modules/AI/components/ChatMessage/components/{AITemplatePreview/components/AITemplateHeader/AITemplateHeader.d.ts → AISnippetPreview/components/AISnippetHeader/AISnippetHeader.d.ts}

@@ -1,6 +1,6 @@
 import { DisplayMode } from '@plitzi/sdk-shared';
 import { AiMode } from '../../../../../../types';
-export type AITemplateHeaderProps = {
+export type AISnippetHeaderProps = {
     baseElementId: string;
     displayMode: DisplayMode;
     onDisplayMode: (mode: DisplayMode) => void;
@@ -11,5 +11,5 @@ export type AITemplateHeaderProps = {
     mode?: AiMode;
     version?: number;
 };
-declare const AITemplateHeader: ({ baseElementId, displayMode, onDisplayMode, onClick, showHtml, onToggleHtml, hasHtml, mode, version }: AITemplateHeaderProps) => import('react').JSX.Element;
-export default AITemplateHeader;
+declare const AISnippetHeader: ({ baseElementId, displayMode, onDisplayMode, onClick, showHtml, onToggleHtml, hasHtml, mode, version }: AISnippetHeaderProps) => import('react').JSX.Element;
+export default AISnippetHeader;

package/dist/modules/AI/components/ChatMessage/components/AISnippetPreview/components/AISnippetHeader/index.d.ts

@@ -0,0 +1,3 @@
+import { default as AISnippetHeader } from './AISnippetHeader';
+export * from './AISnippetHeader';
+export default AISnippetHeader;

package/dist/modules/AI/components/ChatMessage/components/AISnippetPreview/index.d.ts

@@ -0,0 +1,3 @@
+import { default as AISnippetPreview } from './AISnippetPreview';
+export * from './AISnippetPreview';
+export default AISnippetPreview;

package/dist/modules/AI/hooks/useAiChat.d.ts

@@ -1,5 +1,6 @@
 import { AiAttachment, AiContext, AiMessage, AiProviderSettings, ConversationSummary } from '../types';
 import { AiEffort, AiMode } from '@plitzi/sdk-shared';
+import { Dispatch, SetStateAction } from 'react';
 type QueueEntry = {
     localId: string;
     message: string;
@@ -23,7 +24,7 @@ declare const useAiChat: (providerSettings?: AiProviderSettings) => {
     conversations: ConversationSummary[];
     pendingQueue: QueueEntry[];
     mode: AiMode;
-    setMode: import('react').Dispatch<import('react').SetStateAction<AiMode>>;
+    setMode: Dispatch<SetStateAction<AiMode>>;
     initConversation: () => Promise<void>;
     sendMessage: (message: string, context: AiContext, attachments?: AiAttachment[], effort?: AiEffort) => Promise<void>;
     stopGeneration: () => void;

package/dist/modules/Actions/ActionsContext.d.ts

@@ -7,7 +7,6 @@ export type ActionsContextValue = {
     credentials: SpaceCredential[];
     isLoading: boolean;
     error: string;
-    hasServerRendering: boolean;
     /** One origin per deployment, for building webhook URLs. */
     deployments: {
         environment: string;

package/dist/modules/App/AppContainer/components/NotificationsSettings/NotificationsSettings.d.ts

@@ -0,0 +1,7 @@
+/**
+ * How the toasts an `addNotification` step shows look — the space's `notifications`, the same fields authoring and the
+ * MCP server write. They are stored as a rule inside the custom CSS; here they are fields of their own, and the
+ * custom CSS editor shows the space's CSS without that rule.
+ */
+declare const NotificationsSettings: () => import('react').JSX.Element;
+export default NotificationsSettings;

package/dist/modules/App/AppContainer/components/NotificationsSettings/index.d.ts

@@ -0,0 +1,2 @@
+import { default as NotificationsSettings } from './NotificationsSettings';
+export default NotificationsSettings;

package/dist/modules/App/AppContainer/containers/ContainerServer.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Everything of the space that runs on a server — its actions, functions, connectors, the credentials they use and its
+ * runtime — under one entry of the sidebar. Whether the space HAS a server to run them is said here, once, above them
+ * all.
+ */
+declare const ContainerServer: () => import('react').JSX.Element;
+export default ContainerServer;

package/dist/modules/App/AppContainer/containers/ContainerSettings.d.ts

@@ -1,2 +1,3 @@
+/** The space's settings, and who may visit it: the roles it declares and who holds them. */
 declare const ContainerSettings: () => import('react').JSX.Element;
 export default ContainerSettings;

package/dist/modules/App/AppContainer/containers/GeneralSettings.d.ts

@@ -0,0 +1,2 @@
+declare const GeneralSettings: () => import('react').JSX.Element;
+export default GeneralSettings;

package/dist/modules/App/AppContext.d.ts

@@ -6,6 +6,9 @@ export type AppContextValue = {
     setPreviewMode: Dispatch<SetStateAction<boolean>>;
     displayBorderComponents: 'black' | 'white' | 'none';
     setDisplayBorderComponents: Dispatch<SetStateAction<'black' | 'white' | 'none'>>;
+    /** The layout grid over the canvas: the columns a page is laid out on, to line an element up by eye. */
+    displayGrid: boolean;
+    setDisplayGrid: Dispatch<SetStateAction<boolean>>;
     zoom: number;
     setZoom: Dispatch<SetStateAction<number>>;
     displayMode: DisplayMode;

package/dist/modules/App/components/AppHeader/GridButton.d.ts

@@ -0,0 +1,3 @@
+/** The layout grid over the canvas, on and off; lit while it is on. */
+declare const GridButton: () => import('react').JSX.Element;
+export default GridButton;

package/dist/modules/App/components/AppHeader/IssuesButton/helpers.d.ts

@@ -2,3 +2,5 @@ import { IssuesLevel } from '../../../../Space/helpers/spaceIssues';
 export declare const LEVEL_TEXT: Record<IssuesLevel, string>;
 export declare const LEVEL_ICON: Record<IssuesLevel, string>;
 export declare const LEVEL_TITLE: Record<IssuesLevel, string>;
+/** Nothing wrong, and a shorter way to the same page: the accent, never the colours of a problem. */
+export declare const SUGGESTING_TEXT = "text-indigo-600 dark:text-indigo-400";

package/dist/modules/App/components/EmptyState/EmptyState.d.ts

@@ -0,0 +1,12 @@
+import { ReactNode } from 'react';
+export type EmptyStateProps = {
+    /** A Font Awesome class, e.g. `fa-solid fa-bolt`. */
+    icon: string;
+    title: ReactNode;
+    description?: ReactNode;
+    /** What starts it — usually the one button that creates the first one. */
+    action?: ReactNode;
+};
+/** A subject with nothing in it yet: what it is for, and the way to start. The same everywhere it appears. */
+declare const EmptyState: ({ icon, title, description, action }: EmptyStateProps) => import('react').JSX.Element;
+export default EmptyState;

package/dist/modules/App/components/EmptyState/index.d.ts

@@ -0,0 +1,3 @@
+import { default as EmptyState } from './EmptyState';
+export * from './EmptyState';
+export default EmptyState;

package/dist/modules/App/components/PanelSections/PanelSections.d.ts

@@ -0,0 +1,27 @@
+import { ReactNode } from 'react';
+declare const HEADER_CLASS_NAME: {
+    readonly panel: "mx-2 mt-2";
+    readonly page: "mx-auto w-full max-w-5xl px-6 pt-5 pb-4";
+};
+export type PanelSection = {
+    id: string;
+    label: string;
+    content: ReactNode;
+};
+export type PanelSectionsProps = {
+    /** What the open section is remembered under, among the builder's own preferences. */
+    name: string;
+    sections: [PanelSection, ...PanelSection[]];
+    /** `panel` in the sidebar's dock, `page` over a view that takes the canvas' place. */
+    variant?: keyof typeof HEADER_CLASS_NAME;
+    /** Said once under the tabs, whichever section is open — what holds for all of them. */
+    notice?: ReactNode;
+    className?: string;
+};
+/**
+ * Several subjects behind one entry of the sidebar: a row of tabs over the one that is open. The open one is
+ * remembered, so coming back to the entry finds it where it was left — and a section that no longer exists falls back
+ * to the first.
+ */
+declare const PanelSections: ({ name, sections, variant, notice, className }: PanelSectionsProps) => import('react').JSX.Element;
+export default PanelSections;

package/dist/modules/App/components/PanelSections/index.d.ts

@@ -0,0 +1,3 @@
+import { default as PanelSections } from './PanelSections';
+export * from './PanelSections';
+export default PanelSections;

package/dist/modules/App/components/ResourceRow/ResourceRow.d.ts

@@ -0,0 +1,19 @@
+import { ReactNode } from 'react';
+export type ResourceRowProps = {
+    id: string;
+    /** A Font Awesome class for the tile at the start of the row. */
+    icon?: string;
+    title: ReactNode;
+    subtitle?: ReactNode;
+    /** A state worth seeing without opening it: disabled, in use, unsaved. */
+    badge?: ReactNode;
+    removeTitle?: string;
+    onSelect: (id: string) => void;
+    onRemove?: (id: string) => void;
+};
+/**
+ * One item of a view's list: the row opens it, the bin removes it. Two buttons side by side, never one inside the
+ * other, so each is reachable and announced on its own.
+ */
+declare const ResourceRow: ({ id, icon, title, subtitle, badge, removeTitle, onSelect, onRemove }: ResourceRowProps) => import('react').JSX.Element;
+export default ResourceRow;

package/dist/modules/App/components/ResourceRow/index.d.ts

@@ -0,0 +1,3 @@
+import { default as ResourceRow } from './ResourceRow';
+export * from './ResourceRow';
+export default ResourceRow;

package/dist/modules/App/components/SitemapDiagram/SitemapDiagram.d.ts

@@ -0,0 +1,25 @@
+import { SitemapEntry } from './types';
+import { Element, PageFolder } from '@plitzi/sdk-shared';
+export type SitemapDiagramProps = {
+    pages: Element[];
+    pageFolders: PageFolder[];
+    /** Each layout's name, by id — what a page's card says it renders inside. */
+    layouts?: Record<string, string>;
+    /** The page open in the canvas. */
+    currentPageId?: string;
+    /** A new page — inside a folder when one is given — or a new folder. */
+    onAddNode?: (nodeType: 'page' | 'folder', folderId?: string) => void;
+    /** A page or folder dropped into a folder, or onto the top level (`null`). */
+    onMove?: (entry: SitemapEntry, folderId: string | null) => void;
+    onRemove?: (entry: SitemapEntry) => void;
+    /** A page opened in the canvas, from its card, a double click or Enter. */
+    onOpen?: (pageId: string) => void;
+    /** Back to the canvas: the map replaces it, and the Pages panel that opened it may be closed by now. */
+    onClose?: () => void;
+};
+/**
+ * The site as a map: every folder over what it holds, laid out on its own. From here a page is found, opened, moved by
+ * dropping it onto a folder, or removed; a folder folds away what it holds.
+ */
+declare const SitemapDiagram: ({ pages, pageFolders, layouts, currentPageId, onAddNode, onMove, onRemove, onOpen, onClose }: SitemapDiagramProps) => import('react').JSX.Element;
+export default SitemapDiagram;

package/dist/modules/App/components/SitemapDiagram/components/SitemapChip/SitemapChip.d.ts

@@ -0,0 +1,21 @@
+import { SitemapPage } from '../../types';
+import { ElementFlagGate } from '@plitzi/sdk-shared';
+import { ReactNode } from 'react';
+export type SitemapChipProps = {
+    icon: string;
+    /** Colours of its own; a neutral chip without. */
+    className?: string;
+    title?: string;
+    children: ReactNode;
+};
+/** One fact about a page, small enough that four of them fit under its name. */
+declare const SitemapChip: ({ icon, className, title, children }: SitemapChipProps) => import('react').JSX.Element;
+/** Who may open the page — and, when it sends everybody else elsewhere, where. */
+export declare const SitemapAccessChip: ({ page }: {
+    page: SitemapPage;
+}) => import('react').JSX.Element;
+/** The feature flag the page exists under: `name` while it is on, `!name` while it is off. */
+export declare const SitemapFlagChip: ({ gate }: {
+    gate: ElementFlagGate;
+}) => import('react').JSX.Element;
+export default SitemapChip;

package/dist/modules/App/components/SitemapDiagram/components/SitemapChip/index.d.ts

@@ -0,0 +1,3 @@
+import { default as SitemapChip } from './SitemapChip';
+export * from './SitemapChip';
+export default SitemapChip;

package/dist/modules/App/components/SitemapDiagram/components/SitemapLegend/SitemapLegend.d.ts

@@ -0,0 +1,3 @@
+/** What the stripe down each card means, and the keys that move around the map. */
+declare const SitemapLegend: () => import('react').JSX.Element;
+export default SitemapLegend;

package/dist/modules/App/components/SitemapDiagram/components/SitemapLegend/index.d.ts

@@ -0,0 +1,2 @@
+import { default as SitemapLegend } from './SitemapLegend';
+export default SitemapLegend;

package/dist/modules/App/components/SitemapDiagram/components/SitemapNode/SitemapNode.d.ts

@@ -0,0 +1,15 @@
+import { SitemapEntry } from '../../types';
+export type SitemapNodeProps = {
+    entry: SitemapEntry;
+    selected: boolean;
+    dropTarget: boolean;
+    /** The page open in the canvas right now. */
+    current: boolean;
+    onOpen?: (id: string) => void;
+    /** A new page, made inside this folder. */
+    onAddPage?: (folderId: string) => void;
+    onRemove: (entry: SitemapEntry) => void;
+};
+/** One page or folder of the site: what it is called, where it answers, who may open it and what wraps it. */
+declare const SitemapNode: ({ entry, selected, dropTarget, current, onOpen, onAddPage, onRemove }: SitemapNodeProps) => import('react').JSX.Element;
+export default SitemapNode;

package/dist/modules/App/components/SitemapDiagram/components/SitemapNode/index.d.ts

@@ -0,0 +1,3 @@
+import { default as SitemapNode } from './SitemapNode';
+export * from './SitemapNode';
+export default SitemapNode;

package/dist/modules/App/components/SitemapDiagram/components/SitemapPath/SitemapPath.d.ts

@@ -0,0 +1,6 @@
+export type SitemapPathProps = {
+    path: string;
+};
+/** A page's address, its dynamic segments (`:productId`) marked as what they are: a value, not a word. */
+declare const SitemapPath: ({ path }: SitemapPathProps) => import('react').JSX.Element;
+export default SitemapPath;

package/dist/modules/App/components/SitemapDiagram/components/SitemapPath/index.d.ts

@@ -0,0 +1,3 @@
+import { default as SitemapPath } from './SitemapPath';
+export * from './SitemapPath';
+export default SitemapPath;

package/dist/modules/App/components/SitemapDiagram/components/SitemapToolbar/SitemapToolbar.d.ts

@@ -0,0 +1,16 @@
+export type SitemapToolbarProps = {
+    pageCount: number;
+    folderCount: number;
+    query: string;
+    /** How many entries the query found, and which of them is being shown. */
+    matchCount: number;
+    matchIndex: number;
+    onQueryChange: (query: string) => void;
+    onNextMatch: (backwards: boolean) => void;
+    onAddPage: () => void;
+    onAddFolder: () => void;
+    onClose?: () => void;
+};
+/** Back to the canvas, what the site holds, a search across it, and the two things made from here. */
+declare const SitemapToolbar: ({ pageCount, folderCount, query, matchCount, matchIndex, onQueryChange, onNextMatch, onAddPage, onAddFolder, onClose }: SitemapToolbarProps) => import('react').JSX.Element;
+export default SitemapToolbar;

package/dist/modules/App/components/SitemapDiagram/components/SitemapToolbar/index.d.ts

@@ -0,0 +1,3 @@
+import { default as SitemapToolbar } from './SitemapToolbar';
+export * from './SitemapToolbar';
+export default SitemapToolbar;

package/dist/modules/App/components/SitemapDiagram/helpers/schemaToSitemap.d.ts

@@ -0,0 +1,10 @@
+import { SitemapEntry } from '../types';
+import { Element, PageFolder } from '@plitzi/sdk-shared';
+/**
+ * The site's pages and folders as a tree: each folder holding what names it as its parent, folders and pages alike
+ * sorted by name, and every page with what its card shows — where it answers, who may open it, what wraps it.
+ *
+ * `layouts` names each layout by id: a page refers to its layout by id, and the map shows the name.
+ */
+declare const schemaToSitemap: (pages: Element[], folders: PageFolder[], layouts?: Record<string, string>) => SitemapEntry[];
+export default schemaToSitemap;

package/dist/modules/App/components/SitemapDiagram/helpers/schemaToSitemap.test.d.ts

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

package/dist/modules/App/components/SitemapDiagram/helpers/searchSitemap.d.ts

@@ -0,0 +1,12 @@
+import { SitemapEntry } from '../types';
+export type SitemapSearch = {
+    /** What matched, in the order the map reads. */
+    matches: string[];
+    /** The matches and every folder above one: what stays lit while the rest dims. */
+    visible: Set<string>;
+    /** The folders above a match: shown open whatever was folded. */
+    ancestors: Set<string>;
+};
+/** The pages and folders whose name or address holds the query — case aside — and the folders that lead to them. */
+declare const searchSitemap: (entries: SitemapEntry[], query: string) => SitemapSearch;
+export default searchSitemap;

package/dist/modules/App/components/SitemapDiagram/index.d.ts

@@ -0,0 +1,4 @@
+import { default as SitemapDiagram } from './SitemapDiagram';
+export * from './SitemapDiagram';
+export * from './types';
+export default SitemapDiagram;

package/dist/modules/App/components/SitemapDiagram/types.d.ts

@@ -0,0 +1,36 @@
+import { ElementFlagGate } from '@plitzi/sdk-shared';
+/**
+ * Who may open a page, as the page's `accessLevel` decides it: unset is anyone, `public` is only somebody signed out,
+ * `authenticated` only somebody signed in.
+ */
+export type AccessLevel = 'everyone' | 'guests' | 'signedIn';
+export type SitemapPage = {
+    type: 'page';
+    id: string;
+    title: string;
+    path: string;
+    access: AccessLevel;
+    isDefault: boolean;
+    /** The layout it renders inside, by name. */
+    layout?: string;
+    /** The feature flag it exists under. */
+    flag?: ElementFlagGate;
+    /** Where somebody it refuses is sent, by page name. */
+    redirectTo?: string;
+};
+export type SitemapFolder = {
+    type: 'folder';
+    id: string;
+    title: string;
+    path: string;
+    children: SitemapEntry[];
+};
+/** A page or a folder of the site, as the sitemap draws it. */
+export type SitemapEntry = SitemapPage | SitemapFolder;
+/** One look per access level, for the cards and the legend alike. */
+export declare const ACCESS_LEVELS: Record<AccessLevel, {
+    label: string;
+    icon: string;
+    accent: string;
+    badge: string;
+}>;

package/dist/modules/App/components/ViewPage/ViewPage.d.ts

@@ -0,0 +1,22 @@
+import { ReactNode } from 'react';
+export type ViewPageProps = {
+    /** Where "Back" goes — a form inside a view: the list it was opened from. */
+    onBack?: () => void;
+    backLabel?: string;
+    /** The thing being edited. A list needs none: the tab above already names it. */
+    title?: ReactNode;
+    /** What this view is for, in a sentence. */
+    description?: ReactNode;
+    /** The view's own commands — its primary action last, at the right edge. */
+    actions?: ReactNode;
+    /** Scroll inside the page, or leave it to a child that pins its own footer. */
+    scroll?: boolean;
+    className?: string;
+    children?: ReactNode;
+};
+/**
+ * One page of a view that replaces the canvas — Server, Settings: the same column, the same header, the same rhythm,
+ * whichever subject is open, so moving between tabs moves nothing but the content.
+ */
+declare const ViewPage: ({ onBack, backLabel, title, description, actions, scroll, className, children }: ViewPageProps) => import('react').JSX.Element;
+export default ViewPage;

package/dist/modules/App/components/ViewPage/index.d.ts

@@ -0,0 +1,3 @@
+import { default as ViewPage } from './ViewPage';
+export * from './ViewPage';
+export default ViewPage;

package/dist/modules/App/components/ViewSection/ViewSection.d.ts

@@ -0,0 +1,10 @@
+import { ReactNode } from 'react';
+export type ViewSectionProps = {
+    title: ReactNode;
+    /** Commands that act on this section alone. */
+    actions?: ReactNode;
+    children?: ReactNode;
+};
+/** One part of a view's page, under a small label — never a second page title. */
+declare const ViewSection: ({ title, actions, children }: ViewSectionProps) => import('react').JSX.Element;
+export default ViewSection;

package/dist/modules/App/components/ViewSection/index.d.ts

@@ -0,0 +1,3 @@
+import { default as ViewSection } from './ViewSection';
+export * from './ViewSection';
+export default ViewSection;

package/dist/modules/App/helpers/utils.d.ts

@@ -1,6 +1,15 @@
 import { PopupInstance } from '@plitzi/plitzi-ui/components';
-export declare const getPopups: ({ activeIds }: {
+/**
+ * The entries of the sidebar that REPLACE the canvas instead of opening beside it. `AppContainer` draws them; here they
+ * are only an icon, and alone on the side while open.
+ */
+export declare const FULL_VIEW_IDS: readonly ["server", "settings"];
+export type FullViewId = (typeof FULL_VIEW_IDS)[number];
+export declare const isFullViewId: (id: string | undefined) => id is FullViewId;
+export declare const getPopups: ({ activeIds, platformFlags }: {
     activeIds?: string[];
+    /** The editor's own feature flags, as the platform resolved them for whoever opened it. */
+    platformFlags?: Record<string, boolean>;
 }) => {
     left: PopupInstance[];
     right: PopupInstance[];

package/dist/modules/App/hooks/useSitemapOpen.d.ts

@@ -0,0 +1,7 @@
+import { Dispatch, SetStateAction } from 'react';
+/**
+ * Whether the pages are seen as their map instead of the canvas. Opened from the Pages panel, beside which it is drawn,
+ * and remembered like the panels are.
+ */
+declare const useSitemapOpen: () => readonly [boolean, Dispatch<SetStateAction<boolean>>];
+export default useSitemapOpen;

package/dist/modules/Builder/BuilderHelper.d.ts

@@ -15,7 +15,7 @@ export declare const getClipboardDataProcessed: (clipboardData?: DataTransfer) =
         };
     };
 } | {
-    dataType: "template";
+    dataType: "snippet";
     data: {
         payload: {
             elements: {
@@ -30,9 +30,9 @@ export declare const getClipboardDataProcessed: (clipboardData?: DataTransfer) =
 /**
  * A pasted element, named on the spot.
  *
- * `mintId` is positional and local to the payload being assembled: what comes out of here is a throwaway template
- * document that `SCHEMA_ADD_TEMPLATE` drops into the real space, and that is where a name colliding with the space
- * is renamed. All this has to guarantee is that the paste does not collide with itself.
+ * `mintId` is positional and local to the payload being assembled: what comes out of here is a throwaway snippet
+ * document that `schemaAddSnippet` drops into the real space, and that is where a name colliding with the space
+ * is renamed (`fitSnippet`). All this has to guarantee is that the paste does not collide with itself.
  */
 export declare const getElementDefinition: (componentDefinitions: Record<string, ComponentDefinition>, mintId: (type: string) => string, type: string, attributes?: Element["attributes"], styleSelectors?: Element["definition"]["styleSelectors"], parentId?: string) => {
     definition: Element["definition"];

package/dist/modules/Builder/BuilderProvider.d.ts

@@ -2,7 +2,7 @@ import { EventBridgeEvent } from '@plitzi/sdk-shared';
 export type BuilderProviderProps = {
     children: React.ReactNode;
     baseElementId: string;
-    mode?: 'normal' | 'template';
+    mode?: 'normal' | 'snippet';
     schemaName?: string;
     onHandler?: (event: EventBridgeEvent, data: unknown[]) => void;
     onBaseElementChange?: (baseElementId: string) => void;

package/dist/modules/Builder/Models/SnippetForm.d.ts

@@ -0,0 +1,16 @@
+import { MouseEvent } from 'react';
+/** What the form answers: the snippet, and the public bucket of which CDN it goes in. */
+export type SnippetFormValues = {
+    name: string;
+    description?: string;
+    cdnIdentifier: string;
+    bucketIdentifier: string;
+};
+export type SnippetFormProps = {
+    name?: string;
+    description?: string;
+    onClose?: (e?: MouseEvent) => void;
+    onSubmit?: (e: MouseEvent | undefined, values: SnippetFormValues) => void;
+};
+declare const SnippetForm: ({ name, description, onSubmit, onClose }: SnippetFormProps) => import('react').JSX.Element;
+export default SnippetForm;

package/dist/modules/Builder/components/BuilderContextMenu/BuilderContextMenuItem.d.ts

@@ -2,10 +2,15 @@ import { HTMLAttributes, MouseEvent, ReactNode } from 'react';
 export type BuilderContextMenuItemProps = {
     id?: string;
     title?: string;
+    /** What the item does beyond its name, shown on hover. */
+    hint?: string;
+    /** Only a shortcut that exists: a menu that shows one teaches it. */
     shortcut?: string;
+    /** `danger` for what removes. */
+    intent?: 'default' | 'danger';
     children?: ReactNode;
     className?: string;
     onClick?: (e: MouseEvent, id: string) => void;
 } & Omit<HTMLAttributes<HTMLDivElement>, 'onClick'>;
-declare const BuilderContextMenuItem: ({ id, title, shortcut, children, className, onClick, ...otherProps }: BuilderContextMenuItemProps) => import('react').JSX.Element;
+declare const BuilderContextMenuItem: ({ id, title, hint, shortcut, intent, children, className, onClick, ...otherProps }: BuilderContextMenuItemProps) => import('react').JSX.Element;
 export default BuilderContextMenuItem;

package/dist/modules/Builder/components/BuilderElementTools/ElementAnchor.d.ts

@@ -0,0 +1,11 @@
+export type ElementAnchorProps = {
+    anchor?: string;
+    /** `undefined` removes it: the element has no `id` in the DOM. */
+    onUpdate?: (key: string, value: string | undefined, isDefinition?: boolean) => void;
+};
+/**
+ * The `id` an element carries in the DOM, so a link to `/page#anchor` lands on it. Saved as soon as what is typed is
+ * one; while it is not, the field says why and the element keeps the one it had.
+ */
+declare const ElementAnchor: ({ anchor, onUpdate }: ElementAnchorProps) => import('react').JSX.Element;
+export default ElementAnchor;

package/dist/modules/Builder/components/BuilderElementTools/ElementDefinitionSettings.d.ts

@@ -5,6 +5,8 @@ export type ElementDefinitionSettingsProps = {
     canHoldItems?: boolean;
     /** What the element's type declares, which is what an instance with no strategy of its own follows. */
     declaredLoadStrategy?: ElementLoadStrategy;
+    /** The feature flags the space declares — what the element's gate may name. */
+    flagNames?: string[];
     /** The one name this element answers to. Editing it renames the element across the whole document. */
     id: string;
     /** Why this id cannot be used here, or null when it is free. Given the slugified id, never the raw typing. */
@@ -13,5 +15,5 @@ export type ElementDefinitionSettingsProps = {
     onUpdate?: (key: string, value: string | boolean | number | object | undefined, isDefinition?: boolean) => void;
     onRename: (id: string) => void;
 };
-declare const ElementDefinitionSettings: ({ definition, canHoldItems, declaredLoadStrategy, id, getNameConflict, onUpdate, onRename }: ElementDefinitionSettingsProps) => import('react').JSX.Element;
+declare const ElementDefinitionSettings: ({ definition, canHoldItems, declaredLoadStrategy, flagNames, id, getNameConflict, onUpdate, onRename }: ElementDefinitionSettingsProps) => import('react').JSX.Element;
 export default ElementDefinitionSettings;

package/dist/modules/Builder/components/BuilderElementTools/ElementFlagGate.d.ts

@@ -0,0 +1,16 @@
+import { ElementFlagGate as TElementFlagGate } from '@plitzi/sdk-shared';
+export type ElementFlagGateProps = {
+    gate?: TElementFlagGate;
+    /** The flags the space declares, which are the ones a gate may name. */
+    flagNames: string[];
+    isPage?: boolean;
+    /** `undefined` removes the gate: the element is rendered whatever the flags say. */
+    onUpdate?: (key: string, value: TElementFlagGate | undefined, isDefinition?: boolean) => void;
+};
+/**
+ * The feature flag an element exists under — not a visibility: gated off, it is not rendered at all, on the server or
+ * in the browser, and none of its markup is in the page. Offered only once the space declares a flag,
+ * and kept on screen for an element still naming one the space removed, so the author can see why it is gone.
+ */
+declare const ElementFlagGate: ({ gate, flagNames: names, isPage, onUpdate }: ElementFlagGateProps) => import('react').JSX.Element | null;
+export default ElementFlagGate;

package/dist/modules/Builder/components/BuilderElementTools/NothingSelected.d.ts

@@ -0,0 +1,6 @@
+/**
+ * What the tools say before anything is chosen: how to choose, and the keys that work on what is chosen — the place
+ * an author looks while learning the canvas, so the place the shortcuts are taught.
+ */
+declare const NothingSelected: () => import('react').JSX.Element;
+export default NothingSelected;