Skip to main content

@esrf/daiquiri-lib

A variety of the daiquiri-ui components are exported into a shared package published as @esrf/daiquiri-lib. This allows for a consistent look and feel in other projects.

Features available in the library are marked throughout the documentation with the daiquiri-lib badge

Layout Manager​

layout-manager

The YAML layout language and associated render are available in @esrf/daiquiri-lib. See the Layout Manager for more information.

The library exports:

  • YAMLLayout - The main renderer
  • YAMLErrorBoundary - To catch YAML related parsing / syntax errors at run time
  • renderYamlNode - Render a single node
  • registerYamlComponent - To register components into the available list
  • YamlComponent, YamlNode - Types

Monitor Panel​

monitor-panel

A monitor panel that can be used in the application header and provides an overview of object statuses at a glance.

The library exports:

  • MonitorPanel - The main panel
  • MonitorPanelItem - A Col wrapper for an item
  • registerMonitorComponent - Register other monitor types
  • registerRuntimeHook - Register a useHardware hook to actually retrieve the object of interest
  • dynamicOp - A helper to determine whether a value is valid
  • MonitorPanelProps and Monitor - types

Hardware Components​

hardware-components

Currently the following hardware components are available in the shared library:

FrontEndInfoMotorDefaultMultipositionPropertyShutterDefault

Custom Components​

Custom hardware components can also be constructed using the HardwareTemplate. See Developers > Hardware Components for more information.

Exported components / properties / types:

  • HardwareTemplate
  • TypeIcon
  • HardwareVariant
  • HardwareInputNumber
  • HardwareNumericStep
  • HardwareState.HardwareState - To render a consistent state
  • HardwareTypes - Related types
  • HardwareSchema - Schema for each hardware object (properties, callables)

CSS / SASS​

Styles are exported through src/styles.scss. This requires that custom-colors map is defined before importing, for example:

$primary: #272a7c;
$secondary: #9395be;
$info: #46ac32;
$gray: #ddd;

$custom-colors: (
    't-purple': $primary,
    't-cyan': $info
);

@import '@esrf/daiquiri-lib/src/styles.scss';