@traq-markdown-engine/sdk 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,24 @@
+import type { Document } from './generated/nodes.js';
+import type { Extraction, ExtractorOptions } from './generated/processing.js';
+export type { ExtractorOptions, Extraction, References, EmbeddedInfo, EmbeddingPlan, EmbeddingCandidate, LookupKind } from './generated/processing.js';
+export type { Preset } from './generated/presets.js';
+export { presets } from './generated/presets.js';
+export { isKnownNode } from './generated/nodes.js';
+export type { Document, Node, NodeKind, ParseError } from './generated/nodes.js';
+export interface Parser {
+    parse(source: string): Document;
+    parseInline(source: string): Document;
+    dispose(): void;
+}
+export interface Extractor {
+    extract(document: Document): Extraction;
+    dispose(): void;
+}
+export interface Runtime {
+    createParser(preset: string): Parser;
+    createExtractor(options: ExtractorOptions): Extractor;
+    dispose(): void;
+}
+/** Compile Wasm once; each Parser owns an independent instance and Rust preset. */
+export declare function createRuntime(bytes: Uint8Array): Promise<Runtime>;
+export { embedReferences, mentionsUser } from './embedding.js';

package/dist/index.js

@@ -0,0 +1,95 @@
+import { buildId, inputBytes } from './generated/artifact.js';
+export { presets } from './generated/presets.js';
+export { isKnownNode } from './generated/nodes.js';
+/** Compile Wasm once; each Parser owns an independent instance and Rust preset. */
+export async function createRuntime(bytes) {
+    let module = await WebAssembly.compile(new Uint8Array(bytes).buffer);
+    const instances = new Set();
+    return Object.freeze({
+        createParser(preset) {
+            const instance = instantiate('configure', preset);
+            return Object.freeze({
+                parse: (source) => instance.call('parse', source),
+                parseInline: (source) => instance.call('parse', source, 1),
+                dispose: instance.dispose
+            });
+        },
+        createExtractor(options) {
+            const instance = instantiate('configure_extractor', JSON.stringify(options));
+            return Object.freeze({
+                extract: (document) => instance.call('extract', JSON.stringify(document)),
+                dispose: instance.dispose
+            });
+        },
+        dispose() {
+            module = undefined;
+            for (const instance of instances) {
+                instance.dispose();
+            }
+        }
+    });
+    function instantiate(configuration, config) {
+        if (!module) {
+            throw new Error('Runtime is disposed');
+        }
+        let wasm = new WebAssembly.Instance(module, {})
+            .exports;
+        const encoder = new TextEncoder(), decoder = new TextDecoder('utf-8', {
+            fatal: true,
+            ignoreBOM: true
+        });
+        function call(operation, source, mode = 0) {
+            if (!wasm) {
+                throw new Error('Instance is disposed');
+            }
+            if (typeof source !== 'string') {
+                throw new TypeError('Expected source string');
+            }
+            if (source.length > inputBytes) {
+                throw new RangeError('Wasm input limit exceeded');
+            }
+            const input = encoder.encode(source);
+            if (input.length > inputBytes) {
+                throw new RangeError('Wasm input limit exceeded');
+            }
+            if (decoder.decode(input) !== source) {
+                throw new TypeError('Source contains an unpaired surrogate');
+            }
+            const pointer = wasm.input_ptr(input.length);
+            if (!pointer) {
+                throw new RangeError('Wasm input limit exceeded');
+            }
+            let result;
+            try {
+                new Uint8Array(wasm.memory.buffer, pointer, input.length).set(input);
+                const length = wasm[operation](mode);
+                result = JSON.parse(decoder.decode(new Uint8Array(wasm.memory.buffer, wasm.output_ptr(), length)));
+            }
+            catch (error) {
+                wasm = undefined;
+                throw error;
+            }
+            // Rust validates the AST before encoding; the build ID pairs its types.
+            if (result.error) {
+                throw new Error('Markdown: ' + JSON.stringify(result.error), {
+                    cause: result.error
+                });
+            }
+            if (operation.startsWith('configure') && result.configured !== buildId) {
+                throw new Error('Wasm does not match this SDK build');
+            }
+            return (result.result ?? result.document);
+        }
+        call(configuration, config);
+        const instance = Object.freeze({
+            call,
+            dispose() {
+                wasm = undefined;
+                instances.delete(instance);
+            }
+        });
+        instances.add(instance);
+        return instance;
+    }
+}
+export { embedReferences, mentionsUser } from './embedding.js';

package/dist/renderer/condensed.d.ts

@@ -0,0 +1,4 @@
+import type { Plugin } from '@traq-markdown-engine/core/renderer';
+import type { Options } from './index.js';
+/** A condensed traQ message is a flattened document, not inline-only parsing. */
+export declare function configureCondensed(common: Plugin, generic: Plugin, trap: Plugin, options: Options): void;

package/dist/renderer/condensed.js

@@ -0,0 +1,73 @@
+import { names as genericNames, isKnownNode as genericNode } from '@traq-markdown-engine/commonmark-plugin/generic/nodes';
+import { isKnownNode, names } from '@traq-markdown-engine/commonmark-plugin/nodes';
+import { validateLink as defaultPolicy } from '@traq-markdown-engine/commonmark-plugin/policy';
+import { attributes, checked, escapeHtml } from '@traq-markdown-engine/core/html';
+import { names as trapNames, isKnownNode as trapNode } from '@traq-markdown-engine/traq-plugin/nodes';
+const blocks = (nodes, ctx) => (nodes ?? []).map(node => ctx.render([node])).join(' ');
+function configureCommonCondensed(common, options) {
+    for (const kind of [names.Softbreak, names.Hardbreak])
+        common.replace(kind, checked(kind, isKnownNode, () => ' '));
+    common.replace(names.Paragraph, checked(names.Paragraph, isKnownNode, (n, ctx) => ctx.render(n.children)));
+    common.replace(names.Heading, checked(names.Heading, isKnownNode, (n, ctx) => '#'.repeat(n.data.level) + ' ' + ctx.render(n.children)));
+    common.replace(names.Blockquote, checked(names.Blockquote, isKnownNode, (n, ctx) => '> ' + blocks(n.children, ctx)));
+    common.replace(names.List, checked(names.List, isKnownNode, (n, ctx) => {
+        let index = 0;
+        const children = n.data.ordered
+            ? (n.children ?? []).map(child => {
+                if (!isKnownNode(child) || child.kind !== names.ListItem) {
+                    return child;
+                }
+                return {
+                    ...child,
+                    data: {
+                        marker: `${n.data.start + index++}${child.data.marker.slice(-1)}`
+                    }
+                };
+            })
+            : n.children;
+        return blocks(children, ctx);
+    }));
+    common.replace(names.ListItem, checked(names.ListItem, isKnownNode, (n, ctx) => n.data.marker + ' ' + blocks(n.children, ctx)));
+    common.replace(names.ThematicBreak, checked(names.ThematicBreak, isKnownNode, n => ' ' + escapeHtml(n.data.marker) + ' '));
+    common.replace(names.CodeBlock, checked(names.CodeBlock, isKnownNode, n => '<code>' + escapeHtml(n.data.literal) + '</code>'));
+    common.replace(names.HtmlBlock, checked(names.HtmlBlock, isKnownNode, n => escapeHtml(n.data.literal)));
+    common.replace(names.Image, checked(names.Image, isKnownNode, (n, _ctx) => {
+        const label = escapeHtml(n.data.label_source);
+        if (!(options.validateLink ?? defaultPolicy)(n.data.destination))
+            return label;
+        return ('<a' +
+            attributes([
+                ['href', n.data.destination],
+                ...(n.data.title === null
+                    ? []
+                    : [['title', n.data.title]])
+            ]) +
+            ' data-is-image>' +
+            label +
+            '</a>');
+    }));
+}
+function configureGenericCondensed(generic) {
+    generic.replace(genericNames.Table, checked(genericNames.Table, genericNode, (n, ctx) => (n.children ?? [])
+        .map(row => {
+        if (!genericNode(row) || row.kind !== genericNames.Row)
+            throw new TypeError('Invalid table row');
+        return ((row.children ?? [])
+            .map(cell => {
+            if (!genericNode(cell) || cell.kind !== genericNames.Cell)
+                throw new TypeError('Invalid table cell');
+            return '| ' + ctx.render(cell.children);
+        })
+            .join(' ') + ' |');
+    })
+        .join(' ')));
+}
+function configureTrapCondensed(trap) {
+    trap.replace(trapNames.BlankLine, checked(trapNames.BlankLine, trapNode, () => ' '));
+}
+/** A condensed traQ message is a flattened document, not inline-only parsing. */
+export function configureCondensed(common, generic, trap, options) {
+    configureCommonCondensed(common, options);
+    configureGenericCondensed(generic);
+    configureTrapCondensed(trap);
+}

package/dist/renderer/embeddings.d.ts

@@ -0,0 +1,23 @@
+import type { Document, Node } from '@traq-markdown-engine/core/renderer';
+export type Embedding = {
+    type: 'file';
+    id: string;
+} | {
+    type: 'message';
+    id: string;
+} | {
+    type: 'url';
+    url: string;
+};
+/** traQ links describe cards; external links describe OGP candidates. */
+export declare function embeddingFromUrl(value: string, origin: string): Embedding | undefined;
+/** Does not mutate the parser's document; both presentations can reuse it. */
+export declare function prepareMessage(document: Document, origin: string, condensed: boolean): {
+    document: {
+        source: string;
+        children: Node[];
+    };
+    embeddings: Embedding[];
+};
+/** Whether the final paragraph ends with an embedding on a line of its own. */
+export declare function endsWithEmbedding(document: Document, origin: string): boolean;

package/dist/renderer/embeddings.js

@@ -0,0 +1,145 @@
+import { isKnownNode, names } from '@traq-markdown-engine/commonmark-plugin/nodes';
+import { names as trap } from '@traq-markdown-engine/traq-plugin/nodes';
+import { classifyTraqLink } from './links.js';
+/** traQ links describe cards; external links describe OGP candidates. */
+export function embeddingFromUrl(value, origin) {
+    let url;
+    try {
+        url = new URL(value);
+    }
+    catch {
+        return;
+    }
+    if (url.protocol !== 'http:' && url.protocol !== 'https:')
+        return;
+    const target = classifyTraqLink(value, origin);
+    if (target)
+        return target;
+    if (url.origin !== origin)
+        return { type: 'url', url: value };
+}
+function collectEmbeddings(nodes, origin, state, ids) {
+    for (const node of nodes) {
+        if (node.kind === trap.Spoiler)
+            continue;
+        if (isKnownNode(node) && node.kind === names.Link) {
+            const embedding = embeddingFromUrl(node.data.destination, origin);
+            if (embedding) {
+                state.links.set(node, embedding);
+                if (embedding.type === 'url' || !ids.has(embedding.id)) {
+                    state.embeddings.push(embedding);
+                    if (embedding.type !== 'url')
+                        ids.add(embedding.id);
+                }
+            }
+        }
+        if (node.children)
+            collectEmbeddings(node.children, origin, state, ids);
+    }
+}
+function trimTrailingEmbeddings(children, links) {
+    const result = children.slice();
+    let last = result.length - 1;
+    while (result[last]?.kind === trap.BlankLine)
+        last--;
+    const paragraph = result[last];
+    if (paragraph?.kind !== names.Paragraph || !paragraph.children)
+        return result;
+    let end = paragraph.children.length - 1;
+    let removed = false;
+    while (end >= 0) {
+        const node = paragraph.children[end];
+        const embedding = links.get(node);
+        if (node.kind === names.Softbreak) {
+            end--;
+            continue;
+        }
+        if (embedding &&
+            embedding.type !== 'url' &&
+            isKnownNode(node) &&
+            node.kind === names.Link &&
+            node.data.form === 'linkify') {
+            removed = true;
+            end--;
+            continue;
+        }
+        break;
+    }
+    if (removed) {
+        result[last] = {
+            ...paragraph,
+            children: paragraph.children.slice(0, end + 1)
+        };
+        result.length = last + 1;
+    }
+    return result;
+}
+function replaceEmbeddingLabels(nodes, links) {
+    return nodes.map(node => {
+        const embedding = links.get(node);
+        if (embedding &&
+            (embedding.type === 'file' ||
+                (embedding.type === 'message' &&
+                    isKnownNode(node) &&
+                    node.kind === names.Link &&
+                    node.data.form === 'linkify'))) {
+            return {
+                ...node,
+                children: [
+                    {
+                        kind: names.Text,
+                        span: node.span,
+                        data: {
+                            value: embedding.type === 'file'
+                                ? '[[添付ファイル]]'
+                                : '[[引用メッセージ]]'
+                        }
+                    }
+                ]
+            };
+        }
+        return node.children
+            ? {
+                ...node,
+                children: replaceEmbeddingLabels(node.children, links)
+            }
+            : node;
+    });
+}
+/** Does not mutate the parser's document; both presentations can reuse it. */
+export function prepareMessage(document, origin, condensed) {
+    const state = {
+        links: new Map(),
+        embeddings: []
+    };
+    collectEmbeddings(document.children, origin, state, new Set());
+    const children = trimTrailingEmbeddings(document.children, state.links);
+    const renderedChildren = condensed
+        ? replaceEmbeddingLabels(children, state.links)
+        : children;
+    return {
+        document: { ...document, children: renderedChildren },
+        embeddings: state.embeddings
+    };
+}
+/** Whether the final paragraph ends with an embedding on a line of its own. */
+export function endsWithEmbedding(document, origin) {
+    const blocks = document.children.filter(node => node.kind !== trap.BlankLine);
+    const paragraph = blocks.at(-1);
+    if (paragraph?.kind !== names.Paragraph) {
+        return false;
+    }
+    const children = paragraph.children ?? [];
+    const last = children.at(-1);
+    const previous = children.at(-2);
+    if (!last ||
+        !isKnownNode(last) ||
+        last.kind !== names.Link ||
+        last.data.form !== 'linkify') {
+        return false;
+    }
+    if (previous && previous.kind !== names.Softbreak) {
+        return false;
+    }
+    return embeddingFromUrl(last.data.destination, origin) !== undefined;
+}

package/dist/renderer/image-domains.d.ts

@@ -0,0 +1,2 @@
+declare const _default: string[];
+export default _default;

package/dist/renderer/image-domains.js

@@ -0,0 +1,11 @@
+export default [
+    'libra.tokyotech.org',
+    'user-images.githubusercontent.com',
+    'git.trap.jp',
+    'wiki.trapti.tech',
+    'wiki.trap.jp',
+    'md.trapti.tech',
+    'md.trap.jp',
+    'trap.jp',
+    'traq-dev.tokyotech.org'
+];

package/dist/renderer/index.d.ts

@@ -0,0 +1,27 @@
+import type { Options as GenericOptions } from '@traq-markdown-engine/commonmark-plugin/generic/renderer';
+import type { Options as CommonOptions } from '@traq-markdown-engine/commonmark-plugin/renderer';
+import type { Document } from '@traq-markdown-engine/core/renderer';
+import type { Options as TrapOptions } from '@traq-markdown-engine/traq-plugin/renderer';
+export { embeddingFromUrl, endsWithEmbedding } from './embeddings.js';
+export type { Embedding } from './embeddings.js';
+export type Options = CommonOptions & GenericOptions & TrapOptions;
+export declare function html(options?: Options): import("@traq-markdown-engine/core/renderer").Preset;
+/** Build standard and condensed message renderers from the same options. */
+export declare function messageRenderers({ origin, ...options }: Options & {
+    origin: string;
+}): Readonly<{
+    standard: Readonly<{
+        render(document: Document): {
+            rawText: string;
+            renderedText: string;
+            embeddings: import("./embeddings.js").Embedding[];
+        };
+    }>;
+    condensed: Readonly<{
+        render(document: Document): {
+            rawText: string;
+            renderedText: string;
+            embeddings: import("./embeddings.js").Embedding[];
+        };
+    }>;
+}>;

package/dist/renderer/index.js

@@ -0,0 +1,93 @@
+import { math } from '@traq-markdown-engine/commonmark-plugin/generic/math';
+import { plugin as generic } from '@traq-markdown-engine/commonmark-plugin/generic/renderer';
+import { createHighlightFunc } from '@traq-markdown-engine/commonmark-plugin/highlight';
+import { plugin as common } from '@traq-markdown-engine/commonmark-plugin/renderer';
+import { PresetBuilder } from '@traq-markdown-engine/core/renderer';
+import { renderer } from '@traq-markdown-engine/core/renderer';
+import { plugin as trap } from '@traq-markdown-engine/traq-plugin/renderer';
+import { configureCondensed } from './condensed.js';
+import { prepareMessage } from './embeddings.js';
+import imageDomains from './image-domains.js';
+export { embeddingFromUrl, endsWithEmbedding } from './embeddings.js';
+const highlight = createHighlightFunc('traq-code traq-lang');
+const validateImage = (value) => {
+    try {
+        const url = new URL(value);
+        return url.protocol === 'https:' && imageDomains.includes(url.hostname);
+    }
+    catch {
+        return false;
+    }
+};
+function condensedOptions(options) {
+    const customMath = options.math;
+    return {
+        ...options,
+        math: customMath
+            ? (tex) => customMath(tex, false)
+            : (tex) => math(tex, false, {
+                maxSize: 1,
+                macros: {
+                    '\\Huge': '',
+                    '\\huge': '',
+                    '\\LARGE': '',
+                    '\\Large': '',
+                    '\\large': ''
+                }
+            })
+    };
+}
+function build(options = {}, condensed = false) {
+    const commonPlugin = common({
+        breaks: true,
+        highlight,
+        validateImage,
+        linkAttributes: {
+            target: '_blank',
+            rel: 'nofollow noopener noreferrer'
+        },
+        ...options
+    });
+    const genericPlugin = generic(condensed ? condensedOptions(options) : options);
+    const trapPlugin = trap(options);
+    if (condensed) {
+        configureCondensed(commonPlugin, genericPlugin, trapPlugin, options);
+    }
+    return new PresetBuilder()
+        .add(commonPlugin)
+        .add(genericPlugin)
+        .add(trapPlugin)
+        .build();
+}
+export function html(options) {
+    return build(options);
+}
+/** Build standard and condensed message renderers from the same options. */
+export function messageRenderers({ origin, ...options }) {
+    const embeddingOrigin = new URL(origin).origin;
+    function create(condensed) {
+        const view = renderer(build(options, condensed));
+        return Object.freeze({
+            render(document) {
+                const prepared = prepareMessage(document, embeddingOrigin, condensed);
+                const renderedText = condensed
+                    ? prepared.document.children
+                        .map(node => view.render({
+                        ...prepared.document,
+                        children: [node]
+                    }))
+                        .join(' ')
+                    : view.render(prepared.document);
+                return {
+                    rawText: document.source,
+                    renderedText,
+                    embeddings: prepared.embeddings
+                };
+            }
+        });
+    }
+    return Object.freeze({
+        standard: create(false),
+        condensed: create(true)
+    });
+}

package/dist/renderer/links.d.ts

@@ -0,0 +1,8 @@
+export type TraqLink = {
+    type: 'file' | 'message';
+    id: string;
+};
+/** Shared lexical policy with Rust processing/links.rs; no URL normalization.
+ * Only the configured origin and an exact UUID path identify a traQ resource.
+ */
+export declare function classifyTraqLink(value: string, origin: string): TraqLink | undefined;

package/dist/renderer/links.js

@@ -0,0 +1,16 @@
+/** Shared lexical policy with Rust processing/links.rs; no URL normalization.
+ * Only the configured origin and an exact UUID path identify a traQ resource.
+ */
+export function classifyTraqLink(value, origin) {
+    const base = origin.replace(/\/+$/, '');
+    if (!base || !value.startsWith(base))
+        return;
+    const path = value.slice(base.length).split(/[?#]/, 1)[0];
+    const match = /^\/(files|messages)\/([\da-fA-F]{8}-[\da-fA-F]{4}-[\da-fA-F]{4}-[\da-fA-F]{4}-[\da-fA-F]{12})$/.exec(path);
+    if (!match || match[0] !== path)
+        return;
+    return {
+        type: match[1] === 'files' ? 'file' : 'message',
+        id: match[2].toLowerCase()
+    };
+}

package/package.json

@@ -0,0 +1,84 @@
+{
+  "name": "@traq-markdown-engine/sdk",
+  "version": "0.1.0",
+  "description": "traQ Markdown presets and processing, distributed as Rust, Wasm, Go and TypeScript.",
+  "homepage": "https://github.com/uni-kakurenbo/traq-markdown-engine#readme",
+  "bugs": {
+    "url": "https://github.com/uni-kakurenbo/traq-markdown-engine/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/uni-kakurenbo/traq-markdown-engine.git",
+    "directory": "packages/sdk"
+  },
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org"
+  },
+  "author": "traP (https://github.com/traPtitech)",
+  "sideEffects": [
+    "./dist/index.css"
+  ],
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./nodes": {
+      "types": "./dist/generated/nodes.d.ts",
+      "import": "./dist/generated/nodes.js"
+    },
+    "./parser.wasm": "./dist/parser.wasm",
+    "./contract.json": "./dist/contract.json",
+    "./renderer": {
+      "types": "./dist/renderer/index.d.ts",
+      "import": "./dist/renderer/index.js"
+    },
+    "./index.css": "./dist/index.css",
+    "./styles/*": "./styles/*.scss"
+  },
+  "files": [
+    "dist/index.js",
+    "dist/index.d.ts",
+    "dist/embedding.js",
+    "dist/embedding.d.ts",
+    "dist/generated",
+    "dist/parser.wasm",
+    "dist/contract.json",
+    "THIRD_PARTY_NOTICES.md",
+    "dist/renderer",
+    "dist/index.css",
+    "LICENSE",
+    "styles"
+  ],
+  "scripts": {
+    "build": "bun run scripts/build.ts",
+    "build:renderer": "sass --no-source-map styles/index.scss dist/index.css",
+    "build:ts": "bun run ../../scripts/tsc.ts -p typescript/tsconfig.build.json",
+    "example:go": "go -C examples/go run .",
+    "example:rust": "cargo run -p traq-markdown-example && cargo run -p traq-markdown-grammar --example parse && cargo run -p traq-markdown-processing --example notification && cargo run -p traq-markdown-processing --example compose-text",
+    "example:ts": "bun run examples/typescript/main.ts",
+    "examples": "bun run example:rust && bun run example:go && bun run example:ts",
+    "generate:bindings": "bun run scripts/generate-bindings.ts",
+    "test": "bun test ./typescript/tests",
+    "test:go": "go -C go test -count=1 ./...",
+    "typecheck": "bun run ../../scripts/tsc.ts -p typescript/tsconfig.json && bun run ../../scripts/tsc.ts -p examples/typescript/tsconfig.json"
+  },
+  "devDependencies": {
+    "@traq-markdown-engine/commonmark-plugin": "workspace:*",
+    "@traq-markdown-engine/core": "workspace:*",
+    "@traq-markdown-engine/traq-plugin": "workspace:*",
+    "markdown-it": "15.0.1",
+    "sass": "1.103.1"
+  },
+  "peerDependencies": {
+    "@traq-markdown-engine/commonmark-plugin": "0.1.0",
+    "@traq-markdown-engine/core": "0.1.0",
+    "@traq-markdown-engine/traq-plugin": "0.1.0"
+  },
+  "engines": {
+    "node": ">=24"
+  }
+}

package/styles/animation/_ascension.sass

@@ -0,0 +1,34 @@
+@keyframes ascension
+  0%
+    filter: blur(0) drop-shadow(0 0.2em 0.2em #e3df62) saturate(1)
+    transform: translateY(0px)
+  10%
+    filter: blur(0) drop-shadow(0 0.2em 0.3em #e3df62) saturate(1)
+    transform: translateY(-0.02em)
+  20%
+    filter: blur(0) drop-shadow(0 0.2em 0.4em #e3df62) saturate(1)
+    transform: translateY(-0.04em)
+  30%
+    filter: blur(0) drop-shadow(0 0.2em 0.5em #e3df62) saturate(0.9)
+    transform: translateY(-0.06em)
+  40%
+    filter: blur(0) drop-shadow(0 0.2em 0.5em #e3df62) saturate(0.8)
+    transform: translateY(-0.08em)
+  50%
+    filter: blur(0) drop-shadow(0 0.2em 0.5em #e3df62) saturate(0.7)
+    transform: translateY(-0.1em)
+  60%
+    filter: blur(0.2em) drop-shadow(0 0.2em 0.5em #e3df62) saturate(0.6)
+    transform: translateY(-0.12em) scale(0.8)
+  70%
+    filter: blur(0.4em) drop-shadow(0 0.2em 0.5em #e3df62) saturate(0.5)
+    transform: translateY(-0.14em) scale(0.6)
+  80%
+    filter: blur(0.6em) drop-shadow(0 0.2em 0.5em #e3df62) saturate(0.4)
+    transform: translateY(-0.16em) scale(0.4)
+  90%
+    filter: blur(0.8em) drop-shadow(0 0.2em 0.5em #e3df62) saturate(0.3)
+    transform: translateY(-0.18em) scale(0.2)
+  100%
+    filter: blur(1em) drop-shadow(0 0.2em 0.5em #e3df62) saturate(0.3)
+    transform: translateY(-0.2em) scale(0)