@designcrowd/fe-shared-lib 1.2.0 → 1.2.1-ml-input-changes

package/.storybook-static/assets/PaymentConfigList.stories-EUp7r4Ga.js

@@ -0,0 +1,126 @@
+import{a as c}from"./axios-dxcvQi4N.js";import{M as C}from"./index-BqKh95Lf.js";import{L as z}from"./Loader-D6_mUM4g.js";import{c as s,i as f,F as H,f as W,g as m,o as t,a as w,j as D,t as r,n as _,e as g,b as v,A as d}from"./vue.esm-bundler-C7QvyiW1.js";import{_ as J}from"./_plugin-vue_export-helper-DlAUqK2U.js";import{B as oe}from"./Button-IgCxbLvL.js";import{D as se,a as re}from"./DropdownItem-C4PFbXSv.js";import{P as ie}from"./Pill-DEH_ScBa.js";import"./_commonjsHelpers-BosuxZz1.js";import"./ButtonPrimary-Ce51KkgM.js";import"./Icon-B8lXgcc0.js";let Q;const de=e=>{Q=e},me=()=>Q||c,ce=async e=>{try{const n=await me().get(`/maker/api/brand-pages/${e}/payment-configs`);return n.status===200?n.data:null}catch{return null}},pe={setBrandPageApiClientAxios:de,getPaymentConfigsByBrandPageToken:ce},o=Object.freeze({active:"Active",pendingPreOnboarding:"PendingPreOnboarding",pendingPostOnboarding:"PendingPostOnboarding",unactivatedByCustomer:"UnactivatedByCustomer"}),X={props:{brandPageToken:{type:String,required:!1},showPaymentProviderExternalId:{type:Boolean,required:!1,default:!0},statusFilters:{type:Array,required:!1,default:void 0}},data:()=>({isLoading:!0,paymentConfigs:[]}),methods:{getPaymentConfigStatusDisplayText(e){switch(e){case o.pendingPreOnboarding:return"Onboarding Incomplete";case o.pendingPostOnboarding:return"Pending Verification";case o.active:return"Connected";case o.unactivatedByCustomer:return"Inactive";default:return null}},getPaymentConfigStatusDisplayClasses(e){switch(e){case o.pendingPreOnboarding:case o.pendingPostOnboarding:return"tw-bg-warning-500";case o.active:return"tw-bg-success-500";case o.unactivatedByCustomer:return"tw-bg-grayscale-600";default:return null}},async updatePaymentConfigs(){if(this.brandPageToken)try{this.isLoading=!0;const e=await pe.getPaymentConfigsByBrandPageToken(this.brandPageToken);e&&(this.paymentConfigs=Array.isArray(this.statusFilters)?e.filter(n=>this.statusFilters.some(i=>n.status===i)):e,this.$emit("on-load",this.paymentConfigs))}finally{this.isLoading=!1}}}},Z={components:{Loader:z},mixins:[X],async mounted(){await this.updatePaymentConfigs()}},le={key:0,class:"tw-w-full tw-flex tw-justify-center tw-p-2"},ge={key:1},fe=["href"],ue=["src"];function ye(e,n,i,ne,te,p){const E=m("Loader");return t(),s("div",null,[e.isLoading?(t(),s("div",le,[f(E)])):(t(),s("div",ge,[(t(!0),s(H,null,W(e.paymentConfigs,(a,h)=>(t(),s("a",{key:a.id,href:a.dashboardUrl,target:"_blank"},[w("div",{class:_(["tw-w-full tw-flex tw-font-sans tw-text-sm tw-items-center tw-p-3 tw-gap-2 tw-rounded tw-bg-white tw-border tw-border-solid tw-border-grayscale-500 tw-text-secondary-500 hover:tw-bg-grayscale-200",{"tw-mb-2":h!==e.paymentConfigs.length-1}])},[w("img",{class:"tw-h-6",src:a.paymentProviderImageUrl,alt:"Payment provider's logo"},null,8,ue),D(" "+r(a.paymentProviderName)+" "+r(a.defaultCurrency)+" ",1),w("p",{class:_(["tw-ml-auto tw-text-xs tw-rounded-full tw-py-0.5 tw-my-0 tw-text-white tw-px-4 tw-outline-none tw-uppercase",e.getPaymentConfigStatusDisplayClasses(a.status)])},r(e.getPaymentConfigStatusDisplayText(a.status)),3)],2)],8,fe))),128))]))])}const T=J(Z,[["render",ye]]);Z.__docgenInfo={exportName:"default",displayName:"PaymentConfigList",description:"",tags:{},props:[{name:"brandPageToken",mixin:{name:"PaymentConfig.mixin",path:"PaymentConfig.mixin.js"},type:{name:"string"},required:!1},{name:"showPaymentProviderExternalId",mixin:{name:"PaymentConfig.mixin",path:"PaymentConfig.mixin.js"},type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"true"}},{name:"statusFilters",mixin:{name:"PaymentConfig.mixin",path:"PaymentConfig.mixin.js"},type:{name:"array"},required:!1,defaultValue:{func:!1,value:"undefined"}}],events:[{name:"on-load",mixin:{name:"PaymentConfig.mixin",path:"PaymentConfig.mixin.js"},type:{names:["undefined"]}}],sourceFiles:["/Users/brooke.couchman/Projects/fe-shared-lib/src/experiences/components/PaymentConfigList/PaymentConfig.mixin.js","/Users/brooke.couchman/Projects/fe-shared-lib/src/experiences/components/PaymentConfigList/PaymentConfigList.vue"]};const ee={components:{Button:oe,Dropdown:se,DropdownItem:re,Loader:z,Pill:ie},mixins:[X],props:{showAddPaymentProvider:{type:Boolean,default:!0},paymentConfigId:{type:String,required:!1,default:void 0}},data:()=>({isAddPaymentProviderButtonVisible:!1,selectedPaymentConfig:void 0}),watch:{paymentConfig(e){this.selectedPaymentConfig=e}},async mounted(){if(this.brandPageToken){if(await this.updatePaymentConfigs(),!this.selectedPaymentConfig&&this.paymentConfigs.length===0){this.isAddPaymentProviderButtonVisible=!0;return}const e=this.paymentConfigs.find(n=>n.id===this.paymentConfigId);if(e)this.setSelectedPaymentConfig(e);else if(this.paymentConfigs.length>0){const n=this.paymentConfigs.find(i=>i.status===o.active);this.setSelectedPaymentConfig(n||this.paymentConfigs[0])}}else this.isLoading=!1,this.isAddPaymentProviderButtonVisible=!0},methods:{onAddPaymentProviderButtonClick(){this.$emit("on-add-payment-provider-click")},onPaymentConfigClick(e){this.setSelectedPaymentConfig(e),this.$refs.dropdown.hideMenu()},setSelectedPaymentConfig(e){this.selectedPaymentConfig=e,this.$emit("on-payment-config-selected",this.selectedPaymentConfig)}}},Pe={key:0,class:"tw-w-full tw-flex tw-justify-center tw-p-2"},be={key:0,class:"tw-flex"},we={class:"tw-text-sm tw-grow tw-select-none"},Ce={class:"tw-text-sm tw-grow tw-select-none"};function ke(e,n,i,ne,te,p){const E=m("Loader"),a=m("Button"),h=m("Pill"),O=m("DropdownItem"),ae=m("Dropdown");return t(),s("div",null,[e.isLoading?(t(),s("div",Pe,[f(E)])):g("",!0),e.isAddPaymentProviderButtonVisible?(t(),v(a,{key:1,label:"Add Payment Provider",size:"small",variant:"outline",onOnClick:p.onAddPaymentProviderButtonClick},null,8,["onOnClick"])):g("",!0),!e.isLoading&&!e.isAddPaymentProviderButtonVisible?(t(),v(ae,{key:2,ref:"dropdown"},{title:d(()=>[e.selectedPaymentConfig?(t(),s("div",be,[w("span",we,r(e.selectedPaymentConfig.name),1),f(h,{class:_(["tw-text-white tw-mr-2",e.getPaymentConfigStatusDisplayClasses(e.selectedPaymentConfig.status)])},{default:d(()=>[D(r(e.getPaymentConfigStatusDisplayText(e.selectedPaymentConfig.status)),1)]),_:1},8,["class"])])):g("",!0)]),default:d(()=>[(t(!0),s(H,null,W(e.paymentConfigs,l=>(t(),v(O,{key:`payment-config-${l.id}`,onClick:he=>p.onPaymentConfigClick(l)},{default:d(()=>[w("span",Ce,r(l.name),1),f(h,{class:_(["tw-text-white",e.getPaymentConfigStatusDisplayClasses(l.status)])},{default:d(()=>[D(r(e.getPaymentConfigStatusDisplayText(l.status)),1)]),_:2},1032,["class"])]),_:2},1032,["onClick"]))),128)),i.showAddPaymentProvider?(t(),v(O,{key:0,class:"tw-border-t-2",onClick:p.onAddPaymentProviderButtonClick},{default:d(()=>[f(a,{"full-width":!0,label:"Add Payment Provider",size:"small",variant:"outline",onOnClick:p.onAddPaymentProviderButtonClick},null,8,["onOnClick"])]),_:1},8,["onClick"])):g("",!0)]),_:1},512)):g("",!0)])}const A=J(ee,[["render",ke]]);ee.__docgenInfo={exportName:"default",displayName:"PaymentConfigDropdown",description:"",tags:{},props:[{name:"brandPageToken",mixin:{name:"PaymentConfig.mixin",path:"PaymentConfig.mixin.js"},type:{name:"string"},required:!1},{name:"showPaymentProviderExternalId",mixin:{name:"PaymentConfig.mixin",path:"PaymentConfig.mixin.js"},type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"true"}},{name:"statusFilters",mixin:{name:"PaymentConfig.mixin",path:"PaymentConfig.mixin.js"},type:{name:"array"},required:!1,defaultValue:{func:!1,value:"undefined"}},{name:"showAddPaymentProvider",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}},{name:"paymentConfigId",type:{name:"string"},required:!1,defaultValue:{func:!1,value:"undefined"}}],events:[{name:"on-load",mixin:{name:"PaymentConfig.mixin",path:"PaymentConfig.mixin.js"},type:{names:["undefined"]}},{name:"on-add-payment-provider-click"},{name:"on-payment-config-selected",type:{names:["undefined"]}}],sourceFiles:["/Users/brooke.couchman/Projects/fe-shared-lib/src/experiences/components/PaymentConfigList/PaymentConfig.mixin.js","/Users/brooke.couchman/Projects/fe-shared-lib/src/experiences/components/PaymentConfigList/PaymentConfigDropdown.vue"]};const Be={title:"Components/PaymentConfigList",component:T},k=2e3,x=[{id:"32e1c01c-6276-4edb-821d-16f9d8a5e16b",name:"Stripe AUD",paymentProviderExternalId:void 0,paymentProviderImageUrl:"https://staging.bcassetcdn.com/assets/brand-page/payment-providers/stripe_wordmark_purple.svg",paymentProviderName:"Stripe",defaultCurrency:"USD",dashboardUrl:"https://dashboard.stripe.com",status:"PendingPreOnboarding"},{id:"ea1a0933-f3a5-486a-8943-3cea44d4c7ee",name:"Stripe USD",paymentProviderImageUrl:"https://staging.bcassetcdn.com/assets/brand-page/payment-providers/stripe_wordmark_purple.svg",paymentProviderExternalId:"acct_123456789abcdefg",paymentProviderName:"Stripe",defaultCurrency:"USD",dashboardUrl:"https://dashboard.stripe.com",status:"PendingPostOnboarding"},{id:"87dea6c0-68de-4172-984c-ff443c93413c",name:"Stripe GBP",paymentProviderExternalId:"acct_123456789abcdefg",paymentProviderImageUrl:"https://staging.bcassetcdn.com/assets/brand-page/payment-providers/stripe_wordmark_purple.svg",paymentProviderName:"Stripe",defaultCurrency:"AUD",dashboardUrl:"https://dashboard.stripe.com",status:"UnactivatedByCustomer"},{id:"450507c3-ac55-449d-b944-6daa1adba3f1",name:"Stripe EUR",paymentProviderExternalId:"acct_123456789abcdefg",paymentProviderImageUrl:"https://staging.bcassetcdn.com/assets/brand-page/payment-providers/stripe_wordmark_purple.svg",paymentProviderName:"Stripe",defaultCurrency:"GBP",dashboardUrl:"https://dashboard.stripe.com",status:"Active"}],S=()=>{const e=new C(c,{delayResponse:k}),n="6bc3885c-7e5c-4c9e-9b54-21dcd06ca647";return e.onGet(`/maker/api/brand-pages/${n}/payment-configs`).reply(200,x),{components:{PaymentConfigList:T},data(){return{brandPageToken:n}},template:`
+      <div class="tw-w-full tw-p-4" style="background: #f4f4f4">
+      <PaymentConfigList :brand-page-token="brandPageToken"/>
+      </div>
+    `}},u=()=>{const e=new C(c,{delayResponse:k}),n="6bc3885c-7e5c-4c9e-9b54-21dcd06ca647";return e.onGet(`/maker/api/brand-pages/${n}/payment-configs`).reply(200,x),{components:{PaymentConfigList:T},data(){return{brandPageToken:n}},template:`
+      <div class="tw-w-full tw-p-4" style="background: #f4f4f4">
+      <PaymentConfigList :brand-page-token="brandPageToken" :show-payment-provider-external-id="false"/>
+      </div>
+    `}};u.story={name:"Sample Stripe (Hidden External Id)"};const y=()=>{const e=new C(c,{delayResponse:k}),n="6bc3885c-7e5c-4c9e-9b54-21dcd06ca647";return e.onGet(`/maker/api/brand-pages/${n}/payment-configs`).reply(200,x),{components:{PaymentConfigDropdown:A},data(){return{brandPageToken:n}},template:`
+      <div class="tw-w-1/3 tw-p-4" style="background: #f4f4f4">
+      <PaymentConfigDropdown :brand-page-token="brandPageToken"/>
+      </div>
+    `}};y.story={name:"Dropdown Stripe"};const P=()=>{const e=new C(c,{delayResponse:k}),n="6bc3885c-7e5c-4c9e-9b54-21dcd06ca647";return e.onGet(`/maker/api/brand-pages/${n}/payment-configs`).reply(200,x),{components:{PaymentConfigDropdown:A},data(){return{brandPageToken:n}},template:`
+      <div class="tw-w-full tw-p-4" style="background: #f4f4f4">
+      <PaymentConfigDropdown :brand-page-token="brandPageToken" :status-filters="['Active']"/>
+      </div>
+    `}};P.story={name:"Dropdown Stripe with filter"};const b=()=>{const e=new C(c,{delayResponse:k}),n="00000000-0000-0000-0000-000000000000";return e.onGet(`/maker/api/brand-pages/${n}/payment-configs`).reply(200,[]),{components:{PaymentConfigDropdown:A},data(){return{brandPageToken:n}},template:`
+      <div class="tw-w-1/3 tw-p-4" style="background: #f4f4f4">
+      <PaymentConfigDropdown :brand-page-token="brandPageToken"/>
+      </div>
+    `}};b.SampleDropdownEmpty={name:"Dropdown Empty"};var L,N,B;S.parameters={...S.parameters,docs:{...(L=S.parameters)==null?void 0:L.docs,source:{originalSource:`() => {
+  const mock = new MockAdapter(axios, {
+    delayResponse: MOCK_RESPONSE_DELAY
+  });
+  const brandPageToken = '6bc3885c-7e5c-4c9e-9b54-21dcd06ca647';
+  mock.onGet(\`/maker/api/brand-pages/\${brandPageToken}/payment-configs\`).reply(200, PAYMENT_CONFIGS_RESPONSE);
+  return {
+    components: {
+      PaymentConfigList
+    },
+    data() {
+      return {
+        brandPageToken
+      };
+    },
+    template: \`
+      <div class="tw-w-full tw-p-4" style="background: #f4f4f4">
+      <PaymentConfigList :brand-page-token="brandPageToken"/>
+      </div>
+    \`
+  };
+}`,...(B=(N=S.parameters)==null?void 0:N.docs)==null?void 0:B.source}}};var I,$,R;u.parameters={...u.parameters,docs:{...(I=u.parameters)==null?void 0:I.docs,source:{originalSource:`() => {
+  const mock = new MockAdapter(axios, {
+    delayResponse: MOCK_RESPONSE_DELAY
+  });
+  const brandPageToken = '6bc3885c-7e5c-4c9e-9b54-21dcd06ca647';
+  mock.onGet(\`/maker/api/brand-pages/\${brandPageToken}/payment-configs\`).reply(200, PAYMENT_CONFIGS_RESPONSE);
+  return {
+    components: {
+      PaymentConfigList
+    },
+    data() {
+      return {
+        brandPageToken
+      };
+    },
+    template: \`
+      <div class="tw-w-full tw-p-4" style="background: #f4f4f4">
+      <PaymentConfigList :brand-page-token="brandPageToken" :show-payment-provider-external-id="false"/>
+      </div>
+    \`
+  };
+}`,...(R=($=u.parameters)==null?void 0:$.docs)==null?void 0:R.source}}};var U,M,j;y.parameters={...y.parameters,docs:{...(U=y.parameters)==null?void 0:U.docs,source:{originalSource:`() => {
+  const mock = new MockAdapter(axios, {
+    delayResponse: MOCK_RESPONSE_DELAY
+  });
+  const brandPageToken = '6bc3885c-7e5c-4c9e-9b54-21dcd06ca647';
+  mock.onGet(\`/maker/api/brand-pages/\${brandPageToken}/payment-configs\`).reply(200, PAYMENT_CONFIGS_RESPONSE);
+  return {
+    components: {
+      PaymentConfigDropdown
+    },
+    data() {
+      return {
+        brandPageToken
+      };
+    },
+    template: \`
+      <div class="tw-w-1/3 tw-p-4" style="background: #f4f4f4">
+      <PaymentConfigDropdown :brand-page-token="brandPageToken"/>
+      </div>
+    \`
+  };
+}`,...(j=(M=y.parameters)==null?void 0:M.docs)==null?void 0:j.source}}};var G,F,V;P.parameters={...P.parameters,docs:{...(G=P.parameters)==null?void 0:G.docs,source:{originalSource:`() => {
+  const mock = new MockAdapter(axios, {
+    delayResponse: MOCK_RESPONSE_DELAY
+  });
+  const brandPageToken = '6bc3885c-7e5c-4c9e-9b54-21dcd06ca647';
+  mock.onGet(\`/maker/api/brand-pages/\${brandPageToken}/payment-configs\`).reply(200, PAYMENT_CONFIGS_RESPONSE);
+  return {
+    components: {
+      PaymentConfigDropdown
+    },
+    data() {
+      return {
+        brandPageToken
+      };
+    },
+    template: \`
+      <div class="tw-w-full tw-p-4" style="background: #f4f4f4">
+      <PaymentConfigDropdown :brand-page-token="brandPageToken" :status-filters="['Active']"/>
+      </div>
+    \`
+  };
+}`,...(V=(F=P.parameters)==null?void 0:F.docs)==null?void 0:V.source}}};var q,Y,K;b.parameters={...b.parameters,docs:{...(q=b.parameters)==null?void 0:q.docs,source:{originalSource:`() => {
+  const mock = new MockAdapter(axios, {
+    delayResponse: MOCK_RESPONSE_DELAY
+  });
+  const brandPageToken = '00000000-0000-0000-0000-000000000000';
+  mock.onGet(\`/maker/api/brand-pages/\${brandPageToken}/payment-configs\`).reply(200, []);
+  return {
+    components: {
+      PaymentConfigDropdown
+    },
+    data() {
+      return {
+        brandPageToken
+      };
+    },
+    template: \`
+      <div class="tw-w-1/3 tw-p-4" style="background: #f4f4f4">
+      <PaymentConfigDropdown :brand-page-token="brandPageToken"/>
+      </div>
+    \`
+  };
+}`,...(K=(Y=b.parameters)==null?void 0:Y.docs)==null?void 0:K.source}}};const Ie=["SampleStripe","SampleStripeHideExternalId","SampleDropdownStripe","SampleDropdownStripeWithFilter","SampleDropdownEmpty"];export{b as SampleDropdownEmpty,y as SampleDropdownStripe,P as SampleDropdownStripeWithFilter,S as SampleStripe,u as SampleStripeHideExternalId,Ie as __namedExportsOrder,Be as default};

package/.storybook-static/assets/Picture-AUjTe_FO.js

@@ -0,0 +1 @@
+import{c as l,F as f,f as o,a as m,n as c,h as g,o as s}from"./vue.esm-bundler-C7QvyiW1.js";import{_ as y}from"./_plugin-vue_export-helper-DlAUqK2U.js";const d={props:{classes:{type:[String,Object],default:""},defaultImageUrl:{type:String,required:!0},alt:{type:String,default:void 0},sources:{type:Array,default:()=>[]},dataAttribute:{type:String,default:void 0},lazyLoad:{type:Boolean,default:!0},width:{type:String,default:void 0},height:{type:String,default:void 0},styles:{type:Object,default:void 0}},data(){return{imageTagRef:"js-image-tag"}},computed:{isLazyLoading(){return this.lazyLoad?"lazy":!1}},mounted(){this.dataAttribute&&this.$refs[this.imageTagRef].setAttribute(this.dataAttribute,"")},methods:{onContextMenu(n){this.$emit("contextmenu",n)},onImgLoad(n){this.$emit("onImgLoad",n)}}},h=["srcset","media"],p=["loading","src","alt","width","height"];function L(n,u,e,b,i,a){return s(),l("picture",null,[(s(!0),l(f,null,o(e.sources,(t,r)=>(s(),l("source",{key:r,srcset:t.srcset,media:t.mediaQuery},null,8,h))),128)),m("img",{ref:i.imageTagRef,class:c(["tw-block tw-w-full",e.classes]),loading:a.isLazyLoading,src:e.defaultImageUrl,alt:e.alt,width:e.width,height:e.height,style:g(e.styles),onContextmenu:u[0]||(u[0]=(...t)=>a.onContextMenu&&a.onContextMenu(...t)),onLoad:u[1]||(u[1]=(...t)=>a.onImgLoad&&a.onImgLoad(...t))},null,46,p)])}const x=y(d,[["render",L]]);d.__docgenInfo={exportName:"default",displayName:"Picture",description:"",tags:{},props:[{name:"classes",type:{name:"string|object"},defaultValue:{func:!1,value:"''"}},{name:"defaultImageUrl",type:{name:"string"},required:!0},{name:"alt",type:{name:"string"},defaultValue:{func:!1,value:"undefined"}},{name:"sources",type:{name:"array"},defaultValue:{func:!1,value:"[]"}},{name:"dataAttribute",type:{name:"string"},defaultValue:{func:!1,value:"undefined"}},{name:"lazyLoad",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}},{name:"width",type:{name:"string"},defaultValue:{func:!1,value:"undefined"}},{name:"height",type:{name:"string"},defaultValue:{func:!1,value:"undefined"}},{name:"styles",type:{name:"object"},defaultValue:{func:!1,value:"undefined"}}],events:[{name:"contextmenu",type:{names:["undefined"]}},{name:"onImgLoad",type:{names:["undefined"]}}],sourceFiles:["/Users/brooke.couchman/Projects/fe-shared-lib/src/atoms/components/Picture/Picture.vue"]};export{x as P};

package/.storybook-static/assets/Picture.stories-7_37X1oI.js

@@ -0,0 +1,119 @@
+import{P as s}from"./Picture-AUjTe_FO.js";import"./vue.esm-bundler-C7QvyiW1.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const a={standard:{defaultImageUrl:"https://bcassetcdn.com/assets/images/web/features/features-facebook-cover@2x.png",alt:"Facebook cover",sources:[{srcset:"https://bcassetcdn.com/assets/images/web/features/features-facebook-cover.png",mediaQuery:"(min-width: 1024px)"}]},logoSearchResultsGrid:{defaultImageUrl:"https://via.placeholder.com/600x480",alt:"Logo search result thumbnail",sources:[{srcset:"https://via.placeholder.com/300x240, https://via.placeholder.com/600x480 2x"}]},designSearchResultsGrid:{defaultImageUrl:"https://via.placeholder.com/800x304",alt:"Logo search result thumbnail",sources:[{srcset:"https://via.placeholder.com/480x182, https://via.placeholder.com/960x364 2x",mediaQuery:"(max-width: 767px)"},{srcset:"https://via.placeholder.com/400x152, https://via.placeholder.com/800x304 2x",mediaQuery:"(min-width: 768px)"}]}},v={title:"Components/Picture",component:s},t=()=>({components:{Picture:s},data(){return{picture:a.standard}},template:`
+      <Picture
+        :default-image-url="picture.defaultImageUrl"
+        :sources="picture.sources"
+        :alt="picture.alt"
+        data-attribute="data-test-preview"
+      />
+    `}),e=()=>({components:{Picture:s},data(){return{picture:a.logoSearchResultsGrid}},template:`
+      <div class="tw-container tw-max-w-300 tw-mx-auto tw-px-2 lg:tw-px-2.5 tw-mb-4">
+        <div class="tw-grid md:tw-grid-cols-3 tw-gap-5 tw-pt-8 tw-mb-12 lg:tw-grid-cols-4 tw-grid-cols-2 tw-px-2.5">
+          <div
+            v-for="index in 30"
+            :key="index"
+            class="tw-border tw-border-solid tw-border-grayscale-400"
+          >
+            <Picture
+              classes="tw-object-cover tw-w-full tw-object-top"
+              :default-image-url="picture.defaultImageUrl"
+              :sources="picture.sources"
+              :alt="picture.alt"
+            />
+          </div>
+        </div>
+      </div>
+    `}),r=()=>({components:{Picture:s},data(){return{picture:a.designSearchResultsGrid}},template:`
+      <div class="tw-container tw-max-w-300 tw-mx-auto tw-px-2 lg:tw-px-2.5 tw-mb-4">
+        <div class="tw-grid md:tw-grid-cols-3 tw-gap-5 tw-pt-8 tw-mb-12 lg:tw-grid-cols-3 tw-grid-cols-1 tw-px-2.5">
+          <div
+            v-for="index in 30"
+            :key="index"
+            class="tw-border tw-border-solid tw-border-grayscale-400"
+          >
+            <Picture
+              classes="tw-object-cover tw-w-full tw-object-top"
+              :default-image-url="picture.defaultImageUrl"
+              :sources="picture.sources"
+              :alt="picture.alt"
+            />
+          </div>
+        </div>
+      </div>
+    `});var c,o,i;t.parameters={...t.parameters,docs:{...(c=t.parameters)==null?void 0:c.docs,source:{originalSource:`() => {
+  return {
+    components: {
+      Picture
+    },
+    data() {
+      return {
+        picture: pictureFixtures.standard
+      };
+    },
+    template: \`
+      <Picture
+        :default-image-url="picture.defaultImageUrl"
+        :sources="picture.sources"
+        :alt="picture.alt"
+        data-attribute="data-test-preview"
+      />
+    \`
+  };
+}`,...(i=(o=t.parameters)==null?void 0:o.docs)==null?void 0:i.source}}};var n,d,l;e.parameters={...e.parameters,docs:{...(n=e.parameters)==null?void 0:n.docs,source:{originalSource:`() => {
+  return {
+    components: {
+      Picture
+    },
+    data() {
+      return {
+        picture: pictureFixtures.logoSearchResultsGrid
+      };
+    },
+    template: \`
+      <div class="tw-container tw-max-w-300 tw-mx-auto tw-px-2 lg:tw-px-2.5 tw-mb-4">
+        <div class="tw-grid md:tw-grid-cols-3 tw-gap-5 tw-pt-8 tw-mb-12 lg:tw-grid-cols-4 tw-grid-cols-2 tw-px-2.5">
+          <div
+            v-for="index in 30"
+            :key="index"
+            class="tw-border tw-border-solid tw-border-grayscale-400"
+          >
+            <Picture
+              classes="tw-object-cover tw-w-full tw-object-top"
+              :default-image-url="picture.defaultImageUrl"
+              :sources="picture.sources"
+              :alt="picture.alt"
+            />
+          </div>
+        </div>
+      </div>
+    \`
+  };
+}`,...(l=(d=e.parameters)==null?void 0:d.docs)==null?void 0:l.source}}};var u,p,w;r.parameters={...r.parameters,docs:{...(u=r.parameters)==null?void 0:u.docs,source:{originalSource:`() => {
+  return {
+    components: {
+      Picture
+    },
+    data() {
+      return {
+        picture: pictureFixtures.designSearchResultsGrid
+      };
+    },
+    template: \`
+      <div class="tw-container tw-max-w-300 tw-mx-auto tw-px-2 lg:tw-px-2.5 tw-mb-4">
+        <div class="tw-grid md:tw-grid-cols-3 tw-gap-5 tw-pt-8 tw-mb-12 lg:tw-grid-cols-3 tw-grid-cols-1 tw-px-2.5">
+          <div
+            v-for="index in 30"
+            :key="index"
+            class="tw-border tw-border-solid tw-border-grayscale-400"
+          >
+            <Picture
+              classes="tw-object-cover tw-w-full tw-object-top"
+              :default-image-url="picture.defaultImageUrl"
+              :sources="picture.sources"
+              :alt="picture.alt"
+            />
+          </div>
+        </div>
+      </div>
+    \`
+  };
+}`,...(w=(p=r.parameters)==null?void 0:p.docs)==null?void 0:w.source}}};const b=["Standard","LogoSearchResultsGrid","DesignSearchResultsGrid"];export{r as DesignSearchResultsGrid,e as LogoSearchResultsGrid,t as Standard,b as __namedExportsOrder,v as default};

package/.storybook-static/assets/Pill-DEH_ScBa.js

@@ -0,0 +1 @@
+import{c as o,r as s,o as r}from"./vue.esm-bundler-C7QvyiW1.js";import{_ as n}from"./_plugin-vue_export-helper-DlAUqK2U.js";const e={},c={class:"tw-rounded-full tw-outline-none tw-uppercase tw-py-0.5 tw-px-4 tw-select-none tw-text-center tw-text-xs"};function l(t,a,i,p,d,u){return r(),o("div",c,[s(t.$slots,"default")])}const _=n(e,[["render",l]]);e.__docgenInfo={exportName:"default",displayName:"Pill",description:"",tags:{},slots:[{name:"default"}],sourceFiles:["/Users/brooke.couchman/Projects/fe-shared-lib/src/atoms/components/Pill/Pill.vue"]};export{_ as P};

package/.storybook-static/assets/Pill.stories-CKakcDo1.js

@@ -0,0 +1,18 @@
+import{P as n}from"./Pill-DEH_ScBa.js";import"./vue.esm-bundler-C7QvyiW1.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const i={title:"Components/Pill",component:n},t=()=>({components:{Pill:n},template:`
+      <div class="tw-font-sans">
+        <Pill class="tw-text-white tw-my-2 tw-w-8" :style="{ background: 'blue' }">Blue</Pill>
+        <Pill class="tw-text-white tw-my-2 tw-w-8" :style="{ background: 'red' }">Red</Pill>
+      </div>
+    `});var e,l,s;t.parameters={...t.parameters,docs:{...(e=t.parameters)==null?void 0:e.docs,source:{originalSource:`() => {
+  return {
+    components: {
+      Pill
+    },
+    template: \`
+      <div class="tw-font-sans">
+        <Pill class="tw-text-white tw-my-2 tw-w-8" :style="{ background: 'blue' }">Blue</Pill>
+        <Pill class="tw-text-white tw-my-2 tw-w-8" :style="{ background: 'red' }">Red</Pill>
+      </div>
+    \`
+  };
+}`,...(s=(l=t.parameters)==null?void 0:l.docs)==null?void 0:s.source}}};const c=["Sample"];export{t as Sample,c as __namedExportsOrder,i as default};

package/.storybook-static/assets/PillBar-BeJSf_Pk.css

@@ -0,0 +1 @@
+.carousel-filter__category{white-space:nowrap}.carousel-filter__category:not(:last-child){margin-right:.75rem}

package/.storybook-static/assets/PillBar.stories-BNwlQM4p.js

@@ -0,0 +1,41 @@
+import{B as k}from"./Button-IgCxbLvL.js";import{c as n,F as w,f as U,g as x,o as i,i as D}from"./vue.esm-bundler-C7QvyiW1.js";import{_ as P}from"./_plugin-vue_export-helper-DlAUqK2U.js";import"./ButtonPrimary-Ce51KkgM.js";import"./Icon-B8lXgcc0.js";const p={components:{Button:k},props:{categories:{type:Array,required:!0,default:()=>[]},initialCategory:{type:String,required:!1,default:"Popular"},isDarkMode:{type:Boolean,default:!1}},data(){return{selectedCategory:null}},created(){this.selectedCategory=this.initialCategory},methods:{onSelectCategory(r){this.selectedCategory=r.name,this.$emit("on-click-category",r)}}},N={class:"tw-list-none tw-flex tw-overflow-y-hidden tw-overflow-x-auto tw-m-0 tw-p-0"};function I(r,v,o,B,y,b){const h=x("Button");return i(),n("ul",N,[(i(!0),n(w,null,U(o.categories,e=>(i(),n("li",{key:e.name,class:"carousel-filter__category"},[D(h,{label:e.name,variant:o.isDarkMode?"dark-mode-pill":"pill",active:e.name===y.selectedCategory,onOnClick:S=>b.onSelectCategory(e)},null,8,["label","variant","active","onOnClick"])]))),128))])}const s=P(p,[["render",I]]);p.__docgenInfo={exportName:"default",displayName:"PillBar",description:"",tags:{},props:[{name:"categories",type:{name:"array"},required:!0,defaultValue:{func:!1,value:"[]"}},{name:"initialCategory",type:{name:"string"},required:!1,defaultValue:{func:!1,value:"'Popular'"}},{name:"isDarkMode",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}}],events:[{name:"on-click-category",type:{names:["undefined"]}}],sourceFiles:["/Users/brooke.couchman/Projects/fe-shared-lib/src/atoms/components/PillBar/PillBar.vue"]};const f=[{name:"Popular",templateTypes:[{name:"Logo Designs",category:"Brand Identity",editorUrl:"logo-design-modal",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-brand-identity-logo-design@2x.png",carouselImageUrl:null,dimensions:"1280 x 1024",description:"View and edit your logo",height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Logo Designs",pluralName:"Logo Designs",token:"b0349875-33ac-4b93-a581-42f93255f461"},{name:"Business Card",category:"Brand Identity",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/business%20card%20horizontal",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-brand-identity-business-card@2x.png",carouselImageUrl:null,dimensions:"3.5 x 2 in",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:null,pluralName:"Business Cards",token:"4b6158b3-c992-4799-a838-d060565c32e7"},{name:"Facebook cover",category:"Social Media Covers",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/facebook%20cover",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-cover-facebook@2x.png",carouselImageUrl:null,dimensions:"820 x 312 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Facebook Cover",pluralName:"Facebook Covers",token:"fd5a796f-4f74-46a4-b5eb-cf5e478cd095"},{name:"Instagram post",category:"Social Media Posts",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/instagram%20post",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-post-instagram@2x.png",carouselImageUrl:null,dimensions:"1080 x 1080 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Instagram Post",pluralName:"Instagram Posts",token:"bce84983-7d85-499e-8b82-3474b625867e"},{name:"Brand Page",category:"Website",editorUrl:"/maker/brand-page/manage/create?logoDraftToken=32e0c206-edc5-4452-9925-2ab43ffd947c",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-brand-identity-business-card-vertical@2x.png",carouselImageUrl:null,dimensions:"Default",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Web Page",pluralName:"Web Pages",token:"88102dd6-2601-48b2-b6a3-1ab6f5600ce7"},{name:"Facebook post",category:"Social Media Posts",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/facebook%20post",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-post-facebook@2x.png",carouselImageUrl:null,dimensions:"940 x 788 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Facebook Post",pluralName:"Facebook Posts",token:"f6ecd7bd-ed25-4e9e-b500-a1452defb15e"},{name:"YouTube cover (channel art)",category:"Social Media Covers",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/youtube%20cover%20(channel%20art)",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-cover-youtube@2x.png",carouselImageUrl:null,dimensions:"2560 x 1440 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"YouTube Banner",pluralName:"YouTube Banners",token:"b5f801a9-625f-45df-bf31-af2ccf594018"}]},{name:"Social Media Covers",templateTypes:[{name:"Facebook cover",category:"Social Media Covers",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/facebook%20cover",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-cover-facebook@2x.png",carouselImageUrl:null,dimensions:"820 x 312 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Facebook Cover",pluralName:"Facebook Covers",token:"fd5a796f-4f74-46a4-b5eb-cf5e478cd095"},{name:"YouTube cover (channel art)",category:"Social Media Covers",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/youtube%20cover%20(channel%20art)",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-cover-youtube@2x.png",carouselImageUrl:null,dimensions:"2560 x 1440 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"YouTube Banner",pluralName:"YouTube Banners",token:"b5f801a9-625f-45df-bf31-af2ccf594018"},{name:"Twitch banner",category:"Social Media Covers",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/twitch%20banner",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-cover-tiwtch@2x.png",carouselImageUrl:null,dimensions:"1920 x 480 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Twitch Banner",pluralName:"Twitch Banners",token:"73529324-07c5-4306-b230-89a200f30f76"},{name:"LinkedIn banner",category:"Social Media Covers",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/linkedin%20banner",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-cover-linkedin@2x.png",carouselImageUrl:null,dimensions:"1584 x 396 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"LinkedIn Banner",pluralName:"LinkedIn Banners",token:"47b661fe-05f7-4d75-ae79-7c1b2d582978"},{name:"Facebook event cover",category:"Social Media Covers",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/facebook%20event%20cover",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-cover-facebook-event@2x.png",carouselImageUrl:null,dimensions:"1920 x 1080 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Facebook Event Cover",pluralName:"Facebook Event Covers",token:"b239cf78-9c34-492f-a9ff-e66e3e1b40e7"},{name:"SoundCloud banner",category:"Social Media Covers",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/soundcloud%20banner",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-cover-soundcloud@2x.png",carouselImageUrl:null,dimensions:"2480 x 520 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"SoundCloud Banner",pluralName:"SoundCloud Banners",token:"7344e35c-e6ba-4f20-8957-9fb3bc02d190"},{name:"Tumblr banner",category:"Social Media Covers",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/tumblr%20banner",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-cover-tumblr@2x.png",carouselImageUrl:null,dimensions:"3000 x 1055 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Tumblr Banner",pluralName:"Tumblr Banners",token:"709b5da5-9cd3-469d-9ed0-b93649b0803e"},{name:"Twitter header (cover)",category:"Social Media Covers",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/twitter%20header%20(cover)",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-cover-twitter@2x.png",carouselImageUrl:null,dimensions:"1500 x 500 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Twitter Header",pluralName:"Twitter Headers",token:"f99d0426-fd9e-4d59-a38c-b3160949a089"},{name:"Pinterest board cover",category:"Social Media Covers",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/pinterest%20board%20cover",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-cover-pinterest@2x.png",carouselImageUrl:null,dimensions:"222 x 150 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Pinterest Covers",pluralName:"Pinterest Board Covers",token:"c4b8232c-cb16-4126-9a01-2312d70e1e88"},{name:"Zoom background",category:"Social Media Covers",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/zoom%20background",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-cover-zoom@2x.png",carouselImageUrl:null,dimensions:"1280 x 720 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Zoom Background",pluralName:"Zoom Backgrounds",token:"c08e1a37-0472-444b-95a2-f37a663c0f5f"}]},{name:"Social Media Posts",templateTypes:[{name:"Instagram post",category:"Social Media Posts",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/instagram%20post",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-post-instagram@2x.png",carouselImageUrl:null,dimensions:"1080 x 1080 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Instagram Post",pluralName:"Instagram Posts",token:"bce84983-7d85-499e-8b82-3474b625867e"},{name:"Instagram story",category:"Social Media Posts",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/instagram%20story",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-post-instagram-story@2x.png",carouselImageUrl:null,dimensions:"1080 x 1920 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Instagram Story",pluralName:"Instagram Stories",token:"606e1476-be7e-40d1-b41e-fd656bf7d7df"},{name:"Facebook post",category:"Social Media Posts",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/facebook%20post",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-post-facebook@2x.png",carouselImageUrl:null,dimensions:"940 x 788 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Facebook Post",pluralName:"Facebook Posts",token:"f6ecd7bd-ed25-4e9e-b500-a1452defb15e"},{name:"Tumblr post",category:"Social Media Posts",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/tumblr%20post",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-post-tumblr@2x.png",carouselImageUrl:null,dimensions:"500 x 750 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Tumblr Post",pluralName:"Tumblr Posts",token:"cce321b7-3fa9-4b9b-b588-0bce143b92e5"},{name:"Facebook story",category:"Social Media Posts",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/facebook%20story",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-post-facebook-story@2x.png",carouselImageUrl:null,dimensions:"1080 x 1920 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Facebook Story",pluralName:"Facebook Stories",token:"b9500b5e-a010-4654-a1d1-572e8465ecbe"},{name:"Whatsapp story",category:"Social Media Posts",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/whatsapp%20story",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-post-whatsapp@2x.png",carouselImageUrl:null,dimensions:"1080 x 1920 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Whatsapp Story",pluralName:"Whatsapp Stories",token:"a7b11991-2fb2-4e99-82b2-ac6303f3b0e1"},{name:"YouTube thumbnail (on videos)",category:"Social Media Posts",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/youtube%20thumbnail%20(on%20videos)",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-profile-pic-youtube-thumbnail@2x.png",carouselImageUrl:null,dimensions:"1280 x 720 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"YouTube Thumbnail",pluralName:"YouTube Thumbnails",token:"f414305c-eda8-4af0-a7a3-8de64f696c01"},{name:"Facebook ad",category:"Social Media Posts",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/facebook%20ad",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-post-facebook-ad@2x.png",carouselImageUrl:null,dimensions:"1200 x 628 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Facebook Ad",pluralName:"Facebook Ads",token:"a5c8754a-ebe3-4074-8a57-a0b70f1e47b9"},{name:"Twitter post",category:"Social Media Posts",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/twitter%20post",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-post-twitter@2x.png",carouselImageUrl:null,dimensions:"1024 x 512 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Twitter Post",pluralName:"Twitter Posts",token:"e5dc0278-7e12-48dc-813f-f212bbbc747e"},{name:"Snapchat geofilters, ads and lenses",category:"Social Media Posts",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/snapchat%20geofilters,%20ads%20and%20lenses",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-social-media-post-snapchat@2x.png",carouselImageUrl:null,dimensions:"1080 x 1920 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Snapchat Design",pluralName:"Snapchat Designs",token:"16680a40-3922-4e52-9787-ba0ecbd05ea9"}]},{name:"Profile Pictures",templateTypes:[{name:"Facebook profile picture",category:"Profile Pictures",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/facebook%20profile%20picture",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-profile-pic-facebook@2x.png",carouselImageUrl:null,dimensions:"1000 x 1000 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Facebook Profile Picture",pluralName:"Facebook Profile Pictures",token:"de3f1998-4daa-4f00-94f1-805d44909ca9"},{name:"Instagram profile picture",category:"Profile Pictures",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/instagram%20profile%20picture",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-profile-pic-instagram@2x.png",carouselImageUrl:null,dimensions:"1000 x 1000 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Instagram Profile Picture",pluralName:"Instagram Profile Pictures",token:"c935053f-449a-4c15-8c66-73f7899d8de7"},{name:"Twitch profile picture",category:"Profile Pictures",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/twitch%20profile%20picture",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-profile-pic-twitch@2x.png",carouselImageUrl:null,dimensions:"1000 x 1000 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Twitch Profile Picture",pluralName:"Twitch Profile Pictures",token:"590a763d-0c35-4ec8-ad43-cd20a06f40e8"},{name:"LinkedIn profile picture",category:"Profile Pictures",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/linkedin%20profile%20picture",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-profile-pic-linkedin@2x.png",carouselImageUrl:null,dimensions:"1000 x 1000 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"LinkedIn Profile Picture",pluralName:"LinkedIn Profile Pictures",token:"9e372479-f436-4349-8ed1-911ea2f914c7"},{name:"YouTube channel icon",category:"Profile Pictures",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/youtube%20channel%20icon",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-profile-pic-youtube@2x.png",carouselImageUrl:null,dimensions:"1000 x 1000 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"YouTube Channel Icon",pluralName:"YouTube Channel Icons",token:"4a2314ac-927f-466e-97eb-36d84fb67a44"},{name:"Twitter profile picture",category:"Profile Pictures",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/twitter%20profile%20picture",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-profile-pic-twitter@2x.png",carouselImageUrl:null,dimensions:"1000 x 1000 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Twitter Profile Picture",pluralName:"Twitter Profile Pictures",token:"11e94819-27dc-44b8-b6ff-6d2961a25f84"},{name:"SoundCloud profile picture",category:"Profile Pictures",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/soundcloud%20profile%20picture",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-profile-pic-soundcloud@2x.png",carouselImageUrl:null,dimensions:"1000 x 1000 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"SoundCloud Profile Picture",pluralName:"SoundCloud Profile Pictures",token:"5d9756fa-1e59-4e53-b4b1-e44bfad6f83f"},{name:"Pinterest profile picture",category:"Profile Pictures",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/pinterest%20profile%20picture",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-profile-pic-pinterest@2x.png",carouselImageUrl:null,dimensions:"1000 x 1000 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Pinterest Profile Picture",pluralName:"Pinterest Profile Pictures",token:"40d1de23-89c5-4806-83d5-6dd653bd07e1"},{name:"Tumblr profile picture",category:"Profile Pictures",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/tumblr%20profile%20picture",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-profile-pic-tumblr@2x.png",carouselImageUrl:null,dimensions:"1000 x 1000 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Tumblr Profile Picture",pluralName:"Tumblr Profile Pictures",token:"3a892cea-41b0-422b-bea3-29bb3497ba6c"}]},{name:"Brand Identity",templateTypes:[{name:"Business card horizontal",category:"Brand Identity",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/business%20card%20horizontal",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-brand-identity-business-card@2x.png",carouselImageUrl:null,dimensions:"3.5 x 2 in",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Business Card",pluralName:"Business cards horizontal",token:"4b6158b3-c992-4799-a838-d060565c32e7"},{name:"Business card square",category:"Brand Identity",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/business%20card%20square",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-brand-identity-business-card-square@2x.png",carouselImageUrl:null,dimensions:"2.5 x 2.5 in",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Business Card",pluralName:"Business cards square",token:"0707e6b7-f460-4b11-808f-24a9178e304f"},{name:"Business card vertical",category:"Brand Identity",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/business%20card%20vertical",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-brand-identity-business-card-vertical@2x.png",carouselImageUrl:null,dimensions:"2 x 3.5 in",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Business Card",pluralName:"Business cards vertical",token:"1e42a0e3-3c5a-4226-b884-3e3bcaa5d3f4"},{name:"Email Signature",category:"Brand Identity",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/email%20signature",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-brand-identity-email-signature@2x.png",carouselImageUrl:null,dimensions:"600 x 200 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Email Signature",pluralName:"Email Signatures",token:"ef11f0d4-5549-4c26-9e3f-ccac8c91e4a2"},{name:"Letterhead",category:"Brand Identity",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/letterhead",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-brand-identity-letterhead@2x.png",carouselImageUrl:null,dimensions:"21 x 29.7 cm (A4)",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Letterhead",pluralName:"Letterheads",token:"eef6343e-4d4e-49e5-b4ae-ea73418daf3e"},{name:"Favicon",category:"Brand Identity",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/favicon",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-brand-identity-favicon@2x.png",carouselImageUrl:null,dimensions:"32 x 32 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Favicon",pluralName:"Favicons",token:"c83da9fb-e514-450c-995b-240f6b68966d"},{name:"Poster",category:"Brand Identity",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/poster",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-brand-identity-poster@2x.png",carouselImageUrl:null,dimensions:"598 x 845 mm (A1)",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Poster",pluralName:"Posters",token:"ff5b1fe0-ac40-4ad2-9ca1-99eae9daad7f"},{name:"Flyer",category:"Brand Identity",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/flyer",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-brand-identity-flyer@2x.png",carouselImageUrl:null,dimensions:"21 x 29.7 cm (A4)",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Flyer",pluralName:"Flyers",token:"c34f4e0b-ea57-4d5d-9a64-ac410fd647d2"},{name:"Invoice",category:"Brand Identity",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/invoice",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-brand-identity-invoice@2x.png",carouselImageUrl:null,dimensions:"21 x 29.7 cm (A4)",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Invoice",pluralName:"Invoices",token:"60456c4c-158e-4c90-a3cc-1d0d20ae2eb6"},{name:"Menu",category:"Brand Identity",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/menu",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-brand-identity-menu@2x.png",carouselImageUrl:null,dimensions:"21 x 29.7 cm (A4)",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Menu",pluralName:"Menus",token:"ab7d3c84-63b6-4ac5-8b76-11190c220869"},{name:"Postcard",category:"Brand Identity",editorUrl:"/maker/mydesigns/new/32e0c206-edc5-4452-9925-2ab43ffd947c/postcard",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-brand-identity-postcard@2x.png",carouselImageUrl:null,dimensions:"151 x 108 mm (A6)",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Postcard",pluralName:"Postcards",token:"581e5ddd-b180-4789-b573-b1f2330b9a0f"},{name:"Logo Designs",category:"Brand Identity",editorUrl:"logo-design-modal",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-brand-identity-logo-design@2x.png",carouselImageUrl:null,dimensions:"1280 x 1024",description:"View and edit your logo",height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:"Logo Designs",pluralName:"Logo Designs",token:"b0349875-33ac-4b93-a581-42f93255f461"}]},{name:"Custom Design",templateTypes:[{name:"Square",category:null,editorUrl:"/maker/mydesigns/new/customdesign?h=1080&w=1080&logoDraftToken=32e0c206-edc5-4452-9925-2ab43ffd947c",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-custom-square.png",carouselImageUrl:null,dimensions:"1080 x 1080 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:null,pluralName:"Square",token:"00000000-0000-0000-0000-000000000000"},{name:"Portrait",category:null,editorUrl:"/maker/mydesigns/new/customdesign?h=1080&w=720&logoDraftToken=32e0c206-edc5-4452-9925-2ab43ffd947c",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-custom-portrait.png",carouselImageUrl:null,dimensions:"1080 x 720 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:null,pluralName:"Portrait",token:"00000000-0000-0000-0000-000000000000"},{name:"Landscape",category:null,editorUrl:"/maker/mydesigns/new/customdesign?h=720&w=1080&logoDraftToken=32e0c206-edc5-4452-9925-2ab43ffd947c",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-custom-landscape.png",carouselImageUrl:null,dimensions:"720 x 1080 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:null,pluralName:"Landscape",token:"00000000-0000-0000-0000-000000000000"},{name:"Tall",category:null,editorUrl:"/maker/mydesigns/new/customdesign?h=1280&w=640&logoDraftToken=32e0c206-edc5-4452-9925-2ab43ffd947c",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-custom-tall.png",carouselImageUrl:null,dimensions:"1280 x 640 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:null,pluralName:"Tall",token:"00000000-0000-0000-0000-000000000000"},{name:"Wide",category:null,editorUrl:"/maker/mydesigns/new/customdesign?h=640&w=1280&logoDraftToken=32e0c206-edc5-4452-9925-2ab43ffd947c",imageUrl:"https://localhost:8101/images/brandcrowd/maker/maker-generic-custom-wide.png",carouselImageUrl:null,dimensions:"640 x 1280 px",description:null,height:null,width:null,smallDisplay:0,largeDisplay:0,slug:null,friendlyName:null,pluralName:"Wide",token:"00000000-0000-0000-0000-000000000000"}]}],L={title:"Components/PillBar",component:s},l=()=>({components:{PillBar:s},data(){return{categories:f}},template:`
+      <div class="tw-max-w-300">
+        <PillBar :categories="categories" />
+      </div>
+    `}),a=()=>({components:{PillBar:s},data(){return{categories:f}},template:`
+      <div class="tw-max-w-300 tw-bg-black tw-p-8">
+        <PillBar :categories="categories" is-dark-mode />
+      </div>
+    `});var t,c,d;l.parameters={...l.parameters,docs:{...(t=l.parameters)==null?void 0:t.docs,source:{originalSource:`() => {
+  return {
+    components: {
+      PillBar
+    },
+    data() {
+      return {
+        categories
+      };
+    },
+    template: \`
+      <div class="tw-max-w-300">
+        <PillBar :categories="categories" />
+      </div>
+    \`
+  };
+}`,...(d=(c=l.parameters)==null?void 0:c.docs)==null?void 0:d.source}}};var m,u,g;a.parameters={...a.parameters,docs:{...(m=a.parameters)==null?void 0:m.docs,source:{originalSource:`() => {
+  return {
+    components: {
+      PillBar
+    },
+    data() {
+      return {
+        categories
+      };
+    },
+    template: \`
+      <div class="tw-max-w-300 tw-bg-black tw-p-8">
+        <PillBar :categories="categories" is-dark-mode />
+      </div>
+    \`
+  };
+}`,...(g=(u=a.parameters)==null?void 0:u.docs)==null?void 0:g.source}}};const Y=["Sample","SampleDarkMode"];export{l as Sample,a as SampleDarkMode,Y as __namedExportsOrder,L as default};

package/.storybook-static/assets/Price-BzFp3dn5.js

@@ -0,0 +1 @@
+import{c as s,t as a,o as i}from"./vue.esm-bundler-C7QvyiW1.js";import{_ as l}from"./_plugin-vue_export-helper-DlAUqK2U.js";const n={props:{amount:{type:[Number,String],required:!1,default:null},alwaysShowFraction:{type:Boolean,required:!1,default:!0},currency:{type:Object,required:!1,default:null},fraction:{type:[Number,String],required:!1,default:0},showAbbreviation:{type:Boolean,required:!1,default:!1},wrapInParentheses:{type:Boolean,requred:!1,default:!1},suffix:{type:String,required:!1,default:""},isDomainCredit:{type:Boolean,required:!1,default:!1}},computed:{amountFormatted(){if(this.isDomainCredit)return"Domain credit used";if(!this.amount||this.amount===0)return"Free";const e=Number.parseFloat(this.amount);return Number.isNaN(e)?this.amount:!(e%1!==0)&&!this.alwaysShowFraction?e.toFixed(0):e.toFixed(this.fraction)},currencyAbbreviation(){var e,r;return this.showAbbreviation&&this.amount>0?(r=(e=this.currency)==null?void 0:e.abbreviation)==null?void 0:r.trim():""},currencySymbol(){var e,r;return!this.amount||this.amount===0?"":((r=(e=this.currency)==null?void 0:e.symbol)==null?void 0:r.trim())??"$"},isSymbolPlacedBeforePrice(){var e,r;return((e=this.currency)==null?void 0:e.isSymbolPlacedBeforePrice)==null?!0:((r=this.currency)==null?void 0:r.isSymbolPlacedBeforePrice)===!0},currencySymbolBefore(){return this.isSymbolPlacedBeforePrice?this.currencySymbol:""},currencySymbolAfter(){return this.isSymbolPlacedBeforePrice?"":this.currencySymbol},optionalLeftParenthesis(){return this.wrapInParentheses?"(":""},optionalRightParenthesis(){return this.wrapInParentheses?")":""}}},o={class:"notranslate"};function c(e,r,u,f,m,t){return i(),s("span",o,a(t.optionalLeftParenthesis)+a(t.currencyAbbreviation)+a(t.currencySymbolBefore)+a(t.amountFormatted)+a(t.currencySymbolAfter)+a(t.optionalRightParenthesis)+a(u.suffix),1)}const h=l(n,[["render",c]]);n.__docgenInfo={exportName:"default",displayName:"Price",description:"",tags:{},props:[{name:"amount",type:{name:"number|string"},required:!1,defaultValue:{func:!1,value:"null"}},{name:"alwaysShowFraction",type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"true"}},{name:"currency",type:{name:"object"},required:!1,defaultValue:{func:!1,value:"null"}},{name:"fraction",type:{name:"number|string"},required:!1,defaultValue:{func:!1,value:"0"}},{name:"showAbbreviation",type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}},{name:"wrapInParentheses",type:{name:"boolean"},defaultValue:{func:!1,value:"false"}},{name:"suffix",type:{name:"string"},required:!1,defaultValue:{func:!1,value:"''"}},{name:"isDomainCredit",type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}}],sourceFiles:["/Users/brooke.couchman/Projects/fe-shared-lib/src/atoms/components/Price/Price.vue"]};export{h as P};

package/.storybook-static/assets/Price.stories-m0jztoEd.js

@@ -0,0 +1,221 @@
+import{P as a}from"./Price-BzFp3dn5.js";import"./vue.esm-bundler-C7QvyiW1.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const N={id:1,name:"United State Dollars",iso4127Code:"USD",symbol:"$",abbreviation:"US"},T={id:2,name:"Australian Dollars",iso4127Code:"AUD",symbol:"$",abbreviation:"AU"},j={id:999,name:"Euro",iso4127Code:"EUR",symbol:"€",abbreviation:"EU"},s=[N,T,j],U={title:"Components/Price",component:a,args:{currencyName:s[0].name},argTypes:{amount:{type:"number"},currencyName:{control:{type:"select"},options:s.map(n=>n.name)}}},t={render:(n,{argTypes:e})=>({components:{Price:a},props:Object.keys(e),setup(){return{args:n}},computed:{selectedCurrency(){return s.find(r=>r.name===this.args.currencyName)}},template:`
+      <span>
+        <price 
+            v-bind="args"
+            :currency="selectedCurrency"
+        />
+      </span>
+    `}),args:{amount:45}},c={render:(n,{argTypes:e})=>({components:{Price:a},props:Object.keys(e),setup(){return{args:n}},computed:{selectedCurrency(){return s.find(r=>r.name===this.args.currencyName)}},template:`
+      <span>
+        <price
+            v-bind="args"
+            :currency="selectedCurrency"
+            fraction="2"
+            :show-abbreviation="true"
+        />
+      </span>
+    `}),args:{amount:22.5}},o={render:(n,{argTypes:e})=>({components:{Price:a},props:Object.keys(e),setup(){return{args:n}},computed:{selectedCurrency(){return s.find(r=>r.name===this.args.currencyName)}},template:`
+      <span>
+        <price
+            v-bind="args"
+            :always-show-fraction="true"
+            :currency="selectedCurrency"
+            fraction="2"
+            :show-abbreviation="true"
+        />
+      </span>
+    `}),args:{amount:22}},u={render:(n,{argTypes:e})=>({components:{Price:a},props:Object.keys(e),setup(){return{args:n}},computed:{selectedCurrency(){return s.find(r=>r.name===this.args.currencyName)}},template:`
+      <span>
+        <price
+            v-bind="args"
+            :always-show-fraction="false"
+            :currency="selectedCurrency"
+            fraction="2"
+            :show-abbreviation="true"
+          />
+      </span>
+    `}),args:{amount:22}},p={render:(n,{argTypes:e})=>({components:{Price:a},props:Object.keys(e),setup(){return{args:n}},computed:{selectedCurrency(){return s.find(r=>r.name===this.args.currencyName)}},template:`
+      <span>
+        <price
+            v-bind="args"
+            :always-show-fraction="true"
+            :currency="selectedCurrency"
+            fraction="2"
+            :show-abbreviation="true"
+            :suffix="suffix"
+          />
+      </span>
+    `}),args:{amount:22,suffix:"/yr"}};var i,m,d;t.parameters={...t.parameters,docs:{...(i=t.parameters)==null?void 0:i.docs,source:{originalSource:`{
+  render: (args, {
+    argTypes
+  }) => {
+    return {
+      components: {
+        Price
+      },
+      props: Object.keys(argTypes),
+      setup() {
+        return {
+          args
+        };
+      },
+      computed: {
+        selectedCurrency() {
+          return currencies.find(x => x.name === this.args.currencyName);
+        }
+      },
+      template: \`
+      <span>
+        <price 
+            v-bind="args"
+            :currency="selectedCurrency"
+        />
+      </span>
+    \`
+    };
+  },
+  args: {
+    amount: 45
+  }
+}`,...(d=(m=t.parameters)==null?void 0:m.docs)==null?void 0:d.source}}};var y,l,g;c.parameters={...c.parameters,docs:{...(y=c.parameters)==null?void 0:y.docs,source:{originalSource:`{
+  render: (args, {
+    argTypes
+  }) => {
+    return {
+      components: {
+        Price
+      },
+      props: Object.keys(argTypes),
+      setup() {
+        return {
+          args
+        };
+      },
+      computed: {
+        selectedCurrency() {
+          return currencies.find(x => x.name === this.args.currencyName);
+        }
+      },
+      template: \`
+      <span>
+        <price
+            v-bind="args"
+            :currency="selectedCurrency"
+            fraction="2"
+            :show-abbreviation="true"
+        />
+      </span>
+    \`
+    };
+  },
+  args: {
+    amount: 22.5
+  }
+}`,...(g=(l=c.parameters)==null?void 0:l.docs)==null?void 0:g.source}}};var f,b,h;o.parameters={...o.parameters,docs:{...(f=o.parameters)==null?void 0:f.docs,source:{originalSource:`{
+  render: (args, {
+    argTypes
+  }) => {
+    return {
+      components: {
+        Price
+      },
+      props: Object.keys(argTypes),
+      setup() {
+        return {
+          args
+        };
+      },
+      computed: {
+        selectedCurrency() {
+          return currencies.find(x => x.name === this.args.currencyName);
+        }
+      },
+      template: \`
+      <span>
+        <price
+            v-bind="args"
+            :always-show-fraction="true"
+            :currency="selectedCurrency"
+            fraction="2"
+            :show-abbreviation="true"
+        />
+      </span>
+    \`
+    };
+  },
+  args: {
+    amount: 22.0
+  }
+}`,...(h=(b=o.parameters)==null?void 0:b.docs)==null?void 0:h.source}}};var w,C,v;u.parameters={...u.parameters,docs:{...(w=u.parameters)==null?void 0:w.docs,source:{originalSource:`{
+  render: (args, {
+    argTypes
+  }) => {
+    return {
+      components: {
+        Price
+      },
+      props: Object.keys(argTypes),
+      setup() {
+        return {
+          args
+        };
+      },
+      computed: {
+        selectedCurrency() {
+          return currencies.find(x => x.name === this.args.currencyName);
+        }
+      },
+      template: \`
+      <span>
+        <price
+            v-bind="args"
+            :always-show-fraction="false"
+            :currency="selectedCurrency"
+            fraction="2"
+            :show-abbreviation="true"
+          />
+      </span>
+    \`
+    };
+  },
+  args: {
+    amount: 22.0
+  }
+}`,...(v=(C=u.parameters)==null?void 0:C.docs)==null?void 0:v.source}}};var x,S,O;p.parameters={...p.parameters,docs:{...(x=p.parameters)==null?void 0:x.docs,source:{originalSource:`{
+  render: (args, {
+    argTypes
+  }) => {
+    return {
+      components: {
+        Price
+      },
+      props: Object.keys(argTypes),
+      setup() {
+        return {
+          args
+        };
+      },
+      computed: {
+        selectedCurrency() {
+          return currencies.find(x => x.name === this.args.currencyName);
+        }
+      },
+      template: \`
+      <span>
+        <price
+            v-bind="args"
+            :always-show-fraction="true"
+            :currency="selectedCurrency"
+            fraction="2"
+            :show-abbreviation="true"
+            :suffix="suffix"
+          />
+      </span>
+    \`
+    };
+  },
+  args: {
+    amount: 22.0,
+    suffix: '/yr'
+  }
+}`,...(O=(S=p.parameters)==null?void 0:S.docs)==null?void 0:O.source}}};const F=["Sample","WithFraction","AlwaysShowFractionOn","AlwaysShowFractionOff","WithSuffix"];export{u as AlwaysShowFractionOff,o as AlwaysShowFractionOn,t as Sample,c as WithFraction,p as WithSuffix,F as __namedExportsOrder,U as default};