@allakando/allakando-web-ui
Version:
Allakando's web component library
35 lines (34 loc) • 2.83 kB
JavaScript
import{s as n}from"./helper-774a7e1d.js";import{I as o,a as s,b as h,c as d}from"./inline-622e1189.js";const l=`# Allakando Benefit Card\r
\r
The ako-benefit-card component is used for showing benefits avaialbe to a user.\r
\r
The component is having four attributes, which are "direction", "image", "headertitle", and "headersubtitle".\r
\r
## direction\r
\r
This attribute can have two options "vertical" and "horizontal", which specifies the direction of the card component.\r
\r
## image\r
\r
This attribute sets the card image of the component\r
\r
## headertitle\r
\r
This attribute sets the header title of the card component\r
\r
## headersubtitle\r
\r
This attribute sets the header subtitle of the card component.\r
\r
## showhighlight\r
\r
This attribute unhide the highlight in the header banner section of the card component.\r
`,g={title:"Atomic Components/Benefit-Card",component:"ako-benefit-card",tags:["autodocs"],parameters:{docs:{description:{component:l}}},argTypes:{direction:{options:["vertical","horizontal"],control:{type:"select"}},image:{control:{type:"text"}},headertitle:{control:{type:"text"}},headersubtitle:{control:{type:"object"}},showhighlight:{options:[!0,!1],control:{type:"boolean"}}}},t=e=>`<ako-benefit-card
${e.image?`image=${e.image}`:""}
${e.direction?`direction="${e.direction}"`:""}
${e.headertitle?`headertitle="${e.headertitle}"`:""}
${e.headersubtitle?`headersubtitle=${n(e.headersubtitle)}`:""}
${e.showhighlight?`showhighlight="${e.showhighlight}"`:""}
>
Appen som guidar dig genom kursen med hjälp av videofilmer, uppgifter, smarta strategier och mycket mer. Välj vilket betyg du siktar på så hjälper appen dig att nå det på rekordtid!
</ako-benefit-card>`;t.args={image:o,headertitle:"Matteappen",headersubtitle:[{title:"Matte 1-3",link:s},{title:"Egen takt",link:h},{title:"Online",link:d}]};var r,i,a;t.parameters={...t.parameters,docs:{...(r=t.parameters)==null?void 0:r.docs,source:{originalSource:'args => {\n return `<ako-benefit-card \n ${args.image ? `image=${args.image}` : ""}\n ${args.direction ? `direction="${args.direction}"` : ""}\n ${args.headertitle ? `headertitle="${args.headertitle}"` : ""}\n ${args.headersubtitle ? `headersubtitle=${serializeForHtmlAttribute(args.headersubtitle)}` : ""}\n ${args.showhighlight ? `showhighlight="${args.showhighlight}"` : ""}\n >\n Appen som guidar dig genom kursen med hjälp av videofilmer, uppgifter, smarta strategier och mycket mer. Välj vilket betyg du siktar på så hjälper appen dig att nå det på rekordtid!\n </ako-benefit-card>`;\n}',...(a=(i=t.parameters)==null?void 0:i.docs)==null?void 0:a.source}}};const m=["Template"];export{t as Template,m as __namedExportsOrder,g as default};