No Preview

Sorry, but you either have no stories or none are selected somehow.

If the problem persists, check the browser console, or the terminal you've run Storybook from.

The component failed to render properly, likely due to a configuration issue in Storybook. Here are some common causes and how you can address them:

  1. Missing Context/Providers: You can use decorators to supply specific contexts or providers, which are sometimes necessary for components to render correctly. For detailed instructions on using decorators, please visit the Decorators documentation.
  2. Misconfigured Webpack or Vite: Verify that Storybook picks up all necessary settings for loaders, plugins, and other relevant parameters. You can find step-by-step guides for configuring Webpack or Vite with Storybook.
  3. Missing Environment Variables: Your Storybook may require specific environment variables to function as intended. You can set up custom environment variables as outlined in the Environment Variables documentation.

Accordion

import { IDAccordionModule, IDAccordionComponent } from "@inera/ids-angular/components/accordion";

// Optional imports
import { IDCardModule } from "@inera/ids-angular/components/card";

<id-accordion> will render an accordion section and hide all the contents inside it.

Headline

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut.
NameDescriptionDefaultControl
headline
string
-
Properties
expanded
Sets initial expanded state.
boolean
false
headlinesize
Set desired size on the parent accordion.
"xs""s""m"
"m"
lean
Removes the borders and some padding. Is set automatically if the accordion is placed inside a card
boolean
false
level
Nested children will get level 2 automatically.
12
1
-
outputs
expandedChange
EventEmitter<boolean>
new EventEmitter<boolean>()
onClosed
EventEmitter<Event>
new EventEmitter()
onExpanded
EventEmitter<Event>
new EventEmitter()
slots
For content
""
headline
Headline such as h2, h3 etc.

Nested

Headline size m

Brig Jack Ketch sheet snow scourge of the seven seas crow's nest.

Headline s

Sink me dance the hempen jig draft. Long boat fluke nipper Gold Road execution dock reef topsail quarter blow the man down loot..

Headline size s

Excepteur sint occaecat cupidatat non proident, sunt in culpa qui.

Headline size xs

Long boat fluke nipper Gold Road execution dock reef topsail quarter blow the man down loot.

Headline size xs - not nested

Excepteur sint occaecat cupidatat non proident, officia mollit anim.

Inside card

Headline

Prow scuttle parrel provost Sail ho shrouds spirits boom mizzenmast yardarm.Long clothes. Provost hands bilged on her anchor black spot Blimey Privateer loaded to the gunwalls Gold Road bilge rat pirate.

Accessibility

No action required.