mirror of
https://github.com/material-components/material-web.git
synced 2024-10-26 21:56:56 +03:00
c390291687
PiperOrigin-RevId: 576601342
45 lines
1.1 KiB
TypeScript
45 lines
1.1 KiB
TypeScript
/**
|
|
* @license
|
|
* Copyright 2023 Google LLC
|
|
* SPDX-License-Identifier: Apache-2.0
|
|
*/
|
|
|
|
import './material-collection.js';
|
|
import './index.js';
|
|
|
|
import {FabSize} from '@material/web/fab/fab.js';
|
|
import {
|
|
KnobTypesToKnobs,
|
|
MaterialCollection,
|
|
materialInitsToStoryInits,
|
|
setUpDemo,
|
|
} from './material-collection.js';
|
|
import {
|
|
boolInput,
|
|
Knob,
|
|
selectDropdown,
|
|
textInput,
|
|
} from './index.js';
|
|
|
|
import {stories, StoryKnobs} from './stories.js';
|
|
|
|
const collection = new MaterialCollection<KnobTypesToKnobs<StoryKnobs>>('FAB', [
|
|
new Knob('icon', {defaultValue: 'edit', ui: textInput()}),
|
|
new Knob('label', {defaultValue: '', ui: textInput()}),
|
|
new Knob('lowered', {defaultValue: false, ui: boolInput()}),
|
|
new Knob('size', {
|
|
defaultValue: 'medium' as FabSize,
|
|
ui: selectDropdown<FabSize>({
|
|
options: [
|
|
{label: 'medium', value: 'medium'},
|
|
{label: 'small', value: 'small'},
|
|
{label: 'large', value: 'large'},
|
|
],
|
|
}),
|
|
}),
|
|
]);
|
|
|
|
collection.addStories(...materialInitsToStoryInits(stories));
|
|
|
|
setUpDemo(collection, {icons: 'material-symbols'});
|