@atom-forge/brickee 0.0.0-stage → 0.0.1

package/dist/model.js

@@ -0,0 +1,45 @@
+// Block content: what the block editor (src/routes/(+lib)/blocks) writes into the `content` column of pages, news posts
+// and promo boxes. Built-in blocks are `md:<kind>` with inline markdown text (raw text for md:code); every other type
+// belongs to an editor plugin, with its own props and, for some, nested blocks.
+export const MD = 'md:';
+export const MAX_INDENT = 6;
+/** Plugins with nested blocks hold one level only, so a document is at most this deep. */
+export const MAX_DEPTH = 2;
+export const isMd = (b) => b.type.startsWith(MD);
+/** Inline markdown -> plain text: marks, escapes and link targets dropped. */
+export function inlineToPlainText(md) {
+    return md
+        .replace(/<\/?(u|sub|sup)>/g, '')
+        .replace(/\[([^\]]*)\]\([^)]*\)/g, '$1')
+        .replace(/(\*\*|~~|`)/g, '')
+        .replace(/(?<![\\*])\*(?!\*)/g, '')
+        .replace(/\\(.)/g, '$1');
+}
+/** Every text of a document, in order: for search, leads and meta descriptions. */
+export function blocksToPlainText(blocks) {
+    const out = [];
+    const walk = (list) => {
+        for (const b of list) {
+            if (b.text)
+                out.push(b.type === 'md:code' ? b.text : inlineToPlainText(b.text));
+            for (const v of Object.values(b.props ?? {})) {
+                // Titles, captions and table cells are text too; ids, colours and switches are not.
+                if (typeof v === 'string' && /\s/.test(v.trim()))
+                    out.push(v.trim());
+                if (Array.isArray(v))
+                    for (const row of v)
+                        if (Array.isArray(row))
+                            out.push(row.map((c) => inlineToPlainText(String(c))).join(' '));
+            }
+            if (b.blocks)
+                walk(b.blocks);
+        }
+    };
+    walk(blocks);
+    return out.filter(Boolean).join('\n\n');
+}
+/**
+ * Does a container's `accepts` list take this palette id? The list holds palette ids, and 'md:*' for every built-in
+ * block (text, headings, lists, quote, code, divider). No list: everything.
+ */
+export const acceptsId = (accepts, id) => !accepts || accepts.some((a) => a === id || (a === 'md:*' && id.startsWith('md:')));

package/dist/palette.d.ts

@@ -0,0 +1,19 @@
+import { Pilcrow } from '@lucide/svelte';
+export type Icon = typeof Pilcrow;
+export interface PaletteItem {
+    /** The stored type: md:p, md:h1… for built-in blocks, the plugin's type for plugins. */
+    id: string;
+    label: string;
+    hint: string;
+    /** Extra search words for the slash menu. */
+    keys: string;
+    icon: Icon;
+}
+/** Every built-in block the slash menu can offer, in the default order. */
+export declare const PALETTE_ITEMS: PaletteItem[];
+/** Palette ids of every built-in block (md:p, md:h1…), in the default order. */
+export declare const BUILT_IN_IDS: string[];
+import { acceptsId } from './model';
+export { acceptsId };
+/** The palette of a container's nested editor: the host's, narrowed to what the container accepts (in the host's order). */
+export declare const narrowPalette: (palette: string[], accepts: readonly string[] | undefined) => string[];

package/dist/palette.js

@@ -0,0 +1,23 @@
+import { Heading1, Heading2, Heading3, Heading4, Heading5, Heading6, List, ListOrdered, ListTodo, Pilcrow, SeparatorHorizontal, SquareCode, TextQuote } from '@lucide/svelte';
+/** Every built-in block the slash menu can offer, in the default order. */
+export const PALETTE_ITEMS = [
+    { id: 'md:p', label: 'Text', hint: 'Plain paragraph', keys: 'text paragraph', icon: Pilcrow },
+    { id: 'md:h1', label: 'Heading 1', hint: 'Large heading', keys: 'heading h1 title', icon: Heading1 },
+    { id: 'md:h2', label: 'Heading 2', hint: 'Medium heading', keys: 'heading h2 title', icon: Heading2 },
+    { id: 'md:h3', label: 'Heading 3', hint: 'Small heading', keys: 'heading h3 title', icon: Heading3 },
+    { id: 'md:h4', label: 'Heading 4', hint: 'Sub-heading', keys: 'heading h4 title', icon: Heading4 },
+    { id: 'md:h5', label: 'Heading 5', hint: 'Minor heading', keys: 'heading h5 title', icon: Heading5 },
+    { id: 'md:h6', label: 'Heading 6', hint: 'Smallest heading', keys: 'heading h6 title', icon: Heading6 },
+    { id: 'md:ul', label: 'Bulleted list', hint: 'Simple bullets', keys: 'bullet list ul', icon: List },
+    { id: 'md:ol', label: 'Numbered list', hint: 'Ordered items', keys: 'numbered ordered list ol', icon: ListOrdered },
+    { id: 'md:todo', label: 'To-do', hint: 'Checkable item', keys: 'todo task checkbox', icon: ListTodo },
+    { id: 'md:quote', label: 'Quote', hint: 'Highlighted quote', keys: 'quote blockquote', icon: TextQuote },
+    { id: 'md:code', label: 'Code', hint: 'Monospaced block', keys: 'code snippet pre', icon: SquareCode },
+    { id: 'md:hr', label: 'Divider', hint: 'Horizontal line', keys: 'divider hr line separator', icon: SeparatorHorizontal }
+];
+/** Palette ids of every built-in block (md:p, md:h1…), in the default order. */
+export const BUILT_IN_IDS = PALETTE_ITEMS.map((it) => it.id);
+import { acceptsId } from './model';
+export { acceptsId };
+/** The palette of a container's nested editor: the host's, narrowed to what the container accepts (in the host's order). */
+export const narrowPalette = (palette, accepts) => accepts ? palette.filter((id) => acceptsId(accepts, id)) : palette;

package/dist/plugins/Gap.svelte

@@ -0,0 +1,28 @@
+<script lang="ts" module>
+	export interface GapProps extends Record<string, unknown> {
+		/** The height in lines of text (of the text around it), as a string from the select. */
+		lines: string;
+	}
+
+	export const GAP_MAX = 8;
+	export const GAP_LINES = Array.from({ length: GAP_MAX }, (_, i) => ({ value: String(i + 1), label: i ? '{n} lines' : '1 line' }));
+
+	/** The number of lines, 1–8 (default 1). */
+	export const gapLines = (lines: unknown) => Math.min(GAP_MAX, Math.max(1, Math.round(Number(lines)) || 1));
+</script>
+
+<script lang="ts">
+	import type { PluginViewProps } from '../types';
+
+	// Empty space, so many lines high; in the editor a hatched strip of the same height.
+	let { props = $bindable() }: PluginViewProps<GapProps> = $props();
+</script>
+
+<div class="gap" style:height="{gapLines(props.lines)}lh" aria-hidden="true"></div>
+
+<style>
+	.gap {
+		border-radius: 6px;
+		background: repeating-linear-gradient(-45deg, transparent 0 6px, rgb(0 0 0 / 0.05) 6px 12px);
+	}
+</style>

package/dist/plugins/Gap.svelte.d.ts

@@ -0,0 +1,15 @@
+export interface GapProps extends Record<string, unknown> {
+    /** The height in lines of text (of the text around it), as a string from the select. */
+    lines: string;
+}
+export declare const GAP_MAX = 8;
+export declare const GAP_LINES: {
+    value: string;
+    label: string;
+}[];
+/** The number of lines, 1–8 (default 1). */
+export declare const gapLines: (lines: unknown) => number;
+import type { PluginViewProps } from '../types';
+declare const Gap: import("svelte").Component<PluginViewProps<GapProps>, {}, "props">;
+type Gap = ReturnType<typeof Gap>;
+export default Gap;

package/dist/plugins/GapPreview.svelte

@@ -0,0 +1,17 @@
+<svelte:options css="injected" />
+
+<script lang="ts">
+	import type { PluginPreviewProps } from '../types';
+	import { gapLines, type GapProps } from './Gap.svelte';
+
+	let { props }: PluginPreviewProps<GapProps> = $props();
+</script>
+
+<div class="gap" style:height="{gapLines(props.lines)}lh" aria-hidden="true"></div>
+
+<style>
+	.gap {
+		clear: both;
+		margin: 0;
+	}
+</style>

package/dist/plugins/GapPreview.svelte.d.ts

@@ -0,0 +1,5 @@
+import type { PluginPreviewProps } from '../types';
+import { type GapProps } from './Gap.svelte';
+declare const GapPreview: import("svelte").Component<PluginPreviewProps<GapProps>, {}, "">;
+type GapPreview = ReturnType<typeof GapPreview>;
+export default GapPreview;

package/dist/plugins/Map.svelte

@@ -0,0 +1,47 @@
+<script lang="ts" module>
+	export interface MapProps extends Record<string, unknown> {
+		/** Place or address, as typed into Google Maps. */
+		q: string;
+		/** Zoom level, 1–20. */
+		zoom: string;
+	}
+
+	/** Google Maps embed for a place (no API key needed); empty without a place. */
+	export const mapSrc = (p: MapProps) =>
+		p.q ? `https://www.google.com/maps?q=${encodeURIComponent(p.q)}&z=${Number(p.zoom) || 15}&output=embed` : '';
+</script>
+
+<script lang="ts">
+	import { useText } from '../i18n';
+	import { MapPin } from '@lucide/svelte';
+	import type { PluginViewProps } from '../types';
+	import Empty from '../kit/Empty.svelte';
+
+	let { props = $bindable() }: PluginViewProps<MapProps> = $props();
+	const tr = useText();
+	const src = $derived(mapSrc(props));
+</script>
+
+{#if src}
+	<div class="map">
+		<!-- Not interactive inside the editor, so selecting and dragging the block keep working. -->
+		<iframe title={tr('Map: {place}', { place: String(props.q ?? '') })} {src} loading="lazy"></iframe>
+	</div>
+{:else}
+	<Empty icon={MapPin} text="Set a place or an address above" />
+{/if}
+
+<style>
+	.map {
+		border: 1px solid #e5e5ea;
+		border-radius: 10px;
+		overflow: hidden;
+	}
+	iframe {
+		display: block;
+		width: 100%;
+		height: 260px;
+		border: 0;
+		pointer-events: none;
+	}
+</style>

package/dist/plugins/Map.svelte.d.ts

@@ -0,0 +1,12 @@
+export interface MapProps extends Record<string, unknown> {
+    /** Place or address, as typed into Google Maps. */
+    q: string;
+    /** Zoom level, 1–20. */
+    zoom: string;
+}
+/** Google Maps embed for a place (no API key needed); empty without a place. */
+export declare const mapSrc: (p: MapProps) => string;
+import type { PluginViewProps } from '../types';
+declare const Map: import("svelte").Component<PluginViewProps<MapProps>, {}, "props">;
+type Map = ReturnType<typeof Map>;
+export default Map;

package/dist/plugins/MapPreview.svelte

@@ -0,0 +1,26 @@
+<svelte:options css="injected" />
+
+<script lang="ts">
+	import { useText } from '../i18n';
+	import type { PluginPreviewProps } from '../types';
+	import { mapSrc, type MapProps } from './Map.svelte';
+
+	let { props }: PluginPreviewProps<MapProps> = $props();
+	const tr = useText();
+	const src = $derived(mapSrc(props));
+</script>
+
+{#if src}
+	<iframe class="map" title={tr('Map: {place}', { place: String(props.q ?? '') })} {src} loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
+{/if}
+
+<style>
+	.map {
+		display: block;
+		width: 100%;
+		height: 300px;
+		margin: 0 0 1em;
+		border: 0;
+		border-radius: 10px;
+	}
+</style>

package/dist/plugins/MapPreview.svelte.d.ts

@@ -0,0 +1,5 @@
+import type { PluginPreviewProps } from '../types';
+import { type MapProps } from './Map.svelte';
+declare const MapPreview: import("svelte").Component<PluginPreviewProps<MapProps>, {}, "">;
+type MapPreview = ReturnType<typeof MapPreview>;
+export default MapPreview;