import { html , TemplateResult } from '@spectrum-web-components/base' ; import '../sp-avatar.js' ; import { AvatarSize } from '..' ; import { avatar } from './images' ; export default { component : 'sp-avatar' , title : 'Avatar' , argTypes : { label : { control : 'text' } , src : { control : 'text' } , } , args : { label : 'Place dog' , src : avatar , } , } ; interface StoryArgs { label ? : string ; src ? : string ; size ? : AvatarSize ; } const Template = ( { label = 'Place Dog' , src = avatar , size = 100 , } = { } ) : TemplateResult => { return html `
        <sp-avatar label=${ label } src=${ src } size=${ size }></sp-avatar>
    ` ; } ; export const size50 = ( args = { } ) : TemplateResult => Template ( { ... args , size : 50 } ) ; export const size75 = ( args = { } ) : TemplateResult => Template ( { ... args , size : 75 } ) ; export const size100 = ( args = { } ) : TemplateResult => Template ( { ... args , size : 100 } ) ; export const size200 = ( args = { } ) : TemplateResult => Template ( { ... args , size : 200 } ) ; export const size300 = ( args = { } ) : TemplateResult => Template ( { ... args , size : 300 } ) ; export const size400 = ( args = { } ) : TemplateResult => Template ( { ... args , size : 400 } ) ; export const size500 = ( args = { } ) : TemplateResult => Template ( { ... args , size : 500 } ) ; export const size600 = ( args = { } ) : TemplateResult => Template ( { ... args , size : 600 } ) ; export const size700 = ( args = { } ) : TemplateResult => Template ( { ... args , size : 700 } ) ;