You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1 lines
16 KiB
1 lines
16 KiB
import{n as t,_ as e}from"./index.min.js";import{D as n}from"./Docs.min.js";import"./vendor.min.js";const l=t({props:{docs:Object},computed:{options(){const t=[{icon:"expand",link:"lab/docs/"+this.docs.component}];return this.docs.github&&t.unshift({icon:"github",link:this.docs.github,target:"_blank"}),t}}},(function(){var t=this,e=t._self._c;return e("k-drawer",t._b({ref:"drawer",staticClass:"k-form-drawer",attrs:{options:t.options},on:{submit:function(e){return t.$emit("cancel")}}},"k-drawer",t.$attrs,!1),[e("k-lab-docs",t._b({},"k-lab-docs",t.docs,!1))],1)}),[],!1,null,null,null,null).exports;const a=t({props:{code:{type:Boolean,default:!0},label:String,flex:Boolean},data:()=>({mode:"preview"}),computed:{component(){return window.UiExamples[this.label]}}},(function(){var t=this,e=t._self._c;return e("div",{staticClass:"k-lab-example",attrs:{"data-flex":t.flex,tabindex:"0"}},[e("header",{staticClass:"k-lab-example-header"},[e("h3",{staticClass:"k-lab-example-label"},[t._v(t._s(t.label))]),t.code?e("k-button-group",{staticClass:"k-lab-example-inspector",attrs:{layout:"collapsed"}},[e("k-button",{attrs:{theme:"preview"===t.mode?"info":null,icon:"preview",size:"xs",title:"Preview"},on:{click:function(e){t.mode="preview"}}}),e("k-button",{attrs:{theme:"inspect"===t.mode?"info":null,icon:"code",size:"xs",title:"Vue code"},on:{click:function(e){t.mode="inspect"}}})],1):t._e()],1),"preview"===t.mode?e("div",{staticClass:"k-lab-example-canvas"},[t._t("default")],2):t._e(),"inspect"===t.mode?e("div",{staticClass:"k-lab-example-code"},[e("k-code",{attrs:{language:"html"}},[t._v(t._s(t.component))])],1):t._e()])}),[],!1,null,null,null,null).exports;const o=t({},(function(){return(0,this._self._c)("div",{staticClass:"k-lab-examples"},[this._t("default")],2)}),[],!1,null,null,null,null).exports;const i=t({props:{description:{default:!0,type:Boolean},icon:{default:!0,type:Boolean},placeholder:{default:!0,type:Boolean},type:String,value:{default:null,type:[String,Number,Array]}},data:()=>({input:null}),computed:{label(){return this.$helper.string.ucfirst(this.type)}},watch:{value:{handler(t){this.input=t},immediate:!0}},methods:{emit(t){this.input=t,this.$emit("input",t)}}},(function(){var t=this,e=t._self._c;return e("k-lab-form",[e("k-lab-examples",[e("k-lab-example",{attrs:{label:"Default"}},[e(`k-${t.type}-field`,{tag:"component",attrs:{name:t.type,label:t.label,value:t.input},on:{input:t.emit}})],1),e("k-lab-example",{attrs:{label:"Autofocus"}},[e(`k-${t.type}-field`,{tag:"component",attrs:{autofocus:!0,label:t.label,value:t.input},on:{input:t.emit}})],1),e("k-lab-example",{attrs:{label:"Required"}},[e(`k-${t.type}-field`,{tag:"component",attrs:{label:t.label,required:!0,value:t.input},on:{input:t.emit}})],1),t.placeholder?e("k-lab-example",{attrs:{label:"Placeholder"}},[e(`k-${t.type}-field`,{tag:"component",attrs:{label:t.label,value:t.input,placeholder:"Placeholder text …"},on:{input:t.emit}})],1):t._e(),e("k-lab-example",{attrs:{label:"Help"}},[e(`k-${t.type}-field`,{tag:"component",attrs:{label:t.label,value:t.input,help:"This is some help text"},on:{input:t.emit}})],1),t.description?e("k-lab-example",{attrs:{label:"Before & After"}},[e(`k-${t.type}-field`,{tag:"component",attrs:{label:t.label,value:t.input,after:"After",before:"Before"},on:{input:t.emit}})],1):t._e(),t.icon?e("k-lab-example",{attrs:{label:"Icon"}},[e(`k-${t.type}-field`,{tag:"component",attrs:{label:t.label,value:t.input,icon:"edit"},on:{input:t.emit}})],1):t._e(),e("k-lab-example",{attrs:{label:"Disabled"}},[e(`k-${t.type}-field`,{tag:"component",attrs:{disabled:!0,label:t.label,value:t.input},on:{input:t.emit}})],1),t._t("default")],2)],1)}),[],!1,null,null,null,null).exports;const p=t({props:{column:{default:()=>({}),type:Object},field:{default:()=>({}),type:Object},label:String,type:String,value:{}}},(function(){var t=this,e=t._self._c;return e("k-lab-example",{attrs:{label:t.label}},[e("div",{staticClass:"k-table"},[e("table",[e("thead",[e("tr",[e("th",{attrs:{"data-mobile":"true"}},[t._v(" "+t._s(t.$helper.string.ucfirst(t.type))+" Field Preview ")])])]),e("tbody",[e("tr",[e("td",{staticClass:"k-table-cell"},[e(`k-${t.type}-field-preview`,{tag:"component",attrs:{column:t.column,field:t.field,value:t.value},on:{input:function(e){return t.$emit("input",e)}}})],1)])])])])])}),[],!1,null,null,null,null).exports;const s=t({methods:{submit(t){const e=Object.fromEntries(new FormData(t));this.$panel.dialog.open({component:"k-lab-output-dialog",props:{code:JSON.stringify(e,null,2)}})}}},(function(){var t=this,e=t._self._c;return e("form",{staticClass:"k-lab-form",on:{submit:function(e){return e.preventDefault(),t.submit(e.target)}}},[t._t("default"),e("footer",[e("k-button",{attrs:{type:"submit",icon:"check",theme:"positive",variant:"filled"}},[t._v(" Submit ")])],1)],2)}),[],!1,null,null,null,null).exports;const u=t({props:{placeholder:{default:!0,type:Boolean},type:String,value:{default:null,type:[String,Number,Boolean,Object,Array]}},data:()=>({input:null}),watch:{value:{handler(t){this.input=t},immediate:!0}},methods:{emit(t){this.input=t,this.$emit("input",t)}}},(function(){var t=this,e=t._self._c;return e("k-lab-form",[e("k-lab-examples",{staticClass:"k-lab-input-examples"},[e("k-lab-example",{attrs:{label:"Default"}},[e(`k-${t.type}-input`,{tag:"component",attrs:{name:t.type,value:t.input},on:{input:t.emit}})],1),e("k-lab-example",{attrs:{label:"Autofocus"}},[e(`k-${t.type}-input`,{tag:"component",attrs:{autofocus:!0,value:t.input},on:{input:t.emit}})],1),e("k-lab-example",{attrs:{label:"Required"}},[e(`k-${t.type}-input`,{tag:"component",attrs:{required:!0,value:t.input},on:{input:t.emit}})],1),t.placeholder?e("k-lab-example",{attrs:{label:"Placeholder"}},[e(`k-${t.type}-input`,{tag:"component",attrs:{value:t.input,placeholder:"Placeholder text …"},on:{input:t.emit}})],1):t._e(),e("k-lab-example",{attrs:{label:"Focus"}},[e(`k-${t.type}-input`,{ref:"input",tag:"component",staticStyle:{"margin-bottom":"1.5rem"},attrs:{value:t.input},on:{input:t.emit}}),e("k-button",{attrs:{variant:"filled",size:"sm"},on:{click:function(e){return t.$refs.input.focus()}}},[t._v(" Focus ")])],1),e("k-lab-example",{attrs:{label:"Disabled"}},[e(`k-${t.type}-input`,{tag:"component",attrs:{disabled:!0,value:t.input},on:{input:t.emit}})],1),t._t("default")],2)],1)}),[],!1,null,null,null,null).exports;const r=t({props:{description:{default:!0,type:Boolean},icon:{default:!0,type:Boolean},placeholder:{default:!0,type:Boolean},type:String,value:{default:null,type:[String,Number]}},data:()=>({input:null}),watch:{value:{handler(t){this.input=t},immediate:!0}},methods:{emit(t){this.input=t,this.$emit("input",t)}}},(function(){var t=this,e=t._self._c;return e("k-lab-form",[e("k-lab-examples",[e("k-lab-example",{attrs:{label:"Default"}},[e(`k-${t.type}-inputbox`,{tag:"component",attrs:{name:t.type,value:t.input},on:{input:t.emit}})],1),e("k-lab-example",{attrs:{label:"Autofocus"}},[e(`k-${t.type}-inputbox`,{tag:"component",attrs:{autofocus:!0,value:t.input},on:{input:t.emit}})],1),e("k-lab-example",{attrs:{label:"Required"}},[e(`k-${t.type}-inputbox`,{tag:"component",attrs:{required:!0,value:t.input},on:{input:t.emit}})],1),t.placeholder?e("k-lab-example",{attrs:{label:"Placeholder"}},[e(`k-${t.type}-inputbox`,{tag:"component",attrs:{value:t.input,placeholder:"Placeholder text …"},on:{input:t.emit}})],1):t._e(),t.description?e("k-lab-example",{attrs:{label:"Before & After"}},[e(`k-${t.type}-inputbox`,{tag:"component",attrs:{value:t.input,after:"After",before:"Before"},on:{input:t.emit}})],1):t._e(),t.icon?e("k-lab-example",{attrs:{label:"Icon"}},[e(`k-${t.type}-inputbox`,{tag:"component",attrs:{value:t.input,icon:"edit"},on:{input:t.emit}})],1):t._e(),e("k-lab-example",{attrs:{label:"Disabled"}},[e(`k-${t.type}-inputbox`,{tag:"component",attrs:{disabled:!0,value:t.input},on:{input:t.emit}})],1),t._t("default")],2)],1)}),[],!1,null,null,null,null).exports;const m=t({props:{columns:{default:!0,type:Boolean},info:{default:!0,type:Boolean},type:String,value:{default:null,type:[Array,String]}},data:()=>({input:null}),computed:{label(){return this.$helper.string.ucfirst(this.type)},options:()=>[{text:"Option A",value:"a"},{text:"Option B",value:"b"},{text:"Option C",value:"c"}],optionsWithInfo:()=>[{text:"Option A",value:"a",info:"This is some info text"},{text:"Option B",value:"b",info:"This is some info text"},{text:"Option C",value:"c",info:"This is some info text"}]},watch:{value:{handler(t){this.input=t},immediate:!0}},methods:{emit(t){this.input=t,this.$emit("input",t)}}},(function(){var t=this,e=t._self._c;return e("k-lab-form",[e("k-lab-examples",[e("k-lab-example",{attrs:{label:"Default"}},[e(`k-${t.type}-field`,{tag:"component",attrs:{name:t.type,label:t.label,options:t.options,value:t.input},on:{input:t.emit}})],1),e("k-lab-example",{attrs:{label:"Autofocus"}},[e(`k-${t.type}-field`,{tag:"component",attrs:{autofocus:!0,label:t.label,options:t.options,value:t.input},on:{input:t.emit}})],1),t.info?e("k-lab-example",{attrs:{label:"Options with info"}},[e(`k-${t.type}-field`,{tag:"component",attrs:{label:t.label,options:t.optionsWithInfo,value:t.input},on:{input:t.emit}})],1):t._e(),e("k-lab-example",{attrs:{label:"Required"}},[e(`k-${t.type}-field`,{tag:"component",attrs:{label:t.label,options:t.optionsWithInfo,required:!0,value:t.input},on:{input:t.emit}})],1),t.columns?e("k-lab-example",{attrs:{label:"Columns"}},[e(`k-${t.type}-field`,{tag:"component",attrs:{columns:3,label:t.label,options:t.optionsWithInfo,value:t.input},on:{input:t.emit}})],1):t._e(),e("k-lab-example",{attrs:{label:"Disabled"}},[e(`k-${t.type}-field`,{tag:"component",attrs:{label:t.label,options:t.optionsWithInfo,disabled:!0,value:t.input},on:{input:t.emit}})],1),t._t("default")],2)],1)}),[],!1,null,null,null,null).exports;const c=t({props:{info:{default:!0,type:Boolean},options:{default:()=>[{text:"Option A",value:"a"},{text:"Option B",value:"b"},{text:"Option C",value:"c"}],type:Array},optionsWithInfo:{default:()=>[{text:"Option A",value:"a",info:"This is some info text"},{text:"Option B",value:"b",info:"This is some info text"},{text:"Option C",value:"c",info:"This is some info text"}],type:Array},type:String,value:[Array,String,Number]},data:()=>({input:null}),watch:{value:{handler(t){this.input=t},immediate:!0}},methods:{emit(t){this.input=t,this.$emit("input",t)}}},(function(){var t=this,e=t._self._c;return e("k-lab-form",[e("k-lab-examples",{staticClass:"k-lab-options-input-examples"},[e("k-lab-example",{attrs:{label:"Default"}},[e(`k-${t.type}-input`,{tag:"component",attrs:{name:t.type,options:t.options,value:t.input},on:{input:t.emit}})],1),e("k-lab-example",{attrs:{label:"Autofocus"}},[e(`k-${t.type}-input`,{tag:"component",attrs:{autofocus:!0,options:t.options,value:t.input},on:{input:t.emit}})],1),e("k-lab-example",{attrs:{label:"Required"}},[e(`k-${t.type}-input`,{tag:"component",attrs:{options:t.options,required:!0,value:t.input},on:{input:t.emit}})],1),t.info?e("k-lab-example",{attrs:{label:"Options with info"}},[e(`k-${t.type}-input`,{tag:"component",attrs:{options:t.optionsWithInfo,value:t.input},on:{input:t.emit}})],1):t._e(),e("k-lab-example",{attrs:{label:"Focus"}},[e("div",{staticStyle:{"margin-bottom":"1.5rem"}},[e(`k-${t.type}-input`,{ref:"input",tag:"component",staticStyle:{"margin-bottom":"1.5rem"},attrs:{options:t.info?t.optionsWithInfo:t.options,value:t.input},on:{input:t.emit}})],1),e("k-button",{attrs:{variant:"filled",size:"sm"},on:{click:function(e){return t.$refs.input.focus()}}},[t._v(" Focus ")])],1),e("k-lab-example",{attrs:{label:"Disabled"}},[e(`k-${t.type}-input`,{tag:"component",attrs:{disabled:!0,options:t.info?t.optionsWithInfo:t.options,value:t.input},on:{input:t.emit}})],1),t._t("default",null,{options:t.options,optionsWithInfo:t.optionsWithInfo})],2)],1)}),[],!1,null,null,null,null).exports;const b=t({props:{columns:{default:!0,type:Boolean},description:{default:!0,type:Boolean},icon:{default:!0,type:Boolean},info:{default:!0,type:Boolean},placeholder:{default:!0,type:Boolean},type:String,value:{default:null,type:[Array,String]}},data:()=>({input:null}),computed:{options:()=>[{text:"Option A",value:"a"},{text:"Option B",value:"b"},{text:"Option C",value:"c"}],optionsWithInfo:()=>[{text:"Option A",value:"a",info:"This is some info text"},{text:"Option B",value:"b",info:"This is some info text"},{text:"Option C",value:"c",info:"This is some info text"}]},watch:{value:{handler(t){this.input=t},immediate:!0}},methods:{emit(t){this.input=t,this.$emit("input",t)}}},(function(){var t=this,e=t._self._c;return e("k-lab-form",[e("k-lab-examples",[e("k-lab-example",{attrs:{label:"Default"}},[e(`k-${t.type}-inputbox`,{tag:"component",attrs:{name:t.type,options:t.options,value:t.input},on:{input:t.emit}})],1),e("k-lab-example",{attrs:{label:"Autofocus"}},[e(`k-${t.type}-inputbox`,{tag:"component",attrs:{autofocus:!0,options:t.options,value:t.input},on:{input:t.emit}})],1),t.info?e("k-lab-example",{attrs:{label:"Options with info"}},[e(`k-${t.type}-inputbox`,{tag:"component",attrs:{options:t.optionsWithInfo,value:t.input},on:{input:t.emit}})],1):t._e(),e("k-lab-example",{attrs:{label:"Required"}},[e(`k-${t.type}-inputbox`,{tag:"component",attrs:{options:t.optionsWithInfo,required:!0,value:t.input},on:{input:t.emit}})],1),t.placeholder?e("k-lab-example",{attrs:{label:"Placeholder"}},[e(`k-${t.type}-inputbox`,{tag:"component",attrs:{options:t.options,value:t.input,placeholder:"Placeholder text …"},on:{input:t.emit}})],1):t._e(),t.description?e("k-lab-example",{attrs:{label:"Before & After"}},[e(`k-${t.type}-inputbox`,{tag:"component",attrs:{options:t.options,value:t.input,after:"After",before:"Before"},on:{input:t.emit}})],1):t._e(),t.icon?e("k-lab-example",{attrs:{label:"Icon"}},[e(`k-${t.type}-inputbox`,{tag:"component",attrs:{options:t.options,value:t.input,icon:"edit"},on:{input:t.emit}})],1):t._e(),t.columns?e("k-lab-example",{attrs:{label:"Columns"}},[e(`k-${t.type}-inputbox`,{tag:"component",attrs:{columns:3,options:t.optionsWithInfo,value:t.input},on:{input:t.emit}})],1):t._e(),e("k-lab-example",{attrs:{label:"Disabled"}},[e(`k-${t.type}-inputbox`,{tag:"component",attrs:{options:t.optionsWithInfo,disabled:!0,value:t.input},on:{input:t.emit}})],1),e("k-lab-example",{attrs:{label:"No options"}},[e(`k-${t.type}-inputbox`,{tag:"component"})],1),t._t("default",null,{options:t.options,optionsWithInfo:t.optionsWithInfo})],2)],1)}),[],!1,null,null,null,null).exports;const d=t({props:{code:String,language:{default:"js",type:String}}},(function(){var t=this,e=t._self._c;return e("k-dialog",t._b({attrs:{size:"large","cancel-button":!1,"submit-button":!1},on:{cancel:function(e){return t.$emit("cancel")}}},"k-dialog",t.$attrs,!1),[e("k-code",{attrs:{language:t.language}},[t._v(t._s(t.code))])],1)}),[],!1,null,null,null,null).exports;Vue.component("k-lab-docs",n),Vue.component("k-lab-docs-drawer",l),Vue.component("k-lab-example",a),Vue.component("k-lab-examples",o),Vue.component("k-lab-field-examples",i),Vue.component("k-lab-field-preview-example",p),Vue.component("k-lab-form",s),Vue.component("k-lab-input-examples",u),Vue.component("k-lab-inputbox-examples",r),Vue.component("k-lab-options-field-examples",m),Vue.component("k-lab-options-input-examples",c),Vue.component("k-lab-options-inputbox-examples",b),Vue.component("k-lab-output-dialog",d);const f=t({props:{docs:String,examples:[Object,Array],file:String,github:String,props:[Object,Array],styles:String,tab:String,tabs:{type:Array,default:()=>[]},template:String,title:String},data:()=>({component:null}),watch:{tab:{handler(){this.createComponent()},immediate:!0}},mounted(){this.$panel.view.path.replace(/lab\//,"")},methods:{async createComponent(){if(!this.file)return;const{default:t}=await e((()=>import(this.$panel.url(this.file)+"?cache="+Date.now())),[],import.meta.url);t.template=this.template,this.component={...t},window.UiExamples=this.examples},openDocs(){this.$panel.drawer.open(`lab/docs/${this.docs}`)},async reloadComponent(){await this.$panel.view.refresh(),this.createComponent()},reloadDocs(){this.$panel.drawer.isOpen&&this.$panel.drawer.refresh()}}},(function(){var t=this,e=t._self._c;return e("k-panel-inside",{staticClass:"k-lab-playground-view",attrs:{"data-has-tabs":t.tabs.length>1}},[e("k-header",[t._v(" "+t._s(t.title)+" "),t.docs||t.github?e("k-button-group",{attrs:{slot:"buttons"},slot:"buttons"},[t.docs?e("k-button",{attrs:{text:t.docs,icon:"book",size:"sm",variant:"filled"},on:{click:t.openDocs}}):t._e(),t.github?e("k-button",{attrs:{icon:"github",size:"sm",variant:"filled",link:t.github,target:"_blank"}}):t._e()],1):t._e()],1),e("k-tabs",{attrs:{tab:t.tab,tabs:t.tabs}}),t.component?e(t.component,t._b({tag:"component"},"component",t.props,!1)):t._e(),t.styles?e("style",{tag:"component",domProps:{innerHTML:t._s(t.styles)}}):t._e()],1)}),[],!1,null,null,null,null).exports;export{f as default};
|
|
|