magnaui 0.1.0

package/dist/components/magna/chat-composer.module.css

@@ -0,0 +1,36 @@
+.waveform {
+  display: flex;
+  height: 32px;
+  align-items: center;
+  justify-content: center;
+  gap: 3px;
+  overflow: hidden;
+}
+
+.waveform > span {
+  width: 3px;
+  flex-shrink: 0;
+  border-radius: 999px;
+  background: currentColor;
+  animation: recording-wave 900ms ease-in-out infinite alternate;
+  transform-origin: center;
+}
+
+.waveform[data-paused] > span {
+  animation-play-state: paused;
+}
+
+@keyframes recording-wave {
+  from {
+    transform: scaleY(0.35);
+  }
+  to {
+    transform: scaleY(1);
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .waveform > span {
+    animation: none;
+  }
+}

package/dist/components/magna/desktop-button.d.ts

@@ -0,0 +1,8 @@
+import * as React from "react";
+export interface DesktopButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: 'bordered' | 'borderless' | 'tinted' | 'destructive' | 'prominent' | 'destructive-prominent';
+    context?: 'content' | 'glass';
+    windowActive?: boolean;
+}
+/** The 24px desktop button family. Interaction states come from Figma's 72 variants. */
+export declare const DesktopButton: React.ForwardRefExoticComponent<DesktopButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/components/magna/desktop-button.js

@@ -0,0 +1,10 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../../utils/cn.js";
+/** The 24px desktop button family. Interaction states come from Figma's 72 variants. */
+export const DesktopButton = React.forwardRef(({ variant = 'bordered', context = 'content', windowActive = true, className, children, ...props }, ref) => (_jsx("button", { ref: ref, type: 'button', "data-variant": variant, "data-context": context, "data-window-active": windowActive, className: cn('magna-desktop-button relative isolate inline-flex h-6 items-center justify-center overflow-hidden rounded-full px-4 text-[13px] font-medium leading-5 tracking-[-0.006em] outline-none before:absolute before:inset-0 before:-z-10 before:bg-[var(--desktop-bg)] before:opacity-[var(--desktop-bg-opacity)] focus-visible:ring-2 focus-visible:ring-primary-base focus-visible:ring-offset-2 disabled:cursor-not-allowed', className), ...props, children: _jsx("span", { style: {
+            color: 'var(--desktop-text)',
+            opacity: 'var(--desktop-text-opacity)',
+        }, children: children }) })));
+DesktopButton.displayName = 'DesktopButton';

package/dist/components/magna/desktop-switch.d.ts

@@ -0,0 +1,4 @@
+import * as React from "react";
+import * as Switch from "@radix-ui/react-switch";
+/** Figma Toggles - Switches: 54 × 24 track, 32 × 20 thumb. */
+export declare const DesktopSwitch: React.ForwardRefExoticComponent<Omit<Switch.SwitchProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/components/magna/desktop-switch.js

@@ -0,0 +1,8 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import * as Switch from "@radix-ui/react-switch";
+import { cn } from "../../utils/cn.js";
+/** Figma Toggles - Switches: 54 × 24 track, 32 × 20 thumb. */
+export const DesktopSwitch = React.forwardRef(({ className, ...props }, ref) => (_jsx(Switch.Root, { ref: ref, className: cn('group relative h-6 w-[54px] shrink-0 rounded-full bg-[rgba(0,0,0,0.085)] p-0.5 transition-colors focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-base disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-[#0088ff] dark:data-[state=unchecked]:bg-white-alpha-16', className), ...props, children: _jsx(Switch.Thumb, { className: 'absolute start-0.5 top-0.5 block h-5 w-8 rounded-full bg-static-white shadow-[0_3px_36px_rgba(0,0,0,0.05)] transition-transform data-[state=checked]:translate-x-[18px] motion-reduce:transition-none rtl:data-[state=checked]:-translate-x-[18px]' }) })));
+DesktopSwitch.displayName = 'DesktopSwitch';

package/dist/components/magna/file-tile.d.ts

@@ -0,0 +1,9 @@
+import * as React from "react";
+import type { MagnaAppId } from "./apps.js";
+/** Figma File set 199743:174512, with readable text at application scale. */
+export declare function FileTile({ kind, label, app, selected, className, ...props }: {
+    kind?: 'file' | 'folder' | 'app';
+    label: string;
+    app?: MagnaAppId;
+    selected?: boolean;
+} & React.ButtonHTMLAttributes<HTMLButtonElement>): import("react/jsx-runtime").JSX.Element;

package/dist/components/magna/file-tile.js

@@ -0,0 +1,11 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { resolveMagnaAsset as __resolveMagnaAsset_1 } from "../../magna-assets.js";
+import { cn } from "../../utils/cn.js";
+import { AppIcon } from "./app-icon.js";
+/** Figma File set 199743:174512, with readable text at application scale. */
+export function FileTile({ kind = 'folder', label, app = 'today', selected, className, ...props }) {
+    return (_jsxs("button", { type: 'button', "aria-pressed": selected, className: cn('flex w-[88px] flex-col items-center gap-2 rounded-xl p-2 hover:bg-bg-weak-50 focus-visible:outline focus-visible:outline-2 focus-visible:outline-primary-base', selected && 'bg-primary-alpha-10', className), ...props, children: [kind === 'app' ? (_jsx(AppIcon, { app: app, size: 34, decorative: true })) : (
+            // eslint-disable-next-line @next/next/no-img-element
+            _jsx("img", { src: __resolveMagnaAsset_1(`/magna/${kind}.png`), width: 34, height: 30, alt: '', className: 'h-[30px] w-[34px] object-contain' })), _jsx("span", { className: 'w-full truncate text-center text-label-xs', children: label })] }));
+}

package/dist/components/magna/index.d.ts

@@ -0,0 +1,11 @@
+export { AppIcon, AppLauncher } from "./app-icon.js";
+export { MagnaLogo, type MagnaLogoProps, type MagnaLogoAutoVariant, } from "./logo.js";
+export { magnaLogoVariants, type MagnaLogoVariant } from "./logo-variants.js";
+export { magnaApps, type MagnaAppId } from "./apps.js";
+export { ChatComposer, type ChatComposerProps, type ChatComposerStatus, } from "./chat-composer.js";
+export { ChatActivity, type ChatActivityProps } from "./chat-activity.js";
+export { DesktopButton, type DesktopButtonProps } from "./desktop-button.js";
+export { DesktopSwitch } from "./desktop-switch.js";
+export { FileTile } from "./file-tile.js";
+export { MagnaNavigation, defaultNavItems, type MagnaNavItem, } from "./navigation.js";
+export { ProjectContext } from "./project-context.js";

package/dist/components/magna/index.js

@@ -0,0 +1,11 @@
+export { AppIcon, AppLauncher } from "./app-icon.js";
+export { MagnaLogo, } from "./logo.js";
+export { magnaLogoVariants } from "./logo-variants.js";
+export { magnaApps } from "./apps.js";
+export { ChatComposer, } from "./chat-composer.js";
+export { ChatActivity } from "./chat-activity.js";
+export { DesktopButton } from "./desktop-button.js";
+export { DesktopSwitch } from "./desktop-switch.js";
+export { FileTile } from "./file-tile.js";
+export { MagnaNavigation, defaultNavItems, } from "./navigation.js";
+export { ProjectContext } from "./project-context.js";

package/dist/components/magna/logo-variants.d.ts

@@ -0,0 +1,243 @@
+/** Every exact variant from the Magna Figma logo component set. */
+export declare const magnaLogoVariants: readonly [{
+    readonly id: "glyph-black";
+    readonly name: "Glyph · Black";
+    readonly family: "glyph";
+    readonly treatment: "black";
+    readonly src: string;
+    readonly width: 900;
+    readonly height: 900;
+    readonly figmaNodeId: "199756:174767";
+    readonly figmaName: "Magna AI_RGB_Logo_Glyph_Black 2";
+}, {
+    readonly id: "glyph-white";
+    readonly name: "Glyph · White";
+    readonly family: "glyph";
+    readonly treatment: "white";
+    readonly src: string;
+    readonly width: 900;
+    readonly height: 900;
+    readonly figmaNodeId: "199756:174790";
+    readonly figmaName: "Magna AI_RGB_Logo_Glyph_Secondary_White 1";
+}, {
+    readonly id: "glyph-color";
+    readonly name: "Glyph · Full color";
+    readonly family: "glyph";
+    readonly treatment: "color";
+    readonly src: string;
+    readonly width: 900;
+    readonly height: 901;
+    readonly figmaNodeId: "199756:174781";
+    readonly figmaName: "Magna AI_RGB_Logo_Glyph_Primary_Colored 1";
+}, {
+    readonly id: "horizontal-black";
+    readonly name: "Horizontal · Black";
+    readonly family: "horizontal";
+    readonly treatment: "black";
+    readonly src: string;
+    readonly width: 3163;
+    readonly height: 900;
+    readonly figmaNodeId: "199756:174809";
+    readonly figmaName: "Magna AI_RGB_Logo_Horizontal_Black 1";
+}, {
+    readonly id: "horizontal-white";
+    readonly name: "Horizontal · White";
+    readonly family: "horizontal";
+    readonly treatment: "white";
+    readonly src: string;
+    readonly width: 3163;
+    readonly height: 900;
+    readonly figmaNodeId: "199756:174889";
+    readonly figmaName: "Magna AI_RGB_Logo_Horizontal_White 1";
+}, {
+    readonly id: "horizontal-color-black";
+    readonly name: "Horizontal · Color / black text";
+    readonly family: "horizontal";
+    readonly treatment: "color-black";
+    readonly src: string;
+    readonly width: 3163;
+    readonly height: 901;
+    readonly figmaNodeId: "199756:174890";
+    readonly figmaName: "Magna AI_RGB_Logo_Horizontal_Colored_Black Text 1";
+}, {
+    readonly id: "horizontal-color-white";
+    readonly name: "Horizontal · Color / white text";
+    readonly family: "horizontal";
+    readonly treatment: "color-white";
+    readonly src: string;
+    readonly width: 3163;
+    readonly height: 901;
+    readonly figmaNodeId: "199756:174872";
+    readonly figmaName: "Magna AI_RGB_Logo_Horizontal_Colored_White Text 1";
+}, {
+    readonly id: "stacked-black";
+    readonly name: "Stacked · Black";
+    readonly family: "stacked";
+    readonly treatment: "black";
+    readonly src: string;
+    readonly width: 1200;
+    readonly height: 1200;
+    readonly figmaNodeId: "199756:175256";
+    readonly figmaName: "Magna AI_RGB_Logo_Stacked_Black 1";
+}, {
+    readonly id: "stacked-white";
+    readonly name: "Stacked · White";
+    readonly family: "stacked";
+    readonly treatment: "white";
+    readonly src: string;
+    readonly width: 1200;
+    readonly height: 1200;
+    readonly figmaNodeId: "199756:175249";
+    readonly figmaName: "Magna AI_RGB_Logo_Stacked_White 1";
+}, {
+    readonly id: "stacked-color-black";
+    readonly name: "Stacked · Color / black text";
+    readonly family: "stacked";
+    readonly treatment: "color-black";
+    readonly src: string;
+    readonly width: 1200;
+    readonly height: 1200;
+    readonly figmaNodeId: "199756:175251";
+    readonly figmaName: "Magna AI_RGB_Logo_Stacked_Colored_Black Text 1";
+}, {
+    readonly id: "stacked-color-white";
+    readonly name: "Stacked · Color / white text";
+    readonly family: "stacked";
+    readonly treatment: "color-white";
+    readonly src: string;
+    readonly width: 1200;
+    readonly height: 1200;
+    readonly figmaNodeId: "199756:175250";
+    readonly figmaName: "Magna AI_RGB_Logo_Stacked_Colored_White Text 2";
+}, {
+    readonly id: "tagline-horizontal-black";
+    readonly name: "Horizontal tagline · Black";
+    readonly family: "tagline-horizontal";
+    readonly treatment: "black";
+    readonly src: string;
+    readonly width: 3162;
+    readonly height: 980;
+    readonly figmaNodeId: "199756:175015";
+    readonly figmaName: "Magna AI_RGB_Logo_Tagline_Primary_Horizontal_Black 1";
+}, {
+    readonly id: "tagline-horizontal-white";
+    readonly name: "Horizontal tagline · White";
+    readonly family: "tagline-horizontal";
+    readonly treatment: "white";
+    readonly src: string;
+    readonly width: 3162;
+    readonly height: 980;
+    readonly figmaNodeId: "199756:175006";
+    readonly figmaName: "Magna AI_RGB_Logo_Tagline_Primary_Horizontal_White 1";
+}, {
+    readonly id: "tagline-horizontal-color-black";
+    readonly name: "Horizontal tagline · Color / black text";
+    readonly family: "tagline-horizontal";
+    readonly treatment: "color-black";
+    readonly src: string;
+    readonly width: 3162;
+    readonly height: 980;
+    readonly figmaNodeId: "199756:175012";
+    readonly figmaName: "Magna AI_RGB_Logo_Tagline_Primary_Horizontal_Colored_Black Text 1";
+}, {
+    readonly id: "tagline-horizontal-color-white";
+    readonly name: "Horizontal tagline · Color / white text";
+    readonly family: "tagline-horizontal";
+    readonly treatment: "color-white";
+    readonly src: string;
+    readonly width: 3163;
+    readonly height: 980;
+    readonly figmaNodeId: "199756:175009";
+    readonly figmaName: "Magna AI_RGB_Logo_Tagline_Primary_Horizontal_Colored_White Text 1";
+}, {
+    readonly id: "tagline-stacked-black";
+    readonly name: "Stacked tagline · Black";
+    readonly family: "tagline-stacked";
+    readonly treatment: "black";
+    readonly src: string;
+    readonly width: 1200;
+    readonly height: 1200;
+    readonly figmaNodeId: "199756:175255";
+    readonly figmaName: "Magna AI_RGB_Logo_Tagline_Primary_Stacked_Black 1";
+}, {
+    readonly id: "tagline-stacked-white";
+    readonly name: "Stacked tagline · White";
+    readonly family: "tagline-stacked";
+    readonly treatment: "white";
+    readonly src: string;
+    readonly width: 1200;
+    readonly height: 1200;
+    readonly figmaNodeId: "199756:175254";
+    readonly figmaName: "Magna AI_RGB_Logo_Tagline_Primary_Stacked_White 1";
+}, {
+    readonly id: "tagline-stacked-color-black";
+    readonly name: "Stacked tagline · Color / black text";
+    readonly family: "tagline-stacked";
+    readonly treatment: "color-black";
+    readonly src: string;
+    readonly width: 1200;
+    readonly height: 1200;
+    readonly figmaNodeId: "199756:175252";
+    readonly figmaName: "Magna AI_RGB_Logo_Tagline_Primary_Stacked_Colored_Black Text 1";
+}, {
+    readonly id: "tagline-stacked-color-white";
+    readonly name: "Stacked tagline · Color / white text";
+    readonly family: "tagline-stacked";
+    readonly treatment: "color-white";
+    readonly src: string;
+    readonly width: 1200;
+    readonly height: 1200;
+    readonly figmaNodeId: "199756:175253";
+    readonly figmaName: "Magna AI_RGB_Logo_Tagline_Primary_Stacked_Colored_White Text 1";
+}, {
+    readonly id: "tagline-inline-black";
+    readonly name: "Inline tagline · Black";
+    readonly family: "tagline-inline";
+    readonly treatment: "black";
+    readonly src: string;
+    readonly width: 4667;
+    readonly height: 900;
+    readonly figmaNodeId: "199756:175392";
+    readonly figmaName: "Magna AI_RGB_Logo_Tagline_Secondary_Stacked_Black 1";
+}, {
+    readonly id: "tagline-inline-white";
+    readonly name: "Inline tagline · White";
+    readonly family: "tagline-inline";
+    readonly treatment: "white";
+    readonly src: string;
+    readonly width: 4667;
+    readonly height: 900;
+    readonly figmaNodeId: "199756:175391";
+    readonly figmaName: "Magna AI_RGB_Logo_Tagline_Secondary_Stacked_White 1";
+}, {
+    readonly id: "tagline-inline-color-black";
+    readonly name: "Inline tagline · Color / black text";
+    readonly family: "tagline-inline";
+    readonly treatment: "color-black";
+    readonly src: string;
+    readonly width: 4667;
+    readonly height: 901;
+    readonly figmaNodeId: "199756:175393";
+    readonly figmaName: "Magna AI_RGB_Logo_Tagline_Secondary_Horizontal_Colored_Black Text 1";
+}, {
+    readonly id: "tagline-inline-color-white";
+    readonly name: "Inline tagline · Color / white text";
+    readonly family: "tagline-inline";
+    readonly treatment: "color-white";
+    readonly src: string;
+    readonly width: 4667;
+    readonly height: 901;
+    readonly figmaNodeId: "199756:175395";
+    readonly figmaName: "Magna AI_RGB_Logo_Tagline_Secondary_Horizontal_Colored_White Text 1";
+}, {
+    readonly id: "tagline-inline-color-white-alt";
+    readonly name: "Inline tagline · Color / white text (alternate)";
+    readonly family: "tagline-inline";
+    readonly treatment: "color-white";
+    readonly src: string;
+    readonly width: 4667;
+    readonly height: 901;
+    readonly figmaNodeId: "199756:175394";
+    readonly figmaName: "Magna AI_RGB_Logo_Tagline_Secondary_Horizontal_Colored_White Text 2";
+}];
+export type MagnaLogoVariant = (typeof magnaLogoVariants)[number]['id'];

package/dist/components/magna/logo-variants.js

@@ -0,0 +1,268 @@
+import { resolveMagnaAsset as __resolveMagnaAsset_1 } from "../../magna-assets.js";
+/** Every exact variant from the Magna Figma logo component set. */
+export const magnaLogoVariants = [
+    {
+        id: 'glyph-black',
+        name: 'Glyph \u00b7 Black',
+        family: 'glyph',
+        treatment: 'black',
+        src: __resolveMagnaAsset_1('/magna/logos/glyph-black.svg'),
+        width: 900.0,
+        height: 900.0,
+        figmaNodeId: '199756:174767',
+        figmaName: 'Magna AI_RGB_Logo_Glyph_Black 2',
+    },
+    {
+        id: 'glyph-white',
+        name: 'Glyph \u00b7 White',
+        family: 'glyph',
+        treatment: 'white',
+        src: __resolveMagnaAsset_1('/magna/logos/glyph-white.svg'),
+        width: 900.0,
+        height: 900.0,
+        figmaNodeId: '199756:174790',
+        figmaName: 'Magna AI_RGB_Logo_Glyph_Secondary_White 1',
+    },
+    {
+        id: 'glyph-color',
+        name: 'Glyph \u00b7 Full color',
+        family: 'glyph',
+        treatment: 'color',
+        src: __resolveMagnaAsset_1('/magna/logos/glyph-color.svg'),
+        width: 900.0,
+        height: 901.0,
+        figmaNodeId: '199756:174781',
+        figmaName: 'Magna AI_RGB_Logo_Glyph_Primary_Colored 1',
+    },
+    {
+        id: 'horizontal-black',
+        name: 'Horizontal \u00b7 Black',
+        family: 'horizontal',
+        treatment: 'black',
+        src: __resolveMagnaAsset_1('/magna/logos/horizontal-black.svg'),
+        width: 3163.0,
+        height: 900.0,
+        figmaNodeId: '199756:174809',
+        figmaName: 'Magna AI_RGB_Logo_Horizontal_Black 1',
+    },
+    {
+        id: 'horizontal-white',
+        name: 'Horizontal \u00b7 White',
+        family: 'horizontal',
+        treatment: 'white',
+        src: __resolveMagnaAsset_1('/magna/logos/horizontal-white.svg'),
+        width: 3163.0,
+        height: 900.0,
+        figmaNodeId: '199756:174889',
+        figmaName: 'Magna AI_RGB_Logo_Horizontal_White 1',
+    },
+    {
+        id: 'horizontal-color-black',
+        name: 'Horizontal \u00b7 Color / black text',
+        family: 'horizontal',
+        treatment: 'color-black',
+        src: __resolveMagnaAsset_1('/magna/logos/horizontal-color-black.svg'),
+        width: 3163.0,
+        height: 901.0,
+        figmaNodeId: '199756:174890',
+        figmaName: 'Magna AI_RGB_Logo_Horizontal_Colored_Black Text 1',
+    },
+    {
+        id: 'horizontal-color-white',
+        name: 'Horizontal \u00b7 Color / white text',
+        family: 'horizontal',
+        treatment: 'color-white',
+        src: __resolveMagnaAsset_1('/magna/logos/horizontal-color-white.svg'),
+        width: 3163.0,
+        height: 901.0,
+        figmaNodeId: '199756:174872',
+        figmaName: 'Magna AI_RGB_Logo_Horizontal_Colored_White Text 1',
+    },
+    {
+        id: 'stacked-black',
+        name: 'Stacked \u00b7 Black',
+        family: 'stacked',
+        treatment: 'black',
+        src: __resolveMagnaAsset_1('/magna/logos/stacked-black.svg'),
+        width: 1200.0,
+        height: 1200.0,
+        figmaNodeId: '199756:175256',
+        figmaName: 'Magna AI_RGB_Logo_Stacked_Black 1',
+    },
+    {
+        id: 'stacked-white',
+        name: 'Stacked \u00b7 White',
+        family: 'stacked',
+        treatment: 'white',
+        src: __resolveMagnaAsset_1('/magna/logos/stacked-white.svg'),
+        width: 1200.0,
+        height: 1200.0,
+        figmaNodeId: '199756:175249',
+        figmaName: 'Magna AI_RGB_Logo_Stacked_White 1',
+    },
+    {
+        id: 'stacked-color-black',
+        name: 'Stacked \u00b7 Color / black text',
+        family: 'stacked',
+        treatment: 'color-black',
+        src: __resolveMagnaAsset_1('/magna/logos/stacked-color-black.svg'),
+        width: 1200.0,
+        height: 1200.0,
+        figmaNodeId: '199756:175251',
+        figmaName: 'Magna AI_RGB_Logo_Stacked_Colored_Black Text 1',
+    },
+    {
+        id: 'stacked-color-white',
+        name: 'Stacked \u00b7 Color / white text',
+        family: 'stacked',
+        treatment: 'color-white',
+        src: __resolveMagnaAsset_1('/magna/logos/stacked-color-white.svg'),
+        width: 1200.0,
+        height: 1200.0,
+        figmaNodeId: '199756:175250',
+        figmaName: 'Magna AI_RGB_Logo_Stacked_Colored_White Text 2',
+    },
+    {
+        id: 'tagline-horizontal-black',
+        name: 'Horizontal tagline \u00b7 Black',
+        family: 'tagline-horizontal',
+        treatment: 'black',
+        src: __resolveMagnaAsset_1('/magna/logos/tagline-horizontal-black.svg'),
+        width: 3162.0,
+        height: 980.0,
+        figmaNodeId: '199756:175015',
+        figmaName: 'Magna AI_RGB_Logo_Tagline_Primary_Horizontal_Black 1',
+    },
+    {
+        id: 'tagline-horizontal-white',
+        name: 'Horizontal tagline \u00b7 White',
+        family: 'tagline-horizontal',
+        treatment: 'white',
+        src: __resolveMagnaAsset_1('/magna/logos/tagline-horizontal-white.svg'),
+        width: 3162.0,
+        height: 980.0,
+        figmaNodeId: '199756:175006',
+        figmaName: 'Magna AI_RGB_Logo_Tagline_Primary_Horizontal_White 1',
+    },
+    {
+        id: 'tagline-horizontal-color-black',
+        name: 'Horizontal tagline \u00b7 Color / black text',
+        family: 'tagline-horizontal',
+        treatment: 'color-black',
+        src: __resolveMagnaAsset_1('/magna/logos/tagline-horizontal-color-black.svg'),
+        width: 3162.0,
+        height: 980.0,
+        figmaNodeId: '199756:175012',
+        figmaName: 'Magna AI_RGB_Logo_Tagline_Primary_Horizontal_Colored_Black Text 1',
+    },
+    {
+        id: 'tagline-horizontal-color-white',
+        name: 'Horizontal tagline \u00b7 Color / white text',
+        family: 'tagline-horizontal',
+        treatment: 'color-white',
+        src: __resolveMagnaAsset_1('/magna/logos/tagline-horizontal-color-white.svg'),
+        width: 3163.0,
+        height: 980.0,
+        figmaNodeId: '199756:175009',
+        figmaName: 'Magna AI_RGB_Logo_Tagline_Primary_Horizontal_Colored_White Text 1',
+    },
+    {
+        id: 'tagline-stacked-black',
+        name: 'Stacked tagline \u00b7 Black',
+        family: 'tagline-stacked',
+        treatment: 'black',
+        src: __resolveMagnaAsset_1('/magna/logos/tagline-stacked-black.svg'),
+        width: 1200.0,
+        height: 1200.0,
+        figmaNodeId: '199756:175255',
+        figmaName: 'Magna AI_RGB_Logo_Tagline_Primary_Stacked_Black 1',
+    },
+    {
+        id: 'tagline-stacked-white',
+        name: 'Stacked tagline \u00b7 White',
+        family: 'tagline-stacked',
+        treatment: 'white',
+        src: __resolveMagnaAsset_1('/magna/logos/tagline-stacked-white.svg'),
+        width: 1200.0,
+        height: 1200.0,
+        figmaNodeId: '199756:175254',
+        figmaName: 'Magna AI_RGB_Logo_Tagline_Primary_Stacked_White 1',
+    },
+    {
+        id: 'tagline-stacked-color-black',
+        name: 'Stacked tagline \u00b7 Color / black text',
+        family: 'tagline-stacked',
+        treatment: 'color-black',
+        src: __resolveMagnaAsset_1('/magna/logos/tagline-stacked-color-black.svg'),
+        width: 1200.0,
+        height: 1200.0,
+        figmaNodeId: '199756:175252',
+        figmaName: 'Magna AI_RGB_Logo_Tagline_Primary_Stacked_Colored_Black Text 1',
+    },
+    {
+        id: 'tagline-stacked-color-white',
+        name: 'Stacked tagline \u00b7 Color / white text',
+        family: 'tagline-stacked',
+        treatment: 'color-white',
+        src: __resolveMagnaAsset_1('/magna/logos/tagline-stacked-color-white.svg'),
+        width: 1200.0,
+        height: 1200.0,
+        figmaNodeId: '199756:175253',
+        figmaName: 'Magna AI_RGB_Logo_Tagline_Primary_Stacked_Colored_White Text 1',
+    },
+    {
+        id: 'tagline-inline-black',
+        name: 'Inline tagline \u00b7 Black',
+        family: 'tagline-inline',
+        treatment: 'black',
+        src: __resolveMagnaAsset_1('/magna/logos/tagline-inline-black.svg'),
+        width: 4667.0,
+        height: 900.0,
+        figmaNodeId: '199756:175392',
+        figmaName: 'Magna AI_RGB_Logo_Tagline_Secondary_Stacked_Black 1',
+    },
+    {
+        id: 'tagline-inline-white',
+        name: 'Inline tagline \u00b7 White',
+        family: 'tagline-inline',
+        treatment: 'white',
+        src: __resolveMagnaAsset_1('/magna/logos/tagline-inline-white.svg'),
+        width: 4667.0,
+        height: 900.0,
+        figmaNodeId: '199756:175391',
+        figmaName: 'Magna AI_RGB_Logo_Tagline_Secondary_Stacked_White 1',
+    },
+    {
+        id: 'tagline-inline-color-black',
+        name: 'Inline tagline \u00b7 Color / black text',
+        family: 'tagline-inline',
+        treatment: 'color-black',
+        src: __resolveMagnaAsset_1('/magna/logos/tagline-inline-color-black.svg'),
+        width: 4667.0,
+        height: 901.0,
+        figmaNodeId: '199756:175393',
+        figmaName: 'Magna AI_RGB_Logo_Tagline_Secondary_Horizontal_Colored_Black Text 1',
+    },
+    {
+        id: 'tagline-inline-color-white',
+        name: 'Inline tagline \u00b7 Color / white text',
+        family: 'tagline-inline',
+        treatment: 'color-white',
+        src: __resolveMagnaAsset_1('/magna/logos/tagline-inline-color-white.svg'),
+        width: 4667.0,
+        height: 901.0,
+        figmaNodeId: '199756:175395',
+        figmaName: 'Magna AI_RGB_Logo_Tagline_Secondary_Horizontal_Colored_White Text 1',
+    },
+    {
+        id: 'tagline-inline-color-white-alt',
+        name: 'Inline tagline \u00b7 Color / white text (alternate)',
+        family: 'tagline-inline',
+        treatment: 'color-white',
+        src: __resolveMagnaAsset_1('/magna/logos/tagline-inline-color-white-alt.svg'),
+        width: 4667.0,
+        height: 901.0,
+        figmaNodeId: '199756:175394',
+        figmaName: 'Magna AI_RGB_Logo_Tagline_Secondary_Horizontal_Colored_White Text 2',
+    },
+];

package/dist/components/magna/logo.d.ts

@@ -0,0 +1,11 @@
+import type { ComponentPropsWithoutRef } from "react";
+import { type MagnaLogoVariant } from "./logo-variants.js";
+export type MagnaLogoAutoVariant = 'stacked' | 'glyph' | 'horizontal' | 'tagline-horizontal' | 'tagline-stacked' | 'tagline-inline';
+export type MagnaLogoProps = Omit<ComponentPropsWithoutRef<'span'>, 'children'> & {
+    /** Theme-aware layout aliases, or any of the 24 fixed Figma variants. */
+    variant?: MagnaLogoAutoVariant | MagnaLogoVariant;
+    /** Omit when adjacent text or the enclosing link already names the brand. */
+    label?: string;
+};
+/** Exact Figma SVG artwork with optional theme-aware layout aliases. */
+export declare function MagnaLogo({ className, label, variant, ...props }: MagnaLogoProps): import("react/jsx-runtime").JSX.Element;