2.0.1 • Published 4 years ago
@chameleon-ds/skeleton v2.0.1
Chameleon Skeleton
import { html } from "@open-wc/demoing-storybook";
import { withKnobs, text, number } from "@open-wc/demoing-storybook";
import "./chameleon-skeleton.js";
export default {
title: "Components|Data and Visualizations/Skeleton",
component: "chameleon-skeleton",
decorators: [withKnobs],
options: { selectedPanel: "storybookjs/docs/panel" },
};
Properties
Property Name | Type(s) | Default Value | Description |
---|---|---|---|
theme | String | "primary" | The skeleton's theme ("primary", "secondary") |
height | String | "100%" | The skeleton's height |
width | String | "100%" | The skeleton's width |
cHeight | Number | 50 | The skeleton's circle height |
Examples
Default
export const Default = () => {
const height = text("Height", "100%");
const width = text("Width", "100%");
const theme = text("Theme", "primary");
const cHeight = number("Circle Height", 50);
return theme === "primary"
? html`
<chameleon-skeleton theme="primary" height="${height}" width="${width}">
</chameleon-skeleton>
`
: theme === "secondary"
? html` <chameleon-skeleton theme="secondary" cHeight="${cHeight}">
</chameleon-skeleton>`
: "";
};
2.0.1
4 years ago
2.0.0
4 years ago
1.2.7
4 years ago
1.2.6
4 years ago
1.2.5
4 years ago
1.2.2
4 years ago
1.2.1
4 years ago
1.2.0
4 years ago
1.1.3
4 years ago
1.1.1
4 years ago
1.1.0
5 years ago
1.0.1
5 years ago
1.0.0
5 years ago
0.3.2
5 years ago
0.3.1
5 years ago
0.3.0
5 years ago
0.2.1
5 years ago
0.2.0
5 years ago
0.1.0
5 years ago