JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 244
  • Score
    100M100P100Q100220F
  • License Apache-2.0

unc-initial-bar

Package Exports

  • @unc-dsi/unc-initial-bar

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@unc-dsi/unc-initial-bar) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

<unc-initial-bar>

<unc-initial-bar> is bar to select an initial. Useful for quick access by person's name.

<unc-initial-bar label="Name" selection="R"></unc-initial-bar>

screenshot

Attributes / Properties

Name Description
label Optional text on top of the bar
selection Select or change the selected initial

Events

Name Description
select Fire when the selection changed.
Contains the old selection and the new selection : {detail: {oldSelection, newSelection }}

Styling

Name Default Lumo value Default value Description
--unc-initial-bar-padding --lumo-space-xs / 2 0.25rem / 2 Padding around each initial
--unc-initial-bar-selected-color --lumo-base-color #fff Foreground color of the selected initial
--unc-initial-bar-selected-background-color --lumo-primary-color hsl(214, 90%, 52%) Background color of the selected initial
--unc-initial-bar-border-color --lumo-shade-20pct hsla(214, 53%, 23%, 0.16) Color of grid's lines
--unc-initial-bar-hover-color N/A --unc-initial-bar-border-color Color hovering of the initial
--unc-initial-bar-label-color --lumo-secondary-text-color hsla(214, 42%, 18%, 0.72) Foreground color of the label
--unc-initial-bar-label-size --lumo-font-size-s .875rem Font size of the label

License

Apache License 2.0