Package com.vaadin.flow.component.dependency

Annotation Interface StyleSheet

@Retention(RUNTIME) @Target(TYPE) @Documented @Repeatable(Container.class) public @interface StyleSheet
Loads style sheets into the browser according to a given loading mode. Style sheet URLs can be either a file served by the application itself, or an external URL.

Can defines style sheet dependencies for a Component class or globally.

When this annotation is placed on the AppShellConfigurator, the referenced style sheets are injected globally into the generated index.html during bootstrap. In this case the style sheet is always inlined in the body of the html page, thus LoadMode values are ignored.

For adding multiple style sheets, you can use this annotation multiple times. It is guaranteed that dependencies will be loaded only once.

Absolute URLs are used as-is; values prefixed with context:// are resolved using context path (e.g. context://styles.css becomes /my-app/styles.css) for context path /my-app.

NOTE: while this annotation is not inherited using the @Inherited annotation, the annotations of the possible parent components or implemented interfaces are read when sending the dependencies to the browser.

Since:
1.0
Author:
Vaadin Ltd

  • Nested Class Summary

    Nested Classes
    Modifier and Type
    Class
    Description
    static @interface 
    StyleSheet.Container
    Internal annotation to enable use of multiple StyleSheet annotations.

  • Required Element Summary

    Required Elements
    Modifier and Type
    Required Element
    Description
    String
    value
    Style sheet file URL to load before using the annotated Component in the browser.

  • Optional Element Summary

    Optional Elements
    Modifier and Type
    Optional Element
    Description
    LoadMode
    loadMode
    Determines the dependency load mode.

  • Element Details

    • value

      String value
      Style sheet file URL to load before using the annotated Component in the browser.

      Relative URLs are interpreted as relative to the configured frontend directory location. You can prefix the URL with context:// to make it relative to the context path or use an absolute URL to refer to files outside the frontend directory.

      Returns:
      a style sheet file URL

    • loadMode

      LoadMode loadMode
      Determines the dependency load mode. Refer to LoadMode for the details.
      Returns:
      load mode for the dependency
      Default:
      EAGER