optimizely-oui
Version:
Optimizely's Component Library.
41 lines • 1.75 kB
JavaScript
import React from "react";
import { storiesOf } from "@storybook/react";
import { withKnobs, select, text, boolean as _boolean } from "@storybook/addon-knobs";
import Avatar from "./index.js";
import Container from "../Layout/Container";
import Row from "../Layout/Row";
var stories = storiesOf("Informational|Avatar", module);
stories.addDecorator(withKnobs).addDecorator(function (story) {
return React.createElement("div", {
id: "root-preview"
}, story());
});
stories.add("Default", function () {
return React.createElement(Container, null, React.createElement("p", null, "Size options are small and medium (large is the default and therefore achieved by not specifying a size)"), React.createElement(Row, null, React.createElement(Avatar, {
size: select("size", {
small: "small",
medium: "medium",
"large (default)": null
}, "small")
}), React.createElement(Avatar, {
size: "medium"
}), React.createElement(Avatar, null)), React.createElement(Row, {
paddedContent: "ends"
}, React.createElement(Avatar, {
size: "small",
imageUrl: text("imageUrl", "https://parkseed.com/images/xxl/52081-pk-p1.jpg")
}), React.createElement(Avatar, {
size: "medium",
imageUrl: text("imageUrl", "https://parkseed.com/images/xxl/52081-pk-p1.jpg")
}), React.createElement(Avatar, {
imageUrl: text("imageUrl", "https://parkseed.com/images/xxl/52081-pk-p1.jpg")
})), React.createElement(Row, null, React.createElement(Avatar, {
size: "small",
isEmulating: _boolean("isEmulating", true)
}), React.createElement(Avatar, {
size: "medium",
isEmulating: _boolean("isEmulating", true)
}), React.createElement(Avatar, {
isEmulating: _boolean("isEmulating", true)
})));
});