import * as UI from '../../src/index'

import { Canvas, Meta, Story } from "@storybook/addon-docs";

<Meta title="Display" />

## complain

[API docs](https://solidos.github.io/solid-ui/docs/api/modules/_widgets_buttons_.html#complain)

<Canvas>
  <Story name="complain">
    {() => {
      const div = document.createElement("div");
      UI.widgets.complain({ div, dom: document }, "not good!");
      return div;
    }}
  </Story>
</Canvas>

## errorMessageBlock

[API docs](https://solidos.github.io/solid-ui/docs/api/modules/_widgets_error_.html#errormessageblock)

<Canvas>
  <Story name="errorMessageBlock">
    {() => {
      return UI.widgets.errorMessageBlock(document, "my error message", "#f0f");
    }}
  </Story>
</Canvas>

## setName

Sets the best name we have and looks up a better one

[API docs](https://solidos.github.io/solid-ui/docs/api/modules/_widgets_buttons_.html#setname)

<Canvas>
  <Story name="setName">
    {() => {
      const div = document.createElement("div");
      const jane = $rdf.namedNode("https://jane.example/person/card#me");
      SolidLogic.store.add(jane, UI.ns.foaf("name"), "Jane Doe");
      UI.widgets.setName(div, jane);
      return div;
    }}
  </Story>
</Canvas>
