@designcrowd/fe-shared-lib 1.5.26 → 1.5.27

package/.storybook-static/assets/ColorPicker.stories-DTkwaAKN.js

@@ -0,0 +1,73 @@
+import{F as H}from"./FormControl.mixin-Z8ORnl4_.js";import{c as n,f as F,e as a,b as t,z as J,t as K,n as Q,C as v,o as l}from"./iframe-Dd7cBPzL.js";import{_ as X}from"./_plugin-vue_export-helper-DlAUqK2U.js";import"./Icon-BKxOWZPO.js";const A={mixins:[H],props:{modelValue:{type:String,required:!0},mode:{type:String,default:"color-and-text"}},data(){return{color:this.modelValue}},watch:{color(e){this.$emit("update:modelValue",e)},value(e){this.color=e}},methods:{onColorChange(e){this.color=e,this.$emit("input",e)}}},Z=["for"],$={key:0,class:"tw-text-error-500"},ee=["id","value","disabled"],re={key:0,class:"tw-w-full tw-h-full"},oe=["value","disabled"];function ne(e,o,C,ae,x,b){return l(),n("div",{class:t(["tw-box-border",{"tw-w-32":C.mode==="color-and-text","tw-w-10":C.mode==="color-only"}])},[e.label?(l(),n("label",{key:0,for:`scl-input-${e.id}`,class:t(["tw-font-sans tw-text-grayscale-600 tw-text-sm tw-mb-2 tw-block tw-font-semibold",{"tw-sr-only":e.showLabelScreenReaderOnly}])},[J(K(e.label)+" ",1),e.required?(l(),n("span",$,"*")):F("",!0)],10,Z)):F("",!0),a("div",{class:t([{"tw-opacity-50":e.disabled},"tw-cursor-pointer tw-flex tw-overflow-hidden tw-h-10 tw-items-center tw-bg-white tw-text-grayscale-600 tw-box-border tw-w-full tw-text-base tw-rounded tw-border tw-border-solid tw-border-grayscale-500"])},[a("div",{style:Q({backgroundColor:x.color}),class:"tw-flex-none tw-h-full tw-w-10 tw-border-t-0 tw-border-l-0 tw-border-b-0 tw-border-r tw-border-solid tw-border-grayscale-500 tw-relative"},[a("input",{id:e.id?`scl-input-${e.id}`:null,ref:"input",value:x.color,type:"color",class:"tw-absolute tw-top-0 tw-left-0 tw-w-full tw-h-full tw-opacity-0 tw-cursor-pointer",disabled:e.disabled,onInput:o[0]||(o[0]=v(w=>b.onColorChange(w.target.value),["stop"]))},null,40,ee)],4),C.mode==="color-and-text"?(l(),n("div",re,[a("input",{value:x.color,type:"text",disabled:e.disabled,maxlength:"7",minlength:"4",class:t(["tw-w-full tw-h-full tw-px-3 tw-uppercase tw-border-0 tw-p-0 tw-font-sans focus:tw-outline-none",{"tw-bg-error-100 tw-text-error-700 ":e.error,"tw-bg-warning-100 tw-text-warning-700 ":e.warning,"tw-bg-success-100 tw-text-success-700 ":e.success,"tw-bg-white tw-text-secondary-500 ":!e.error&&!e.warning&&!e.success}]),onInput:o[1]||(o[1]=v(w=>b.onColorChange(w.target.value),["stop"]))},null,42,oe)])):F("",!0)],2)],2)}const G=X(A,[["render",ne]]);A.__docgenInfo={exportName:"default",displayName:"ColorPicker",description:"",tags:{},props:[{name:"attrs",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"object"},required:!1,defaultValue:{func:!0,value:"() => {}"}},{name:"modelValue",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"string"},required:!0,defaultValue:{func:!1,value:"''"}},{name:"id",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"string"},required:!1,defaultValue:{func:!1,value:"undefined"}},{name:"placeholder",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"string"},required:!1,defaultValue:{func:!1,value:"undefined"}},{name:"size",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"string"},required:!1,defaultValue:{func:!1,value:"'sm'"}},{name:"label",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"string"},required:!1,defaultValue:{func:!1,value:"undefined"}},{name:"showLabelScreenReaderOnly",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}},{name:"icon",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"string"},required:!1,defaultValue:{func:!1,value:"undefined"}},{name:"required",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}},{name:"error",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}},{name:"warning",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}},{name:"success",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}},{name:"disabled",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}},{name:"readonly",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}},{name:"name",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"string"},required:!1,defaultValue:{func:!1,value:"undefined"}},{name:"maxlength",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"number"},required:!1,defaultValue:{func:!1,value:"undefined"}},{name:"minlength",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"number"},required:!1,defaultValue:{func:!1,value:"undefined"}},{name:"isSpaceDisabled",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}},{name:"requiredMessage",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{name:"string"},required:!1,defaultValue:{func:!1,value:"'Please fill in this field.'"}},{name:"mode",type:{name:"string"},defaultValue:{func:!1,value:"'color-and-text'"}}],events:[{name:"update:modelValue",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{names:["undefined"]}},{name:"input",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{names:["undefined"]}},{name:"keyup",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{names:["undefined"]}},{name:"keydown",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{names:["undefined"]}},{name:"focus",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{names:["undefined"]}},{name:"blur",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{names:["undefined"]}},{name:"enter-key-up",mixin:{name:"FormControl.mixin",path:"../FormControl/FormControl.mixin.js"},type:{names:["undefined"]}}],sourceFiles:["/Users/kristianbonitz/Repos/fe-shared-lib/src/atoms/components/ColorPicker/ColorPicker.vue","/Users/kristianbonitz/Repos/fe-shared-lib/src/atoms/components/FormControl/FormControl.mixin.js"]};const se={title:"Components/Color Picker",component:G},r={components:{ColorPicker:G},data(){return{value:"#ff0000"}}},m=()=>({...r,template:`
+      <ColorPicker v-model="value" />
+    `}),i=()=>({...r,template:`
+      <ColorPicker v-model="value" mode="color-only" />
+    `}),s=()=>({...r,template:`
+      <ColorPicker v-model="value" label="Your Name" />
+    `}),u=()=>({...r,template:`
+      <ColorPicker v-model="value" label="Your Name" :required="true" />
+    `}),d=()=>({...r,template:`
+      <ColorPicker v-model="value" :warning="true" />
+    `}),c=()=>({...r,template:`
+      <ColorPicker v-model="value" :error="true" />
+    `}),p=()=>({...r,template:`
+      <ColorPicker v-model="value" :success="true" />
+    `}),f=()=>({...r,template:`
+      <ColorPicker v-model="value" :disabled="true" />
+    `});var h,y,g;m.parameters={...m.parameters,docs:{...(h=m.parameters)==null?void 0:h.docs,source:{originalSource:`() => {
+  return {
+    ...data,
+    template: \`
+      <ColorPicker v-model="value" />
+    \`
+  };
+}`,...(g=(y=m.parameters)==null?void 0:y.docs)==null?void 0:g.source}}};var k,j,V;i.parameters={...i.parameters,docs:{...(k=i.parameters)==null?void 0:k.docs,source:{originalSource:`() => {
+  return {
+    ...data,
+    template: \`
+      <ColorPicker v-model="value" mode="color-only" />
+    \`
+  };
+}`,...(V=(j=i.parameters)==null?void 0:j.docs)==null?void 0:V.source}}};var q,P,S;s.parameters={...s.parameters,docs:{...(q=s.parameters)==null?void 0:q.docs,source:{originalSource:`() => {
+  return {
+    ...data,
+    template: \`
+      <ColorPicker v-model="value" label="Your Name" />
+    \`
+  };
+}`,...(S=(P=s.parameters)==null?void 0:P.docs)==null?void 0:S.source}}};var N,z,L;u.parameters={...u.parameters,docs:{...(N=u.parameters)==null?void 0:N.docs,source:{originalSource:`() => {
+  return {
+    ...data,
+    template: \`
+      <ColorPicker v-model="value" label="Your Name" :required="true" />
+    \`
+  };
+}`,...(L=(z=u.parameters)==null?void 0:z.docs)==null?void 0:L.source}}};var R,O,D;d.parameters={...d.parameters,docs:{...(R=d.parameters)==null?void 0:R.docs,source:{originalSource:`() => {
+  return {
+    ...data,
+    template: \`
+      <ColorPicker v-model="value" :warning="true" />
+    \`
+  };
+}`,...(D=(O=d.parameters)==null?void 0:O.docs)==null?void 0:D.source}}};var E,Y,_;c.parameters={...c.parameters,docs:{...(E=c.parameters)==null?void 0:E.docs,source:{originalSource:`() => {
+  return {
+    ...data,
+    template: \`
+      <ColorPicker v-model="value" :error="true" />
+    \`
+  };
+}`,...(_=(Y=c.parameters)==null?void 0:Y.docs)==null?void 0:_.source}}};var B,I,M;p.parameters={...p.parameters,docs:{...(B=p.parameters)==null?void 0:B.docs,source:{originalSource:`() => {
+  return {
+    ...data,
+    template: \`
+      <ColorPicker v-model="value" :success="true" />
+    \`
+  };
+}`,...(M=(I=p.parameters)==null?void 0:I.docs)==null?void 0:M.source}}};var U,W,T;f.parameters={...f.parameters,docs:{...(U=f.parameters)==null?void 0:U.docs,source:{originalSource:`() => {
+  return {
+    ...data,
+    template: \`
+      <ColorPicker v-model="value" :disabled="true" />
+    \`
+  };
+}`,...(T=(W=f.parameters)==null?void 0:W.docs)==null?void 0:T.source}}};const ue=["Sample","SampleColorOnly","Label","LabelRequired","Warning","Error","Success","Disabled"];export{f as Disabled,c as Error,s as Label,u as LabelRequired,m as Sample,i as SampleColorOnly,p as Success,d as Warning,ue as __namedExportsOrder,se as default};

package/.storybook-static/assets/CopyToClipboardText.stories-CYAv-s36.js

@@ -0,0 +1,32 @@
+import{i as v,c as S,e as p,h as d,t as c,x as u,o as z}from"./iframe-Dd7cBPzL.js";import{T as V}from"./Tooltip-BhRZYr7B.js";import{I as _}from"./Icon-BKxOWZPO.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";const k={class:"tw-flex tw-w-full tw-items-center tw-gap-2"},B=["title"],N={class:"tw-flex tw-z-50 tw-text-grayscale-600 tw-font-normal tw-text-sm tw-justify-center tw-whitespace-nowrap tw-select-none"},l={__name:"CopyToClipboardText",props:{text:{type:String,required:!0},tooltipText:{type:String,default:"Copy to clipboard"},tooltipCopiedText:{type:String,default:"Copied!"},shouldShowTooltip:{type:Boolean,default:!0},iconSize:{type:String,default:"sm"}},setup(e){const s=e,t=v(s.tooltipText),g=()=>{t.value=s.tooltipCopiedText,navigator.clipboard.writeText(s.text)};return(I,i)=>(z(),S("div",k,[p("p",{class:"tw-overflow-x-hidden tw-truncate",title:e.text},c(e.text),9,B),d(V,{class:"tw-items-center",direction:"top",alignment:"center",color:"grayscale-700","should-show-icon":!1,"should-show-tooltip":e.shouldShowTooltip&&t.value,"full-width":"","is-rounded-corner":""},{open:u(()=>[d(_,{name:"duplicate",alt:"Duplicate icon",size:e.iconSize,class:"tw-p-1 tw-rounded tw-cursor-pointer tw-text-grayscale-600 hover:tw-bg-grayscale-400","should-display-title":!1,onClick:g,onMouseleave:i[0]||(i[0]=q=>t.value=e.tooltipText)},null,8,["size"])]),content:u(()=>[p("p",N,c(t.value),1)]),_:1},8,["should-show-tooltip"])]))}};l.__docgenInfo={exportName:"default",displayName:"CopyToClipboardText",description:"",tags:{},props:[{name:"text",type:{name:"string"},required:!0},{name:"tooltipText",type:{name:"string"},defaultValue:{func:!1,value:"'Copy to clipboard'"}},{name:"tooltipCopiedText",type:{name:"string"},defaultValue:{func:!1,value:"'Copied!'"}},{name:"shouldShowTooltip",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}},{name:"iconSize",type:{name:"string"},defaultValue:{func:!1,value:"'sm'"}}],sourceFiles:["/Users/kristianbonitz/Repos/fe-shared-lib/src/atoms/components/CopyToClipboardText/CopyToClipboardText.vue"]};const F={title:"Components/CopyToClipboardText",component:l},n={components:{CopyToClipboardText:l}},o=()=>({...n,template:`
+      <CopyToClipboardText text="Copy me!"/>
+    `}),a=()=>({...n,template:`
+      <CopyToClipboardText text="Copy me!" :should-show-tooltip="false"/>
+    `}),r=()=>({...n,template:`
+      <div style="width: 200px; border: solid blue 1px">
+        <CopyToClipboardText text="This sentence is too large to fit" />
+      </div>
+    `});var m,x,T;o.parameters={...o.parameters,docs:{...(m=o.parameters)==null?void 0:m.docs,source:{originalSource:`() => {
+  return {
+    ...data,
+    template: \`
+      <CopyToClipboardText text="Copy me!"/>
+    \`
+  };
+}`,...(T=(x=o.parameters)==null?void 0:x.docs)==null?void 0:T.source}}};var C,y,f;a.parameters={...a.parameters,docs:{...(C=a.parameters)==null?void 0:C.docs,source:{originalSource:`() => {
+  return {
+    ...data,
+    template: \`
+      <CopyToClipboardText text="Copy me!" :should-show-tooltip="false"/>
+    \`
+  };
+}`,...(f=(y=a.parameters)==null?void 0:y.docs)==null?void 0:f.source}}};var w,h,b;r.parameters={...r.parameters,docs:{...(w=r.parameters)==null?void 0:w.docs,source:{originalSource:`() => {
+  return {
+    ...data,
+    template: \`
+      <div style="width: 200px; border: solid blue 1px">
+        <CopyToClipboardText text="This sentence is too large to fit" />
+      </div>
+    \`
+  };
+}`,...(b=(h=r.parameters)==null?void 0:h.docs)==null?void 0:b.source}}};const M=["Sample","WithoutTooltip","Truncated"];export{o as Sample,r as Truncated,a as WithoutTooltip,M as __namedExportsOrder,F as default};

package/.storybook-static/assets/Dropdown.stories-hHlWTMpq.js

@@ -0,0 +1,159 @@
+import{D as n,a as l}from"./DropdownItem-BIPkoata.js";import{P as a}from"./Pill-CpGZCb39.js";import{B as I}from"./Button-DUOSTNbh.js";import"./iframe-Dd7cBPzL.js";import"./Icon-BKxOWZPO.js";import"./_plugin-vue_export-helper-DlAUqK2U.js";import"./ButtonPrimary-C1HLT2L3.js";const k={title:"Components/Dropdown",component:n},e=()=>({components:{Dropdown:n,DropdownItem:l,Pill:a},data(){return{show:!0}},template:`
+      <div class="tw-font-sans tw-w-1/4">
+        <Dropdown menu-align="right" v-model:show="show" @update:show="(visible) => show = visible" menu-element-classes="tw-w-full">
+          <DropdownItem @click="() => show = false">
+            <span class="tw-grow">Menu item 1</span>
+            <Pill class="tw-text-white" :style="{ background: 'blue' }">Blue</Pill>
+          </DropdownItem>
+          <DropdownItem>
+            <span class="tw-grow">Menu item 2</span>
+            <Pill class="tw-text-white tw-w-7" :style="{ background: 'red' }">Red</Pill>
+          </DropdownItem>
+        </Dropdown>
+      </div>
+    `}),t=()=>({components:{Dropdown:n,DropdownItem:l},template:`
+      <div class="tw-font-sans tw-w-1/4">
+        <Dropdown menu-align="right" disabled menu-element-classes="tw-w-full">
+          <DropdownItem>
+            <span>Menu item 1</span>
+          </DropdownItem>
+          <DropdownItem>
+            <span>Menu item 2</span>
+          </DropdownItem>
+        </Dropdown>
+      </div>
+    `}),s=()=>({components:{Dropdown:n,DropdownItem:l,Pill:a},template:`
+      <div class="tw-font-sans tw-w-1/4">
+        <Dropdown menu-align="right" menu-element-classes="tw-h-40 tw-overflow-y-auto tw-w-full">
+          <DropdownItem v-for="(item, i) in items" :key="i">
+            <span class="tw-grow">{{ item.display }}</span>
+          </DropdownItem>
+        </Dropdown>
+      </div>
+    `,setup(){return{items:[{display:"Menu 1"},{display:"Menu 2"},{display:"Menu 3"},{display:"Menu 4"},{display:"Menu 5"},{display:"Menu 6"},{display:"Menu 7"},{display:"Menu 8"},{display:"Menu 9"},{display:"Menu 10"}]}}}),o=()=>({components:{Dropdown:n,DropdownItem:l,Button:I,Pill:a},template:`
+      <div class="tw-flex tw-gap-2 tw-m-4">
+        <Dropdown menu-align="right" element-classes="tw-h-12" menu-element-classes="tw-w-full">
+          <DropdownItem>
+            <span class="tw-grow">Menu item 1</span>
+            <Pill class="tw-text-white" :style="{ background: 'blue' }">Blue</Pill>
+          </DropdownItem>
+          <DropdownItem>
+            <span class="tw-grow">Menu item 2</span>
+            <Pill class="tw-text-white tw-w-7" :style="{ background: 'red' }">Red</Pill>
+          </DropdownItem>
+        </Dropdown>
+        <Button label="Submit" variant="primary">Button</Button>
+      </div>
+    `});var r,p,w;e.parameters={...e.parameters,docs:{...(r=e.parameters)==null?void 0:r.docs,source:{originalSource:`() => {
+  return {
+    components: {
+      Dropdown,
+      DropdownItem,
+      Pill
+    },
+    data() {
+      return {
+        show: true
+      };
+    },
+    template: \`
+      <div class="tw-font-sans tw-w-1/4">
+        <Dropdown menu-align="right" v-model:show="show" @update:show="(visible) => show = visible" menu-element-classes="tw-w-full">
+          <DropdownItem @click="() => show = false">
+            <span class="tw-grow">Menu item 1</span>
+            <Pill class="tw-text-white" :style="{ background: 'blue' }">Blue</Pill>
+          </DropdownItem>
+          <DropdownItem>
+            <span class="tw-grow">Menu item 2</span>
+            <Pill class="tw-text-white tw-w-7" :style="{ background: 'red' }">Red</Pill>
+          </DropdownItem>
+        </Dropdown>
+      </div>
+    \`
+  };
+}`,...(w=(p=e.parameters)==null?void 0:p.docs)==null?void 0:w.source}}};var i,d,m;t.parameters={...t.parameters,docs:{...(i=t.parameters)==null?void 0:i.docs,source:{originalSource:`() => {
+  return {
+    components: {
+      Dropdown,
+      DropdownItem
+    },
+    template: \`
+      <div class="tw-font-sans tw-w-1/4">
+        <Dropdown menu-align="right" disabled menu-element-classes="tw-w-full">
+          <DropdownItem>
+            <span>Menu item 1</span>
+          </DropdownItem>
+          <DropdownItem>
+            <span>Menu item 2</span>
+          </DropdownItem>
+        </Dropdown>
+      </div>
+    \`
+  };
+}`,...(m=(d=t.parameters)==null?void 0:d.docs)==null?void 0:m.source}}};var u,c,D;s.parameters={...s.parameters,docs:{...(u=s.parameters)==null?void 0:u.docs,source:{originalSource:`() => {
+  return {
+    components: {
+      Dropdown,
+      DropdownItem,
+      Pill
+    },
+    template: \`
+      <div class="tw-font-sans tw-w-1/4">
+        <Dropdown menu-align="right" menu-element-classes="tw-h-40 tw-overflow-y-auto tw-w-full">
+          <DropdownItem v-for="(item, i) in items" :key="i">
+            <span class="tw-grow">{{ item.display }}</span>
+          </DropdownItem>
+        </Dropdown>
+      </div>
+    \`,
+    setup() {
+      return {
+        items: [{
+          display: 'Menu 1'
+        }, {
+          display: 'Menu 2'
+        }, {
+          display: 'Menu 3'
+        }, {
+          display: 'Menu 4'
+        }, {
+          display: 'Menu 5'
+        }, {
+          display: 'Menu 6'
+        }, {
+          display: 'Menu 7'
+        }, {
+          display: 'Menu 8'
+        }, {
+          display: 'Menu 9'
+        }, {
+          display: 'Menu 10'
+        }]
+      };
+    }
+  };
+}`,...(D=(c=s.parameters)==null?void 0:c.docs)==null?void 0:D.source}}};var g,y,h;o.parameters={...o.parameters,docs:{...(g=o.parameters)==null?void 0:g.docs,source:{originalSource:`() => {
+  return {
+    components: {
+      Dropdown,
+      DropdownItem,
+      Button,
+      Pill
+    },
+    template: \`
+      <div class="tw-flex tw-gap-2 tw-m-4">
+        <Dropdown menu-align="right" element-classes="tw-h-12" menu-element-classes="tw-w-full">
+          <DropdownItem>
+            <span class="tw-grow">Menu item 1</span>
+            <Pill class="tw-text-white" :style="{ background: 'blue' }">Blue</Pill>
+          </DropdownItem>
+          <DropdownItem>
+            <span class="tw-grow">Menu item 2</span>
+            <Pill class="tw-text-white tw-w-7" :style="{ background: 'red' }">Red</Pill>
+          </DropdownItem>
+        </Dropdown>
+        <Button label="Submit" variant="primary">Button</Button>
+      </div>
+    \`
+  };
+}`,...(h=(y=o.parameters)==null?void 0:y.docs)==null?void 0:h.source}}};const S=["Sample","Disabled","LongListFixedHeight","SampleElementClasses"];export{t as Disabled,s as LongListFixedHeight,e as Sample,o as SampleElementClasses,S as __namedExportsOrder,k as default};

package/.storybook-static/assets/DropdownItem-BIPkoata.js

@@ -0,0 +1 @@
+import{c as r,e as n,A as p,h,g as l,b as o,B as g,a as b,o as u,z as v,t as y,C as V}from"./iframe-Dd7cBPzL.js";import{I as _}from"./Icon-BKxOWZPO.js";import{_ as d}from"./_plugin-vue_export-helper-DlAUqK2U.js";const f={components:{Icon:_},props:{menuAlign:{type:String,default:"right"},title:{type:String,required:!1,default:void 0},elementClasses:{type:String,required:!1,default:""},menuElementClasses:{type:String,required:!1,default:""},disabled:{type:Boolean,required:!1,default:!1},show:{type:Boolean,required:!1,default:!1},iconSize:{type:String,required:!1,default:"sm"},tooltip:{type:String,required:!1}},data:()=>({isMenuVisible:!1}),computed:{menuItems(){return(this.$slots.default||[]).filter(t=>t.tag)}},watch:{show(){this.isMenuVisible=this.show}},mounted(){this.isMenuVisible=this.show},methods:{onToggleMenu(){this.isMenuVisible=!this.isMenuVisible,this.$emit("update:show",this.isMenuVisible)},hideMenu(){this.isMenuVisible=!1,this.$emit("update:show",!1)},showMenu(){this.isMenuVisible=!0,this.$emit("update:show",!0)}}},M={class:"tw-relative tw-inline-block tw-w-full"},k=["title"],q={class:"tw-text-left tw-flex-auto tw-pl-3 tw-truncate"},C={class:"tw-py-1"};function S(t,s,e,c,w,a){const i=b("Icon");return u(),r("div",M,[n("div",{class:o(["tw-bg-white tw-border tw-border-solid tw-h-10 tw-flex tw-items-center tw-rounded tw-text-md tw-w-full",[e.elementClasses,e.disabled&&"tw-opacity-40 tw-cursor-not-allowed",!t.isMenuVisible&&"tw-border-grayscale-500",t.isMenuVisible&&"tw-border-grayscale-700"]]),onClick:s[0]||(s[0]=()=>!e.disabled&&a.onToggleMenu()),title:e.tooltip},[n("div",q,[l(t.$slots,"title",{},()=>[v(y(e.title),1)])]),h(i,{name:t.isMenuVisible?"chevron-up":"chevron-down",class:"tw-pt-1 tw-pr-2 tw-flex-none",color:"secondary-500",size:e.iconSize},null,8,["name","size"])],10,k),p(n("div",{class:o(["tw-origin-top-right tw-absolute tw-mt-2 tw-rounded-md tw-shadow-lg tw-bg-white tw-ring-1 tw-ring-black tw-ring-opacity-5 tw-z-20",[e.menuElementClasses,{"tw-right-0":e.menuAlign==="right","tw-left-0":e.menuAlign!=="right"}]])},[n("div",C,[l(t.$slots,"default")])],2),[[g,t.isMenuVisible]])])}const B=d(f,[["render",S]]);f.__docgenInfo={exportName:"default",displayName:"Dropdown",description:"",tags:{},props:[{name:"menuAlign",type:{name:"string"},defaultValue:{func:!1,value:"'right'"}},{name:"title",type:{name:"string"},required:!1,defaultValue:{func:!1,value:"undefined"}},{name:"elementClasses",type:{name:"string"},required:!1,defaultValue:{func:!1,value:"''"}},{name:"menuElementClasses",type:{name:"string"},required:!1,defaultValue:{func:!1,value:"''"}},{name:"disabled",type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}},{name:"show",type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}},{name:"iconSize",type:{name:"string"},required:!1,defaultValue:{func:!1,value:"'sm'"}},{name:"tooltip",type:{name:"string"},required:!1}],events:[{name:"update:show",type:{names:["undefined"]}}],slots:[{name:"title"},{name:"default"}],sourceFiles:["/Users/kristianbonitz/Repos/fe-shared-lib/src/atoms/components/Dropdown/Dropdown.vue"]};const m={props:{backgroundHover:{type:Boolean,default:!0}},methods:{onClick(){this.$emit("click")}}};function D(t,s,e,c,w,a){return u(),r("div",null,[n("div",{class:o(["tw-flex tw-items-center tw-px-2 tw-py-2 tw-cursor-pointer",{"dropdown-item-hover":e.backgroundHover}]),onClick:s[0]||(s[0]=V((...i)=>a.onClick&&a.onClick(...i),["stop"]))},[l(t.$slots,"default",{},void 0,!0)],2)])}const N=d(m,[["render",D],["__scopeId","data-v-dce50d20"]]);m.__docgenInfo={exportName:"default",displayName:"DropdownItem",description:"",tags:{},props:[{name:"backgroundHover",type:{name:"boolean"},defaultValue:{func:!1,value:"true"}}],events:[{name:"click"}],slots:[{name:"default"}],sourceFiles:["/Users/kristianbonitz/Repos/fe-shared-lib/src/atoms/components/Dropdown/DropdownItem.vue"]};export{B as D,N as a};

package/.storybook-static/assets/DropdownItem-BV-BdThU.css

@@ -0,0 +1 @@
+.dropdown-item-hover[data-v-dce50d20]:hover{background-color:#eee}

package/.storybook-static/assets/FormControl.mixin-Z8ORnl4_.js

@@ -0,0 +1 @@
+import{I as a}from"./Icon-BKxOWZPO.js";const l=32,i={components:{Icon:a},props:{attrs:{type:Object,required:!1,default:()=>{}},modelValue:{type:[String,Number],required:!1,default:""},id:{type:String,required:!1,default:void 0},placeholder:{type:String,required:!1,default:void 0},size:{type:String,required:!1,default:"sm"},label:{type:String,required:!1,default:void 0},showLabelScreenReaderOnly:{type:Boolean,required:!1,default:!1},icon:{type:String,required:!1,default:void 0},required:{type:Boolean,required:!1,default:!1},error:{type:Boolean,required:!1,default:!1},warning:{type:Boolean,required:!1,default:!1},success:{type:Boolean,required:!1,default:!1},disabled:{type:Boolean,required:!1,default:!1},readonly:{type:Boolean,required:!1,default:!1},name:{type:String,required:!1,default:void 0},maxlength:{type:Number,required:!1,default:void 0},minlength:{type:Number,required:!1,default:void 0},isSpaceDisabled:{type:Boolean,required:!1,default:!1},requiredMessage:{type:String,required:!1,default:"Please fill in this field."}},methods:{input(e,t){this.$emit("update:modelValue",e),this.$emit("input",e),t!=null&&t.target&&t.target.setCustomValidity("")},keyup(e){this.$emit("keyup",e)},keydown(e,t){if(this.isSpaceDisabled&&t.which===l){t.preventDefault();return}this.$emit("keydown",e)},focus(e){this.$emit("focus",e)},blur(e){this.$emit("blur",e)},enterKeyUp(e){this.$emit("enter-key-up",e)}}};export{i as F};

package/.storybook-static/assets/HashRouteModal.stories-t0ZML3rG.js

@@ -0,0 +1,64 @@
+import{E as k,y as V,x as n,a as q,o as B,g as l}from"./iframe-Dd7cBPzL.js";import{M as S}from"./Modal-DWDuRSAE.js";import{_ as x}from"./_plugin-vue_export-helper-DlAUqK2U.js";import{B as z}from"./Button-DUOSTNbh.js";import"./Icon-BKxOWZPO.js";import"./ButtonPrimary-C1HLT2L3.js";/*!
+  * vue-router v4.5.0
+  * (c) 2024 Eduardo San Martin Morote
+  * @license MIT
+  */var u;(function(e){e.pop="pop",e.push="push"})(u||(u={}));var d;(function(e){e.back="back",e.forward="forward",e.unknown=""})(d||(d={}));var c;(function(e){e[e.aborted=4]="aborted",e[e.cancelled=8]="cancelled",e[e.duplicated=16]="duplicated"})(c||(c={}));const _=Symbol("");function g(){return k(_)}const C="#",r="|",E=/[#|]/,O=(e,o)=>`#${e.replace(C,"").split(r).filter(a=>a).concat(o).join(r)}`,j={props:{isHashRouteEnabled:{type:Boolean,required:!1,default:!1}},data:()=>({removeHookFunc:void 0}),mounted(){!this.isHashRouteEnabled||!this.$router||typeof this.onHashRouteChange!="function"||(this.removeHookFunc=this.$router.afterEach((e,o)=>{const a=o.hash.split(e.hash).join("").replace(E,"");this.onHashRouteChange(a)}))},unmounted(){this.removeHookFunc&&(this.removeHookFunc(),this.removeHookFunc=void 0)},methods:{hashRoutePush(e){if(!this.isHashRouteEnabled||!this.$router)return;const o=O(this.$router.currentRoute.value.hash,e);this.$router.push({hash:o})},hashRouteBack(e){!this.isHashRouteEnabled||!this.$router||this.$router.currentRoute.value.hash.split(r).filter(o=>o.indexOf(e)>-1).length!==0&&this.$router.back()}}},M={components:{Modal:S},mixins:[j],props:{simple:{type:Boolean,required:!1,default:!1},removeHorizontalMargin:{type:Boolean,required:!1,default:!1},visible:{type:Boolean,required:!1,default:!1},mandatory:{type:Boolean,required:!1,default:!1},mode:{type:String,required:!1,default:void 0},classes:{type:[String,Object],required:!1,default:""},size:{type:String,required:!1,default:void 0},fullScreenBreakpoint:{type:String,required:!1,default:void 0},closeOnEsc:{type:Boolean,required:!1,default:!1},hideScrollbar:{type:Boolean,required:!1,default:!0}},computed:{modalTag(){return`modal-${this.$.uid}`}},watch:{visible(e){e&&!this.mandatory&&this.hashRoutePush(this.modalTag)}},mounted(){this.visible&&!this.mandatory&&this.hashRoutePush(this.modalTag)},methods:{onHashRouteChange(e){e!==this.modalTag||!this.visible||this.$emit("close-modal",{})},onCloseModal(e){this.hashRouteBack(this.modalTag),this.$emit("close-modal",e)}}};function $(e,o,a,L,w,y){const H=q("Modal");return B(),V(H,{simple:a.simple,"remove-horizontal-margin":a.removeHorizontalMargin,visible:a.visible,mandatory:a.mandatory,mode:a.mode,classes:a.classes,size:a.size,"full-screen-breakpoint":a.fullScreenBreakpoint,"close-on-esc":a.closeOnEsc,"hide-scrollbar":a.hideScrollbar,onCloseModal:y.onCloseModal},{header:n(()=>[l(e.$slots,"header")]),default:n(()=>[l(e.$slots,"default")]),footer:n(()=>[l(e.$slots,"footer")]),_:3},8,["simple","remove-horizontal-margin","visible","mandatory","mode","classes","size","full-screen-breakpoint","close-on-esc","hide-scrollbar","onCloseModal"])}const i=x(M,[["render",$]]);M.__docgenInfo={exportName:"default",displayName:"HashRouteModal",description:"",tags:{},props:[{name:"isHashRouteEnabled",mixin:{name:"hash-router-mixin",path:"../../mixin/hash-router-mixin.js"},type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}},{name:"simple",type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}},{name:"removeHorizontalMargin",type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}},{name:"visible",type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}},{name:"mandatory",type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}},{name:"mode",type:{name:"string"},required:!1,defaultValue:{func:!1,value:"undefined"}},{name:"classes",type:{name:"string|object"},required:!1,defaultValue:{func:!1,value:"''"}},{name:"size",type:{name:"string"},required:!1,defaultValue:{func:!1,value:"undefined"}},{name:"fullScreenBreakpoint",type:{name:"string"},required:!1,defaultValue:{func:!1,value:"undefined"}},{name:"closeOnEsc",type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"false"}},{name:"hideScrollbar",type:{name:"boolean"},required:!1,defaultValue:{func:!1,value:"true"}}],events:[{name:"close-modal",type:{names:["undefined"]}}],slots:[{name:"header"},{name:"default"},{name:"footer"}],sourceFiles:["/Users/kristianbonitz/Repos/fe-shared-lib/src/atoms/components/Modal/HashRouteModal.vue","/Users/kristianbonitz/Repos/fe-shared-lib/src/atoms/mixin/hash-router-mixin.js"]};const A={title:"Components/Hash Router Modal",component:i},R={isVisible:!0},s=(e,{argTypes:o})=>{const a=g();return{components:{HashRouteModal:i},props:Object.keys(o),template:`
+      <HashRouteModal :visible="isVisible" close-on-esc @close-modal="closeLoginModal">
+      Your component goes here
+      </HashRouteModal>
+    `,methods:{closeLoginModal(){this.isVisible=!1}},router:a}};s.args=R;const t=()=>{const e=g();return{components:{HashRouteModal:i,Button:z},data(){return{isVisible:!1}},template:`
+      <div>
+        <Button size="medium" variant="primary" label="Click Me" @on-click="isVisible = true" />
+        <HashRouteModal :visible="isVisible" close-on-esc @close-modal="closeLoginModal">
+        Your component goes here
+        </HashRouteModal>
+      </div>
+    `,methods:{closeLoginModal(){this.isVisible=!1}},router:e}};t.args=R;var m,f,h;s.parameters={...s.parameters,docs:{...(m=s.parameters)==null?void 0:m.docs,source:{originalSource:`(args, {
+  argTypes
+}) => {
+  const router = useRouter();
+  return {
+    components: {
+      HashRouteModal
+    },
+    props: Object.keys(argTypes),
+    template: \`
+      <HashRouteModal :visible="isVisible" close-on-esc @close-modal="closeLoginModal">
+      Your component goes here
+      </HashRouteModal>
+    \`,
+    methods: {
+      closeLoginModal() {
+        this.isVisible = false;
+      }
+    },
+    router
+  };
+}`,...(h=(f=s.parameters)==null?void 0:f.docs)==null?void 0:h.source}}};var p,b,v;t.parameters={...t.parameters,docs:{...(p=t.parameters)==null?void 0:p.docs,source:{originalSource:`() => {
+  const router = useRouter();
+  return {
+    components: {
+      HashRouteModal,
+      Button
+    },
+    data() {
+      return {
+        isVisible: false
+      };
+    },
+    template: \`
+      <div>
+        <Button size="medium" variant="primary" label="Click Me" @on-click="isVisible = true" />
+        <HashRouteModal :visible="isVisible" close-on-esc @close-modal="closeLoginModal">
+        Your component goes here
+        </HashRouteModal>
+      </div>
+    \`,
+    methods: {
+      closeLoginModal() {
+        this.isVisible = false;
+      }
+    },
+    router
+  };
+}`,...(v=(b=t.parameters)==null?void 0:b.docs)==null?void 0:v.source}}};const I=["Sample","OpenWithButton"];export{t as OpenWithButton,s as Sample,I as __namedExportsOrder,A as default};

package/.storybook-static/assets/HelloBar-YB27gvZE.js

@@ -0,0 +1 @@
+import{I as g}from"./Icon-BKxOWZPO.js";import{c as n,e as w,y as i,f as l,b as r,t as u,F as o,r as y,g as v,a as b,o as a}from"./iframe-Dd7cBPzL.js";import{_ as x}from"./_plugin-vue_export-helper-DlAUqK2U.js";const m={components:{Icon:g},props:{label:{type:[String,Array],required:!0},description:{type:String,required:!1,default:void 0},variant:{type:String,required:!1,default:"success"},fontSize:{type:String,required:!1,default:"base"}},computed:{hasCtaSlot(){return!!this.$slots.cta},fontSizeClass(){return`tw-text-${this.fontSize}`}},methods:{isArray(c){return c instanceof Array}}},h={class:"lg:tw-mr-8"},S={key:0,class:"tw-flex-none"};function _(c,k,e,z,A,t){const s=b("Icon");return a(),n("div",{class:r(["tw-font-sans tw-py-3 tw-px-6 tw-rounded",{"tw-bg-info-500":e.variant==="info","tw-bg-error-500":e.variant==="error","tw-bg-success-500":e.variant==="success","tw-bg-warning-500":e.variant==="warning","tw-text-white":e.variant!=="warning","tw-text-grayscale-800":e.variant==="warning"}])},[w("div",{class:r(["tw-flex",{"tw-items-start":e.description||t.isArray(e.label),"tw-items-center":!e.description&&!t.isArray(e.label)}])},[e.variant==="success"?(a(),i(s,{key:0,name:"callout-success",size:"md",class:r(["tw-mr-4 tw-flex tw-items-center",{"tw-mt-1":t.isArray(e.label)}])},null,8,["class"])):l("",!0),e.variant==="warning"?(a(),i(s,{key:1,name:"callout-warning",size:"md",class:r(["tw-mr-4 tw-flex tw-items-center",{"tw-mt-1":t.isArray(e.label)}])},null,8,["class"])):l("",!0),e.variant==="error"?(a(),i(s,{key:2,name:"callout-error",size:"md",class:r(["tw-mr-4 tw-flex tw-items-center",{"tw-mt-1":t.isArray(e.label)}])},null,8,["class"])):l("",!0),e.variant==="info"?(a(),i(s,{key:3,name:"callout-info",size:"md",class:r(["tw-mr-4 tw-flex tw-items-center",{"tw-mt-1":t.isArray(e.label)}])},null,8,["class"])):l("",!0),w("div",{class:r(["tw-w-full tw-flex tw-flex-col lg:tw-flex-row",{"lg:tw-items-center tw-justify-between":t.hasCtaSlot}])},[w("div",h,[t.isArray(e.label)?l("",!0):(a(),n("p",{key:0,class:r(["tw-m-0 tw-leading-tight",[t.fontSizeClass,{"tw-font-bold tw-mb-1":e.description,"tw-text-grayscale-800":e.variant==="warning","tw-text-white":e.variant!=="warning"}]])},u(e.label),3)),t.isArray(e.label)?(a(),n("ul",{key:1,class:r(["tw-m-0 tw-leading-tight tw-ml-4 tw-pl-0",[t.fontSizeClass,{"tw-text-grayscale-800":e.variant==="warning","tw-text-white":e.variant!=="warning"}]])},[(a(!0),n(o,null,y(e.label,(d,f)=>(a(),n("li",{key:f},u(d),1))),128))],2)):l("",!0),e.description?(a(),n("p",{key:2,class:r(["tw-m-0 tw-leading-tight tw-mb-2 lg:tw-mb-0",[t.fontSizeClass,{"tw-text-white":e.variant!=="warning","tw-text-grayscale-600":e.variant==="warning"}]])},u(e.description),3)):l("",!0)]),t.hasCtaSlot?(a(),n("div",S,[v(c.$slots,"cta")])):l("",!0)],2)],2)],2)}const H=x(m,[["render",_]]);m.__docgenInfo={exportName:"default",displayName:"HelloBar",description:"",tags:{},props:[{name:"label",type:{name:"string|array"},required:!0},{name:"description",type:{name:"string"},required:!1,defaultValue:{func:!1,value:"undefined"}},{name:"variant",type:{name:"string"},required:!1,defaultValue:{func:!1,value:"'success'"}},{name:"fontSize",type:{name:"string"},required:!1,defaultValue:{func:!1,value:"'base'"}}],slots:[{name:"cta"}],sourceFiles:["/Users/kristianbonitz/Repos/fe-shared-lib/src/atoms/components/HelloBar/HelloBar.vue"]};export{H};