@elaraai/east-ui 0.0.1-beta.4 → 0.0.1-beta.6

package/dist/src/typography/code/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/typography/code/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAGH,IAAI,EACJ,UAAU,EACV,OAAO,GACV,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAkB,MAAM,YAAY,CAAC;AAEvE,kBAAkB;AAClB,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAkB,MAAM,YAAY,CAAC;AAEvE,+EAA+E;AAC/E,iBAAiB;AACjB,+EAA+E;AAE/E;;;;;;GAMG;AACH,SAAS,UAAU,CACf,KAAqC,EACrC,KAAiB;IAEjB,MAAM,YAAY,GAAG,KAAK,EAAE,OAAO;QAC/B,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,OAAO,KAAK,QAAQ;YAChC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,EAAE,eAAe,CAAC;YAC3D,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC;QACpB,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,SAAS,GAAG,KAAK,EAAE,IAAI;QACzB,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,IAAI,KAAK,QAAQ;YAC7B,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,QAAQ,CAAC;YACjD,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC;QACjB,CAAC,CAAC,SAAS,CAAC;IAEhB,OAAO,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,EAAE;QAC9B,KAAK,EAAE,KAAK;QACZ,OAAO,EAAE,YAAY,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;QAC7E,YAAY,EAAE,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;QAC/F,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;KACvE,CAAC,EAAE,eAAe,CAAC,CAAC;AACzB,CAAC;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG;IAChB,IAAI,EAAE,UAAU;IAChB,KAAK,EAAE;QACH,IAAI,EAAE,QAAQ;QACd,OAAO,EAAE,eAAe;KAC3B;CACK,CAAC"}

package/dist/src/typography/code/types.d.ts

@@ -0,0 +1,56 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+import { type SubtypeExprOrValue, OptionType, StringType, StructType, VariantType, NullType } from "@elaraai/east";
+import { SizeType, type SizeLiteral } from "../../style.js";
+/**
+ * Code variant type for different code display styles.
+ *
+ * @property subtle - Subtle background with colored text
+ * @property surface - Surface-level styling
+ * @property outline - Transparent background with colored border
+ */
+export declare const CodeVariantType: VariantType<{
+    subtle: NullType;
+    surface: NullType;
+    outline: NullType;
+}>;
+export type CodeVariantType = typeof CodeVariantType;
+export type CodeVariantLiteral = "subtle" | "surface" | "outline";
+/**
+ * The concrete East type for Code component data.
+ *
+ * @property value - The code text to display
+ * @property variant - Visual style variant
+ * @property colorPalette - Color scheme for the code
+ * @property size - Size of the code text
+ */
+export declare const CodeType: StructType<{
+    value: StringType;
+    variant: OptionType<VariantType<{
+        subtle: NullType;
+        surface: NullType;
+        outline: NullType;
+    }>>;
+    colorPalette: OptionType<StringType>;
+    size: OptionType<VariantType<{
+        xs: NullType;
+        sm: NullType;
+        md: NullType;
+        lg: NullType;
+    }>>;
+}>;
+export type CodeType = typeof CodeType;
+/**
+ * Style configuration for Code components.
+ */
+export type CodeStyle = {
+    /** Visual style variant */
+    variant?: SubtypeExprOrValue<CodeVariantType> | CodeVariantLiteral;
+    /** Color palette (e.g., "gray", "blue") */
+    colorPalette?: SubtypeExprOrValue<StringType>;
+    /** Size of the code text */
+    size?: SubtypeExprOrValue<SizeType> | SizeLiteral;
+};
+//# sourceMappingURL=types.d.ts.map

package/dist/src/typography/code/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/typography/code/types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EACH,KAAK,kBAAkB,EACvB,UAAU,EACV,UAAU,EACV,UAAU,EACV,WAAW,EACX,QAAQ,EACX,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,QAAQ,EAAE,KAAK,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAM5D;;;;;;GAMG;AACH,eAAO,MAAM,eAAe;;;;EAI1B,CAAC;AAEH,MAAM,MAAM,eAAe,GAAG,OAAO,eAAe,CAAC;AACrD,MAAM,MAAM,kBAAkB,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,CAAC;AAMlE;;;;;;;GAOG;AACH,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;EAKnB,CAAC;AAEH,MAAM,MAAM,QAAQ,GAAG,OAAO,QAAQ,CAAC;AAMvC;;GAEG;AACH,MAAM,MAAM,SAAS,GAAG;IACpB,2BAA2B;IAC3B,OAAO,CAAC,EAAE,kBAAkB,CAAC,eAAe,CAAC,GAAG,kBAAkB,CAAC;IACnE,2CAA2C;IAC3C,YAAY,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IAC9C,4BAA4B;IAC5B,IAAI,CAAC,EAAE,kBAAkB,CAAC,QAAQ,CAAC,GAAG,WAAW,CAAC;CACrD,CAAC"}

package/dist/src/typography/code/types.js

@@ -0,0 +1,39 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+import { OptionType, StringType, StructType, VariantType, NullType, } from "@elaraai/east";
+import { SizeType } from "../../style.js";
+// ============================================================================
+// Code Variant Type
+// ============================================================================
+/**
+ * Code variant type for different code display styles.
+ *
+ * @property subtle - Subtle background with colored text
+ * @property surface - Surface-level styling
+ * @property outline - Transparent background with colored border
+ */
+export const CodeVariantType = VariantType({
+    subtle: NullType,
+    surface: NullType,
+    outline: NullType,
+});
+// ============================================================================
+// Code Type
+// ============================================================================
+/**
+ * The concrete East type for Code component data.
+ *
+ * @property value - The code text to display
+ * @property variant - Visual style variant
+ * @property colorPalette - Color scheme for the code
+ * @property size - Size of the code text
+ */
+export const CodeType = StructType({
+    value: StringType,
+    variant: OptionType(CodeVariantType),
+    colorPalette: OptionType(StringType),
+    size: OptionType(SizeType),
+});
+//# sourceMappingURL=types.js.map

package/dist/src/typography/code/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/typography/code/types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAEH,UAAU,EACV,UAAU,EACV,UAAU,EACV,WAAW,EACX,QAAQ,GACX,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,QAAQ,EAAoB,MAAM,gBAAgB,CAAC;AAE5D,+EAA+E;AAC/E,oBAAoB;AACpB,+EAA+E;AAE/E;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,WAAW,CAAC;IACvC,MAAM,EAAE,QAAQ;IAChB,OAAO,EAAE,QAAQ;IACjB,OAAO,EAAE,QAAQ;CACpB,CAAC,CAAC;AAKH,+EAA+E;AAC/E,YAAY;AACZ,+EAA+E;AAE/E;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAAC;IAC/B,KAAK,EAAE,UAAU;IACjB,OAAO,EAAE,UAAU,CAAC,eAAe,CAAC;IACpC,YAAY,EAAE,UAAU,CAAC,UAAU,CAAC;IACpC,IAAI,EAAE,UAAU,CAAC,QAAQ,CAAC;CAC7B,CAAC,CAAC"}

package/dist/src/typography/code-block/index.d.ts

@@ -0,0 +1,86 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+import { type SubtypeExprOrValue, type ExprType, StringType } from "@elaraai/east";
+import { UIComponentType } from "../../component.js";
+import { type CodeBlockStyle } from "./types.js";
+export { CodeBlockType, CodeLanguageType, type CodeBlockStyle, type CodeLanguage } from "./types.js";
+/**
+ * Creates a CodeBlock component for displaying code with syntax highlighting.
+ *
+ * @param code - The code content to display
+ * @param style - Optional styling configuration
+ * @returns An East expression representing the code block component
+ */
+declare function createCodeBlock(code: SubtypeExprOrValue<StringType>, style?: CodeBlockStyle): ExprType<UIComponentType>;
+/**
+ * CodeBlock component for displaying code blocks with syntax highlighting.
+ *
+ * @remarks
+ * Use `CodeBlock.Root(code, style)` to create code blocks with optional
+ * syntax highlighting, line numbers, and line highlighting.
+ *
+ * @example
+ * ```ts
+ * import { East } from "@elaraai/east";
+ * import { CodeBlock, UIComponentType } from "@elaraai/east-ui";
+ *
+ * const example = East.function([], UIComponentType, $ => {
+ *     return CodeBlock.Root(
+ *         `function hello() {\n  console.log("Hello!");\n}`,
+ *         {
+ *             language: "typescript",
+ *             showLineNumbers: true,
+ *             highlightLines: [2],
+ *         }
+ *     );
+ * });
+ * ```
+ */
+export declare const CodeBlock: {
+    readonly Root: typeof createCodeBlock;
+    readonly Types: {
+        readonly CodeBlock: import("@elaraai/east").StructType<{
+            code: StringType;
+            language: import("@elaraai/east").OptionType<import("@elaraai/east").VariantType<{
+                typescript: import("@elaraai/east").NullType;
+                javascript: import("@elaraai/east").NullType;
+                json: import("@elaraai/east").NullType;
+                html: import("@elaraai/east").NullType;
+                css: import("@elaraai/east").NullType;
+                python: import("@elaraai/east").NullType;
+                rust: import("@elaraai/east").NullType;
+                go: import("@elaraai/east").NullType;
+                sql: import("@elaraai/east").NullType;
+                bash: import("@elaraai/east").NullType;
+                markdown: import("@elaraai/east").NullType;
+                yaml: import("@elaraai/east").NullType;
+                xml: import("@elaraai/east").NullType;
+                plaintext: import("@elaraai/east").NullType;
+            }>>;
+            showLineNumbers: import("@elaraai/east").OptionType<import("@elaraai/east").BooleanType>;
+            highlightLines: import("@elaraai/east").OptionType<import("@elaraai/east").ArrayType<import("@elaraai/east").IntegerType>>;
+            maxHeight: import("@elaraai/east").OptionType<StringType>;
+            showCopyButton: import("@elaraai/east").OptionType<import("@elaraai/east").BooleanType>;
+            title: import("@elaraai/east").OptionType<StringType>;
+        }>;
+        readonly Language: import("@elaraai/east").VariantType<{
+            typescript: import("@elaraai/east").NullType;
+            javascript: import("@elaraai/east").NullType;
+            json: import("@elaraai/east").NullType;
+            html: import("@elaraai/east").NullType;
+            css: import("@elaraai/east").NullType;
+            python: import("@elaraai/east").NullType;
+            rust: import("@elaraai/east").NullType;
+            go: import("@elaraai/east").NullType;
+            sql: import("@elaraai/east").NullType;
+            bash: import("@elaraai/east").NullType;
+            markdown: import("@elaraai/east").NullType;
+            yaml: import("@elaraai/east").NullType;
+            xml: import("@elaraai/east").NullType;
+            plaintext: import("@elaraai/east").NullType;
+        }>;
+    };
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/src/typography/code-block/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/typography/code-block/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EACH,KAAK,kBAAkB,EACvB,KAAK,QAAQ,EAEb,UAAU,EAEb,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAmC,KAAK,cAAc,EAAqB,MAAM,YAAY,CAAC;AAGrG,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,KAAK,cAAc,EAAE,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAMrG;;;;;;GAMG;AACH,iBAAS,eAAe,CACpB,IAAI,EAAE,kBAAkB,CAAC,UAAU,CAAC,EACpC,KAAK,CAAC,EAAE,cAAc,GACvB,QAAQ,CAAC,eAAe,CAAC,CA6B3B;AAED;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAMZ,CAAC"}

package/dist/src/typography/code-block/index.js

@@ -0,0 +1,78 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+import { East, StringType, variant, } from "@elaraai/east";
+import { UIComponentType } from "../../component.js";
+import { CodeBlockType, CodeLanguageType } from "./types.js";
+// Re-export types
+export { CodeBlockType, CodeLanguageType } from "./types.js";
+// ============================================================================
+// CodeBlock Component
+// ============================================================================
+/**
+ * Creates a CodeBlock component for displaying code with syntax highlighting.
+ *
+ * @param code - The code content to display
+ * @param style - Optional styling configuration
+ * @returns An East expression representing the code block component
+ */
+function createCodeBlock(code, style) {
+    const showLineNumbersValue = style?.showLineNumbers !== undefined
+        ? (typeof style.showLineNumbers === "boolean"
+            ? style.showLineNumbers
+            : style.showLineNumbers)
+        : undefined;
+    const showCopyButtonValue = style?.showCopyButton !== undefined
+        ? (typeof style.showCopyButton === "boolean"
+            ? style.showCopyButton
+            : style.showCopyButton)
+        : undefined;
+    // Convert string language to variant
+    const languageValue = style?.language !== undefined
+        ? (typeof style.language === "string"
+            ? East.value(variant(style.language, null), CodeLanguageType)
+            : style.language)
+        : undefined;
+    return East.value(variant("CodeBlock", {
+        code: code,
+        language: languageValue !== undefined ? variant("some", languageValue) : variant("none", null),
+        showLineNumbers: showLineNumbersValue !== undefined ? variant("some", showLineNumbersValue) : variant("none", null),
+        highlightLines: style?.highlightLines ? variant("some", style.highlightLines) : variant("none", null),
+        maxHeight: style?.maxHeight ? variant("some", style.maxHeight) : variant("none", null),
+        showCopyButton: showCopyButtonValue !== undefined ? variant("some", showCopyButtonValue) : variant("none", null),
+        title: style?.title ? variant("some", style.title) : variant("none", null),
+    }), UIComponentType);
+}
+/**
+ * CodeBlock component for displaying code blocks with syntax highlighting.
+ *
+ * @remarks
+ * Use `CodeBlock.Root(code, style)` to create code blocks with optional
+ * syntax highlighting, line numbers, and line highlighting.
+ *
+ * @example
+ * ```ts
+ * import { East } from "@elaraai/east";
+ * import { CodeBlock, UIComponentType } from "@elaraai/east-ui";
+ *
+ * const example = East.function([], UIComponentType, $ => {
+ *     return CodeBlock.Root(
+ *         `function hello() {\n  console.log("Hello!");\n}`,
+ *         {
+ *             language: "typescript",
+ *             showLineNumbers: true,
+ *             highlightLines: [2],
+ *         }
+ *     );
+ * });
+ * ```
+ */
+export const CodeBlock = {
+    Root: createCodeBlock,
+    Types: {
+        CodeBlock: CodeBlockType,
+        Language: CodeLanguageType,
+    },
+};
+//# sourceMappingURL=index.js.map

package/dist/src/typography/code-block/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/typography/code-block/index.ts"],"names":[],"mappings":"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"}

package/dist/src/typography/code-block/types.d.ts

@@ -0,0 +1,100 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+import { type SubtypeExprOrValue, OptionType, StringType, StructType, BooleanType, ArrayType, IntegerType, VariantType, NullType } from "@elaraai/east";
+/**
+ * Programming language variant type for syntax highlighting.
+ *
+ * @remarks
+ * These languages are pre-registered with the syntax highlighter.
+ * Create instances using `variant("typescript", null)` or the string shorthand.
+ *
+ * @property typescript - TypeScript language
+ * @property javascript - JavaScript language
+ * @property json - JSON format
+ * @property html - HTML markup
+ * @property css - CSS styles
+ * @property python - Python language
+ * @property rust - Rust language
+ * @property go - Go language
+ * @property sql - SQL queries
+ * @property bash - Bash/shell scripts
+ * @property markdown - Markdown text
+ * @property yaml - YAML configuration
+ * @property xml - XML markup
+ * @property plaintext - Plain text (no highlighting)
+ */
+export declare const CodeLanguageType: VariantType<{
+    typescript: NullType;
+    javascript: NullType;
+    json: NullType;
+    html: NullType;
+    css: NullType;
+    python: NullType;
+    rust: NullType;
+    go: NullType;
+    sql: NullType;
+    bash: NullType;
+    markdown: NullType;
+    yaml: NullType;
+    xml: NullType;
+    plaintext: NullType;
+}>;
+export type CodeLanguageType = typeof CodeLanguageType;
+/** String literal union for language shortcuts */
+export type CodeLanguage = "typescript" | "javascript" | "json" | "html" | "css" | "python" | "rust" | "go" | "sql" | "bash" | "markdown" | "yaml" | "xml" | "plaintext";
+/**
+ * The concrete East type for CodeBlock component data.
+ *
+ * @property code - The code content to display
+ * @property language - Programming language for syntax highlighting
+ * @property showLineNumbers - Whether to show line numbers
+ * @property highlightLines - Line numbers to highlight
+ * @property maxHeight - Maximum height with scroll
+ * @property showCopyButton - Whether to show copy-to-clipboard button
+ * @property title - Optional title displayed in the header (e.g., filename)
+ */
+export declare const CodeBlockType: StructType<{
+    code: StringType;
+    language: OptionType<VariantType<{
+        typescript: NullType;
+        javascript: NullType;
+        json: NullType;
+        html: NullType;
+        css: NullType;
+        python: NullType;
+        rust: NullType;
+        go: NullType;
+        sql: NullType;
+        bash: NullType;
+        markdown: NullType;
+        yaml: NullType;
+        xml: NullType;
+        plaintext: NullType;
+    }>>;
+    showLineNumbers: OptionType<BooleanType>;
+    highlightLines: OptionType<ArrayType<IntegerType>>;
+    maxHeight: OptionType<StringType>;
+    showCopyButton: OptionType<BooleanType>;
+    title: OptionType<StringType>;
+}>;
+export type CodeBlockType = typeof CodeBlockType;
+/**
+ * Style configuration for CodeBlock components.
+ */
+export type CodeBlockStyle = {
+    /** Programming language for syntax highlighting */
+    language?: SubtypeExprOrValue<CodeLanguageType> | CodeLanguage;
+    /** Whether to show line numbers */
+    showLineNumbers?: SubtypeExprOrValue<BooleanType> | boolean;
+    /** Line numbers to highlight */
+    highlightLines?: SubtypeExprOrValue<ArrayType<IntegerType>>;
+    /** Maximum height with scroll (e.g., "400px") */
+    maxHeight?: SubtypeExprOrValue<StringType>;
+    /** Whether to show copy-to-clipboard button */
+    showCopyButton?: SubtypeExprOrValue<BooleanType> | boolean;
+    /** Optional title displayed in the header (e.g., filename) */
+    title?: SubtypeExprOrValue<StringType>;
+};
+//# sourceMappingURL=types.d.ts.map

package/dist/src/typography/code-block/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/typography/code-block/types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EACH,KAAK,kBAAkB,EACvB,UAAU,EACV,UAAU,EACV,UAAU,EACV,WAAW,EACX,SAAS,EACT,WAAW,EACX,WAAW,EACX,QAAQ,EACX,MAAM,eAAe,CAAC;AAMvB;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;EAe3B,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG,OAAO,gBAAgB,CAAC;AAEvD,kDAAkD;AAClD,MAAM,MAAM,YAAY,GAClB,YAAY,GACZ,YAAY,GACZ,MAAM,GACN,MAAM,GACN,KAAK,GACL,QAAQ,GACR,MAAM,GACN,IAAI,GACJ,KAAK,GACL,MAAM,GACN,UAAU,GACV,MAAM,GACN,KAAK,GACL,WAAW,CAAC;AAMlB;;;;;;;;;;GAUG;AACH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;EAQxB,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG,OAAO,aAAa,CAAC;AAMjD;;GAEG;AACH,MAAM,MAAM,cAAc,GAAG;IACzB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,kBAAkB,CAAC,gBAAgB,CAAC,GAAG,YAAY,CAAC;IAC/D,mCAAmC;IACnC,eAAe,CAAC,EAAE,kBAAkB,CAAC,WAAW,CAAC,GAAG,OAAO,CAAC;IAC5D,gCAAgC;IAChC,cAAc,CAAC,EAAE,kBAAkB,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC,CAAC;IAC5D,iDAAiD;IACjD,SAAS,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IAC3C,+CAA+C;IAC/C,cAAc,CAAC,EAAE,kBAAkB,CAAC,WAAW,CAAC,GAAG,OAAO,CAAC;IAC3D,8DAA8D;IAC9D,KAAK,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;CAC1C,CAAC"}

package/dist/src/typography/code-block/types.js

@@ -0,0 +1,70 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+import { OptionType, StringType, StructType, BooleanType, ArrayType, IntegerType, VariantType, NullType, } from "@elaraai/east";
+// ============================================================================
+// Language Type
+// ============================================================================
+/**
+ * Programming language variant type for syntax highlighting.
+ *
+ * @remarks
+ * These languages are pre-registered with the syntax highlighter.
+ * Create instances using `variant("typescript", null)` or the string shorthand.
+ *
+ * @property typescript - TypeScript language
+ * @property javascript - JavaScript language
+ * @property json - JSON format
+ * @property html - HTML markup
+ * @property css - CSS styles
+ * @property python - Python language
+ * @property rust - Rust language
+ * @property go - Go language
+ * @property sql - SQL queries
+ * @property bash - Bash/shell scripts
+ * @property markdown - Markdown text
+ * @property yaml - YAML configuration
+ * @property xml - XML markup
+ * @property plaintext - Plain text (no highlighting)
+ */
+export const CodeLanguageType = VariantType({
+    typescript: NullType,
+    javascript: NullType,
+    json: NullType,
+    html: NullType,
+    css: NullType,
+    python: NullType,
+    rust: NullType,
+    go: NullType,
+    sql: NullType,
+    bash: NullType,
+    markdown: NullType,
+    yaml: NullType,
+    xml: NullType,
+    plaintext: NullType,
+});
+// ============================================================================
+// CodeBlock Type
+// ============================================================================
+/**
+ * The concrete East type for CodeBlock component data.
+ *
+ * @property code - The code content to display
+ * @property language - Programming language for syntax highlighting
+ * @property showLineNumbers - Whether to show line numbers
+ * @property highlightLines - Line numbers to highlight
+ * @property maxHeight - Maximum height with scroll
+ * @property showCopyButton - Whether to show copy-to-clipboard button
+ * @property title - Optional title displayed in the header (e.g., filename)
+ */
+export const CodeBlockType = StructType({
+    code: StringType,
+    language: OptionType(CodeLanguageType),
+    showLineNumbers: OptionType(BooleanType),
+    highlightLines: OptionType(ArrayType(IntegerType)),
+    maxHeight: OptionType(StringType),
+    showCopyButton: OptionType(BooleanType),
+    title: OptionType(StringType),
+});
+//# sourceMappingURL=types.js.map

package/dist/src/typography/code-block/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/typography/code-block/types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAEH,UAAU,EACV,UAAU,EACV,UAAU,EACV,WAAW,EACX,SAAS,EACT,WAAW,EACX,WAAW,EACX,QAAQ,GACX,MAAM,eAAe,CAAC;AAEvB,+EAA+E;AAC/E,gBAAgB;AAChB,+EAA+E;AAE/E;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,WAAW,CAAC;IACxC,UAAU,EAAE,QAAQ;IACpB,UAAU,EAAE,QAAQ;IACpB,IAAI,EAAE,QAAQ;IACd,IAAI,EAAE,QAAQ;IACd,GAAG,EAAE,QAAQ;IACb,MAAM,EAAE,QAAQ;IAChB,IAAI,EAAE,QAAQ;IACd,EAAE,EAAE,QAAQ;IACZ,GAAG,EAAE,QAAQ;IACb,IAAI,EAAE,QAAQ;IACd,QAAQ,EAAE,QAAQ;IAClB,IAAI,EAAE,QAAQ;IACd,GAAG,EAAE,QAAQ;IACb,SAAS,EAAE,QAAQ;CACtB,CAAC,CAAC;AAqBH,+EAA+E;AAC/E,iBAAiB;AACjB,+EAA+E;AAE/E;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,UAAU,CAAC;IACpC,IAAI,EAAE,UAAU;IAChB,QAAQ,EAAE,UAAU,CAAC,gBAAgB,CAAC;IACtC,eAAe,EAAE,UAAU,CAAC,WAAW,CAAC;IACxC,cAAc,EAAE,UAAU,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IAClD,SAAS,EAAE,UAAU,CAAC,UAAU,CAAC;IACjC,cAAc,EAAE,UAAU,CAAC,WAAW,CAAC;IACvC,KAAK,EAAE,UAAU,CAAC,UAAU,CAAC;CAChC,CAAC,CAAC"}

package/dist/src/typography/heading/index.d.ts

@@ -0,0 +1,92 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+import { type SubtypeExprOrValue, type ExprType, StringType } from "@elaraai/east";
+import { UIComponentType } from "../../component.js";
+import { type HeadingStyle } from "./types.js";
+export { HeadingType, HeadingSizeType, HeadingAsType, type HeadingStyle } from "./types.js";
+/**
+ * Creates a Heading component for semantic headings.
+ *
+ * @param value - The heading text
+ * @param style - Optional styling configuration
+ * @returns An East expression representing the heading component
+ */
+declare function createHeading(value: SubtypeExprOrValue<StringType>, style?: HeadingStyle): ExprType<UIComponentType>;
+/**
+ * Heading component for semantic HTML headings.
+ *
+ * @remarks
+ * Use `Heading.Root(value, style)` to create headings with semantic HTML elements.
+ *
+ * @example
+ * ```ts
+ * import { East } from "@elaraai/east";
+ * import { Heading, UIComponentType } from "@elaraai/east-ui";
+ *
+ * const example = East.function([], UIComponentType, $ => {
+ *     return Heading.Root("Welcome", {
+ *         size: "2xl",
+ *         as: "h1",
+ *         color: "blue.600",
+ *     });
+ * });
+ * ```
+ */
+export declare const Heading: {
+    readonly Root: typeof createHeading;
+    readonly Types: {
+        readonly Heading: import("@elaraai/east").StructType<{
+            value: StringType;
+            size: import("@elaraai/east").OptionType<import("@elaraai/east").VariantType<{
+                xs: import("@elaraai/east").NullType;
+                sm: import("@elaraai/east").NullType;
+                md: import("@elaraai/east").NullType;
+                lg: import("@elaraai/east").NullType;
+                xl: import("@elaraai/east").NullType;
+                "2xl": import("@elaraai/east").NullType;
+                "3xl": import("@elaraai/east").NullType;
+                "4xl": import("@elaraai/east").NullType;
+                "5xl": import("@elaraai/east").NullType;
+                "6xl": import("@elaraai/east").NullType;
+            }>>;
+            as: import("@elaraai/east").OptionType<import("@elaraai/east").VariantType<{
+                h1: import("@elaraai/east").NullType;
+                h2: import("@elaraai/east").NullType;
+                h3: import("@elaraai/east").NullType;
+                h4: import("@elaraai/east").NullType;
+                h5: import("@elaraai/east").NullType;
+                h6: import("@elaraai/east").NullType;
+            }>>;
+            color: import("@elaraai/east").OptionType<StringType>;
+            textAlign: import("@elaraai/east").OptionType<import("@elaraai/east").VariantType<{
+                left: import("@elaraai/east").NullType;
+                center: import("@elaraai/east").NullType;
+                right: import("@elaraai/east").NullType;
+                justify: import("@elaraai/east").NullType;
+            }>>;
+        }>;
+        readonly Size: import("@elaraai/east").VariantType<{
+            xs: import("@elaraai/east").NullType;
+            sm: import("@elaraai/east").NullType;
+            md: import("@elaraai/east").NullType;
+            lg: import("@elaraai/east").NullType;
+            xl: import("@elaraai/east").NullType;
+            "2xl": import("@elaraai/east").NullType;
+            "3xl": import("@elaraai/east").NullType;
+            "4xl": import("@elaraai/east").NullType;
+            "5xl": import("@elaraai/east").NullType;
+            "6xl": import("@elaraai/east").NullType;
+        }>;
+        readonly As: import("@elaraai/east").VariantType<{
+            h1: import("@elaraai/east").NullType;
+            h2: import("@elaraai/east").NullType;
+            h3: import("@elaraai/east").NullType;
+            h4: import("@elaraai/east").NullType;
+            h5: import("@elaraai/east").NullType;
+            h6: import("@elaraai/east").NullType;
+        }>;
+    };
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/src/typography/heading/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/typography/heading/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EACH,KAAK,kBAAkB,EACvB,KAAK,QAAQ,EAEb,UAAU,EAEb,MAAM,eAAe,CAAC;AAGvB,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAA+C,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAG5F,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,aAAa,EAAE,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAM5F;;;;;;GAMG;AACH,iBAAS,aAAa,CAClB,KAAK,EAAE,kBAAkB,CAAC,UAAU,CAAC,EACrC,KAAK,CAAC,EAAE,YAAY,GACrB,QAAQ,CAAC,eAAe,CAAC,CA0B3B;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAOV,CAAC"}

package/dist/src/typography/heading/index.js

@@ -0,0 +1,73 @@
+/**
+ * Copyright (c) 2025 Elara AI Pty Ltd
+ * Dual-licensed under AGPL-3.0 and commercial license. See LICENSE for details.
+ */
+import { East, StringType, variant, } from "@elaraai/east";
+import { TextAlignType } from "../../style.js";
+import { UIComponentType } from "../../component.js";
+import { HeadingType, HeadingSizeType, HeadingAsType } from "./types.js";
+// Re-export types
+export { HeadingType, HeadingSizeType, HeadingAsType } from "./types.js";
+// ============================================================================
+// Heading Component
+// ============================================================================
+/**
+ * Creates a Heading component for semantic headings.
+ *
+ * @param value - The heading text
+ * @param style - Optional styling configuration
+ * @returns An East expression representing the heading component
+ */
+function createHeading(value, style) {
+    const sizeValue = style?.size
+        ? (typeof style.size === "string"
+            ? East.value(variant(style.size, null), HeadingSizeType)
+            : style.size)
+        : undefined;
+    const asValue = style?.as
+        ? (typeof style.as === "string"
+            ? East.value(variant(style.as, null), HeadingAsType)
+            : style.as)
+        : undefined;
+    const textAlignValue = style?.textAlign
+        ? (typeof style.textAlign === "string"
+            ? East.value(variant(style.textAlign, null), TextAlignType)
+            : style.textAlign)
+        : undefined;
+    return East.value(variant("Heading", {
+        value: value,
+        size: sizeValue ? variant("some", sizeValue) : variant("none", null),
+        as: asValue ? variant("some", asValue) : variant("none", null),
+        color: style?.color ? variant("some", style.color) : variant("none", null),
+        textAlign: textAlignValue ? variant("some", textAlignValue) : variant("none", null),
+    }), UIComponentType);
+}
+/**
+ * Heading component for semantic HTML headings.
+ *
+ * @remarks
+ * Use `Heading.Root(value, style)` to create headings with semantic HTML elements.
+ *
+ * @example
+ * ```ts
+ * import { East } from "@elaraai/east";
+ * import { Heading, UIComponentType } from "@elaraai/east-ui";
+ *
+ * const example = East.function([], UIComponentType, $ => {
+ *     return Heading.Root("Welcome", {
+ *         size: "2xl",
+ *         as: "h1",
+ *         color: "blue.600",
+ *     });
+ * });
+ * ```
+ */
+export const Heading = {
+    Root: createHeading,
+    Types: {
+        Heading: HeadingType,
+        Size: HeadingSizeType,
+        As: HeadingAsType,
+    },
+};
+//# sourceMappingURL=index.js.map

package/dist/src/typography/heading/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/typography/heading/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAGH,IAAI,EACJ,UAAU,EACV,OAAO,GACV,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,aAAa,EAAqB,MAAM,YAAY,CAAC;AAE5F,kBAAkB;AAClB,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,aAAa,EAAqB,MAAM,YAAY,CAAC;AAE5F,+EAA+E;AAC/E,oBAAoB;AACpB,+EAA+E;AAE/E;;;;;;GAMG;AACH,SAAS,aAAa,CAClB,KAAqC,EACrC,KAAoB;IAEpB,MAAM,SAAS,GAAG,KAAK,EAAE,IAAI;QACzB,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,IAAI,KAAK,QAAQ;YAC7B,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,eAAe,CAAC;YACxD,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC;QACjB,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,OAAO,GAAG,KAAK,EAAE,EAAE;QACrB,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,EAAE,KAAK,QAAQ;YAC3B,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,EAAE,IAAI,CAAC,EAAE,aAAa,CAAC;YACpD,CAAC,CAAC,KAAK,CAAC,EAAE,CAAC;QACf,CAAC,CAAC,SAAS,CAAC;IAEhB,MAAM,cAAc,GAAG,KAAK,EAAE,SAAS;QACnC,CAAC,CAAC,CAAC,OAAO,KAAK,CAAC,SAAS,KAAK,QAAQ;YAClC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,EAAE,IAAI,CAAC,EAAE,aAAa,CAAC;YAC3D,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC;QACtB,CAAC,CAAC,SAAS,CAAC;IAEhB,OAAO,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS,EAAE;QACjC,KAAK,EAAE,KAAK;QACZ,IAAI,EAAE,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;QACpE,EAAE,EAAE,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;QAC9D,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;QAC1E,SAAS,EAAE,cAAc,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC;KACtF,CAAC,EAAE,eAAe,CAAC,CAAC;AACzB,CAAC;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG;IACnB,IAAI,EAAE,aAAa;IACnB,KAAK,EAAE;QACH,OAAO,EAAE,WAAW;QACpB,IAAI,EAAE,eAAe;QACrB,EAAE,EAAE,aAAa;KACpB;CACK,CAAC"}