Skip to content

@svebcomponents/utils

Small shared helpers used by Svebcomponents packages.

This package is intentionally narrow. It keeps common string transformations in one place so the build-time and runtime packages agree on how prop names and attribute names map to each other.

Exports

kebabize(str)

Converts camelCase or PascalCase names to kebab-case.

import { kebabize } from "@svebcomponents/utils";
kebabize("favoriteNumber"); // "favorite-number"
kebabize("URLValue"); // "url-value"

Used by @svebcomponents/auto-options when generating custom element attribute names from Svelte prop names.

isKebabCase(str)

Checks whether a string is already a simple kebab-case HTML attribute name.

import { isKebabCase } from "@svebcomponents/utils";
isKebabCase("favorite-number"); // true
isKebabCase("favoriteNumber"); // false
isKebabCase("--css-variable"); // false

Used by @svebcomponents/ssr when deciding whether an incoming wrapper prop should be treated as an attribute name or a JavaScript property name.

camelizeKebabCase(str)

Converts kebab-case names back to camelCase.

import { camelizeKebabCase } from "@svebcomponents/utils";
camelizeKebabCase("favorite-number"); // "favoriteNumber"

Used by @svebcomponents/ssr when mapping non-string kebab-case values to component properties during server rendering.

TODO(description, ...args)

Logs a runtime TODO marker.

This is currently used only inside experimental SSR code paths where behavior is intentionally incomplete.