@feedmepos/ui-library 0.0.11 → 0.0.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/dynamic-dialog/FmDynamicDialog.vue.d.ts +21 -1
- package/dist/components/form/form/FmForm.vue.d.ts +6 -1
- package/dist/components/form/select/FmSelect.vue.d.ts +11 -10
- package/dist/components/menu/menu-container/FmMenu.vue.d.ts +10 -8
- package/dist/components/tooltip/FmTooltip.vue.d.ts +3 -3
- package/dist/components.d.ts +580 -127
- package/dist/federation/FmDateRangePicker-6a251133.css +1 -0
- package/dist/federation/FmDropField-b51924c1.css +1 -0
- package/dist/federation/FmForm.vue_vue_type_script_setup_true_lang-67f87de0.js +1 -0
- package/dist/federation/FmMenu-1bf41c36.css +1 -0
- package/dist/federation/FmProgressIndicator.vue_vue_type_style_index_0_lang-4936958a.js +1 -0
- package/dist/federation/FmSelect-0d4033b1.css +1 -0
- package/dist/federation/FmStepper.vue_vue_type_script_setup_true_lang-ebb560f4.js +1 -0
- package/dist/federation/FmTextField.vue_vue_type_style_index_0_lang-37891b48.js +1 -0
- package/dist/federation/{FmTimePicker.vue_vue_type_style_index_0_lang-cd3ff46f.js → FmTimePicker.vue_vue_type_style_index_0_lang-adf67efb.js} +1 -1
- package/dist/federation/FmTooltip.vue_vue_type_script_setup_true_lang-4afc1a0b.js +1 -0
- package/dist/federation/__federation_expose_FmDateRangePicker-96bfdeee.js +1 -0
- package/dist/federation/__federation_expose_FmDropField-acc0feb2.js +1 -0
- package/dist/federation/__federation_expose_FmDynamicDialog-f6d013b7.js +1 -0
- package/dist/federation/{__federation_expose_FmForm-95a4221b.js → __federation_expose_FmForm-81601667.js} +1 -1
- package/dist/federation/__federation_expose_FmMenu-da3eca46.js +1 -0
- package/dist/federation/__federation_expose_FmProgressIndicator-cb1c88dd.js +1 -0
- package/dist/federation/__federation_expose_FmSelect-c850d1a0.js +1 -0
- package/dist/federation/{__federation_expose_FmStepper-39811b61.js → __federation_expose_FmStepper-fc3f64a1.js} +1 -1
- package/dist/federation/{__federation_expose_FmTextField-ee99cd30.js → __federation_expose_FmTextField-09b9d527.js} +1 -1
- package/dist/federation/{__federation_expose_FmTimePicker-149aa26d.js → __federation_expose_FmTimePicker-2f0c4dd1.js} +1 -1
- package/dist/federation/{__federation_expose_FmTooltip-fa2c64c7.js → __federation_expose_FmTooltip-adedf618.js} +1 -1
- package/dist/federation/dialog-plugin-a69976d4.js +1 -0
- package/dist/federation/feedmepos-ui-components.js +1 -1
- package/dist/federation/floating-ui.vue.esm-6ee3a4dc.js +1 -0
- package/dist/federation/index-81fbf747.css +1 -0
- package/dist/federation/index-d2981ce7.js +11 -0
- package/dist/feedmepos-ui-library.js +5128 -4848
- package/dist/feedmepos-ui-library.umd.cjs +6 -6
- package/dist/global-components.d.ts +6 -3
- package/dist/style.css +1 -1
- package/package.json +1 -1
- package/dist/federation/FmDateRangePicker-2b4b8a36.css +0 -1
- package/dist/federation/FmForm.vue_vue_type_script_setup_true_lang-be0b8ff2.js +0 -1
- package/dist/federation/FmMenu-008b4edf.css +0 -1
- package/dist/federation/FmSelect-5383ab5c.css +0 -1
- package/dist/federation/FmStepper.vue_vue_type_script_setup_true_lang-620c5c99.js +0 -1
- package/dist/federation/FmTextField.vue_vue_type_style_index_0_lang-31424202.js +0 -1
- package/dist/federation/FmTooltip.vue_vue_type_script_setup_true_lang-ec99af74.js +0 -1
- package/dist/federation/__federation_expose_FmDateRangePicker-6e0116bd.js +0 -1
- package/dist/federation/__federation_expose_FmMenu-c78ae222.js +0 -1
- package/dist/federation/__federation_expose_FmSelect-dd3e5756.js +0 -1
- package/dist/federation/index-1375029c.css +0 -1
- package/dist/federation/index-cb166ff0.js +0 -11
- /package/dist/federation/{FmStepper-f275f227.css → FmProgressIndicator-f275f227.css} +0 -0
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import{importShared as i,__tla as tr}from"./__federation_fn_import.js";import{c as ar,a as or,_ as ir,__tla as nr}from"./FmBreadcrumb.vue_vue_type_style_index_0_lang-4abc649e.js";import{_ as j,__tla as rr}from"./FmCard.vue_vue_type_style_index_0_lang-3de86b2b.js";import{_ as W,__tla as ur}from"./FmCardSection.vue_vue_type_script_setup_true_lang-b8e33ddd.js";import{_ as sr,__tla as dr}from"./FmCardTitle.vue_vue_type_script_setup_true_lang-4f3b50b7.js";import{_ as cr,__tla as mr}from"./FmLine.vue_vue_type_script_setup_true_lang-290ac533.js";import p,{__tla as pr}from"./__federation_expose_FmButton-a3ca7654.js";import{_ as tt,__tla as vr}from"./FmCardActions.vue_vue_type_script_setup_true_lang-315cfb3c.js";import at,{__tla as fr}from"./__federation_expose_FmDatePicker-c542d446.js";import ot,{__tla as br}from"./__federation_expose_FmDateRangePicker-6e0116bd.js";import{_ as Me,__tla as gr}from"./FmCheckbox.vue_vue_type_style_index_0_lang-fcb61ef1.js";import yr,{__tla as _r}from"./__federation_expose_FmField-41eeed18.js";import F,{__tla as hr}from"./__federation_expose_FmRadio-eb498ffc.js";import{_ as rl,__tla as wr}from"./FmRadioGroup.vue_vue_type_script_setup_true_lang-99e6a9c2.js";import ul,{__tla as Vr}from"./__federation_expose_FmSelect-dd3e5756.js";import sl,{__tla as xr}from"./__federation_expose_FmStepperField-99c193ef.js";import k,{__tla as kr}from"./__federation_expose_FmSwitch-f75dd36e.js";import{_ as be,__tla as Cr}from"./FmTextField.vue_vue_type_style_index_0_lang-31424202.js";import{_ as Re,__tla as Br}from"./FmTextarea.vue_vue_type_style_index_0_lang-7507a1ba.js";import X,{__tla as Fr}from"./__federation_expose_FmIcon-e5ab92a8.js";import Nr,{__tla as Sr}from"./__federation_expose_FmList-6bab2481.js";import dl,{__tla as Er}from"./__federation_expose_FmListItem-b4a2ef3a.js";import Dr,{__tla as Ur}from"./__federation_expose_FmMenu-c78ae222.js";import Tr,{__tla as zr}from"./__federation_expose_FmMenuItem-d331a359.js";import{u as Lr,_ as G,__tla as Ar}from"./FmTooltip.vue_vue_type_script_setup_true_lang-ec99af74.js";import L,{__tla as Or}from"./__federation_expose_FmSnackbar-7af29a69.js";import{_ as Mr,__tla as Rr}from"./FmTimePicker.vue_vue_type_style_index_0_lang-cd3ff46f.js";import{_ as Pr,__tla as jr}from"./FmDialog.vue_vue_type_style_index_0_lang-2c81e20e.js";import it,{__tla as Wr}from"./__federation_expose_FmSpacer-a0a89a0a.js";import{D as nt}from"./provider-keys-22cc7f73.js";import{_ as $r,__tla as Ir}from"./FmForm.vue_vue_type_script_setup_true_lang-be0b8ff2.js";import{_ as ge,__tla as Gr}from"./FmButtonGroup.vue_vue_type_script_setup_true_lang-658ba5f6.js";import{_ as cl,__tla as qr}from"./FmStepper.vue_vue_type_script_setup_true_lang-620c5c99.js";import R,{__tla as Hr}from"./__federation_expose_FmStep-804e2bea.js";import{_ as Jr}from"./_plugin-vue_export-helper-c27b6911.js";Promise.all([(()=>{try{return tr}catch{}})(),(()=>{try{return nr}catch{}})(),(()=>{try{return rr}catch{}})(),(()=>{try{return ur}catch{}})(),(()=>{try{return dr}catch{}})(),(()=>{try{return mr}catch{}})(),(()=>{try{return pr}catch{}})(),(()=>{try{return vr}catch{}})(),(()=>{try{return fr}catch{}})(),(()=>{try{return br}catch{}})(),(()=>{try{return gr}catch{}})(),(()=>{try{return _r}catch{}})(),(()=>{try{return hr}catch{}})(),(()=>{try{return wr}catch{}})(),(()=>{try{return Vr}catch{}})(),(()=>{try{return xr}catch{}})(),(()=>{try{return kr}catch{}})(),(()=>{try{return Cr}catch{}})(),(()=>{try{return Br}catch{}})(),(()=>{try{return Fr}catch{}})(),(()=>{try{return Sr}catch{}})(),(()=>{try{return Er}catch{}})(),(()=>{try{return Ur}catch{}})(),(()=>{try{return zr}catch{}})(),(()=>{try{return Ar}catch{}})(),(()=>{try{return Or}catch{}})(),(()=>{try{return Rr}catch{}})(),(()=>{try{return jr}catch{}})(),(()=>{try{return Wr}catch{}})(),(()=>{try{return Ir}catch{}})(),(()=>{try{return Gr}catch{}})(),(()=>{try{return qr}catch{}})(),(()=>{try{return Hr}catch{}})()]).then(async()=>{(function(){const o=document.createElement("link").relList;if(o&&o.supports&&o.supports("modulepreload"))return;for(const t of document.querySelectorAll('link[rel="modulepreload"]'))a(t);new MutationObserver(t=>{for(const l of t)if(l.type==="childList")for(const n of l.addedNodes)n.tagName==="LINK"&&n.rel==="modulepreload"&&a(n)}).observe(document,{childList:!0,subtree:!0});function e(t){const l={};return t.integrity&&(l.integrity=t.integrity),t.referrerPolicy&&(l.referrerPolicy=t.referrerPolicy),t.crossOrigin==="use-credentials"?l.credentials="include":t.crossOrigin==="anonymous"?l.credentials="omit":l.credentials="same-origin",l}function a(t){if(t.ep)return;t.ep=!0;const l=e(t);fetch(t.href,l)}})();const rt=ar({history:or(),routes:[]}),ml={directive:"wave",color:"currentColor",initialOpacity:.2,finalOpacity:.1,duration:.4,dissolveDuration:.15,easing:"ease-out",cancellationPeriod:75,trigger:"auto",tagName:"div"},ut=o=>"config"in o&&"globalProperties"in o.config,st=o=>{let e;return o==="vue2"?e=!1:o==="vue3"?e=!0:e=ut(o),e?{mounted:"mounted",updated:"updated"}:{mounted:"inserted",updated:"componentUpdated"}},pl=o=>typeof o=="string"&&o!=="auto",vl=(o,e)=>{o.dataset.vWaveBoundary=pl(e)?e:"true"},dt=({borderTopLeftRadius:o,borderTopRightRadius:e,borderBottomLeftRadius:a,borderBottomRightRadius:t},l)=>{const n=document.createElement(l);return n.style.top="0",n.style.left="0",n.style.width="100%",n.style.height="100%",n.style.display="block",n.style.position="absolute",n.style.borderRadius=`${o} ${e} ${t} ${a}`,n.style.overflow="hidden",n.style.pointerEvents="none",n.style.webkitMaskImage="-webkit-radial-gradient(white, black)",n},ct=(o,e,a,t)=>{const l=document.createElement("div");return l.style.position="absolute",l.style.width=`${a}px`,l.style.height=`${a}px`,l.style.top=`${e}px`,l.style.left=`${o}px`,l.style.background=t.color,l.style.borderRadius="50%",l.style.opacity=`${t.initialOpacity}`,l.style.transform="translate(-50%,-50%) scale(0)",l.style.transition=`transform ${t.duration}s ${t.easing}, opacity ${t.duration}s ${t.easing}`,l};function ye(o,e,a,t){const l=o-a,n=e-t;return Math.sqrt(l*l+n*n)}function mt(o,e,{width:a,height:t}){const l=ye(o,e,0,0),n=ye(o,e,a,0),c=ye(o,e,0,t),u=ye(o,e,a,t);return Math.max(l,n,c,u)}const pt=({x:o,y:e},{top:a,left:t})=>({x:o-t,y:e-a}),Pe="vWaveCountInternal";function vt(o){const e=je(o);fl(o,e+1)}function ft(o){const e=je(o);fl(o,e-1)}function fl(o,e){o.dataset[Pe]=e.toString()}function je(o){var e;return parseInt((e=o.dataset[Pe])!==null&&e!==void 0?e:"0",10)}function bt(o){delete o.dataset[Pe]}const We=(o,e,a)=>{const t=e.getBoundingClientRect(),l=window.getComputedStyle(e),{x:n,y:c}=pt(o,t),u=2.05*mt(n,c,t),r=dt(l,a.tagName),m=ct(n,c,u,a);vt(e);let f="";l.position==="static"&&(e.style.position&&(f=e.style.position),e.style.position="relative"),r.appendChild(m),e.appendChild(r);let b=!1;const V=il=>{typeof il<"u"&&(document.removeEventListener("pointerup",V),document.removeEventListener("pointercancel",V)),b?al():b=!0},al=()=>{m.style.transition=`opacity ${a.dissolveDuration}s linear`,m.style.opacity="0",setTimeout(()=>{r.remove(),ft(e),je(e)===0&&(bt(e),e.style.position=f)},a.dissolveDuration*1e3)};document.addEventListener("pointerup",V),document.addEventListener("pointercancel",V);const ol=setTimeout(()=>{document.removeEventListener("pointercancel",fe),requestAnimationFrame(()=>{m.style.transform="translate(-50%,-50%) scale(1)",m.style.opacity=`${a.finalOpacity}`,setTimeout(()=>V(),a.duration*1e3)})},a.cancellationPeriod),fe=()=>{clearTimeout(ol),r.remove(),document.removeEventListener("pointerup",V),document.removeEventListener("pointercancel",V),document.removeEventListener("pointercancel",fe)};document.addEventListener("pointercancel",fe)},Y=new WeakMap,bl=(o={},e="vue3")=>{const a=Object.assign(Object.assign({},ml),o),t=st(e),l=u=>{const r=u.currentTarget.dataset.vWaveTrigger;document.querySelectorAll(`[data-v-wave-boundary="${r}"]`).forEach(m=>We(u,m,Object.assign(Object.assign({},a),Y.get(m))))},n={[t.mounted](u,{value:r={}}){var m;Y.set(u,r),vl(u,(m=r&&r.trigger)!==null&&m!==void 0?m:a.trigger),u.addEventListener("pointerdown",f=>{if(Y.get(u)===!1)return;const b=Object.assign(Object.assign({},a),Y.get(u));if(b.trigger===!1)return We(f,u,b);if(pl(b.trigger))return;const V=u.querySelector('[data-v-wave-trigger="true"]');!V&&b.trigger===!0||V&&!f.composedPath().includes(V)||We(f,u,b)})},[t.updated](u,{value:r={}}){var m;Y.set(u,r),vl(u,(m=r&&r.trigger)!==null&&m!==void 0?m:a.trigger)}},c={[t.mounted](u,{arg:r="true"}){u.dataset.vWaveTrigger=r,r!=="true"&&u.addEventListener("pointerdown",l)},[t.updated](u,{arg:r="true"}){u.dataset.vWaveTrigger=r,r==="true"?u.removeEventListener("pointerdown",l):u.addEventListener("pointerdown",l)}};return{wave:n,vWave:n,waveTrigger:c,vWaveTrigger:c}},gt={install(o,e={}){if(this.installed)return;this.installed=!0;const a=Object.assign(Object.assign({},ml),e),{vWave:t,vWaveTrigger:l}=bl(a,o);o.directive(a.directive,t),o.directive(`${a.directive}-trigger`,l)},installed:!1,createLocalWaveDirective:bl},{defineComponent:yt}=await i("vue"),{toDisplayString:gl,createElementVNode:$e,withCtx:Z,createVNode:yl,renderSlot:_t,openBlock:ht,createBlock:wt}=await i("vue"),Vt={class:"fm-typo-title-sm-700 mb-4"},xt={class:""},s=yt({__name:"DemoSection",props:{title:{type:String,required:!0},description:{type:String,default:void 0}},setup(o){return(e,a)=>(ht(),wt(j,{variant:"outlined",title:o.title},{header:Z(()=>[yl(sr,null,{actions:Z(()=>[]),default:Z(()=>[$e("div",null,[$e("div",Vt,gl(o.title),1),$e("div",xt,gl(o.description??o.title),1)])]),_:1})]),default:Z(()=>[yl(W,null,{default:Z(()=>[_t(e.$slots,"default")]),_:3})]),_:3},8,["title"]))}}),{defineComponent:kt}=await i("vue"),{createVNode:_l,withCtx:Ct,openBlock:Bt,createElementBlock:Ft}=await i("vue"),Nt=kt({__name:"Breadcrumb",setup(o){const e=[{label:"Home",route:"/",disabled:!0},{label:"Marketing",route:"/marketing"},{label:"My campaign",route:"/marketing/campaign"},{label:"Create campaign",route:"/marketing/campaign/create"}];return(a,t)=>(Bt(),Ft("div",null,[_l(s,{title:"Breadcrumb",description:"Basic usage"},{default:Ct(()=>[_l(ir,{items:e})]),_:1})]))}}),{defineComponent:St}=await i("vue"),{createVNode:hl,withCtx:Et,openBlock:Dt,createElementBlock:Ut}=await i("vue"),Tt=St({__name:"Line",setup(o){const e=[{label:"Dataset 1",data:[65,59,80,81,56,55,40,65,59,80,81,56],fill:!0,color:"fm-color-system-green-300"}];return(a,t)=>(Dt(),Ut("div",null,[hl(s,{title:"Line chart",description:"Basic line chart usage"},{default:Et(()=>[hl(cr,{name:"Total product sales",paragraph:"Included sales: Jun 2023 - Aug 2023","x-axis":{categories:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]},datasets:e})]),_:1})]))}}),{defineComponent:zt}=await i("vue"),{createVNode:w,createElementVNode:_e,withCtx:he,openBlock:Lt,createElementBlock:At}=await i("vue"),Ot={class:"flex flex-col gap-24"},Mt={class:"gap-24 grid grid-cols-6"},Rt={class:"gap-24 grid grid-cols-6"},Pt={class:"flex gap-24"},jt={class:"flex gap-24"},Wt=zt({__name:"Button",setup(o){return(e,a)=>(Lt(),At("div",Ot,[w(s,{title:"Basic button",description:"Different button variant"},{default:he(()=>[_e("div",Mt,[w(p,{variant:"primary",label:"Primary"}),w(p,{variant:"secondary",label:"Secondary"}),w(p,{variant:"tertiary",label:"Tertiary"}),w(p,{variant:"destructive",label:"Destructive"}),w(p,{variant:"fab",label:"FAB"})])]),_:1}),w(s,{title:"Size",description:"Different button size"},{default:he(()=>[_e("div",Rt,[w(p,{variant:"primary",label:"md",size:"md"}),w(p,{variant:"primary",label:"lg"})])]),_:1}),w(s,{title:"With icons",description:""},{default:he(()=>[_e("div",Pt,[w(p,{variant:"primary",label:"button",size:"md",icon:"home"}),w(p,{variant:"secondary",label:"button",size:"md",icon:"home"}),w(p,{variant:"tertiary",label:"button",size:"md",icon:"home"}),w(p,{variant:"destructive",label:"button",size:"md",icon:"home"}),w(p,{variant:"fab",label:"button",size:"md",icon:"home"}),w(p,{variant:"fab",size:"md",icon:"home"})])]),_:1}),w(s,{title:"Disabled",description:""},{default:he(()=>[_e("div",jt,[w(p,{variant:"primary",disabled:"",label:"button",size:"md"}),w(p,{variant:"secondary",disabled:"",label:"button",size:"md"}),w(p,{variant:"tertiary",disabled:"",label:"button",size:"md"}),w(p,{variant:"destructive",disabled:"",label:"button",size:"md"}),w(p,{variant:"fab",disabled:"",label:"button",size:"md"}),w(p,{variant:"fab",disabled:"",size:"md",icon:"home"})])]),_:1})]))}}),$t=`
|
|
2
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit,
|
|
3
|
-
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
|
4
|
-
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
|
|
5
|
-
nisi ut aliquip ex ea commodo consequat.
|
|
6
|
-
`,It=`
|
|
7
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit,
|
|
8
|
-
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
|
9
|
-
`;function v(o=!1){return o?$t:It}const{defineComponent:Gt}=await i("vue"),{unref:J,toDisplayString:K,createElementVNode:y,withCtx:h,createVNode:g,openBlock:qt,createElementBlock:Ht}=await i("vue"),Jt={class:"flex flex-col gap-24"},Kt={class:"gap-24 grid grid-cols-3"},Qt={class:"gap-24 grid grid-cols-3"},Xt=y("img",{src:"https://cdn.quasar.dev/img/mountains.jpg"},null,-1),Yt=y("div",{class:"mb-8"}," Title ",-1),Zt=y("img",{src:"https://tailwindui.com/img/ecommerce-images/product-page-01-related-product-01.jpg"},null,-1),ea=y("div",{class:"flex"},[y("div",{class:"grow"},[y("div",{class:"mb-8"}," Basic Tee "),y("div",{class:"text-fm-color-typo-secondary"}," Aspen white ")]),y("div",{class:"fm-typo-body-lg-700"}," $35 ")],-1),la={class:"gap-24 grid grid-cols-2"},ta=y("div",{class:"grow"},[y("img",{src:"https://cdn.quasar.dev/img/mountains.jpg",class:"h-full w-full",style:{"object-fit":"fill"}})],-1),aa=y("div",{class:"grow"},[y("img",{src:"https://cdn.quasar.dev/img/mountains.jpg",class:"h-full w-full",style:{"object-fit":"fill"}})],-1),oa=y("div",{class:"basis-1/3"},[y("img",{src:"https://tailwindui.com/img/ecommerce-images/product-page-01-related-product-01.jpg",class:"h-full w-full",style:{"object-fit":"fill"}})],-1),ia=y("div",{class:"fm-typo-title-sm-700 mb-16"}," Basic Tee 6-pack ",-1),na={class:"text-fm-color-typo-secondary"},ra=y("div",null," Color ",-1),ua=y("div",null," Size ",-1),sa=Gt({__name:"Card",setup(o){return(e,a)=>(qt(),Ht("div",Jt,[g(s,{title:"Card",description:"Card basic usage"},{default:h(()=>[y("div",Kt,[g(j,{class:"h-fit"},{default:h(()=>[g(W,null,{default:h(()=>[y("div",null,K(J(v)()),1)]),_:1})]),_:1}),g(j,{title:"Title"},{default:h(()=>[g(W,null,{default:h(()=>[y("div",null,K(J(v)()),1)]),_:1})]),_:1}),g(j,{title:"Title"},{actions:h(()=>[g(tt,null,{default:h(()=>[g(p,{label:"Cancel",size:"md",variant:"secondary"}),g(p,{label:"Confirm",size:"md"})]),_:1})]),default:h(()=>[g(W,null,{default:h(()=>[y("div",null,K(J(v)()),1)]),_:1})]),_:1})])]),_:1}),g(s,{title:"Media card",description:"Cards with media content"},{default:h(()=>[y("div",Qt,[g(j,{class:"h-fit"},{default:h(()=>[Xt,g(W,null,{default:h(()=>[Yt,y("div",null,K(J(v)()),1)]),_:1})]),_:1}),g(j,{class:"h-fit"},{actions:h(()=>[g(tt,{alignment:"center"},{default:h(()=>[g(p,{label:"Add to cart",size:"md",class:"w-full"})]),_:1})]),default:h(()=>[Zt,g(W,null,{default:h(()=>[ea]),_:1})]),_:1})])]),_:1}),g(s,{title:"Horizontal card",description:"Cards with horizontal layout"},{default:h(()=>[y("div",la,[g(j,{class:"h-fit",horizontal:""},{default:h(()=>[ta,g(W,null,{default:h(()=>[y("div",null,K(J(v)()),1)]),_:1})]),_:1}),g(j,{class:"h-fit",horizontal:""},{default:h(()=>[aa,g(W,{class:"flex flex-col gap-16 items-center justify-center",padding:"p-8"},{default:h(()=>[g(p,{icon:"home",variant:"tertiary"}),g(p,{icon:"add",variant:"tertiary"}),g(p,{icon:"warning",variant:"tertiary"})]),_:1})]),_:1})])]),_:1}),g(s,{title:"Advance",description:"Advance usage for card component"},{default:h(()=>[g(j,{horizontal:""},{default:h(()=>[oa,g(W,{class:"basis-2/3 flex flex-col gap-24"},{default:h(()=>[y("div",null,[ia,y("div",na,K(J(v)(!0)),1)]),ra,ua,g(p,{label:"Add to cart"})]),_:1})]),_:1})]),_:1})]))}}),{defineComponent:da}=await i("vue"),{createVNode:Ie,createElementVNode:ca,withCtx:ma,openBlock:pa,createElementBlock:va}=await i("vue"),fa={class:"flex flex-col gap-24"},ba={class:"gap-24 grid grid-cols-3"},{ref:ga}=await i("vue"),ya=da({__name:"DatePicker",setup(o){const e=ga("2023-10-26");return(a,t)=>(pa(),va("div",fa,[Ie(s,{title:"Date picker",description:"Basic usage"},{default:ma(()=>[ca("div",ba,[Ie(at,{modelValue:e.value,"onUpdate:modelValue":t[0]||(t[0]=l=>e.value=l),label:"Single date picker",disabled:!1},null,8,["modelValue"]),Ie(at,{modelValue:e.value,"onUpdate:modelValue":t[1]||(t[1]=l=>e.value=l),label:"Disabled",disabled:!0},null,8,["modelValue"])])]),_:1})]))}}),{defineComponent:_a}=await i("vue"),{createVNode:Ge,createElementVNode:ha,withCtx:wa,openBlock:Va,createElementBlock:xa}=await i("vue"),ka={class:"flex flex-col gap-24"},Ca={class:"gap-24 grid grid-cols-3"},{ref:Ba}=await i("vue"),Fa=_a({__name:"DateRangePicker",setup(o){const e=Ba({startDate:"2023-10-01",endDate:"2023-10-31"});return(a,t)=>(Va(),xa("div",ka,[Ge(s,{title:"Date picker",description:"Basic usage"},{default:wa(()=>[ha("div",Ca,[Ge(ot,{modelValue:e.value,"onUpdate:modelValue":t[0]||(t[0]=l=>e.value=l),label:"Date range picker",disabled:!1},null,8,["modelValue"]),Ge(ot,{modelValue:e.value,"onUpdate:modelValue":t[1]||(t[1]=l=>e.value=l),label:"Disabled",disabled:!0},null,8,["modelValue"])])]),_:1})]))}}),{defineComponent:Na}=await i("vue"),{unref:we,createVNode:ee,withCtx:Sa,openBlock:Ea,createElementBlock:Da}=await i("vue"),Ua={class:"flex flex-col gap-24"},{ref:Ta}=await i("vue"),za=Na({__name:"Checkbox",setup(o){const e=Ta(!1);return(a,t)=>(Ea(),Da("div",Ua,[ee(s,{title:"Radio",description:"Basic usage"},{default:Sa(()=>[ee(Me,{modelValue:e.value,"onUpdate:modelValue":t[0]||(t[0]=l=>e.value=l),name:"v1",label:"Option 1",value:"1",sublabel:we(v)(),indeterminate:!1},null,8,["modelValue","sublabel"]),ee(Me,{modelValue:e.value,"onUpdate:modelValue":t[1]||(t[1]=l=>e.value=l),name:"v2",label:"Option 2",value:"2",sublabel:we(v)(),indeterminate:!1},null,8,["modelValue","sublabel"]),ee(Me,{modelValue:e.value,"onUpdate:modelValue":t[2]||(t[2]=l=>e.value=l),disabled:!0,name:"v3",label:"Option 3",value:"3",sublabel:we(v)(),indeterminate:!1},null,8,["modelValue","sublabel"]),ee(Me,{modelValue:e.value,"onUpdate:modelValue":t[3]||(t[3]=l=>e.value=l),name:"v4",label:"Option 4",value:"4",sublabel:we(v)(),indeterminate:!0},null,8,["modelValue","sublabel"])]),_:1})]))}}),{defineComponent:La}=await i("vue"),{createElementVNode:Aa,withCtx:wl,createVNode:Vl,openBlock:Oa,createElementBlock:Ma}=await i("vue"),Ra={class:"flex flex-col gap-24"},Pa=Aa("div",null," test ",-1),ja=La({__name:"Field",setup(o){function e(){confirm("form field clicked")}return(a,t)=>(Oa(),Ma("div",Ra,[Vl(s,{title:"Form field",description:"Wrapper to make your component part of form"},{default:wl(()=>[Vl(yr,{class:"text-fm-color-typo-warning",onClick:e},{default:wl(()=>[Pa]),_:1})]),_:1})]))}}),{defineComponent:Wa}=await i("vue"),{unref:S,createVNode:B,withCtx:le,createElementVNode:xl,openBlock:$a,createElementBlock:Ia}=await i("vue"),Ga={class:"flex flex-col gap-24"},{ref:qa}=await i("vue"),Ha=Wa({__name:"Radio",setup(o){const e=qa("");return(a,t)=>($a(),Ia("div",Ga,[B(s,{title:"Radio",description:"Radio Group"},{default:le(()=>[xl("div",null,[B(rl,{modelValue:e.value,"onUpdate:modelValue":t[0]||(t[0]=l=>e.value=l)},{default:le(()=>[B(F,{value:"1",label:"Bluetooth",sublabel:S(v)()},null,8,["sublabel"]),B(F,{value:"2",label:"WiFi",sublabel:S(v)()},null,8,["sublabel"]),B(F,{value:"3",label:"NFC",sublabel:S(v)()},null,8,["sublabel"]),B(F,{value:"4",label:"Hotspot",sublabel:S(v)()},null,8,["sublabel"])]),_:1},8,["modelValue"])])]),_:1}),B(s,{title:"Radio",description:"Radio Group Inline"},{default:le(()=>[xl("div",null,[B(rl,{modelValue:e.value,"onUpdate:modelValue":t[1]||(t[1]=l=>e.value=l),inline:""},{default:le(()=>[B(F,{value:"1",label:"Bluetooth",sublabel:S(v)()},null,8,["sublabel"]),B(F,{value:"2",label:"WiFi",sublabel:S(v)()},null,8,["sublabel"]),B(F,{value:"3",label:"NFC",sublabel:S(v)()},null,8,["sublabel"]),B(F,{value:"4",label:"Hotspot",sublabel:S(v)()},null,8,["sublabel"])]),_:1},8,["modelValue"])])]),_:1}),B(s,{title:"Radio",description:"Radio"},{default:le(()=>[B(F,{modelValue:e.value,"onUpdate:modelValue":t[2]||(t[2]=l=>e.value=l),value:"1",label:"Bluetooth",sublabel:S(v)()},null,8,["modelValue","sublabel"]),B(F,{modelValue:e.value,"onUpdate:modelValue":t[3]||(t[3]=l=>e.value=l),value:"2",label:"WiFi",sublabel:S(v)()},null,8,["modelValue","sublabel"]),B(F,{modelValue:e.value,"onUpdate:modelValue":t[4]||(t[4]=l=>e.value=l),value:"3",label:"NFC",sublabel:S(v)()},null,8,["modelValue","sublabel"]),B(F,{modelValue:e.value,"onUpdate:modelValue":t[5]||(t[5]=l=>e.value=l),value:"4",label:"Hotspot",sublabel:S(v)()},null,8,["modelValue","sublabel"])]),_:1})]))}}),{defineComponent:Ja}=await i("vue"),{createVNode:Ve,toDisplayString:kl,createElementVNode:Cl,withCtx:Bl,openBlock:Ka,createElementBlock:Qa}=await i("vue"),Xa={class:"flex flex-col gap-24"},{ref:Fl}=await i("vue"),Ya=Ja({__name:"Select",setup(o){const e=Fl(3),a=Fl([3,"4"]);return(t,l)=>(Ka(),Qa("div",Xa,[Ve(s,{title:"Select",description:"Single selection"},{default:Bl(()=>[Ve(ul,{modelValue:e.value,"onUpdate:modelValue":l[0]||(l[0]=n=>e.value=n),label:"Select",items:[{label:"Object",value:{first:"something"}},{label:"Array",value:["array","1"]},{label:"Number",value:3},{label:"String",value:"4"},{label:"1",value:"5"},{label:"2",value:"6"}]},null,8,["modelValue"]),Cl("div",null,kl(e.value),1)]),_:1}),Ve(s,{title:"Select",description:"Multiple selection"},{default:Bl(()=>[Ve(ul,{modelValue:a.value,"onUpdate:modelValue":l[1]||(l[1]=n=>a.value=n),label:"Select",items:[{label:"Object",value:{first:"something"}},{label:"Array",value:["array","1"]},{label:"Number",value:3},{label:"String",value:"4"},{label:"1",value:"5"},{label:"2",value:"6"}],multiselect:""},null,8,["modelValue"]),Cl("div",null,kl(a.value),1)]),_:1})]))}}),{defineComponent:Za}=await i("vue"),{createVNode:qe,createElementVNode:He,toDisplayString:eo,createTextVNode:lo,withCtx:to,openBlock:ao,createElementBlock:oo}=await i("vue"),io=He("h1",{class:"mt-8"}," Without steppers ",-1),{ref:no}=await i("vue"),ro=Za({__name:"Stepper",setup(o){const e=no(null);return(a,t)=>(ao(),oo("div",null,[qe(s,{title:"Text field",description:""},{default:to(()=>[He("div",null,[qe(sl,{modelValue:e.value,"onUpdate:modelValue":t[0]||(t[0]=l=>e.value=l),label:"Number",placeholder:"Placeholder",step:30,min:0,max:999,"helper-text":"Helper",rules:[l=>l<=100||"More than 100",l=>l<=50||"More than 50"],"prepend-text":"RM","append-text":"%"},null,8,["modelValue","rules"])]),io,He("div",null,[qe(sl,{modelValue:e.value,"onUpdate:modelValue":t[1]||(t[1]=l=>e.value=l),label:"Number",placeholder:"Placeholder",step:30,min:0,max:999,"helper-text":"Helper",rules:[l=>l<=100||"More than 100",l=>l<=50||"More than 50"],"show-steppers":!1},null,8,["modelValue","rules"])]),lo(" "+eo(e.value),1)]),_:1})]))}}),{defineComponent:uo}=await i("vue"),{createVNode:_,createElementVNode:xe,withCtx:te,unref:Nl,openBlock:so,createElementBlock:co}=await i("vue"),mo={class:"flex flex-col gap-24"},po={class:"flex gap-24"},vo={class:"flex flex-col"},fo={class:"flex gap-24"},bo={class:"flex gap-24"},{ref:go}=await i("vue"),yo=uo({__name:"Switch",setup(o){const e=go({bluetooth:!1,wifi:!1,nfc:!0,hotspot:!0});return(a,t)=>(so(),co("div",mo,[_(s,{title:"Switch",description:"Basic usage"},{default:te(()=>[xe("div",po,[_(k,{modelValue:e.value.bluetooth,"onUpdate:modelValue":t[0]||(t[0]=l=>e.value.bluetooth=l),value:"bluetooth",label:"Bluetooth",disabled:"","show-icon":""},null,8,["modelValue"]),_(k,{modelValue:e.value.wifi,"onUpdate:modelValue":t[1]||(t[1]=l=>e.value.wifi=l),value:"wifi",label:"WiFi"},null,8,["modelValue"]),_(k,{modelValue:e.value.nfc,"onUpdate:modelValue":t[2]||(t[2]=l=>e.value.nfc=l),value:"nfc",label:"NFC"},null,8,["modelValue"]),_(k,{modelValue:e.value.hotspot,"onUpdate:modelValue":t[3]||(t[3]=l=>e.value.hotspot=l),value:"hotspot",label:"Hotspot"},null,8,["modelValue"])])]),_:1}),_(s,{title:"Switch",description:"Vertical"},{default:te(()=>[xe("div",vo,[_(k,{modelValue:e.value.bluetooth,"onUpdate:modelValue":t[4]||(t[4]=l=>e.value.bluetooth=l),value:"bluetooth",label:"Bluetooth"},null,8,["modelValue"]),_(k,{modelValue:e.value.wifi,"onUpdate:modelValue":t[5]||(t[5]=l=>e.value.wifi=l),value:"wifi",label:"WiFi"},null,8,["modelValue"]),_(k,{modelValue:e.value.nfc,"onUpdate:modelValue":t[6]||(t[6]=l=>e.value.nfc=l),value:"nfc",label:"NFC"},null,8,["modelValue"]),_(k,{modelValue:e.value.hotspot,"onUpdate:modelValue":t[7]||(t[7]=l=>e.value.hotspot=l),value:"hotspot",label:"Hotspot"},null,8,["modelValue"])])]),_:1}),_(s,{title:"Label position",description:"Change label position"},{default:te(()=>[_(k,{modelValue:e.value.bluetooth,"onUpdate:modelValue":t[8]||(t[8]=l=>e.value.bluetooth=l),value:"bluetooth",label:"Bluetooth","label-placement":"right"},null,8,["modelValue"]),_(k,{modelValue:e.value.wifi,"onUpdate:modelValue":t[9]||(t[9]=l=>e.value.wifi=l),value:"wifi",label:"WiFi","label-placement":"right",sublabel:Nl(v)(!0)},null,8,["modelValue","sublabel"]),_(k,{modelValue:e.value.nfc,"onUpdate:modelValue":t[10]||(t[10]=l=>e.value.nfc=l),value:"nfc",label:"NFC","label-placement":"right"},null,8,["modelValue"]),_(k,{modelValue:e.value.hotspot,"onUpdate:modelValue":t[11]||(t[11]=l=>e.value.hotspot=l),value:"hotspot",label:"Hotspot","label-placement":"right",sublabel:Nl(v)(!0)},null,8,["modelValue","sublabel"])]),_:1}),_(s,{title:"Disabled switch"},{default:te(()=>[xe("div",fo,[_(k,{modelValue:e.value.bluetooth,"onUpdate:modelValue":t[12]||(t[12]=l=>e.value.bluetooth=l),value:"bluetooth",label:"Bluetooth",disabled:""},null,8,["modelValue"]),_(k,{modelValue:e.value.wifi,"onUpdate:modelValue":t[13]||(t[13]=l=>e.value.wifi=l),value:"wifi",label:"WiFi",disabled:""},null,8,["modelValue"]),_(k,{modelValue:e.value.nfc,"onUpdate:modelValue":t[14]||(t[14]=l=>e.value.nfc=l),value:"nfc",label:"NFC",disabled:""},null,8,["modelValue"]),_(k,{modelValue:e.value.hotspot,"onUpdate:modelValue":t[15]||(t[15]=l=>e.value.hotspot=l),value:"hotspot",label:"Hotspot",disabled:""},null,8,["modelValue"])])]),_:1}),_(s,{title:"Icon switch",description:"Switch with icon"},{default:te(()=>[xe("div",bo,[_(k,{modelValue:e.value.bluetooth,"onUpdate:modelValue":t[16]||(t[16]=l=>e.value.bluetooth=l),value:"bluetooth",label:"Bluetooth",disabled:"","show-icon":""},null,8,["modelValue"]),_(k,{modelValue:e.value.wifi,"onUpdate:modelValue":t[17]||(t[17]=l=>e.value.wifi=l),value:"wifi",label:"WiFi","show-icon":""},null,8,["modelValue"]),_(k,{modelValue:e.value.nfc,"onUpdate:modelValue":t[18]||(t[18]=l=>e.value.nfc=l),value:"nfc",label:"NFC",disabled:"","show-icon":""},null,8,["modelValue"]),_(k,{modelValue:e.value.hotspot,"onUpdate:modelValue":t[19]||(t[19]=l=>e.value.hotspot=l),value:"hotspot",label:"Hotspot","show-icon":""},null,8,["modelValue"])])]),_:1})]))}}),{defineComponent:_o}=await i("vue"),{createVNode:ae,createElementVNode:Sl,withCtx:El,openBlock:ho,createElementBlock:wo}=await i("vue"),{ref:Dl}=await i("vue"),Vo=_o({__name:"TextField",setup(o){const e=Dl(""),a=Dl("");return(t,l)=>(ho(),wo("div",null,[ae(s,{title:"Text field",description:""},{default:El(()=>[Sl("div",null,[ae(be,{modelValue:e.value,"onUpdate:modelValue":l[0]||(l[0]=n=>e.value=n),label:"something",disabled:!1,"input-state":"success","helper-text":"something",rules:[n=>!!n.includes("t")||"nothing"]},null,8,["modelValue","rules"]),ae(be,{modelValue:e.value,"onUpdate:modelValue":l[1]||(l[1]=n=>e.value=n),label:"something",disabled:!1,"input-state":"warning"},null,8,["modelValue"])])]),_:1}),ae(s,{title:"Text area",description:""},{default:El(()=>[Sl("div",null,[ae(Re,{modelValue:a.value,"onUpdate:modelValue":l[2]||(l[2]=n=>a.value=n),label:"textarea",disabled:!1,"input-state":"error",rules:[n=>!!n.includes("t")||"nothing"]},null,8,["modelValue","rules"])])]),_:1})]))}}),{defineComponent:xo}=await i("vue"),{createVNode:oe,createElementVNode:ko,withCtx:Co,openBlock:Bo,createElementBlock:Fo}=await i("vue"),No={class:"flex flex-col gap-24"},So={class:"gap-24 grid grid-cols-12"},Eo=xo({__name:"Icon",setup(o){return(e,a)=>(Bo(),Fo("div",No,[oe(s,{title:"Icon",description:"Basic icon styling"},{default:Co(()=>[ko("div",So,[oe(X,{name:"visibility",outline:!0,size:"sm",color:"primary"}),oe(X,{name:"visibility",outline:!1,color:"system-success-300"}),oe(X,{name:"visibility",outline:!0,size:"lg",color:"#F12345"}),oe(X,{name:"visibility",outline:!1,color:"#F12345",size:"xl"})])]),_:1})]))}}),{defineComponent:Do}=await i("vue"),{createVNode:Q,createElementVNode:C,withCtx:ie,openBlock:Uo,createElementBlock:To}=await i("vue"),zo={class:"flex flex-col gap-24"},Lo={class:"flex gap-24"},Ao=C("div",{class:"grow"},[C("div",null,"Leslie Alexander"),C("div",{class:"fm-typo-body-sm-400 text-fm-color-typo-secondary"}," leslie.alexander@example.com ")],-1),Oo=C("div",{class:"flex flex-col items-end"},[C("div",null," Co-Founder / CEO "),C("div",{class:"fm-typo-body-sm-400 text-fm-color-typo-secondary"}," Last seen 3h ago ")],-1),Mo=C("div",{class:"grow"},[C("div",null,"Michael Foster"),C("div",{class:"fm-typo-body-sm-400 text-fm-color-typo-secondary"}," michael.foster@example.com ")],-1),Ro=C("div",{class:"flex flex-col items-end"},[C("div",null," Co-Founder / CEO "),C("div",{class:"fm-typo-body-sm-400 text-fm-color-typo-secondary"}," Last seen 3h ago ")],-1),Po=C("div",{class:"grow"},[C("div",null,"Dries Vincent"),C("div",{class:"fm-typo-body-sm-400 text-fm-color-typo-secondary"}," dries.vincent@example.com ")],-1),jo=C("div",{class:"flex flex-col items-end"},[C("div",null," Co-Founder / CEO "),C("div",{class:"fm-typo-body-sm-400 text-fm-color-typo-secondary"}," Last seen 3h ago ")],-1),Wo=Do({__name:"List",setup(o){return(e,a)=>(Uo(),To("div",zo,[Q(s,{title:"Switch",description:"Basic usage"},{default:ie(()=>[C("div",Lo,[Q(Nr,{class:"w-full",disabled:""},{default:ie(()=>[Q(dl,{tag:"a"},{default:ie(()=>[Q(X,{name:"hexagon"}),Ao,Oo]),_:1}),Q(dl,{tag:"label"},{default:ie(()=>[Mo,Ro]),_:1}),Q(dl,{tag:"label"},{default:ie(()=>[Po,jo]),_:1})]),_:1})])]),_:1})]))}}),{defineComponent:$o}=await i("vue"),{createElementVNode:Ul,unref:Io,normalizeStyle:Go,Fragment:qo,openBlock:Ho,createElementBlock:Jo}=await i("vue"),{ref:Tl}=await i("vue"),zl=$o({__name:"FmMenuList",setup(o){const e=Tl(null),a=Tl(null),{floatingStyles:t}=Lr(e,a),l=()=>{a.value.style.display="block"},n=()=>{a.value.style.display=""};return(c,u)=>(Ho(),Jo(qo,null,[Ul("button",{ref_key:"anchor",ref:e,onMouseenter:l,onMouseout:n}," Button ",544),Ul("div",{ref_key:"menu",ref:a,class:"bg-cyan-50 h-48 hidden w-48",style:Go(Io(t))}," Tooltip ",4)],64))}}),{defineComponent:Ko}=await i("vue"),{createElementVNode:U,toDisplayString:Ll,createVNode:ne,renderList:Qo,Fragment:Xo,openBlock:Je,createElementBlock:Al,createBlock:Yo,withCtx:ke}=await i("vue"),Zo={class:"flex flex-col gap-24"},ei=U("div",{class:"bg-fm-color-system-warning-100 p-16"},[U("h1",null," Notes "),U("ul",null,[U("li",null,"\u2022 The dropdown will close whenever it detects scrolling"),U("li",null,"\u2022 Multi select must use checkbox per design guidelines")])],-1),li={class:"bg-fm-color-neutral-gray-100 mb-16 min-h-[40px] p-8 whitespace-pre"},ti={class:"w-[280px]"},{ref:Ce}=await i("vue"),ai=Ko({__name:"Menu",setup(o){const e=Ce([{label:"Grid",icon:"grid_view",selected:!1},{label:"List",icon:"view_list",selected:!1},{label:"Thumbnails",icon:"gallery_thumbnail",selected:!1}]),a=Ce(!1),t=Ce(!1),l=Ce(),n=c=>{l.value=c,e.value.forEach(u=>{u.selected=JSON.stringify(u)===JSON.stringify(c)}),t.value=!1};return(c,u)=>(Je(),Al("div",Zo,[ne(s,{title:"Menu",description:"Basic usage WIP: Menu item clicking logic needs some work still, sorry for the wait"},{default:ke(()=>[ei,U("div",li,[U("div",null,[U("code",null,Ll(JSON.stringify(e.value,null,4)),1)]),U("div",null,[U("code",null,Ll(JSON.stringify(l.value,null,4)),1)])]),ne(Dr,{disabled:a.value,"is-open":t.value,onDropdownChanged:u[0]||(u[0]=r=>t.value=r)},{"menu-button":ke(()=>[ne(p,{label:"Open Menu"})]),"menu-content":ke(()=>[U("div",ti,[(Je(!0),Al(Xo,null,Qo(e.value,(r,m)=>(Je(),Yo(Tr,{key:m,modelValue:r.selected,"onUpdate:modelValue":f=>r.selected=f,label:r.label,icon:r.icon,onClick:f=>n(r)},null,8,["modelValue","onUpdate:modelValue","label","icon","onClick"]))),128))])]),_:1},8,["disabled","is-open"])]),_:1}),ne(s,{title:"Floating Menu",description:"Floating UI Menu"},{default:ke(()=>[ne(zl)]),_:1})]))}}),{defineComponent:oi}=await i("vue"),{unref:T,createVNode:N,createElementVNode:Ke,withCtx:Qe,openBlock:ii,createElementBlock:ni}=await i("vue"),ri={class:"flex flex-col gap-24"},ui={class:"gap-24 grid grid-cols-3"},si={class:"gap-24 grid grid-cols-3"},di={class:"gap-24 grid grid-cols-3"},Ol=oi({__name:"Snackbar",setup(o){function e(t){confirm(`Snackbar action pressed!
|
|
10
|
-
${t}.`)}function a(t){confirm(`Snackbar dismissed!
|
|
11
|
-
${t}.`)}return(t,l)=>(ii(),ni("div",ri,[N(s,{title:"Snackbar",description:"Basic usage"},{default:Qe(()=>[Ke("div",ui,[N(L,{title:"Info",description:T(v)(),variant:"info"},null,8,["description"]),N(L,{title:"success",description:T(v)(),variant:"success"},null,8,["description"]),N(L,{title:"warning",description:T(v)(),variant:"warning"},null,8,["description"]),N(L,{title:"error",description:T(v)(),variant:"error"},null,8,["description"]),N(L,{title:"neutral ",description:T(v)(),variant:"neutral"},null,8,["description"])])]),_:1}),N(s,{title:"Advance snackbar",description:"Snackbar with action"},{default:Qe(()=>[Ke("div",si,[N(L,{title:"Info",description:T(v)(),dismissable:"",variant:"info",action:"press me",onOnAction:l[0]||(l[0]=()=>e("info")),onOnDismiss:l[1]||(l[1]=()=>a("info"))},null,8,["description"]),N(L,{title:"success",description:T(v)(),dismissable:"",variant:"success",action:"press me",onOnAction:l[2]||(l[2]=()=>e("success")),onOnDismiss:l[3]||(l[3]=()=>a("success"))},null,8,["description"]),N(L,{title:"warning",description:T(v)(),dismissable:"",variant:"warning",action:"press me",onOnAction:l[4]||(l[4]=()=>e("warning")),onOnDismiss:l[5]||(l[5]=()=>a("warning"))},null,8,["description"]),N(L,{title:"error",description:T(v)(),dismissable:"",variant:"error",action:"press me",onOnAction:l[6]||(l[6]=()=>e("error")),onOnDismiss:l[7]||(l[7]=()=>a("error"))},null,8,["description"]),N(L,{title:"neutral",description:T(v)(),dismissable:"",variant:"neutral",action:"press me",onOnAction:l[8]||(l[8]=()=>e("neutral")),onOnDismiss:l[9]||(l[9]=()=>a("neutral"))},null,8,["description"])])]),_:1}),N(s,{title:"Custom snackbar",description:"Snackbar with custom color"},{default:Qe(()=>[Ke("div",di,[N(L,{title:"Custom snackbar",color:"secondary-blue-pea","bg-color":"secondary-citrus",description:T(v)()},null,8,["description"])])]),_:1})]))}}),{defineComponent:ci}=await i("vue"),{createVNode:mi,toDisplayString:pi,createElementVNode:Xe,withCtx:vi,openBlock:fi,createBlock:bi}=await i("vue"),gi={style:{width:"fit-content"}},yi={class:"flex flex-col gap-16 items-center justify-center"},_i={class:"fm-typo-body-xl-700"},{ref:hi}=await i("vue"),wi=ci({__name:"TimePicker",setup(o){const e=hi(null);return(a,t)=>(fi(),bi(s,{title:"Time picker"},{default:vi(()=>[Xe("div",gi,[Xe("div",yi,[mi(Mr,{modelValue:e.value,"onUpdate:modelValue":t[0]||(t[0]=l=>e.value=l)},null,8,["modelValue"]),Xe("div",_i,pi(e.value),1)])])]),_:1}))}}),{defineComponent:Vi}=await i("vue"),{createTextVNode:$,withCtx:A,createVNode:O,createElementVNode:Ml,openBlock:xi,createElementBlock:ki}=await i("vue"),Ci={class:"flex flex-col gap-24"},Bi={class:"gap-24 grid grid-cols-4"},Fi={class:"gap-24 grid grid-cols-4"},Ni=Vi({__name:"Tooltip",setup(o){return(e,a)=>(xi(),ki("div",Ci,[O(s,{title:"Tooltip",description:"Basic usage"},{default:A(()=>[Ml("div",Bi,[O(G,{"has-arrow":!0,variant:"plain",beak:"top","content-text":"Top tooltip","action-buttons":[{label:"Action",handler:()=>console.log("Button clicked!")}]},{default:A(()=>[$(" Top tooltip ")]),_:1},8,["action-buttons"]),O(G,{"has-arrow":!0,variant:"plain",beak:"right","content-text":"Right tooltip","action-buttons":[{label:"Action",handler:()=>console.log("Button clicked!")}]},{default:A(()=>[$(" Right tooltip ")]),_:1},8,["action-buttons"]),O(G,{"has-arrow":!0,variant:"plain",beak:"bottom","content-text":"Bottom tooltip","action-buttons":[{label:"Action",handler:()=>console.log("Button clicked!")}]},{default:A(()=>[$(" Bottom tooltip ")]),_:1},8,["action-buttons"]),O(G,{"has-arrow":!0,variant:"plain",beak:"left","content-text":"Left tooltip","action-buttons":[{label:"Action",handler:()=>console.log("Button clicked!")}]},{default:A(()=>[$(" Left tooltip ")]),_:1},8,["action-buttons"])])]),_:1}),O(s,{title:"Tooltip",description:"Tooltip with actions"},{default:A(()=>[Ml("div",Fi,[O(G,{"has-arrow":!0,variant:"rich",beak:"top","content-text":"Top tooltip","action-buttons":[{label:"Action",handler:()=>console.log("Button clicked!")}]},{default:A(()=>[$(" Top tooltip ")]),_:1},8,["action-buttons"]),O(G,{"has-arrow":!0,variant:"rich",beak:"right","content-text":"Right tooltip","action-buttons":[{label:"Action",handler:()=>console.log("Button clicked!")}]},{default:A(()=>[$(" Right tooltip ")]),_:1},8,["action-buttons"]),O(G,{"has-arrow":!0,variant:"rich",beak:"bottom","content-text":"Bottom tooltip","action-buttons":[{label:"Action",handler:()=>console.log("Button clicked!")}]},{default:A(()=>[$(" Bottom tooltip ")]),_:1},8,["action-buttons"]),O(G,{"has-arrow":!0,variant:"rich",beak:"left","content-text":"Left tooltip","action-buttons":[{label:"Action",handler:()=>console.log("Button clicked!")}]},{default:A(()=>[$(" Left tooltip ")]),_:1},8,["action-buttons"])])]),_:1})]))}}),{inject:Si}=await i("vue");function Ei(){const o=Si(nt);if(!o)throw new Error("No provider");return o}const{defineComponent:Di}=await i("vue"),{createVNode:z,createElementVNode:Be,withCtx:re,openBlock:Ui,createElementBlock:Ti}=await i("vue"),zi={class:"flex flex-col gap-24"},Li=Be("div",null,"Header",-1),Ai={class:"bg-fm-color-opacity-md overflow-auto w-[500px]"},Oi=Be("div",{class:"h-[300px] w-min"}," this is spacer ",-1),Mi=Be("div",{class:"h-[300px] w-min"}," this is spacer ",-1),{ref:Rl}=await i("vue"),Ri=Di({__name:"Dialog",setup(o){const e=Rl(!1),a=Rl(""),t=Ei(),l=()=>{t.open({title:"something",message:"something",primaryActions:{text:"Primary"},secondaryActions:{text:"Secondary"},tertiaryActions:{text:"Tertiary"},contentComponent:Ol}).onPrimary(()=>{console.log("primary log")}).onSecondary(()=>{console.log("secondary log")}).onTertiary(()=>{console.log("tertiary log")})};return(n,c)=>(Ui(),Ti("div",zi,[z(s,{title:"Icon",description:"Basic icon styling"},{default:re(()=>[z(p,{label:"Open",onClick:c[0]||(c[0]=u=>e.value=!0)}),z(Pr,{modelValue:e.value,"onUpdate:modelValue":c[3]||(c[3]=u=>e.value=u),overlay:!0},{"dialog-header":re(()=>[Li]),"dialog-content":re(()=>[Be("div",Ai,[Oi,z(ul,{modelValue:a.value,"onUpdate:modelValue":c[1]||(c[1]=u=>a.value=u),label:"Select",items:[{label:"Object",value:{first:"something"}},{label:"Array",value:["array","1"]},{label:"Number",value:3},{label:"String",value:"4"},{label:"1",value:"4"},{label:"2",value:"5"}]},null,8,["modelValue"]),z(zl),Mi])]),"dialog-footer":re(()=>[z(p,{class:"sm:w-full xs:w-full",variant:"tertiary",label:"Label",size:"md"}),z(it,{class:"sm:hidden xs:hidden"}),z(p,{class:"sm:w-full xs:w-full",variant:"secondary",label:"Label",size:"md"}),z(p,{class:"sm:w-full xs:w-full",variant:"primary",label:"Close",size:"md",onClick:c[2]||(c[2]=u=>e.value=!1)})]),_:1},8,["modelValue"])]),_:1}),z(s,{title:"Dialog Plugin"},{default:re(()=>[z(p,{variant:"primary",label:"Open Dialog Plugin",size:"lg",onClick:l})]),_:1})]))}}),{defineComponent:Pi}=await i("vue"),{toDisplayString:ji,createElementVNode:Fe,createTextVNode:Wi,createVNode:E,withCtx:Ye,openBlock:$i,createElementBlock:Ii}=await i("vue"),Gi={class:"bg-fm-color-neutral-gray-100 min-h-[40px] p-8 whitespace-pre"},qi={class:"flex gap-8 items-center"},{ref:Hi}=await i("vue"),Ji=Pi({__name:"Form",setup(o){const e=Hi({textField:"",radioGroup:null,stepper:null,textarea:""});return(a,t)=>($i(),Ii("div",null,[E(s,{title:"Form",description:"Basic usage"},{default:Ye(()=>[Fe("div",null,[Wi(" Value: "),Fe("div",Gi,[Fe("code",null,ji(JSON.stringify(e.value,null,4)),1)])]),E($r,{class:"flex flex-col gap-16"},{default:Ye(()=>[E(be,{modelValue:e.value.textField,"onUpdate:modelValue":t[0]||(t[0]=l=>e.value.textField=l),label:"Text Field",rules:[l=>!!l.includes("t")||"Must have a 't'"]},null,8,["modelValue","rules"]),E(rl,{modelValue:e.value.radioGroup,"onUpdate:modelValue":t[1]||(t[1]=l=>e.value.radioGroup=l),disabled:!1},{default:Ye(()=>[E(F,{value:"bluetooth",label:"Bluetooth"}),E(F,{value:"wifi",label:"WiFi"}),E(F,{value:"nfc",label:"NFC"}),E(F,{value:"hotspot",label:"Hotspot"})]),_:1},8,["modelValue"]),E(sl,{modelValue:e.value.stepper,"onUpdate:modelValue":t[2]||(t[2]=l=>e.value.stepper=l),label:"Number",placeholder:"Placeholder",step:30,min:0,max:999,"helper-text":"Helper",rules:[l=>l<=100||"More than 100",l=>l<=50||"More than 50",l=>!!l||"This field is required"],"prepend-text":"RM","append-text":"%"},null,8,["modelValue","rules"]),E(Re,{modelValue:e.value.textarea,"onUpdate:modelValue":t[3]||(t[3]=l=>e.value.textarea=l),label:"Textarea",rules:[l=>!!l.includes("t")||"Must have a 't'"]},null,8,["modelValue","rules"]),Fe("div",qi,[E(p,{type:"submit",label:"Submit"}),E(p,{type:"reset",label:"Reset"})])]),_:1})]),_:1})]))}}),{defineComponent:Ki}=await i("vue"),{createVNode:M,withCtx:ue,openBlock:Qi,createElementBlock:Xi}=await i("vue"),Yi={class:"flex flex-col gap-24"},{ref:se}=await i("vue"),Zi=Ki({__name:"ButtonGroup",setup(o){const e=[{label:"Grid"},{label:"List"},{label:"Thumbnails"}],a=[{icon:"grid_view"},{icon:"view_list"},{icon:"gallery_thumbnail"}],t=[{label:"Grid",icon:"grid_view"},{label:"List",icon:"view_list"},{label:"Thumbnails",icon:"gallery_thumbnail"}],l=[{label:"Grid",icon:"grid_view"},{label:"List (Disabled)",icon:"view_list",disabled:!0},{label:"Thumbnails",icon:"gallery_thumbnail"}],n=se(e[0]),c=se(a[0]),u=se(t[0]),r=se(null),m=se(null);return(f,b)=>(Qi(),Xi("div",Yi,[M(s,{title:"Button Group (Label)",description:"Label only"},{default:ue(()=>[M(ge,{modelValue:n.value,"onUpdate:modelValue":b[0]||(b[0]=V=>n.value=V),items:e},null,8,["modelValue"])]),_:1}),M(s,{title:"Button Group (Icon)",description:"Icon only"},{default:ue(()=>[M(ge,{modelValue:c.value,"onUpdate:modelValue":b[1]||(b[1]=V=>c.value=V),items:a},null,8,["modelValue"])]),_:1}),M(s,{title:"Button Group (Both)",description:"Both"},{default:ue(()=>[M(ge,{modelValue:u.value,"onUpdate:modelValue":b[2]||(b[2]=V=>u.value=V),items:t},null,8,["modelValue"])]),_:1}),M(s,{title:"Button Group (Disabled)",description:"Disabled state for the whole group"},{default:ue(()=>[M(ge,{modelValue:r.value,"onUpdate:modelValue":b[3]||(b[3]=V=>r.value=V),items:t,disabled:""},null,8,["modelValue"])]),_:1}),M(s,{title:"Button Group (Individually Disabled)",description:"Disabled state for the an individual button"},{default:ue(()=>[M(ge,{modelValue:m.value,"onUpdate:modelValue":b[4]||(b[4]=V=>m.value=V),items:l},null,8,["modelValue"])]),_:1})]))}}),{createVNode:x,unref:Pl,withCtx:I,createElementVNode:Ze,openBlock:de,createElementBlock:Ne,createCommentVNode:jl,withModifiers:Wl,createBlock:en}=await i("vue"),ln={class:"flex flex-col gap-24 w-full"},tn={key:0,class:"flex flex-col w-full"},an=Ze("div",{class:"fm-typo-title-sm-700 mb-8"}," Campaign Detail ",-1),on={key:1,class:"flex flex-col w-full"},nn=Ze("div",{class:"fm-typo-title-sm-700 mb-8"}," Campaign Trigger ",-1),rn={key:2,class:"flex flex-col w-full"},un=Ze("div",{class:"fm-typo-title-sm-700 mb-8"}," Campaign Configuration ",-1),{ref:$l}=await i("vue"),sn={__name:"Stepper",setup(o){const e=$l(""),a=$l(1),t=()=>a.value>1,l=()=>!0,n=()=>a.value>2,c=()=>a.value>3,u=()=>{a.value<4&&(a.value+=1)},r=()=>{a.value>0&&(a.value-=1)};return(m,f)=>(de(),Ne("div",ln,[x(s,{title:"Horizontal Stepper",description:"With horizontal orientation"},{default:I(()=>[x(cl,{modelValue:a.value,"onUpdate:modelValue":f[0]||(f[0]=b=>a.value=b),orientation:"horizontal"},{default:I(()=>[x(R,{title:"General information",description:"Supporting text",value:1,disabled:()=>a.value>2,complete:()=>!1,onClick:()=>{}},null,8,["disabled"]),x(R,{title:"Event trigger",description:"asd",value:2,complete:()=>a.value>2},null,8,["complete"]),x(R,{title:"Configuration",description:Pl(v)(!0),value:3,error:()=>!0,complete:()=>a.value>3},null,8,["description","complete"]),x(R,{title:"Confirmation",value:4,disabled:()=>!0,complete:()=>a.value>4},null,8,["complete"])]),_:1},8,["modelValue"])]),_:1}),x(s,{title:"Vertical Stepper",description:"With vertical orientation"},{default:I(()=>[x(cl,{modelValue:a.value,"onUpdate:modelValue":f[1]||(f[1]=b=>a.value=b),orientation:"vertical"},{default:I(()=>[x(R,{title:"General information",description:"Supporting text",value:1,complete:()=>a.value>1},null,8,["complete"]),x(R,{title:"Event trigger",description:Pl(v)(!0),value:2,disabled:()=>!0,complete:()=>a.value>2},null,8,["description","complete"]),x(R,{title:"Configuration",value:3,error:()=>!0,complete:()=>a.value>3},null,8,["complete"])]),_:1},8,["modelValue"])]),_:1}),x(s,{title:"Basic Usage",description:"contains 3 slots (default - FmStep, contents - form, actions - navigation buttons)"},{default:I(()=>[x(cl,{modelValue:a.value,"onUpdate:modelValue":f[6]||(f[6]=b=>a.value=b),"total-steps":3,orientation:"horizontal"},{contents:I(()=>[a.value===1?(de(),Ne("div",tn,[an,x(be,{modelValue:e.value,"onUpdate:modelValue":f[2]||(f[2]=b=>e.value=b),required:"",label:"Field 1"},null,8,["modelValue"]),x(Re,{modelValue:e.value,"onUpdate:modelValue":f[3]||(f[3]=b=>e.value=b),label:"textarea",disabled:!1},null,8,["modelValue"])])):a.value===2?(de(),Ne("div",on,[nn,x(be,{modelValue:e.value,"onUpdate:modelValue":f[4]||(f[4]=b=>e.value=b),label:"Field 1"},null,8,["modelValue"])])):a.value===3?(de(),Ne("div",rn,[un,x(Re,{modelValue:e.value,"onUpdate:modelValue":f[5]||(f[5]=b=>e.value=b),label:"textarea",disabled:!1},null,8,["modelValue"])])):jl("",!0)]),actions:I(()=>[a.value!=1?(de(),en(p,{key:0,type:"button",label:"Previous",variant:"tertiary",onClick:Wl(r,["prevent"])},null,8,["onClick"])):jl("",!0),x(p,{variant:"primary",label:a.value!=3?"Next":"Submit",type:"button",onClick:Wl(u,["prevent"])},null,8,["label","onClick"])]),default:I(()=>[x(R,{title:"General information",description:"Supporting text",value:1,error:l,complete:t}),x(R,{title:"Event trigger",value:2,complete:n}),x(R,{title:"Configuration",value:3,complete:c})]),_:1},8,["modelValue"])]),_:1})]))}},{defineComponent:dn}=await i("vue"),{renderSlot:el,toDisplayString:Se,normalizeClass:ce,createElementVNode:Ee,openBlock:De,createElementBlock:ll,createCommentVNode:cn,createBlock:mn,pushScopeId:Kr,popScopeId:Qr}=await i("vue"),pn={class:"fm-drop-field"},vn=["accept","disabled"],{computed:Il,ref:Ue}=await i("vue"),fn=dn({__name:"FmDropField",props:{label:{default:""},disabled:{type:Boolean,default:!1},accept:{default:""},maxFileSize:{default:8e6}},emits:["file-upload","file-rejected"],setup(o,{emit:e}){const a=o,t=Ue(!1),l=Ue(),n=Ue(),c=Ue(),u=d=>{a.disabled||(d.stopPropagation(),d.preventDefault())},r=d=>{a.disabled||(d.stopPropagation(),d.preventDefault(),t.value=!0)},m=d=>{a.disabled||(d.stopPropagation(),d.preventDefault(),t.value=!1)},f=d=>{a.disabled||(d.stopPropagation(),d.preventDefault(),t.value=!1,b(d))},b=d=>{var P;c.value=((P=d.dataTransfer)==null?void 0:P.files)??d.target.files;const H=c.value;if(l.value=al(H[0]),n.value=ol(H[0]),l.value&&n.value)e("file-upload",H[0]);else{const lr=V();e("file-rejected",[{file:H[0],reason:lr}])}},V=()=>{const d=[];return l.value||d.push("invalid-type"),n.value||d.push("invalid-size"),d},al=d=>{if(!a.accept)return!0;const H=a.accept.split(",").map(P=>P.trim());for(const P of H)if(fe(P)){if(lt(P)===lt(d.type))return!0}else if(il(d)===P||d.type===P)return!0;return!1},ol=d=>d.size<=a.maxFileSize,fe=d=>d.indexOf("*")!==-1,il=d=>"."+d.name.split(".").pop(),lt=d=>d.substring(0,d.indexOf("/")),er=Il(()=>{if(t.value)return"Drop file to upload";if(l.value){if(!n.value)return`File size exceeds ${a.maxFileSize*1e-6}mb`}else return"File type is not valid";return""}),nl=Il(()=>c.value?!l.value||!n.value:!1);return(d,H)=>(De(),ll("label",pn,[el(d.$slots,"label",{},()=>[Ee("div",{class:ce(["fm-typo-body-lg-400",[d.disabled?"text-fm-color-typo-disabled":"text-fm-color-typo-primary"]])},Se(d.label),3)],!0),Ee("div",{class:ce(["fm-drop-field__container",{"fm-drop-field__container--dragging":t.value,"fm-drop-field__container--invalid":nl.value&&!d.disabled,"fm-drop-field__container--disabled":d.disabled}]),onDragenter:u,onDragover:r,onDragleave:m,onDrop:f},[(t.value||nl.value)&&!d.disabled?(De(),ll("div",{key:0,class:ce({"fm-typo-body-lg-700":!0,"text-fm-color-primary":t.value,"text-fm-color-typo-error":nl.value})},Se(er.value),3)):(De(),mn(p,{key:1,label:"Add files",size:"md",variant:"secondary",disabled:d.disabled},null,8,["disabled"])),el(d.$slots,"accept-text",{},()=>[a.accept?(De(),ll("div",{key:0,class:ce(["fm-typo-body-md-400",[d.disabled?"text-fm-color-typo-disabled":"text-fm-color-typo-secondary"]])},Se(`Accepts ${a.accept}`),3)):cn("",!0)],!0),Ee("input",{type:"file",class:"fm-drop-field__input",accept:d.accept,disabled:d.disabled,onChange:b},null,40,vn)],34),el(d.$slots,"helper-text",{},()=>[Ee("div",{class:ce(["fm-typo-body-sm-400",[d.disabled?"text-fm-color-typo-disabled":"text-fm-color-typo-secondary"]])},Se(`Max size ${a.maxFileSize*1e-6}mb`),3)],!0)]))}}),Gl=Jr(fn,[["__scopeId","data-v-31c17193"]]),{defineComponent:bn}=await i("vue"),{createVNode:Te,createElementVNode:ze,toDisplayString:gn,withCtx:ql,Fragment:yn,openBlock:_n,createElementBlock:hn}=await i("vue"),wn=["src"],{ref:Hl}=await i("vue"),Vn=bn({__name:"DropField",setup(o){const e=Hl(),a=Hl(),t=n=>{console.log(n),e.value=URL.createObjectURL(n)},l=n=>{console.log(n),a.value=n};return(n,c)=>(_n(),hn(yn,null,[Te(s,{title:"Drop Field"},{default:ql(()=>[Te(Gl,{class:"h-[300px] w-[200px]",label:"Document",accept:".pdf, .png",onFileUpload:t,onFileRejected:l}),ze("div",null,[ze("img",{src:e.value},null,8,wn)]),ze("div",null,[ze("code",null,gn(JSON.stringify(a.value,function(u,r){return u==="file"?{fileName:r.name,fileType:r.type}:r},4)),1)])]),_:1}),Te(s,{class:"mt-4",title:"Drop Field Disabled"},{default:ql(()=>[Te(Gl,{class:"h-[300px] w-[200px]",label:"Document",disabled:""})]),_:1})],64))}}),{defineComponent:xn}=await i("vue"),{renderList:Jl,Fragment:Kl,openBlock:me,createElementBlock:Le,toDisplayString:Ql,createElementVNode:Ae,normalizeClass:kn,resolveDynamicComponent:Cn,createBlock:Bn}=await i("vue"),Fn={class:"divide-x flex h-screen",style:{"background-color":"#f7f7f7"}},Nn={class:"h-full overflow-y-auto px-24",style:{"min-width":"200px"}},Sn={class:"fm-typo-body-lg-700 mb-8 text-fm-color-typo-tertiary"},En=["onClick"],Dn={class:"grow h-full overflow-y-auto p-16"},{ref:Un,computed:Tn,onMounted:zn}=await i("vue"),Ln=xn({__name:"App",setup(o){const e=[{title:"Application",children:{FmButton:{label:"Button",component:Wt},FmButtonGroup:{label:"Button Group",component:Zi},FmCard:{label:"Card",component:sa},FmIcon:{label:"Icon",component:Eo},FmSnackbar:{label:"Snackbar",component:Ol},FmList:{label:"List & list item",component:Wo},FmStepper:{label:"Stepper",component:sn},FmBreadcrumb:{label:"Breadcrumb",component:Nt},FmDialog:{label:"Dialog",component:Ri},FmDropField:{label:"Drop Field",component:Vn}}},{title:"Form",children:{FmForm:{label:"Form",component:Ji},FmFormField:{label:"Form field",component:ja},FmTextField:{label:"Input",component:Vo},FmStepperField:{label:"Stepper Field",component:ro},FmSwitch:{label:"Switch",component:yo},FmRadio:{label:"Radio",component:Ha},FmCheckbox:{label:"Checkbox",component:za},FmSelect:{label:"Select",component:Ya},FmDatePicker:{label:"Date picker",component:ya},FmDateRangePicker:{label:"Date range picker",component:Fa},FmTimePicker:{label:"Time picker",component:wi}}},{title:"Chart",children:{FmLineChart:{label:"Line chart",component:Tt}}},{title:"Utility",children:{FmMenu:{label:"Menu",component:ai},FmTooltip:{label:"Tooltip",component:Ni}}}],a=Un("FmButton");function t(n){window.location.hash=n,a.value=n}const l=Tn(()=>e.reduce((n,c)=>({...n,...c.children}),{})[a.value].component);return zn(()=>{const[,n]=window.location.hash.split("/");n&&t(n)}),(n,c)=>(me(),Le("div",Fn,[Ae("div",Nn,[(me(),Le(Kl,null,Jl(e,(u,r)=>Ae("div",{key:r,class:"mt-24"},[Ae("div",Sn,Ql(u.title),1),(me(!0),Le(Kl,null,Jl(u.children,(m,f)=>(me(),Le("div",{key:f,class:kn([a.value===f?"cursor-not-allowed fm-typo-body-lg-700 text-fm-color-primary":"cursor-pointer","py-4"]),onClick:()=>t(f)},Ql(m.label),11,En))),128))])),64))]),Ae("div",Dn,[(me(),Bn(Cn(l.value)))])]))}}),{defineComponent:An}=await i("vue"),{resolveDynamicComponent:Xl,openBlock:D,createBlock:q,createElementBlock:pe,createCommentVNode:ve,toDisplayString:Yl,createElementVNode:tl,createVNode:On,normalizeStyle:Mn,normalizeClass:Rn,Transition:Pn,withCtx:jn}=await i("vue"),Wn={key:0,class:"block"},$n={class:"flex fm-typo-title-sm-700 items-center justify-between text-fm-color-typo-primary"},In={class:"fm-typo-title-md-700 text-fm-color-typo-primary"},Gn={key:0,class:"overflow-y-auto"},qn={key:1,class:"fm-typo-body-md-400 overflow-y-auto text-fm-color-neutral-black"},Hn={class:"flex gap-8 items-center justify-end sm:flex-col-reverse xs:flex-col-reverse"},{onMounted:Jn,ref:Zl}=await i("vue"),Kn=An({__name:"FmDynamicDialog",props:{title:{},message:{},primaryActions:{default:null},secondaryActions:{default:null},tertiaryActions:{default:null},overlay:{type:Boolean,default:!0},closeButton:{type:Boolean,default:!0},minWidth:{default:280},dialogComponent:{default:null},contentComponent:{default:null},unmount:{},storedFunctions:{}},emits:["dialog-opened","dialog-closed"],setup(o,{emit:e}){const a=o,t=Zl(!0),l=Zl(null),n=()=>{a.overlay&&(a.unmount(),e("dialog-closed"))},c=r=>{l.value&&r.target===l.value&&n()},u=(r,m)=>{a.storedFunctions[m].forEach(f=>f()),r.close&&n()};return Jn(()=>{e("dialog-opened")}),(r,m)=>(D(),q(Pn,null,{default:jn(()=>[t.value?(D(),pe("div",{key:0,ref_key:"overlayRef",ref:l,class:Rn({"fm-dialog--container":!0,"fm-dialog--overlay":r.overlay}),onClick:c},[r.dialogComponent?(D(),pe("div",Wn,[(D(),q(Xl(r.dialogComponent)))])):(D(),pe("div",{key:1,class:"fm-dialog",style:Mn({"min-width":`${a.minWidth}px`})},[tl("div",$n,[tl("div",In,Yl(r.title),1),r.closeButton?(D(),q(X,{key:0,class:"cursor-pointer",name:"close",size:"md",onClick:n})):ve("",!0)]),r.contentComponent?(D(),pe("div",Gn,[(D(),q(Xl(r.contentComponent)))])):(D(),pe("div",qn,Yl(r.message),1)),tl("div",Hn,[r.tertiaryActions?(D(),q(p,{key:0,class:"sm:w-full xs:w-full",variant:"tertiary",label:r.tertiaryActions.text,size:"md",onClick:m[0]||(m[0]=f=>u(r.tertiaryActions,"tertiary"))},null,8,["label"])):ve("",!0),On(it,{class:"sm:hidden xs:hidden"}),r.secondaryActions?(D(),q(p,{key:1,class:"sm:w-full xs:w-full",variant:"secondary",label:r.secondaryActions.text,size:"md",onClick:m[1]||(m[1]=f=>u(r.secondaryActions,"secondary"))},null,8,["label"])):ve("",!0),r.primaryActions?(D(),q(p,{key:2,class:"sm:w-full xs:w-full",variant:"primary",label:r.primaryActions.text,size:"md",onClick:m[2]||(m[2]=f=>u(r.primaryActions,"primary"))},null,8,["label"])):ve("",!0)])],4))],2)):ve("",!0)]),_:1}))}}),{markRaw:Qn,createVNode:Xn,render:et}=await i("vue"),Yn={install:o=>{const e={open:a=>{const t={primary:[],secondary:[],tertiary:[]},l={onPrimary:m=>(t.primary.push(m),l),onSecondary:m=>(t.secondary.push(m),l),onTertiary:m=>(t.tertiary.push(m),l)};function n(){c&&et(null,c),c=null,r=null}let c=document.createElement("div");document.body.appendChild(c);const u=Qn(Kn);let r=Xn(u,{...a,unmount:n,storedFunctions:t});return r.appContext=o._context,et(r,c),l}};o.config.globalProperties.$dialog=e,o.provide(nt,e)}},{createApp:Zn}=await i("vue"),Oe=Zn(Ln);Oe.use(rt),Oe.use(gt,{duration:.3,color:"var(--fm-color-opacity-sm)",initialOpacity:1,finalOpacity:.1,dissolveDuration:.6}),Oe.use(Yn),Oe.mount("#app")});
|
|
File without changes
|