view-transition-name/dist/index.js

Generate css `view-transition-name`s

import { customIdent } from "custom-ident";
export class ViewTransitionNameError extends Error {
    constructor(message, options) {
        super(message, options);
        this.name = "ViewTransitionNameError";
    }
}
export class ViewTransitionNameReservedKeywordError extends ViewTransitionNameError {
    constructor(keyword) {
        super(`The generated view-transition-name "${keyword}" is a reserved keyword. If you intended to use it, please use the string directly.`);
        this.name = "ViewTransitionNameReservedKeywordError";
    }
}
const INVALID_NAMES = [
    "unset",
    "initial",
    "inherit",
    "revert",
    "revert-layer",
    "match-element",
    "none",
];
/**
 * Turns a list of values into a CSS <view-transition-name>.
 * Escapes invalid characters.
 *
 * @warning Spaces are mapped to hyphens.
 *
 * @example
 * ```ts
 * import { viewTransitionName } from "view-transition-name";
 *
 * const ident = viewTransitionName("foo", "bar", "baz@");
 * console.log(ident); // 'foo_bar_baz\\40'
 *
 * const ident = viewTransitionName([
 *   undefined,
 *   null,
 *   true,
 *   false,
 *   3,
 *   { test: "hi", oof: 0 },
 * ]);
 * console.log(ident); // 'undefined_null_true_false_3_test'
 * ```
 *
 * @param args - The values to be concatenated into a view-transition-name.
 * @returns A string representing the view-transition-name.
 */
export function viewTransitionName(...args) {
    let result;
    try {
        result = customIdent(...args);
    }
    catch (error) {
        if (error instanceof Error) {
            throw new ViewTransitionNameError(`An error occurred while generating the view-transition-name: ${error.message}`, { cause: error });
        }
        throw new ViewTransitionNameError("An unknown error occurred while generating the view-transition-name.");
    }
    // Check for invalid names
    if (INVALID_NAMES.includes(result)) {
        throw new ViewTransitionNameReservedKeywordError(result);
    }
    return result;
}
//# sourceMappingURL=index.js.map