Style
/ API Reference / Plugins
Style
/ API Reference / Plugins

embedded

This plugin allows you to embed keyframes directly in style objects using the animationName property.

The Gist

import { embeddedPlugin } from '@weser/style'

const plugin = embeddedPlugin()

Returns

(Plugin) A plugin function that can be passed to the createRenderer function.

Usage

const style = {
  animationName: {
    from: { opacity: 0 },
    to: { opacity: 1 },
  },
  animationDuration: '1s',
}

Style Type

In order to use this package properly, you need to replace the default T_Style type with T_EmbeddedStyle.

import {
  createRenderer,
  embeddedPlugin,
  type T_EmbeddedStyle,
} from '@weser/style'

type Style = T_EmbeddedStyle

const css = createRenderer<Style>({
  plugins: [embeddedPlugin()],
})
On this page